Glifft Gifting MVP for Mobile App

Glifft.png
 

Summary

Glifft helps you curate personalized gift lists to help you choose the right present for anyone for any occasion.

 

Goal

Design the MVP of a mobile app for iOS centered on everyday, casual gifting through machine-learning.

Duration

3 months

Role

Product Designer with 10 other designers with focus on visual design and branding.

Process

Competitive research, personas, flow charts, wireframing, branding workshop, prototyping, validation testing, rapid iteration.

 

Glifft launched the mobile app in October 2016 and has since shut down their web service platform to focus all efforts on the app. See below for some of the screens of the final product on iPhone and Android devices.

Apple’s Human Interface guidelines were followed to produce iPhone screens

Apple’s Human Interface guidelines were followed to produce iPhone screens

Google’s Material Design guidelines were followed to produce Android screens

Google’s Material Design guidelines were followed to produce Android screens

 
 

Design Process

Research & Validate

We began this project by analyzing popular companies in the on-demand gifting space to learn best practices and user behaviors. We then conducted an idea dump of possible features, desired behaviors, and biggest concerns we should focus on. We narrowed in the concepts with highest potential and expanded on them.

To help further guide our design process, we defined a provisional persona. Due to our tight timeline, we were unable to validate the needs and the goals of our ideal user. It is also important to note that as the application develops, this persona may change as new information become available about users.

 
Jotting down our ideas on post-its helped us organize our thoughts.

Jotting down our ideas on post-its helped us organize our thoughts.

Julia helped us visualize who our users would tentatively be.

 

After some deliberation, I suggested we should proceed with assumption testing. A main concern I had was that the current flow did not match the Founders’ goal of a “casual, everyday use” app. At this point, users would open the application only when they had a person and occasion in mind. We tested whether or not users would have a person and occasion in mind often enough to warrant everyday use of the app.

Our hypothesis is outlined in the picture below along with our generously set threshold. As predicted, the hypothesis failed after asking 10 people who fit our persona type. We decided to introduce another entry point to the application for browsing with the assumption that this idea would encourage “casual, everyday use.”

 
We tested this hypothesis to see if the existing flow would support everyday use.

We tested this hypothesis to see if the existing flow would support everyday use.

The revised flow introduced a new entry point to encourage everyday use.

The revised flow introduced a new entry point to encourage everyday use.

 
 

Ideate & Explore

We began sketching our ideas with a couple rounds of Crazy 8’s, where we quickly sketched wireframes, shared ideas, and iterated. Features were refined as we broke off into smaller groups to create lo-fi wireframes.

My group and I focused on the core functionality of the app: adding gifts to lists (which we called baskets at this time). We introduced the idea of adding items to lists even if you were curating for someone specific. Since this was a disruption from the current flow and could be an unnecessary distraction to some users, we made sure it was not prioritized on the page.

Crazy 8’s quick sketches.

Sharing ideas with Crazy 8’s exercise.

 

Initial wireframe showing how to browse and add gifts.

Refined lofi flow in its entirety.

 
 

Branding & Visuals

We had little visuals to work with so I broke off with a subgroup to pilot a branding workshop. We would have loved to have the Founders there for feedback, but we needed to operate quickly and they entrusted us to do this on our own.

Generating words from Glifft’s current branding and drawing inspiration from similar companies, we bundled them into groups and came up with 4 key brand attributes.

Aspirational adjectives associated with brand.

Bucketing similar words together.

 
Final 4 key brand attributes.

Final 4 key brand attributes.

We choose our typeface and color palette based on font weights/styles and various shades of accent colors for simplicity.

We choose our typeface and color palette based on font weights/styles and various shades of accent colors for simplicity.

 
 

Hifi Mockups & Prototype

We reviewed our low-fidelity screens and streamlined our flows to focus on the main functionality of the app. Our biggest concern was solving today’s problems with the simplest solution possible. Chat flows and sharing functions were simplified, search and filter options were removed, and the browse and curation flows were combined. (Although this may help users learn the swiping interactions as my project-mates pointed out, I personally believe the static browse flow we had previously was more natural to users. If our timeline had allowed, I would have liked to test my hypothesis.)

 

Building the MVP of a product taught us to slim down our flows to optimize engineering build time and user experience.

 

To further establish a seamless user experience, I improved visual hierarchy and streamlined flows to limit user affordances in the list views and exit points. To bring focus to business priorities, I moved the ‘buy’ button to the main swiping interface since the main way Glifft made profits was from affiliate fees from linking.

 

Streamlining user affordances per page to ensured a frictionless user experience and simplified UI.

 
 

Test & Iterate

We built our prototype and tested with people who matched our persona, Julia. We asked 7 users comprehension questions to test the intuitiveness of the interface, and led them through usability tasks to test the flow and interactions of the app.

 

L: Users using our prototype through guided user testing and comprehension questions.
R: testing results showed what we needed to work on.

 

The overall function and aesthetic of the prototype was well received and only some cosmetic changes had to be made. However, the structure of the navigation was confusing to users, so we switched to a 3-tab system (I believe this was a direct result from combining the ‘browse’ and ‘curate’ features, which as stated previously, I would have liked to test).

 

User testing allowed us to see what we needed to fix in our designs to ensure intuitiveness in the app.

 
 

Next Steps

The final mockups were given to the client with the following next steps:

  • Test changes to see if the results from user testing and comprehension improves

  • A/B test the ‘browse’ and ‘curate’ vs single ‘glifft’ flows to see which paradigm is more intuitive to users

  • Revisit and refine provisional persona as more information becomes available about user base

The Founders were tremendously grateful and impressed with the work that we put in to the project and launched the app in October 2016!

 
Design team and Founders of Glifft at our final presentation meeting.

Design team and Founders of Glifft at our final presentation meeting.

 
The [Glifft] team really worked from first principles and rethought the whole premise of our app. [They have] far exceed our expectations — delivering the design on time, with incredibly high quality, all the while communicating clearly with us, the client.
— Sourav Dey, Glifft Co-Founder
 
 
 

 Reflection

Working in a team of 11 designers was challenging for various reasons. This tremendous opportunity taught me:

  • Be firm in the design decisions you believe in, but also realize the product is a combination of everyone’s best ideas

  • Determine a realistic scope earlier on in the project (quality over quantity), especially when designing the MVP

  • UX and UI designers should work together from the beginning to ensure proper communication throughout process

  • When working with non-designers, communicate very clearly importance of process and reasons for design decisions

 
Previous
Previous

Associate Ordering System

Next
Next

Canopy Financial Learning