kilogram

DURATION

12 days

MY ROLE

UX Design: Research, Concept Testing, Usability Testing

UI Design: Wireframing, Prototyping

GOAL

Implementing a new premium feature within the existing Kilogram diet-tracking app that would allow users to request the service of a nutritionist. Users will get a set of tailor-made food and drink suggestions for every meal (breakfast, morning snack, lunch, afternoon snack, dinner). These suggestions can be easily accessed from the app’s journal and preferred options can be chosen.

DISCOVER

BACKGROUND

„Kilogram“ is a diet-tracking app that allows user to track and improve their diet in the simplest way possible. The app operates on the principle of „smart eating“, employing artificial intelligence (AI) to aid individuals in monitoring and measuring their food consumption through intelligent voice and image recognition capabilities. Through continuous usage, the app gains insights into users’ caloric requirements and adjusts to metabolic fluctuations, ensuring alignment with the user’s nutritional goals.

CLIENT

tools: stakeholder interview (video call)

Established and launched in 2023 in Italy, Kilogram aims to empower individuals to take control of their dietary habits, fostering self-contentment. The application employs various AI-based recognition tools, including voice and image recognition, enabling users to track their food and beverage intake effortlessly. Users can use features like barcode scanning, food image capture, or verbal descriptions to log their consumption, allowing the app to estimate nutrient content and calorie intake within the journal. Kilogram's core philosophy revolves around simplifying diet tracking while enabling informed dietary decisions. Beyond its smart eating functions, the app provides real-time contextual information after food logging, such as remaining daily calories, macronutrient recommendations, and healthier food alternatives.

Introducing a new feature—a nutritionist service—Kilogram seeks to integrate professional nutritional guidance for various health objectives alongside self-assisted interventions offered by the app. Traditional personal nutritionist consultations often involve significant costs and logistical efforts, including travel time. The objective is to provide users with an affordable and efficient way of accessing valuable advice and support during their dietary journey, increasing user engagement and conversion rates.

Key requirements for the feature implementation include

an informative onboarding process
a user questionnaire for personalized meal suggestions
a meal journal with sample suggestions for each mealtime
an introduction page for nutritionists, and
a communication channel between users and nutritionists

To seamlessly integrate the new feature into the existing app infrastructure, Kilogram provided relevant target user data, a style guide, onboarding questionnaires, and contact details for a nutritionist. Additionally, the team engaged with the Kilogram app firsthand, creating an account to navigate through its features and evaluate the overall interface design and user experience.

USER

tools: user interview (phone & video call), online survey

Through campaigns, interviews, and first-user experiences, Kilogram gathered data that pinpointed their target user: primarily women living in Italy, Spain, and France, aged 35 and above, seeking simplified diet maintenance solutions. These users may have previous experience with various tracking apps, such as those for monitoring cycles, sleeping patterns, or budgeting.

To ensure the new nutritionist service aligns with user needs and expectations, it was essential to gain a deeper understanding of the target audience. Therefore, six user interviews were conducted against the background of the provided insights. Participants were women aged 36 to 65, situated in Italy, Spain, and France, who were familiar with and engaged with diet apps and nutritional advice services to varying degrees. Additionally, an online survey was deployed to determine individuals’ use of diet-tracking apps, the propensity to consult a nutritionist, and their receptiveness to a feature combining both functionalities.

CONCEPTUALIZATION

PROBLEM DEFINITION

tools: affinity diagram, user persona, user journey map

The insights and expectations gained from the interviews can be summarized as follows:

Interest in Diet-Tracking:
- Although some participants currently don’t use diet-tracking apps, they express openness to considering them, especially if the app incorporates features like food recognition through photos.
Desire for Connection:
- There's a notable interest among participants in having the diet plan seamlessly integrated with a tracking app. They believe this connection would increase motivation and make it easier to stick to their diet goals.
Value of Personalized Plans:
- Participants highly value personalized diet plans created by a nutritionist, acknowledging the uniqueness of individual bodies and requirements. They appreciate plans tailored to their preferences, lifestyle, and health goals.
Importance of User Experience:
- Ease of use is of paramount importance. Participants prefer minimalistic, user-friendly apps that are engaging and offer positive reinforcement, such as streaks or achievements, to sustain motivation.

