A New and Improved Home Screen | Fresh Tri
TOOLS
Figma, Whimsical, Illustrator, Photoshop
MY ROLE
Discovery, ideation, usability, research, prototyping, iteration
TIMELINE
Fall 2021 - Fall 2022
PLATFORM
Mobile
About Fresh Tri
Fresh Tri is a habit changing app that based in science and research-backed psychology. Using the Iterative Mindset Method™, users can break old habits and build new healthy ones. With the support of a thriving Tri(be) community* and licensed practitioners, users have the resources they need to reach their goals in a reliable and sustainable way. Learn more on the company website.
*The Tri(be) is the social element of Fresh Tri. The Tri(be) includes a community feed where users can post their gratitude or intention for the day. Users can either send hearts and communicate with each other about their goals.
Real quick… what is a Tri?
“Tri” is a small step that you can take toward achieving your goal, whether that be weight loss, managing a health condition, or something else.
Here’s an example of a Tri and what it’s comprised of:
It starts with what the user wants to focus on.
We break this down into 4 main categories: eating healthy, managing stress, moving more and thinking positively. After a focus area is chosen (let’s say eating healthy) the Tri gets narrowed down further: how do we want to start the healthy eating process?
The user can choose from our list of options, including eat more veggies, limit processed foods, etc. From there, we go even deeper by asking a few more questions. Let’s say the user choose limit processed foods. From there, we’ll ask which processed foods would you like to eat less of? What might help you eat fewer processed foods?
After the user answers, our algorithm generates personalized habits (the final piece of the Tri), for the user to choose from. This is the smallest, most granular piece that the user focuses on. Some habits that were generated from this example were prepare my own food, choose fresh meat, and more.
From there, the user is ready to go. They can always go back and iterate on the Tri whenever they would like!
Project Summary and Defining the Problem
In the summer of 2021, I joined the most talented team of individuals at Fresh Tri. Together, we were tasked with taking Fresh Tri to the next level - after a user finishes onboarding, what’s next? Where does the user go next? This was the question that started this project, and launched it into the future of Fresh Tri.
The original home screen presents several key usability challenges:
A significant issue is the lack of clear direction for users once they access the home screen. The presence of check-in bubbles is confusing and doesn't provide a meaningful or intuitive way for users to proceed. Furthermore, the inclusion of train videos, which seem to have low user engagement and utilization rates, detracts from the screen's focus.
There is no easily accessible entry point to Tri(be), the most popular feature of our platform, making it frustrating for users who are seeking it. The absence of a convenient place for users to iterate on their Tri* further compounds the ineffectiveness of the home screen.
*Iterating on a Tri is slightly tweaking the Tri to tailor to a users needs. For example, let’s say a user’s overall goal is to eat healthier. They initially choose to eat fewer white carbs to work on achieving the overall goal but that isn’t working for them. To iterate, they swap to eating more whole grains instead.
All of these issues combine to create a home screen that not only lacks clarity and coherence, but also fails to direct users efficiently towards the platform's most valued and used features.
Addressing these issues through thoughtful design and user-centered solutions is crucial for enhancing the home screen's effectiveness and improving the overall user experience.
Listening to the customers
The original home screen/home base of the Fresh Tri app didn’t have a lot of direction - our users didn’t know where to go, or what to do next after onboarding. I was tasked with figuring out how to make the home screen an intuitive and functional place for users to come back to every day.
We also received the feedback that the Tri(be) section of the app was the many users favorite part of the experience. Tri(be) is a place where Fresh Tri users can connect with each other and come together as a community. We took this very seriously and incorporated it into the new design.
Pictured: the current Tri(be) interface
Laying out the requirements
The VP of Behavior Design, Product Manager and Senior Designer provided general requirements based on features requested by customers, and the most effective solutions based on brain science. After discussions with the team, I decided to take inspiration from common features that our user base was familiar with, as well as making note of things that aren’t working in those products (things to avoid). We did market research and some “blue sky” ideation to really think outside the box and produce new and fresh ideas based off effective design principles.
I was full of ideas and excited to hop into more detailed work, so we moved onto low and high fidelity screens. I had ideated solutions based on the needs of the users and the PMs requirements, so I went from there. I absolutely love the visual design elements of the process.
I did have an original home screen base to work off of, so creating complete new wireframes didn’t seem necessary. I used the original screen as a rough base for my designs. I experimented with different components, styles and aesthetics to create a vibe based on the core goals of this project:
Low and High Fidelity Screens
Clarity
Accessibility
Tranquility
Acceptance
Excitement
Challenges
Something that we focused very closely on during this process was making sure that the app was a welcoming, accepting place. We worked hard to remove all judgement and “measuring” (weight logs, login streaks, etc) from the process. We wanted to avoid the traditional form of “tracking” (progress bars, losing progress if the user misses a checkin, etc) user progress, and do it in our own way. We ran into these challenges throughout the process:
To fix these issues and enhance the overall user experience, it was imperative to address these challenges with a user-centric and meticulously designed approach. By carefully reconsidering the layout, content, and accessibility of the home screen, we ensured a smoother and more engaging user journey, ultimately improving the overall effectiveness of the product.
How does a user measure their progress without meticulous tracking? How do they track progress without judgement? How do we keep users coming back, time and time again?
After hours of work, iteration and testing, we came to the most recent version on the app: say hello to the new and improved Fresh Tri Home Screen.
The New Home Screen
Easy access to the goal the user is working on
Judgement free progress bar with milestones to celebrate small victories, along with straightforward access to the iterate and checkin buttons.
While there's a natural sense of progression tied to its functionality (which is unavoidable), we were adamant about instilling a culture of celebrating every milestone along the journey towards the final goal.
To achieve this, we implemented several strategies. We ensured that the user's progress wasn't reset if they missed a check-in, recognizing that setbacks are part of the process. Instead, we maintained a record of their achievements, acknowledging the effort invested thus far. Additionally, we broke down the progress bar into smaller, manageable milestones, making the journey feel more achievable and less daunting. Lastly, users receive daily motivational messages, serving as gentle reminders to keep pushing forward.
Tiles to encourage users to explore different parts of the app
A place for users to write their motivation for making a change in their life, a reminder why they started this journey
An alternative place to access the check in flow
Connection to Tri(be), to engage with the Fresh Tri community
Fun tiles to encourage users to gain new knowledge about healthy habits
Results and Conclusion
The “What’s Next” home screen redesign was a massive success! It increased retention, engagement and was a huge conversion success. Our product is helping people achieve their goals and heal their relationship with themselves. That’s the biggest success in my eyes, the lives that were changed and the people we helped.
There’s always going to be more to iterate on and improve on going forward (these are just a few ideas we have):
Further exploration of the Tri Model - how do we make it even easier to understand? Does it call for another overhaul? What else do our users need?
Continued improvement of the check in bar
Diving into the iterate tab and making that higher priority in the information architecture of the page
We will continue to listen to the users and evolve our designs to create the best version of this product that we possibly can. The journey is never over!
About the Team
This project was a team effort - huge shout out and credits to John Beck (Senior Product Designer) Jordan Butler (Former Product Designer), Anxhi Subashi (Product Designer), Casey Hughes (Former VP of Behavior Design) and Jeff Jureller (Product Manager).