PRIMARY PERSONA:
I developed a persona to synthesize and illustrate my findings in human terms. I compiled behavioral attributes most common to the interview participants, creating the following primary persona, Miguel Paredes a professional millennial wanting to share his spare time with a great companion.
Vivo Saludable Tool
research | definition | ideation & strategy | prototyping | iteration
FINDINGS:
-
No participants adopted through an online shelter/provider.
-
Most of the animals adopted were found on the street.
-
All participants adopted baby animals they found cute.
-
All participants knew there were online shelters, but lacked information.
-
All participants saw the animal (picture, or present) before deciding.
-
Specific information about the animal is important, size prominently.
-
Facebook is the most used tool for researching animal adoption.
-
Street dogs are inexistent in the rich districts and common in the poor.
-
There are few online adoption centers/services.
CARD SORTING:
I created a card sorting exercise at Optimal Workshop, then sent it to contacts until i got ten participants feedback. The sorting was created with food items and macro nutrient groups, this was done to analyze the knowledge of common users about food and their nutrients. The results helped me on how to display this information.
Background
Vivo Saludable is a new brand of nutrition plans. It offers services for healthy living with diets, structured plans, visits, etc, like ketogenic and fasting.
Challenge
Since many of these diets require a lot of time and preparation, depending on a strict control of nutrition values, nutritionists spend too much time creating diets for their clients. Vivo wants to automatize this process and giving their clients a fast and simple tool to keep track of what they eat and their nutrition requirements.
Approach
For now, they use an excel format with formulas so their clients can keep track. They lack the money to create an app and its a big investment for them to make without the proper feedback. A design thinking process approach was chosen to create a simple and fast web tool to replace their current one.
​
Project Duration: 120 hours.
Role:
​
Creative Direction
UX/UI Design
Research
Interaction Design​
Prototyping
Usability Testing
Tools:
Adobe PSD, Illustrator
Optimal Workshop
Invision
Maze
Zeplin
1
EMPATHIZE
Methodologies: Primary & Secondary Research, Competitive Analysis, Interviews, Variable Chart.
RESEARCH GOALS:
-
Emphasize with the user and learn how he goes through the process of creating his diet.
-
Discover if the user has other options than Vivo.
-
Understand the motivations, goals and pain points of users when accessing these services. (including the excel version).
-
Learn from existing clients the positive and negative aspects of the process.
-
Determine the strength and weaknesses of the current diet options in Lima.
-
Observe in situ the process of creating a meal with the excel and the strong points and paint points it currently has.
COMPETITIVE ANALYSIS:
The empathy phase started by analyzing the current landscape of online tools and software that offer nutrition services and tracking. A competitive analysis was conducted to spot the most frequently features and opportunities for improvement. This pre-research led us to develop a proto-persona of the final user including previous assumptions to be proved in the next research phase: user interviews.
Weaknesses
Strengths
INTERVIEWS:
Five interviews were conducted with users that had tried or when planning to try Vivo's services to gain access to qualitative data, to deeply understand the barriers, motivations, and needs, to uncover possible features that could help achieve a better user experience when users want to keep strict their diets and how they keep track while probing the following assumptions extracted from secondary research:
ASSUMPTIONS:
-
The excel tool is nonfriendly and complicated.
-
Not everyone feels attracted/knows about Ketogenic diet.
-
Diets are hard to maintain without the correct habits.
-
Keeping a healthy diet is expensive.
2
IDEATE
Methodologies: Roadmap, Card Sorting, Sitemap, Task flow & User flow.
SITEMAP:
After deciding the essential key features and elements on a roadmap I created a Sitemap, using the information provided from the research and the brief from Vivo, to outline the section pages of the website. Since this is a web tool more than a website the architecture is quite standard and simple. I took into consideration that they will later want to make the transition to an app.
USER FLOW:
I created the flow for the prototype test. The users will be asked to use the tool, browse a recipe add it to their favorites, and create a lunch plan with the recipe favorited. The meal planner will be tested as well with the macro requirement bars to create a lunch with food items from the list.
3
DESIGN
Methodologies: Sketches, Wireframes, Low & High Prototype, Responsive Design, UI KIT.
SKETCHES:
The problem to solve was to create a nutrition value tracker for a food list that's easy to access and use. I decided to solve this barrier by creating a simple and clean tool, with the right features. I started by sketching my ideas.
​
WIREFRAMES:
Once the architecture was set, mid-fidelity wireframes were sketched for both desktop and mobile versions to quickly test the structure and layout among potential customers and iterate if needed. Afterwards I produced high-fidelity wireframes.
UI KIT:
Based the look of the tool on Vivo's branding, the color scheme and font was chosen and all the icons were created. First, they were done with shadowing but some recommendations made me decide to go without them. Which have to be applied in the reiteration step.
HI-FI RESPONSIVE DESIGN:
After the first usability test I used the wireframes as a basis, then built the high fidelity design of the site using Photoshop and Illustrator.
The responsive design was done using a 12 grid system. The design for the smart was done at the minimum, 375 pix.
4
PROTOTYPING & TESTING
Methodologies: Usability Testing.
USABILITY TESTING:
Using the mid fidelity wireframes I put up a prototype in Invision. Two tests were done, the first one to test the evaluate the nutrition tracker and recommended recipes. Participants were asked to like a recipe and then create a lunch meal by using the favorited recipe. In the second test, participants were asked to create their own recipe in the recipe creator and add it to their lunch meal. The test was done in person and remotely using Skype and Maze.
FINDINGS:
-
All participants finished the first test without error.
-
50% of participants finished the second test without error.
-
80% of participants found the new way to track the nutrition
value improved. -
40% of participants found confusing the measurement of the items.
-
All participants found the new tool to be an improvement
with a simpler interface. -
The second test for the recipe creator had some errors.
-
Missing a way to swap from keto to normal nutrition values.
-
50% of participants tried to access buttons not implemented and mentioned they had no idea what the icon would do.
-
All participants agreed on the visual aesthetic is a good incentive to try it out more often.
REFLECTIONS & NEXT STEPS:
Vivo Saludable web tool project was my first authentic case. Working in hand with a CEO and a programmer was a great and enriching experience. The project in it self-escalated to be a bigger challenge for all of us than we first expected. In the beginning, we were focusing solely on the meal planner, to later add more features midway.
As next steps, I would reiterate on the other features, especially the recipe creator which needs better phrasing and flow. And the profile and tracker features that were postponed with new insights and feedback from the first clients trying the tool out.
Being able to apply a wide array of UX techniques and synthesize findings in a real project was gratifying and made me add some missing pieces to the whole puzzle.
