Product launched February 2019
Client creates high quality planners and notebooks that millions of people use on a daily basis. They now offer personalized versions of their products through DCKAP’s Productimize platform. This is Phase 2 of the project, focusing on the UX.
UX + UI Designer, Design Team Project Manager
Wes Toyofuku, Kendra Ford, Charity Fortajada
Mohammed Anees, Andrea Sanchez, Jared Gambatese
Sketch, Invision.Studio, Paper + Pencil, Basecamp, Zeplin
Streamline user flow and interface of the product customization platform to better communicate each step and all custom possibilities.
Create a more intuitive user flow.
Create a mobile interface since the first release was not responsive and mobile was not a client concern.
Introduce more UX tools into teams existing design process.
The client team summarized customer service case info, heat map, and screen recording notes to direct us towards which aspects of the interface to focus on.
After spending 30 mins creating a planner, several obvious issues surfaced.
Users are skipping steps
Users are hunting around page to navigate
Navigation should not take users attention away from the customization process.
Users should not need to look around the page to determine where to click for the next step.
Navigation between steps & sub-steps is separated across multiple areas.
Visual styling of navigation creates an unclear hierarchy.
CTA styling is not consistent throughout the page.
‘Previous’ and ‘Next’ options not present.
Designing the cover, the most unique part of the customization process, is buried in the middle of the process.
What appears to be an “Add to Cart” CTA is actually a step header and doesn’t add anything to the cart. It takes the user to a review step which once approved, progresses to an Add To Cart step.
Starting with V1, and understanding the stakeholders concern to make the sub-step options more visible, I mocked up a concept and did some gorilla testing to get some immediate feedback. Interface was further streamlined and mocked up to present to internal stakeholders, Product owner and Engineers who signed off on the design which was then presented and signed off by client.