UnFranchise B2B Autoship

Design Research | UI Design | Front-End Code

About the Project

The complexity of the business required extra effort to introduce AutoShip to customers. This resulted in the creation of a bucket system that did require management by customers. The complexity was due to BV/IBV that customers need to accrue to maintain status within the business.

The Problem
Create an experience that allows customers to manage their autoship, taking complex business rules and translating them into a simple experience.
I relied on business stakeholders to represent customer needs. Taking business requirements, as I explored different patterns I did competetive analysis as well as referencing best practices for patterns I planned on implement.
This was a collaboration with business stakeholders and engineering as I worked on various iterations of the experience. As the design reflects, there was a lot of complexity and the goal was to keep the user focused on the tasks needing to be completed.

I explored drag and drop to try making some of the interactions more intuitive, keeping in mind the context in which a user might need this kind of interaction and making sure there was an alternate way of doing this in a more accessible manor.

I used color blocks to reinforce the sections on the page incase a user chooses to have all the steps expanded.
Main Takeaways
This design could have benefitted from both some user research and a user test. I benefited greatly from discussions with Architects and Developers in engineering as I explored different features.

With the new visual direction incorporated in UnFranchise checkout, this could have made this experience easier to scan. I also think that some of the decisions made with experience unintentionally made the available actions confusing. For example, a checkbox next to the drag handle. One way I could have better handled that is expose it with an edit function for that list.