Based on these insights and in consideration of Elena, the primary user persona who struggles to find an ideal solution for accessing a professionally curated and personalized diet plan that is easy to follow and track via an app, the question of „How might we provide Elena a solution that’s tailored to her needs?“ Emerges as a focus point for further exploration.

IDEATION

tools: lightning demo, brainstorming, dot voting

For inspiration during the ideation phase, the technique of „Lightning Demos“ was employed. This involved carefully selecting and analyzing exemplary references, identifying key aspects, and drawing insights to inspire the prototype.

The selecting primarily focused on diet-tracking apps and online nutritionist services, including „Eat This Much“, „Diet Planner“, „Lifesum“, „betterhelp“, „NOOM“, „8fit“, and „YAZIO“. Key elements were identified, such as maintaining a motivational and human tone during onboarding, incorporating a progress bar to track questionnaire completion, featuring an informative nutritionist page, scheduling processes, contact methods, and journal layouts with meal suggestions. Additionally, features like diet challenges, comprehensive progress tracking dashboards, educational nutrition material, and integration with health apps like the FitBit pedometer were explored. While these features could improve user engagement, they were beyond the project scope and time constraints but still are valuable best practice examples.

Drawing from this feature and visualization inspiration, these insights were integrated with the existing design of the Kilogram app and the questionnaire provided by the nutritionist to develop initial wireframes.

SOLUTION DESIGN

PROTOTYPE

tools: user flow, figma, usability testing

For the nutritionist service, the most crucial screens needed for a smooth user flow were determined. These screens include:

An adapted menu screen
A benefits page for the different subscription plans Kilogram wants to offer (after implementing the nutritionist service, their next step is also to implement a personal trainer service)
The onboarding screens, including the questionnaire
The journal with the personalized meal plan
The nutritionist page

Once these screens were finalized as Mid-Fis, they underwent usability testing with interviewees who were familiar with the app concept. Valuable insights were gathered for every step in the user flow:

Onboarding process pages:

Users suggested having a clear number of the overall steps on the onboarding, besides the progress bar, for easier navigation. Therefore, the number of steps was added to provide a clear overview.
Some questions were found confusing by users, and they didn’t understand why certain answers were needed. To address this, more detailed explanatory information was included for these questions.
Users disliked the infinite list of food suggestions in two of the questions. That’s why the arrangement of all the foods was changed, and a text input field was added for more efficient selection.

Meal plan on the journal page:

Users expressed concern about the cluttered layout of the journal, prompting an increase in spacing between the lines.
Users struggled with recognizing the „add food“ and „add exercise“buttons as they lacked a familiar „CTA look“ and appeared more like regular text. To improve accessibility, these buttons underwent a redesign and repositioning.
Users found the term „I ate this“ confusing and suggested a more concise wording. Therefore, „I ate this“ was changed to „Add to journal“ to maintain consistency in the app’s copy.

Nutritionist page:

Initially, users could send their nutritionist one voicemail per month on a selected date, as per the brief. However, users found this option frustrating and incomprehensible, desiring a more frequent and accessible way of communication. After consulting with the stakeholder, the design of the communication area was adjusted to a more familiar chat feature.

Navigation bar:

(Although it was not within the scope to redesign the navigation bar or the app itself, insightful feedback was received during usability testing.)

Users found the navigation bar taking up unnecessary space on the screen.
The function and position of the round button were deemed unintuitive and could benefit from additional description text.
The search bar’s position was unclear to users, who expected it to be on the top of the screen.
Similarly, users anticipated the journal and menu icons to be located in the top corner of the screen or in a more aligned way alongside the round button, aligning with their natural browsing patterns.

FINAL DESIGN

tools: figma

During the prototype and usability phase, the team developed and refined screens essential for a seamless user experience. The phase facilitated the identification and resolution of usability issues, ensuring the app’s functionality and design aligned with user expectations and preferences.

And here's the final design of the new nutritionist service implementation: