Sweet Bliss

OVERVIEW

Sweet Bliss is a single location bakery with a foundation of diversity, offering an extensive range of goods tailored to cater to individuals with various dietary preferences and restrictions, including vegans and those with specific ingredient allergies. They aim to ensure that all customers can easily access this information and make choices in accordance with their dietary preferences.

The App design goal was to allow users to easily choose items from the menu based on their dietary preferences and obtain detailed information about each item on the menu.

ROLE

Mobile App UX / UI Designer

Brand Design System, Visual Designer, User Experience Designer, Wire-framing and prototyping

TOOLS USED

Figma, Adobe Illustrator, Adobe Photoshop

RESEARCH PHASE

Brand & Strategy

The first step was to understand the brand’s foundation, voice, and attributes. I started designing questions in order to figure out what the brand is about, how it wants to be presented, and who the target audience is.

Foundation: What are brand’s values?

Voice: In what tone do we want to communicate with the users?

Feeling: How does the user feel when in contact with the brand?

Identity: What is the brand image and personality?

Target Audience: Who are the main users?

Pain Points: What problems do I need to solve in my design? What is the main purpose of the app?

Distinctive Factor: What sets the brand apart from its competitors?

I had a meeting with the bakery’s owner to gather enough information to answer all the questions and come up with a strategy to design the bakery’s app and Design System which was very challenging since the Bakery didn’t have any brand identity or Design System at that point.

Target Audience & Pain Points

To better understand the target audience and user needs, I developed two personas for this project. This personas helped me stay on track while crafting the information architecture of my app based on user goals and pain points.

Goals & Information Architecture

After carefully analyzing the brand’s target audience, pain points, and distinctive factors, I identified two primary paint points that I have to consider while designing the app. 

The first pain point was resolved by enabling users to select their allergens and filtering menu items accordingly, displaying only allergen-free items for easy ordering.

The second pain point was addressed by providing nutritional information and ingredient lists for all menu items.

The initial information architecture was designed based on these two main goals.

Competitive Audit

To distinguish the Sweet Bliss app from other online ordering apps, I conducted a comprehensive competitive analysis. This research aimed to uncover the strengths and weaknesses of existing competitors, with the ultimate goal of leveraging these insights to enhance the design of our app. By strategically applying lessons learned from this analysis, I aspire to create a unique and compelling user experience that sets Sweet Bliss apart in the crowded landscape of online ordering apps.

What I learned …

At the end of the research phrase, I realized that I have to work more on new ideas on how to let the user filter out the items that he or she is allergic to, or simply doesn’t want in her/his orders. I have to gain the user’s trust with my design and assure him/her that Sweet Bliss values the customers and cares about their preferences in every and each

DESIGN PHASE

Wireframing

In the wireframing phase, I crafted a foundational blueprint for the user interface, focusing on clarity, functionality, and user flow. By strategically organizing content and mapping out key interactions, the wireframes served as a roadmap for the user experience. This iterative process, aligned with design principles, contributed to a streamlined and user-friendly final design.

Design System

Since Sweet Bliss didn’t have a design system, I started the design phase by designing the system for the brand. I made sure to consider the voice (Friendly, Caring, Informative), identity of the brand (Approachable, Creative, Cute, Supportive) and the feeling that the app needs to create in the user in my design.

User Accessibility had a crucial Influence on this step to make sure that everyone can enjoy the app. The color palette, font, and typography was chosen carefully based on the user accessibility standards.

PROTOTYPE PHASE

Final Prototype & Design

After finalizing the wireframes using client’s and users’ feedbacks. It was time to start the prototype. 

Getting started

“Get Started” screen is simply designed. Sign up / Sign In screen uses user’s phone number as the main verification type. After signing up, one of the main screens comes up and simply asks if user has any allergies or dietary restrictions and wants to filter out those items from the menu. it also points out that these settings can be changed in the future in the user’s profile or on the menu. with this design, user feels how much sweet bakery values their needs and dietary restrictions.

Menu / Order

 The menu played a pivotal role in addressing key functionalities of the app, encompassing dietary restrictions, ingredient filters, and nutritional information. After exploring various approaches, I opted for a bold and consistently visible filter at the top of the menu. This design ensures that when a user filters out an ingredient, all relevant items across categories are instantly refined. Users can easily revert by clicking on the restricted ingredient.
 
Furthermore, the menu prominently features essential nutritional details like calories, sugar, and fat on each item card. A dedicated button provides users with comprehensive nutrition facts, while allergens or restricted ingredients are intuitively represented with icons on the item card. This strategic design approach enhances user experience and emphasizes the app’s core goals.

FINAL THOUGHTS &

Takeaways

Diving into this project was an absolute joy because I got to be part of every step, watching it grow from the ground up. Plus, I picked up a ton of new things along the way!

Here are some awesome takeaways from this adventure:

User-Centric Design Excellence: The Sweet Bliss app showcases a strong commitment to user-centric design by prioritizing a seamless and intuitive experience. Users can easily navigate and make informed choices based on their dietary preferences, ensuring a positive interaction with the platform.

Establishment of Brand Identity:Through meticulous research and design efforts, Sweet Bliss successfully established a distinct brand identity. The design system reflects a friendly, caring, and approachable brand personality, contributing to a cohesive and memorable user experience.

Innovation in Allergen Filtering and Transparency: Recognizing the importance of addressing user concerns, the app introduces innovative ways for users to filter out allergens, fostering trust and reinforcing Sweet Bliss’s commitment to customer preferences. The app goes beyond by providing comprehensive nutritional information on the menu and item cards, enhancing transparency and building trust with customers.