Experteas App
Context
This project idea was inspired by the need I saw to fill a gap among the apps that currently exists for tea enthusiasts. I wanted to create a holistic and comprehensive app that displayed information that a user would normally have to do multiple online searches to find all on one customizable platform.
Challenge
Tea lovers and integrative health practitioners want one place that provides them with all the information they need on different types of tea. They also want to be able to find and save their favorites, and discover similar brands based on their tastes and interests.
Solution
Create an app that provides tea and brand information, includes cultural and historical context, and boosts consumer’s knowledge of the health benefits of tea.
Scope: Self-Led Project
Duration: One week
Tools: Figma, Adobe Illustrator
Role: User Research, Concept, Wireframe, Prototype
User Research
I researched existing apps that focused on teas and medicinal herbs. I also researched the information that I would need to know to create this app and the proper layout so that it would convey all of the relevant information in a practical and aesthetically pleasing manner to the user.
I assumed that there would be medicinal apps for plants and other apps for tea lovers, so I researched them to see what features they contained and how they functioned. I learned that while there were many tea brewing apps that claimed to “make the perfect cup of tea”, there was no app that provided users with a full experience of learning about medicinal properties, tea brands, practices and so on. Therefore, I sought to create an app that combined those functions together and became a mobile hub for all tea enthusiasts.
Pain Points
Users have a hard time finding the different types of information they are looking for on teas, brands, and best brewing practices. Most apps are geared towards only brewing or selling.
Many apps geared towards tea-drinkers are for commercial use. They include subscriptions and tea “sent right to your door” for a price. They do not provide other useful information.
Design Process
Ideate
Starting off this project I had a brainstorming session. I took a few moments to write down all of the ideas and features that I wanted to incorporate in the app. I also thought about who the most likely users would be which includes tea-drinkers and healthcare specialists practicing traditional and modern integrative medicine. I then narrowed down the features I thought would be most useful and fine tuned them.
Wireframes
These wireframes were created on Illustrator. I approached them knowing there were a few basic features I wanted to incorporate, such as:
-
brewing timer
-
login page to have personal accounts
-
info on different types of tea
-
recommendations for users who want to discover new teas
-
barcode scanner
All of these features would allow each user to have a personalized bespoke experience, while offering them the
in-depth knowledge they are looking for.
Lo-fi Prototype
This prototype is similar to the previous wireframes. However, after looking over my original wireframes, I wasn’t sure if the organization on the homepage would be the best layout.
I experimented with a different layout in this prototype. This would allow for larger images and less wording. I also added a brand information page. Users will now be able to research different tea brands.
Mockups
Final Iteration
This is the final prototype of Experteas. The user flow consists of logging in, learning information about a tea type, making that tea, and then moving on to scanning a different tea and using that as a tool to learn more, then favoriting it so that the user can come back to it when needed.
The flow is inspired by a new user who might want to explore the app, and then move on to using the different tools that are provided.
Accessibility
Multilingual
This app is created for people of all ages and backgrounds. Many different cultures have a tea-drinking culture.
The ability to change the language of the app makes it more accessible to non-english speakers.
Easy to Read
The text can be made larger and has a number of images to accompany the text.
People who may have a hard time seeing text will more easily see black text against a white background.
Mobility
The barcode scanner is fast and it is not necessary for a person to have a steady hand in order for the scanner to read the barcode.
It is also not necessary to move somewhere else where there is a white or clean background.
Takeaways
Throughout this project, I learned to:
-
Always consider mobility.
-
Keep navigation simple.
-
Be more creative with adding animations.
-
Researching other existing apps is a great way to learn about where your own design may be improved.
After finishing this design there are a few design elements I would change or improve:
-
Include different color options for users that have green-red colorblindness.
-
Make icons more clear to what their meanings are.
-
Include sustainability ratings on tea brands.
-
Change tea kettle on timer to a tea pot steaming than pouring cup of tea.
-
Add social element to connect with other users on the app.