Vicky Chang, the owner of Maikeiki Studio kicked off her own gig on Instagram and Facebook about two years ago, and now she's on a mission to bring all her customers under one virtual roof and really get her brand out there.
That's where this website swoops in for boosting her brand, showing off her awesome creations, introducing the premium ingredients that goes into her cakes, and proudly flaunting all the great reviews she's collected. With this website, users can not only check out her previous work for inspiration but also order a custom cake with a quick and easy guest checkout. It's all about making Maikeiki shine and keeping things super simple for ordering – no fuss, all fun!
Let's have a glance of the Maikeiki website:
Let's slice right into the design process.
user interview & pain points
I conducted interviews with 5 participants to gain insights into their pain points. This research process enabled me to identify 4 specific pain points based on their feedback.
75% of participants emphasized that the lack of customer support resulting in delays regarding customer inquiries, and order-related issues.
Half of the participants expressed feeling overwhelmed due to an unclear pricing structure.
Most of participants encountered difficulties in locating the ingredients list and information, leading to uncertainty about the quality of the cakes.
Some participants mentioned the absence of readily available information regarding pickup and/or delivery time windows before they began the customization process.
Who are our target users?
personas & user journey
I've brought two personas to life and mapped out their user journey
Hugo Lu
Age
29
Education
Master
Occupation
Designer
Location
Taipei
bio.
Hugo is a creative graphic designer with a taste for quality. He is annoyed by the lack of nutrition & ingredients list. He's on a quest to find the perfect cake for his health-conscious friend, seeking a bakery that marries artistry and healthy ingredients to create a delightful surprise.
I'm all about enjoying some sweets, but I like to keep an eye on my health too.
Sophie Wang
Age
25
Education
Bachelor
Occupation
Teacher
Location
Taipei
bio.
Sophie is a dedicated teacher who adores celebrating life's moments with a slice of cake. She is often frustrated by confusing pricing structures when choosing a cake company. Sophie's on a mission to find a company that combines delicious cakes with straightforward pricing.
Teaching kids is a piece of cake, but choosing a cake shouldn't be so complicated!
Goal: Order a custom cake online for upcoming birthday.
Hugo is looking for a custom cake for his mom online.
He felt frustrated due to lack of transparent information.
He opened up the Maikeiki website.
He was able to order the cake efficiently with information he needs.
He felt satisfied picking up his cake, knowing he was about to enjoy it.
website structure
There are two primary user flows: one is designed to showcase the baker's talent, instilling confidence in customers regarding their purchases, while the other aims to create a platform for submitting orders. By introducing a linear, sequential progression, users can gradually engage with the baker, fostering trust in the process. Moreover, the order button remains easily accessible at the top right corner, ensuring a seamless transition into the order flow without any obstacles.
ideation & sketches
The main challenge of this project is to not only offer a straightforward ordering process but also to showcase the baker's portfolio effectively. The website needs to find a way to harmoniously combine both aspects and deliver a fresh and innovative outcome.
wireframe & prototype
Transferring my sketches into the digital realm allows me to thoroughly assess the transitions and connections between screens, leading to improvements in user flows. One significant modification involved simplifying the flow by eliminating screen numbers.
insights & iteration
I conducted user testing sessions with 5 participants to gather feedback. The feedback not only offered valuable and actionable insights for enhancing the user experience but also revealed interesting discoveries regarding interface development. These findings have played a crucial role in shaping the website to improve its overall user experience.
Refined customize page
Some participants expressed their desire to check for the availability of pickup time before beginning the customization process.
“I hate that when I’ve selected all the options, only to be told later that they're not available for the pickup time I had in mind.” - user B
iteration
Rearranged customization steps for better order flow.
Displayed transparent pricing structure upfront.
Placed sticky navigation bar at the top of the page for easy access to other screens.
before
after
Streamlined overloaded pages
It became apparent to me that during user interactions with the prototype, certain pages didn't load as smoothly as anticipated, particularly those featuring larger images and more content. Prolonged loading times could potentially result in an unsatisfactory user experience or even a higher drop-off rate.
“I guess I don't really need to see all the images at once, you know?” - user C
iteration
Eliminated and consolidated unnecessary large images.
Created more whitespace for improved readability and breathing room.
Introduced a slideshow to showcase specific pages.
before
after
Establish a consistent style throughout
Based on user feedback about their overall impression of the website, half of the participants found the layout to be acceptable but somewhat generic. They expressed a desire for a more creative and innovative website design.
“I like that I don’t need to click around to find information, so I think the website does its job. However, I don’t find it unique.” - user A
iteration
Introduced round shapes in the center on each page to represent the cake.
Chose colors that resonate with Maikeiki's top-selling matcha flavor to elevate the brand.
Integrated animations to enhance the user interaction and overall experience.
before
after
final design & hi-fi prototype
What I have learned:
Animations capture attention.
I added some cool animations to this project, not just to inject a bit of fun that matches the bakery's vibe but also because the testers really liked how they grabbed people's attention.
Ongoing improvement & development.
We're on the hunt for a developer to get the website ready for launch. It's going to be a big moment for both me and the baker when we finally see the finished product.
Creating a responsive web app.
Some customers have been reaching out to the baker via Instagram, and it makes sense to create a responsive web app for those who prefer using their mobile phones.
Introducing features that were not included in MVP.
Because of the custom cake industry's nature, ordering without talking to the baker isn't workable. We'll be adding a chat feature to support these discussions.
.png)
