How to Build a Product in 2 Weeks From Scratch — Case Study
Step-by-step process with the lessons learned
When a voluntary initiative tries to help local businesses, and they need you to design a product in less than two weeks, it’s everything but usual. Here’s how UX studio designers approached this impossible task to create an entirely new product in 2 weeks and what we’ve learned from it.
Content table:
- The Pakk idea (Summary)
- Approach and plan (Methodology and project plan)
- Designing Pakk in 2 Weeks(The project itself)
- Package delivered (Results and conclusions)
How Pakk Mobile App Idea Was Born💡
The name Pakk comes from the Hungarian language and can be translated as “package.”
Hungarian enthusiasts created a Pakk’s mobile app concept with a single goal in mind: to connect struggling small businesses with their customers and help them during the coronavirus outbreak.
They envisioned a mobile app that would let users explore local shops, allow them to see what services they offer, and enable them to order a custom package.
Their initiative reached out to UX studio to assist with the design. A team of two UX professionals accompanied Pakk for a short time. The task was to walk them through the UX process and guide them in creating a useful and easy-to-use app.
Methodology and Project Plan 📅
During the pandemic outbreak, small businesses struggled to keep up with the lack of customers, reduced opening hours, and other regulations. Thus, every single day was crucial for the Pakk team; they wanted to launch the application as soon as possible.
UX studio team started the project in the second week of April 2020. The goal was to deliver the final UI in just two weeks to have Pakk ready and running by the end of the month. Honestly, it seemed impossible.
However, we came up with the solution to manage the app launch on time:
- Kickoff on the second day that aimed to gather as much information as possible.
- A working prototype by the end of the first week.
- Usability testing, prototype iteration on the second week.
- Final UI and UI testing on the second week.
- A closing meeting with the deliverables and results overview.
We also recognized that instantaneous communication between our team members was crucial, so we set up a Slack workspace and relied on short, on-point video calls.
It helped to make critical decisions in minutes and allowed us to respond to user feedback immediately. On the other hand, it was clear that many of our design choices could not be validated in just two weeks. So we created a list of problematic/promising points for future references.
Designing Pakk in 2 Weeks🌈
1. Kickoff
UX studio prepared a kickoff meeting to get to know Pakk team, the product itself, and decide on how to approach the design in general. A widely used mission-vision workshop came handy to define Pakk as a brand, while the value selection workshop showed us how Pakk wanted to present itself.
During the research, we defined that Pakk should be accessible, practical, trustworthy, and, most importantly, safe. These were the fundamental values we followed when it later came to design choices.
Along with the developers, we also established an impact-effort matrix to see which features could launch with 1.0 and be prioritized later. We noticed that the classic webshop experience was way out of scope — the Pakk team did not have enough resources to maintain a database in the 1.0 version with items, services, and prices. Therefore, we had to convince users that manual contact would be an easy way to order and pick up a package.
2. An ever-changing prototype
Our first prototype showed local businesses nearby on a map.
Although we agreed it was a good approach design-wise, we realized Pakk was not something users might use for browsing between different kinds of shops.
For instance, if you want to buy milk, you won’t consider going to a butcher shop. Instead, you’ll want to see different shops to choose from. So, we figured a more funnel-like flow would be more suitable to satisfy user needs — and this is how we arrived at the second version of the app prototype:
A home page was introduced, which was beneficial both for the businesses (to gain exposure) and the users who could browse shops sorted into predefined groups.
Considering the main values of the brand, these groups were classified as “popular” (frequently favorited), “safe” (shops where staff worked in full protective gear), “online ordering available”, and “new shops” (recently joined Pakk).
We moved search to a dedicated page, which allowed us to keep the list and map views. We assumed that the search functionality would be frequently used. Thus, we put tags on the home page that lead to search results outright, speeding up the wayfinding process.
We still had to convince users to contact the shop manually, and the Pakk team raised the need to somehow tease with a full-fledged webshop experience. That’s why the “funneled” flow drew a lot of attention to the vendor’s subpage. It was iterated many times, and the final solution was cultivated into a straightforward ScreenFlow that explained the ordering process and encouraged users to contact the shop.
3. Conducting usability tests and interviews
Meanwhile, recruitment for user testing was ongoing. Since this was a pro bono project, we couldn’t offer incentives to participants. Despite this fact, people were open and excited to participate, so it was relatively easy to conduct usability tests.
This heartwarming experience motivated us along the way, and we are incredibly thankful to all of the participants for their time and precious feedback.
We started the tests with a short interview session to determine our target audience’s shopping behavior during the lockdown.
We added an average walking time instead of using meters, which turned out to be a beneficial addition since many of our people preferred to walk rather than use public transportation.
In the testing phase, we focused on wayfinding. Participants were given a task (to find a bakery, for example), and we followed them through the prototype while continually reflecting on problematic points.
To bring an example, one of the most frequently encountered problems was the switch between the map and the list view of search results. After trying many different solutions, it was finally decided to use a floating CTA, which performed well during the tests — but was marked as a potential problem point that should be monitored closely later on.
Results and Takeaways 🎉
Creating a strong visual language
Our team created the UI as soon as we settled the structure. It happened in the middle of the second week. We proposed various approaches to match the values defined during the branding session.
The Pakk team wanted a powerful style that was going to grant individuality to the brand. That’s why the complementary red color became the background color in the final version.
Because of this bold and venturous design language, the proper final UI test was crucial. Using Invision, we build a simple UI prototype with a single flow, but this time research aimed to examine specific interface-related issues, like readability and recognizability.
We regularly updated the Pakk team on our findings, while continuously pushing new screens to Zeplin (which we used to hand over the screens and explain mechanics to the developers).
A UI kit with many elements, and their states was also created and kept up-to-date. It helped to facilitate the system migration into code. All efforts resulted in a smooth transition into the development phase, where our collaboration officially ended.
Takeaways
During the two-week Pakk design project, we iterated the prototype four times, more than 150 UI elements were created, 50 screens, and 10 usability tests.
All in all, we can proudly say that UX studio created a great digital product together with the Pakk team. Pakk app has been already released on the Hungarian market.
We can mention a lot of things that could have been done more effectively during our collaboration. Still, we managed to build and optimize the interface with an unusually strong appearance that suits Pakk.
Our main takeaway from this collaboration: you can’t plan everything or prepare for the unexpected. When you have two weeks to build a product from scratch, you have to create a detailed plan ready for execution. You have to keep moving forward, whatever it takes.
