BiteMap
Bitemap is a digital solution aimed to enhance user discovery of small ethnic grocery stores around them and make approaching new food ingredients less intimidating.
Context
Role
Individual
Interaction Design, Research
Timeline
Aug 2024 - Dec 2024
Project Type
Academic
Tools & Skills
Figma, Competitive analysis, Personas, Experience mapping, Sketching, Prototyping
Social stigma
Despite the cultural diversity in Hong Kong, a lot of non East-Asian cultures face stigmatization, especially from individuals holding more traditional viewpoints. Because of this, many ethnic markets in Hong Kong fly under the radar and are familiar only to those who frequent them or hear about them through word of mouth.
Off path
Oftentimes, these stores are located inside small corners of wet markets or off of smaller hidden side streets.
No (online) presence
There are a select few online articles that outline where specific ethnic shops are located in Hong Kong, but these lists are rarely comprehensive and usually quite long and tedious to navigate.
Bitemap proposes a solution to increase awareness, ease of discovery and frequency of shopping at these smaller stores as one step towards destigmatizing unfamiliar cultures, and let a wider population enjoy the flavors that other cultures have to offer.
Deficiencies of current systems
Competitive Analysis
After defining the problem context, I set up to determine what tools were already in place to help individuals gain access to smaller grocery stores through a competitive analysis. From completing this research, I generated a list of key features that could be helpful to incorporate into my ideation process and later design (such as location visualizations, a congregated list of shops, recommendations and inspiration, and filtering options).
I knew I wanted to focus on two aspects that current platforms aren’t able to achieve:
Clear organization of stores and ease of navigation
Blog articles just contained one long list of shops, Google maps can be overwhelming to navigate due to the number of search results, online grocery store HKTVMall is visually busy and does not have comprehensive filters for browsing specific cuisine’s ingredients.
Relevant and dedicated platform for finding niche ingredients
All of the existing platforms are not dedicated to helping individuals explore and find ethnic grocery stores and ingredients, thus not optimized to give users the best experience in completing this goal
Defining the user
Personas &
Experience Mapping
As the scope of this project was limited to secondary research, I created personas to help better visualize the types of user needs and frustrations regarding grocery shopping. These were a crucial aspect to my design process as it served as a point of reference to ensure features and design decisions directly impacted what users were looking for.
In addition, I developed individual experience maps based on these three personas, and analyzed together, these key users want a way of shop finding, reminders in their shopping list, and a form of community recipe sharing.
Testing the flow
Paper Prototyping
I brainstormed an initial version of these features and translated them into a paper prototype which was then used for wizard of oz testing to check the flow and understanding of the implemented tasks with one external user.
The takeaway from this was that the overarching tasks were easy to grasp, but the navigation screen was missing a step to let users preview the route before selection, and the overall interface needed more obvious ‘exit’ options.
Final Design
Map
Set travel distance and filter stores by cuisine, ingredient, or name. View store details like hours and location, and get directions to nearby ethnic grocery stores.
Deals
Browse daily deals from local stores. Upvote popular deals and tap to see store details on the map, helping users discover new ingredients at great prices.
Shopping list
Add, delete, or check off items. Get substitution suggestions for ingredients, and when you’re in-store, the list reorganizes to show items available at that location.
What do users think?
Learnings & Reflection
Looking back at this one semester process, it was fascinating to see the development of a product from problem conceptualization to the final design. While there are many factors about the high-fidelity interface that I would have loved to get user testing on to iterate on the design and flesh out the features more, I’m glad that a lot of time was spent on exploring the initial problem space and generating ideas for solutions. Even though this project lacked primary research, all of the core features of BiteMap stayed extremely close to the problem and identified user needs. As at every stage of the brainstorming and development process, I asked myself “does this feature enhance the discoverability of small stores or make other cultures easier to approach?” This kept the features very intentional, and always linked back to the main goals.