INFOGRAIN APP

 
 

Overview

What was the problem we set to solve? Why did it matter?

We were trying to help students with dietary restrictions make informed meal decisions. And enhance their restaurant going and meal selection process. 

People with dietary restrictions face a lot of issues in their daily life. Students are often busy, leaving less time to choose restaurants and look at compatible menu items in detail. Their difficult is further amplified by various factors like social stigma & having an overall lack of information to take informed decisions.

What was our final solution?

Our final solution was an app, that would help users locate restaurants nearby that were compatible with their diet & view their menus. Each restaurant would have a personalized match score for the user based on other users’ reviews & ratings. 

How do we know it works?

  • I ensured that we stuck to a detailed design process throughout the project to ensure a high quality end product. Along with the feedback & guidance from various academia & professors.
  • We involved our target users throughout the process ensuring their voices were heard. 
  • We scored very highly on our final product evaluation & end user survey.

My Role

Our team decided to try to split the work as evenly as possible, with certain members being responsible for specific parts. Here are some of my contributions -

  • Performed needs analysis through methods of Contextual Inquiry, Interviews & Market Research.
  • Led most of the 'design thinking' sessions including Brainstorming & Affinity Diagramming 
  • Responsible for creating all infographics of the project including personas, revised affinity diagram & user journey maps
  • Created & revised part of the high-fidelity screens with Sketch
  • Facilitated 2 open ended interviews during needs analysis, 2 feedback interview sessions during the ideation phase & 3 concept evaluation interview & surverys at the final evaluation stage.
  • Designed project logo and created poster & video for competition entry

 

 

Team

  • Agrim Chandra 
  • Brianna Pritchett 
  • Hue Watson
  • Ishaani Mittal
 
 

How can we enhance students with dietary restrictions’ restaurant going and meal selection process? 

 
 

 

*  *  *  *  *

 

Research & Results

 
Group 4.png
 

Affinity Diagramming

 
IMG_20170918_201935269.jpg
 
adl.png
affinity_diagram.png

 

Affinity Diagram Insights

I created the above infographic representation of the affinity diagram that our team made, so that we got another visual perspective. Here are the 3 key insights - 

  • Around 1/2 of the remarks from users related to the 'Discovery phase', while eating out. Deciding where to eat. 

  • Social Stigma & Choices available were the biggest factors related to decisions, that affected the users.

  • Overall, I realized that most of the insights generated by the users didn't seem to adhere to one specific category.  The points mentioned by users were very often nuanced and had to be dissected from several layers of other underlying issues. This entire problem seemed fuzzier than I had imagined!

 

Usability Criteria

After analyzing our Affinity Diagram and user concerns, here is what our team came up with - 

  • Cost

  • Language

  • Responsiveness

  • Simple to use

  • Substitutivity

head.png

Survey Results

 
stats.png
 

Interview Quotes

time_b.gif
nothing.gif
limited.gif
attention.gif
burden.gif
burden.gif
 

*  *  *  *  *

 

Design Process

To give us some guidance to kickstart the design process, we started off with asking the simple question:

who really is our user ? 

Personas & User Journeys

  1. Meet Vishnu! He's new to the country, is vegetarian & is rather shy bringing up his diet at public settings.

  2. Then we have Vikki. She's a new vegan. Social, a tad bit impatient and a hell lot of headstrong!

  3. And then there is Grace. She's just got diagnosed with Celiac disease at 19, so she's got to stick to gluten free foods from now on. Her family is very supportive, but she feels bad inconveniencing others!

 

Brainstorming

During this ideation phase, I helped facilitate the brainstorming discussion. To make our brainstorming process more informed, I listed several items on the board. All of the things that should help us in case we needed to be reminded of our end goal. Or just to give us a little push.

brainstorming.png

Next, I thought it might be be a good idea to classify all our ideas based on their Feasibility & Creativity scale. 

