Flour Power Bakery
Flour Power Bakery
CASE STUDY: BRANDING AND MOBILE BAKERY APP
Embedded Files
Project Overview
Project Overview
Flour Power is a conceptual local bakery located in the Downtown area of Albuquerque, NM. They specialize in high-quality and fresh pastries and drinks. As the bakery’s clientele grows it has become increasingly important for them to offer a mobile ordering application that allows their clients to easily order items for quick pickup.
The aim of this project was to solve the problem of creating a user-friendly interface for non-tech-savvy individuals who want to earn rewards while conveniently ordering items for quick pick up on their mobile device. Additionally, develop a strong brand identity for the bakery that can be used to represent them in their mobile app and other media channels.
Project Type
Concept
My Role
Brand Designer
UX/UI Designer and Research
Art Direction
Duration
January–March 2023
Technologies
Figma, Adobe Xd, Illustrator, and Photoshop
Flour Power Branding
The inception of FLOUR POWER's brand identity was rooted in a thorough examination of its target audience. Utilizing personas, I discerned that the brand resonates with a demographic comprising working and retired professionals aged 25 to 65, seeking convenience amidst urban living. While FLOUR POWER caters to this demographic, it was crucial to avoid a dated appearance. FLOUR POWER embodies empowerment, vibrancy, and the essence of easy living.
Brand Identity
The journey of brand design commenced with a deep dive into history. My aim was to craft something that exuded a sense of both familiarity and innovation. Drawing inspiration from the vibrant era of 1960–70s America, I discovered that delicately embracing nostalgia could evoke a feeling of both comfort and energy. Flour Power is a retro, flirty, vibrant bakery that offers fresh selections that remind you of where you come from.
Brand Colors
The color palette selected for Flour Power's branding draws inspiration from the lively hues of the 1960-70s era. These colors, reminiscent of my grandparents' home, were slightly softened for a contemporary feel. Introducing a dark gray and soft white enhances the palette, imbuing it with a modern, graphic edge.
Typeface
The logo's typefaces draw inspiration from the fluffy texture of frosting, a hallmark of the bakery. Arial was selected for its exceptional readability and accessibility, aligning with FLOUR POWER's commitment to user-friendly design.
Logo Design
Flour Power's Logo design was directly inspired by the research conducted during the brand identity phase. The clever wordplay of Flour Power served as the primary inspiration for the logo. Featuring a cupcake adorned with blooming flowers atop, it offers an intriguing twist while subtly reinforcing one of the bakery's core values: delivering the freshest pastries.
The logo was meticulously crafted to ensure brand recognition across various platforms. Whether used in its entirety or broken down to meet diverse needs, it retains its unmistakable brand identity without compromise.
Flour Power Mobile App Design
The bakery needs to create a mobile app so customers can easily order menu items and conveniently pick them up at the bakery's downtown location. User research uncovered users need a mobile ordering app that offers an intuitive user experience since many are not tech-savvy. It was discovered many users in Flour Power's target user group are not confident with using technology and often feel left out because they don't understand how to navigate complicated user interfaces. I personally believe technology and user experiences can be designed in a way that is both intuitive and accessible. Great design should open doors to empower users and build confidence.
Design Thinking Framework
Research
Conducting user interviews was essential to come up with an understanding of the unique issues end users are facing when ordering food through a mobile app.
research goal #1
research goal #1
Identify what features are helpful for users when using a mobile food ordering app
research goal #2
research goal #2
Identify pain points users have when ordering on mobile apps
Empathy Map
Individual empathy maps were created based on interviewees during the research process. This map helped to identify what pain points users are facing when placing orders on mobile apps.
User Persona
Liz is a 60-year-old retiree who lives with her puppy! She enjoys spending time with her family and friends. When she chooses to order drinks and bakery items she generally goes in person or over the phone since mobile apps can be troublesome. Her experience with technology is limited but she would like to start using it if it means she can participate in loyalty programs.
Problem Statement
Liz Lopez is a single retiree with little technology experience who needs an easy-to-use app because she wants to keep things simple and not stress over the ordering process.
User Pain Points
Paper Wireframes
After completing a task flow, I started sketching some paper wireframes of what the application could look like once it was translated into a digital format. This process allowed for rapid iterations, many versions were created, the ones I moved forward with are shown below
Digital Wireframes (version 1)
I translated the paper wireframes into digital versions so I could begin testing to help identify any problems early on prior to turning them into lofi/hifi prototypes. These were constructed using Figma.
The Log in and Sign up buttons were changed to a stacked orientation and all buttons were made larger.
While on the Log in and Sign up pages users wanted an option to be able to sign up or log in from the other page in case they chose the wrong button.
A mobile payment option was added so users could pay with their digital wallets. The "save for later" feature was removed to allow for autofill of payment info.
More Usability Testing
After the second set of low-fidelity wireframes was conducted the product was translated into a high-fidelity version and underwent 2 more rounds of usability testing. The user groups were each made up of three people: one male-identifying, one female-identifying, and one non-binary person.
Round One of Testing
Adding rewards to homepage
Adding rewards to homepage
The first round of user testing showed users wanted to see what rewards were available prior to ordering their items.
Adding elevation
Adding elevation
One issue that users were facing was not being able to tell the difference between regular design elements and one that required action. By adding shadows to fields and buttons this helped with accessibility.
Round Two of Testing
Reward Redemption
Reward Redemption
The reward system was a place where people took longer to navigate during testing. This round revealed it needed some major changes. I made the buttons large and easy to follow. It also has a text box that lets users know what to do.
Button Hierarchy
Button Hierarchy
In the first round the buttons were the same color. This made the UI a bit more cluttered and added to the confusion of navigating an app. The button hierarchy subtly suggests what a user should do next or what has been chosen.
High-Fidelity Prototype
Here is where everything that preceded came together to formulate the final high-fidelity prototype of Flour Power's mobile ordering application.
Learning Outcomes
This was the first product I've created. I learned a tremendous amount about the user experience process and what it entails. During the research phase, I learned how important it was to go into research without any bias. I also realized that you can't go into this with a solution in mind. It is all based on what the user needs and what features will lead to the best user experience for them. The biggest lesson I learned is this process cannot be rushed. It's crucial to take your time and go through the steps thoroughly to avoid missing things that could really help people.
In hindsight, there is so much I would do differently. I would have taken better notes while going through the process, I would ideate more solutions, and I would dig deeper into the research portion to uncover more pain points users are facing. Design is about empathy and that is the only way to solve user's problems and offer real solutions.
Page updated
Google Sites
Report abuse