Shipping Web-App Design
Project Definition
To take an existing app bundled with years of technical debt and cobbled together ideas and create a modern, clean user experience to make the checkout process easier and faster.
Current vs suggested steps in the checkout flow.
Evaluation
I first worked to understand the flow for the user, what was slowing them down - what changes could be made quickly to improve this and what was an ideal flow with the minimum number of hurdles. There were a number of obvious things waiting until after payment to offer an account that would help massively reduce drop-out.
What we're working with
User flow isnt the only thing that will impact the bottom line - I wanted to take this as an opporuntity to take all of the teams wealth of knowledge and condense into a more consistent, clean and readable design.
A friendly UI for a complex process
While shipping still requires a lot of form filling and check-boxes, especially shipping internationally - breaking things down into manageable pieces and making the layout easy to read and understand goes a long way.
To support a large and powerful shipping platform, creating consistency and tools for developers is key.
You can see for example that rather than having to support many buttons in different contexts, I helped to bring these all under one single component.
Supporting the development team with the logic behind my decision making is key among a distributed team.