Image uploaded from iOS (2).jpg
Image uploaded from iOS (5).jpg

Our team then scored all the ideas based an aggregated score, of their potential, that we saw in them. 

From these findings, we decided to look into the top 3 ideas that were rated the highest according to their potential.

 

Initial Ideas

  •  An AR APP that allows a user to scan the menu with their phone. The app would then provides information based on the menu items and the user's restrictions.

lfar.png
  • An outdoor restaurant signboard system that uses QR codes so that a user could scan the code with their phone and get an instant rating of their compatibility with that restaurant's menu.

  • A Kiosk placed in a public setting around several restaurants. Where a user would be able to choose a meal from all compatible available options nearby them through the kiosk.

lfk.png
 

Concept Evaluation

Once our mockups were created, we went out to get feedback on them from our users. We conduced a total of 6 moderated user feedback sessions. Below I have classified their feedback into three categories -

Likes

  1. Restaurant - User Compatibility scoring
  2. Restaurant proximity information

Dislikes

  1. Using QR Codes would be cumbersome
  2. Not comfortable using AR in public

Wants/Opportunities

  1. Wanting granular level of detail on their dietary choices
  2. Seeing reviews of restaurants directly from the app itself
  3. Being able to use the app in a group setting

Converging Design Ideas

Ok, so now we had 3 pretty good ideas. Which gets us to our next part - 

 

How do I pick a single best idea from the top 3?

 

feature_selection.png
 

*  *  *  *  *

 

Final Design

App Features

  • Defining Restrictions

 
diet selection page.png
 

 

  • Map Viewing Page

 
 

 

  • Menu Page

 

 
menupage.png
 
  • Restaurant Reviews

 
 

 

  • Rating Page

 
 

 

APP Stakeholder Mapping

 

APP user scenarios

 
everything for timeline.png
 
 

Interactive Prototype

 
 
 

Logo Design

I designed the logo of this app, heavily relying on the name. Infograin. The info refers to the information that this app provides to the user. The grain refers to the both the high level of granularity offered by the search function along with the traditional food grains. 

infograin logo animated.gif

 

Color Scheme & Interface Guideline

type.png

Purple, to evoke a sense of maturity & responsibility. Yellow, a more zestful & fun color to show that this app wasn't to be taken too seriously.

We also wanted it to be loud, proud & to almost celebratory. We also decided to design the app based on Google's Material Design owning to the very many resources available online.

 

*  *  *  *  *

Design Evaluation

After completing our prototype, we took it to various users to get feedback, & evaluate our designs. We gave then two tasks to complete -

  1. Choose your dietary restriction and pick a restaurant in the area where you would like to eat, keeping your dietary restriction in mind.

  2. Pick a dish from a given restaurant for yourself, and for a friend.

These two tasks would help us know how the user would use the app. We gained insights from making the users 'think aloud', and asked them to provide a general SUS ( System Usability Scale) score to the app.

 

Our overall SUS score was 80.1

 

Think-Aloud Insights

  • Use symbols to simplify explanation of dietary restrictions

  • Allow users a greater control over filtering for a range of sorting parameters

  • Make the sorting option a little more visible

  • Avoid colors that might confuse users, such as green, in a food related app 

 

*  *  *  *  *

 

Project Reflection

After this project was completed, our team discussed our overall process and how we could have improved our app even further. Here are some ways I think the app could be improved even more - 

  1. A single person doing all the UI would have led to an easier and more consistent design look.
  2. We would love to take on the challenge of allowing more than one user to use the app at a time. 
  3. I'd love to try to inject a bit more personality into the app. Maybe fun catchphrases, some drawings here and there, maybe a change in diction in some places.
  4. Creating an ecosystem of users, and finding ways of strengthening the user community too. 
  5. Trying to incorporate the core functionality of this app ( the unique scoring system and personalized menu view) into a larger app's existing ecosystem. 
 
 Our team!

Our team!