"When is this going live? I will totally sign up!"

~ Usability study participant

Overview

Jraf was my very first design. It was my course project for the Google UX Design Certificate course.

Jraf is a platform that allows people living around the same area to collaborate on meals, so that everyone can get cooked or raw meals delivered to them for much better prices.

Prototype is temporarily unavailable

The Product

The Jraf app connects people with special dietary needs with each other, and then with chefs willing to cook for them. The giraffe app targets working class people, with special dietary needs, who lack the time to make their own meals.

Project duration

5 months

The Problem

People with special dietary needs (due to their health or choices), who don’t have time to make their own meals, struggle to find suitable meals at local restaurants.

The Goal

An app that allows people with special dietary needs access meals that suit their dietary needs.

My Role

I conceptualized and designed this idea from start to finish.

My Responsbilities

UX Research, Ideation, Wireframing, low and high-fidelity prototyping, branding, design system, conducting usability studies, accounting for accessibility, and iterating on designs.

Foundational research

I conducted a survey using Google forms, and I conducted interviews over Zoom to get a deep dive into the thoughts of my potential users.

User groups identified through research were single working adults who don’t have time to cook meals; Students who needed a cheaper option for quality meals; and family people who needed cheaper options to get quality food for their family.

I Then empathized with users by creating user personas, empathy maps, and user journey maps, to understand the users I’m designing for and their needs, and to better put myself in their circumstances.

I also conducted a competitive audit to understand what players in the industry are already doing: What they are doing well, and what could be improved upon, based on feedback from their users.

Paper Wireframes

My goal with the wireframes was to design a flow that is familiar to users, intuitive and easy to navigate. I also wanted to discover all possible obstacles that could hinder a smooth flow.

Home Timeline

Food Description Page

Check Out

Profile Page

Digital Wireframes

Changes were made based on feedback from study participants.

Paper Timeline

Digital Timeline

Paper Profile

Digital Profile

Low Fidelity Prototype

Using the completed set of digital wireframes, I created a low fidelity prototype.

Usability study

I conducted two rounds of usability studies. Findings from the first study guided the designs from wireframes to mock ups. The second study used a high fidelity prototype and revealed areas that needed refining.

I organized my data in tables, and synthesized my data into themes using sticker notes. This affinity diagram helped me develop data based insights about my design.

Mockups

The first round of usability studies revealed that users wanted to know how far their vendors were from them, and how previous customers felt about their food/service. So we included proximity indicators, and star ratings for vendors in the later designs. We also improved the create meal button on later designs...

Digital Timeline

First Review

Second Review

Third Review

More usability studies and feedback led to a decision to review the layout to reduce cluttering. I also reduced the amount of colors used on the cards to reduce visual load; altered icons to make the product neater and more ergonomic.

Accessibility Considerations

I ensured that the color combinations I used are in line with the WCAG guidelines for more accessibility.
I also ensured that warnings are made with both color codes and words.
I ensured the posts are designed in such a way that all pictures are described.
All our warnings are also accompanied with screen-readable texts, so they are accessible to people with visual impairment.
In creating meals, I ensured there’s an option for speaking, for those who are unable to type.
There are also suggestions while creating meals, to reduce the need for users with motor disabilities to have to type.

Impact

I have gotten a lot of positive feedback from users who have not only found the app intuitive and enjoyable to use, but are also looking forward to see it launched so that they can use it.

Takeaway

What I learned from the process of building this app is that there is no substitute for usability studies and feedback. I have realized that no matter how great i feel my design is, implementing usability studies and feedback always makes it better.

Return to Top

Please take out time to take this short feedback survey. I would love to know what you think about my portfolio.

Thank you for your interest in my work. If you like what you see, do not hesitate to contact me:

Page updated

Google Sites

Report abuse