Product Design Process at Freeletics

Learn how we strengthen team collaboration, clarity, and trust while focusing on our customers.

Stephen M. Walker II
Life at Freeletics
7 min readJan 18, 2019

--

Photo by rawpixel on Unsplash

What to prioritize?

For people and for startups, time is the most precious resource. At Freeletics we focused our time on delivery over documentation for years. We prioritized shipping over generating notes or documenting decisions. We scaled the product teams and grew to a design team of ten. And we streamlined our DevOps process so that we continuously integrate and deploy our apps.

We now have continual internal betas and app store releases every two weeks. An efficient machine focused on shipping the four apps we build.

Thanks for investing five minutes of your time.

But at a certain point, this singular focus on delivery over documentation stopped making sense. Our product teams, which we call Crews, used different best practices, and designers did not always make their work visible to the Crew. When seeking to understand this better understand this problem, we also learned that Designers sometimes did not understand what Product Managers were working on and vice versa, especially when multiple Crews collaborated.

This isn’t what we wanted. Shipping digital products is a team sport so we needed to publish the rules to the game we were all playing.

What should our design process help us do?

This is the question we started with. Every designer (or company) follows some sort of process that they repeat over and over again. Many of them publish it because it sets expectations with clients and stakeholders. But few describe or understand why this is the best process for their work.

Before designing any process, you should answer the most crucial question of all: What do you expect to have by the end of the process?

Process design and process itself can bore people at a startup. Worse, it can make them apathetic. You join startups to build and ship things, not to sharpen your bureaucracy skills. Thankfully, you defeat bureaucracy by focusing on outcomes and building in transparency for all involved.

What is the result we expect?

We want our product design process to deliver relevant, delightful experiences for our customers. We build lifestyle health apps focused on fitness and nutrition. These are high-effort products for our customers. We challenge our customers to take action in the real world. And to do this successfully, we must achieve three things:

  • Validate that we are working on a real problem for our customers
  • Define and ship an exceptional app experience
  • Confirm product/market fit before iterating further

Our process is as focused on craft and polish as it is learning. Continually learning is what makes us better designers and propels our product innovation.

Organizing our chaos aka the process.

We documented the disparate Crew processes and analyzed key design activities. We discussed the goals and debated best practices. This allowed us to streamline our work into five fluid, sometimes cyclical, stages.

Let’s dive into them.

Understand

Designer analyzes customer research videos

How can you begin work without truly understanding the problem? You can, but we wouldn’t recommend it.

This is where the majority of the project definition, user research, and analysis happens. Designers partner with PMs to understand and define the problem, synthesizing data from research (market, user, experts) and product analytics. The Crew is ready to move forward after defining a hypothesis, the desired outcomes, and have a shared understanding of what they’re not solving. All of these steps verify that there is enough evidence that this is a real problem we should tackle.

Key activities include:

  • Defining the project and hypothesis
  • Expert interviews
  • Customer research
  • Product analysis
  • Documenting and sharing learnings

Ideate & Explore

HMW make running great again?

The second stage, Ideate & Explore is (as clichéd as it sounds) where the magic happens. We emphasize collaboration here, pulling in engineers and diverse perspectives from outside of Product and Engineering. For Freeletics, this ranges from customer engagement, content strategy, product marketing, training science experts, to user research. Designers lead explorations and the prototyping of ideas, finding their way through messy concepts until a solution becomes clear.

There’s no playbook for innovation, but a shared language and understanding of methods is helpful. We use Human-Centered Design methods and time-boxed sessions – 2 hours, 1 day, or sometimes 4 days – to quickly iterate and test new ideas with customers.

Key activities include:

  • Design definition
  • Collaborative ideation and exploration
  • Concept visualization, communication, and feedback
  • Prototype testing with customers
  • Documenting learnings and committing to a solution

Implementation

Designer finalizes flows and view states

The third stage, Implementation, is what many designers view as the job, but it is only part of the work required to ship a successful product. It just happens to be the most visible.

The flows. The screens. The interactions.

This is where the product takes shape. Designers work with their Crew — Android, iOS, and Backend Engineers, plus the Product Manager — to refine the UI, think through gestures, adjust for device or platform-specific nuances, and evaluate against content and design patterns. Most of the work happens in Sketch, but we also use Overflow, Marvel, and Framer to communicate the details. We design for a global audience and this requires design adjustments to support language localization.

Key activities include:

  • Refining the information architecture, user flows, visual design, and interactions
  • Integrating final English content
  • Defining exceptional scenarios (dead ends and empty or error states)
  • Reviewing with the Design System team, validating patterns and elements
  • Checking for content, privacy, or accessibility impacts

Ship It!

Engineer and designer review Android interactions

There is almost nothing better than shipping it. But to do this, designers and engineers must work closely together to get the details right. Thankfully, we use Abstract, which streamlines the handoff of most details. But no tool replaces a good conversation between designer and engineer for clarification.

There are also some potentially tedious cleanup and reporting tasks (does anyone love Jira?) required when there are more than a couple of people building the app. Taking the time to do these tasks now makes future work smoother.

Key activities include:

  • Design / Engineering Handoff (specs, interactions, content)
  • Updating Jira tickets and reacting to implementation issues
  • Testing the new experience on different platforms and devices
  • Design hygiene (file, branch, prototype, and exploration cleanup)
  • Celebrating with the team

Monitor & Iterate

Designers and a product manager viewing country adoption metrics

Many companies stop and move onto the next project after a release. Thankfully, we monitor the launch through beta releases, A/B tests, and phased worldwide rollouts. This gives us a better understanding of what our customers are actually doing. Are they using the new feature? Are they more successful in reaching their health goals? Do they even like what we shipped? Answering these questions helps a Crew understand how to iterate next.

Key activities include:

  • Monitoring and analyzing A/B tests, metrics, and customer feedback
  • Discussing results with the Crew and others in the company
  • Building an iteration plan

What’s next for us?

We shared this process with the product management team and discussed overlapping activities or responsibilities. This was insightful for everyone because we never came together as a full group to discuss how we are working. It seems obvious once you do this, but when there are so many people and different teams you rarely stop to discuss these topics.

In a year, when our team is likely twice the size, we will iterate. Each new person brings experience and knowledge that shapes how we work every day.

Clarify your work and build team trust

We hope this overview of our process is helpful for you and that it inspires you to do the same with your team. It only took a few hours to draft, discuss, and document ours. It’s a small investment in how your team works.

You can start small by spending ten minutes mapping your view of the stages and activities. Then provide everyone on your team individual time to brainstorm before gathering everyone together to discuss.

Don’t forget to iterate over time.

Thank you for reading!

--

--