PROJECT BRIEF
Hotray is a bakery delivery mobile application that I designed as part of my solo journey into UX/UI. There are not many applications specifically serving baked items so I decided to foray into this project. Some unique features and some existing stuff were improved. Presenting, hotray!!.
PROBLEM STATEMENT
As the pandemic struck and several bakeries, eateries took the damage and some even had to close down. This even after there was no dearth in demand among the people. As the situation eased, a need was felt by the eateries as well as the people to find a safe and accessible method to expand the services of bakeries through app model.
INTENDED SOLUTION
Here I stumble across the idea of creating an app that provides seamless user experience to the lovers of baked items that they were not able to find during the pandemic or even after the pandemic their favourite shops are still under the covid cloud.
THE NEED
In a survey conducted by LocalCircles, a social engagement platform, it was estimated that number of users is expected to rise to 498.5m by 2025. It also indicated that the orders from tier-2 and tier-3 cities was on the rise. With such a large user base there is a need for better user experience and interaction and accessibility too to cater to the users. Hence consistent upgradation of design of these applications is needed.
User interviews and survey
I conducted interviews of 5 people in the age group between 18 and 32 through the platform of MS teams. Apart from that i also circulated a google form which received over 20 responses.
A. Most participants highlighted the fact that sometimes they missed out on offers due to unawareness or lack of proper placement of the offers.
B. Majority of them were in favour of customizing their cake in case of a food app like subway for sandwiches.
C. Responses showed that the participants ordered online 2 times a week on an average.
D. Their ordering frequency has increased after the pandemic struck.
E. Participants also highlighted the accessibility problems like filter options for alternatives of sugar products, lactose tolerant products, etc.
F. If they have to leave urgently at time of delivery, they mostly mentioned that their landlord or neighbours collected the order, but that required constant communication with the delivery guy.
Competitive analysis
I undertook a competitive study analysis of two applications providing same type of services - ferns ‘n’ petals and bakingo. I found that though both were providing a wealth of options to the customer, there were still some things which were causing user pain points like easily locating previous orders, cluttered cart, lack of options to explore the user’s personal tastes, proper highlighting of offers, etc. These could be a major hurdle in user flow of an user.
DEFINE
User Persona
Based on the analysis and findings through the user interviews and surveys, I created a persona to get a fair idea of what the average user would want and how her experience can be made better. The persona was instrumental in keeping myself abreast with the problem statement while designing the app.
Task analysis
After carefully analyzing the stats from the user interviews and surveys, taking clues from the persona and getting a clearer picture from the task analysis, I found some key pain points which needed to be addressed.
Pain points
IDEATE
Taking all the pain points into account I started creating the lo-fi wireframes. I took inspiration from the other apps in the segment and the primary and secondary research.
Lo-fi wireframing
Homepage
Offers screen
Previous orders screen
Cart
INITIAL PROTOTYPE
After getting a rough idea of what the screens would look like, i proceeded to do prototyping. I used figma for the same.
Homepage
Offers screen
Search screem
Cart
USER TESTING
After getting the initial mockups of the app, I decided to conduct an user testing of the prototype. I conducted the testing via links and phone calls, in person as well as through the mediums of MS teams and google meets. An interesting find was that participants appeared to perform seamlessly when I was present during the testing.
A. Earlier the participants in the testing found the cards in the cart very cluttered, so the cards were modified with minimalistic yet important information.
B. The count bar was also modified as the earlier one didn’t have a blending colour with the overall theme.
C. The participants had found it hard to spot the orange ‘n’ green navigation bar, so it was modified.
D. The participants wanted the promo code option before the final bill is shown so that they can clearly analyze the impact.
A. Unnecessary information was removed from the offer’s card.
B. Fonts of varying sizes and colours were used to make the offer’s card attractive.
C. Some offers shown in the homepage are repeated to make user comfortable.
A. Graphic cards replaced just texts in recent searches to make it more vibrant.
B. Participants revealed that graphic cards influenced their search choices to a considerable extent.
A. Participants found it difficult to spot the categories as well as the offers, so a categories section and offers section were added separately.
B. Participants showed signs of not being able to find the build your own cake button, so a card with the same was put in the top of the homepage to make it more noticeable.
C. The cards were modified to include time of delivery, average ratings, instant order from homepage itself, veg/non-veg symbols, etc according to feedback by participants.
FINAL PRODUCT
Feature 1
Make your own cake feature makes this application stand out from others by enabling users to make their own cake by selecting some basic choices from various options. They can customize according to their own taste buds and add the same to the cart.
Offers are displayed both at the top of homepage as well as a separate screen opens up after tapping the icon in the bottom navigation bar. This eases the pain point of missing out on offers.
Displaying a template of recent orders of the user helped in locating the previous orders screen. For users accustomed to competitor apps, a previous order button was also placed in the profile section.
Feature 4
Analyzing the pain point of informing the user about the ingredients from which the item is prepared and info about the time taken for the food to reach the user, they were mentioned in the card itself so that the user can quickly scan through the items to select.
CONCLUSION AND LEARNINGS
This project was a great learning journey for me. It was like an ever increasing graph of learning different concepts of ux/ui design plus i got to explore and admire many other applications in the process. I started to appreciate how carefully the apps and websites are designed and what are the purpose of different elements. Overall it was a great opportunity and looking forward towards positves and negatives.
