Redesigning a rapid delivery service to serve 10x the products and leverage per customer personalization for millions.
7 years after it’s creation, GoPuff had grown from a college campus startup to being in 400 major US cities by 2021. With aspirations for more expansion, more product lines, and European markets, GoPuff needed to drastically overhaul their mobile app. I led the effort to define and design that outcome over 4 months.
Design Lead (Me)
100%
Design Director
20%
Principle Designer
100%
Product Designer
100%
Product Designer
100%
Product Delivery Manager
50%
User Researcher
20%
Our ambitious, high-level goal needed further definition and agreement across a diverse executive stakeholder group before we went further.
We were given a high level mandate to make GoPuff scalable for the future. As of 2021 the mobile app was still based on the original architecture and codebase. It was pushed to it’s limits by their success, and they wanted to redesign for the next 5-10 years of growth.
Outputs
Workshops
Stakeholder Agreement
Project Plan (high leve)
Product Map (first draft)
A whole redesign must include deep product management work to map the previous feature set, the new one, and the differences between.
With my prior experience as a Product Manager I worked alongside their Product team to create a Product Map of GoPuff. A hybrid user journey, product areas, and Epics create an accessible view of the whole experience. With this as a basis, we used workshops and discussions to expose goals and concerns from all parties, shared with the group, and prioritized together to elicit buy-in efficiently.
Outputs
Product Map (several iterations)
Sprint Plan (weekly breakdown)
The new information architecture and flow had to support thousands of products with different verticals and categorizations, and the ability to search and browse interchangeably was critical.
This architectural work was planned for early on as it was foundational to subsequent phases. Without final visual design we designed variations with wireframes, designing for key scenarios where users would try to reach specific products, broader categories, or be casually browsing.
We allocated user research to test prototype variations with these corresponding use case scenarios. This provided validation for our approach with minor refinements of our design, allowing us to continue to build forward.
Outputs
User flow scenarios (framing and research)
Search and browse flows (wireframe fidelity)
User testing
GoPuff arrived with a brand update that lacked a digital execution, providing us the opportunity expand the digital language alongside the structural work.
The original brand was built on a vibrant, fun, and somewhat irreverent feel that set itself apart in the market. We leveraged our full design team to diverge as much as possible before converging on 3 directions to present to their marketing stakeholders and company founders.
The selected variation was a more natural extension of their original brand, while integrating a new vibrant secondary palette and minor illustrative touches. These were stress tested in our presentation with both marketing and UI examples.
Outputs
3x creative territories
Mix of marketing and UI design examples
We learned the business struggled with targeting users based on a fixed experience. To define a personalization solution we needed to create components and variants to demonstrate flexibility.
Throughout the product we mapped a variety of components that could be varied based on additional effort, from minor to major time investments. A home screen experience with no events or promotions, all the way to major promotions such as Superbowl sales.
Key component variations included the home screen, product carousels, and product detail pages. With this toolkit, we demonstrated layouts that could change differently based on user demographics, location, and local events. Internal discussions no longer had to compete for fixed real estate, and instead only had to define their target market.
Outputs
Component and variation systems
Visual rhythm usage guidelines
Outcomes
Through redesigned information architecture we enabled a far larger inventories and market verticals, while also improving discoverability.
Coordination with stakeholders helped evolve their digital identity to a modern and flexible system that remains singular in the landscape.
Product analysis and prioritization led to migration of core features of their mobile app while creating space and time for new features.