Thomas Putt — Digital Product Design

Project Details

It all started when Roll’d CEO, Bao Hoang's family escaped Vietnam by boat with nothing besides his family’s traditional recipes. Fast forward a few years and 72 stores later, the Roll'd Vietnamese inspired street food phenomenon is now the fastest growing Australian restaurant chain.

My role

While working at jtribe, I was the design lead tasked with designing Roll’d’s MVP ordering app for iOS. I collaborated closely with product owners, BA’s, researchers and external development partners. I was responsible for user research, conceptualizing and prototyping MVP features, interactions and visual design.

The challenge

Roll’d were experiencing rapid growth and wanted to prove market fit for an app that aimed to solve the following problems:

Reduce foot traffic in popular stores

Roll’d were experiencing POS bottlenecks during busy lunch hours which created long queues. This frustrated people in the queue, deterred prospective customers and negatively impacted the company revenue.

Define an MVP to be used in 72 stores

With an avalanche of product ideas and visions from various stakeholder teams and franchisees, we had to coach and focus a myriad of non-technical teams to follow a human-centered product design approach.

What does winning look like?

The product owners' launch strategy involved testing the product within 3 stores before rolling out internationally. Our team worked closely with the product owner and client to understand our success metrics:

Improving kitchen and point of sale efficiency during peak times.
Reduce queue wait time from 10m to 5m during peak hour.
Improve the in-store experience and customer satisfaction.

The approach

Roll’d had previously engaged a marketing agency to design this app, resulting in a poor outcome that was ultimately thrown out. As a result, we had a huge task of building trust and designing a solution within a three week runway. Because of the tight time-frame, I opted for a lean and efficient approach, dividing research and design into three parts:

Observe. Eat. Repeat.

As soon as lunchtime arrived, I ventured out to the busiest Roll’d franchise in the city to “endure” the ordering experience for myself. My goals were to understand the challenges customers faced during the order process.

Observations

Ordering on the spot

The menu was hard to see unless you were close to the front of the line. By the time I was served, I hadn’t figured out my entire order and I stalled for time which caused a longer wait for people behind me.

Unclear pick-up point

The pick-up point was hidden along the side of the shop and wasn’t initially clear. I eventually spotted it when I saw a group of people waiting nearby with similar looking blue buzzing devices.

Cultural gaps

Nước Mắm Pha? Nước chấm? Hoisin? Sriracha? While these condiments may be familiar to those in the know, understanding these flavours could prove challenging to unfamiliar audiences. This also begs the question - what pairs better with what?

Visualizing the moving parts

I worked with subject matter experts, product owners and point-of-sale engineers to create our Service Blueprint - this helped fill in gaps from my own experience, build ordering context and uncover opportunities for improvement.

What do customers think?

I worked with the marketing team to conduct surveys, gauging the customer’s desire for an app, value set and buying habits.

Using this data, we created personas and selected frequent customers as our primary audience as they were most likely to download an app. We also used these insights to influence the app’s design direction.

Key insights

Competitors’ apps were slow due to complicated menus. Roll’d’s simple menu was its biggest strength.
Convenience, healthy food and deals are what customers care most about.
Surveys had shown that 76% of sales came from a handful of menu items.

Prototyping the MVP in 3 days

Our boardroom was booked - stakeholders, engineers and product owners alike were eagerly sipping coffee as we began to browse existing research and conceive our core flows.

Initial solutions

Pooling the team’s expertise, I conceptualized solutions that leveraged our research, were technically feasible and worked within business constraints.

Testing the prototype during peak-hour

Prototype in-hand, we set out to Roll’d’s busiest store during lunch to simulate the prototyping experience. The user testing task was simple: while waiting in the queue, users were handed the prototype and asked to order a specific menu item which we had prepared at the pick-up zone. Unguided, we observed how they navigated the entire experience. We used lookback.io to record the sessions.

Key learnings:

Efficient and quick: 90% of new customers picked up the order unassisted in under 3 minutes.
Uncovering new user needs: Corporate group orders were more common than we realized which revealed flaws in the prototype’s experience, uncovering new user needs - for example, customer invoices and the ability to add meal deals to multiple orders.

Worthy updates.

After securing buy-in from the CEO, we moved ahead and updated the prototype.

Polishing the experience

Designing the remaining flows

After fine-tuning the MVP’s happy path, I started working on additional flows, page states and experiences to make sure our MVP was robust enough for in-store testing.