InVintory App

ROLE
UX/UI Design
Brand Strategy

DATE
Aug 2019 - Mar 2020

InVintory helps wine collectors manage their collection.

As the first designer at InVintory, my work on the UX/UI of the app lead to a successful launch, a 4.7 rating in the App Store and collectors all over the globe using InVintory to manage their wine collection.

THE OPPORTUNITY

The InVintory team approached me with the desire to disrupt the wine collecting space. While competitors already existed in the market, they believed they could win with exceptional UX.

The UX/UI of current solutions, like VinoCell and CellarTracker, confused and annoyed their users.

The InVintory team wanted me to investigate why and then create a better experience. They already had an MVP that I could build from.

01

Developing the brand

RESEARCHING THE USER

I began by studying the target audience through face-to-face interviews and online studies.

Wine collectors tended to be:

40-65 years old and affluent
slow to adopt new technology
cultured and intelligent
attracted to craftmanship and quality

BRAND CONCLUSIONS

After my research, I suggested that InVintory:

create a niche, inspiring space for serious wine collectors. They wanted to be a part of an elite community that understood them.
focus on providing luxury instead of appealing to the masses. Wine collectors valued quality, white glove service and personalization.
emphasize simplicity, efficiency and reliability and then deliver.
Wine collectors mistrusted new methods of organizing their collection and sometimes stuggled with new user experiences. We needed to reassure them.

02

Creating the styleguide

PICKING TYPEFACES

For reading text, I picked a neutral, friendly typeface called Lexend Deca. I chose it because it was designed specificially with legibility in mind. It worked well for our older audience who often relied on reading glasses.

For headlines, I chose a display serif typeface called DM Serif. I wanted to honor the founders vision by using a similar style to the original. However, DM Serif featured a greater contrast between the thick and thin parts of the letters, making it much crisper and easier to read.

PICKING COLORS

The original MVP used many different greys. I unified them with one greyscale for consistency.

I liked using gold as the brand color because of it's association with opulance. However, the original gold felt dull and lifeless so I added more warmth to make it really pop.

I also create a collection of secondary colors based on colors found in nature. Bright, artificial colors can seem cheap and immature. Natural colors often appear more refined.

PICKING VISUALS

I hoped to portray effortless elegance and richness with the visuals.

For illustrations, art deco line illustrations inspired me. They tended to have a neutral personality and would not appear cute. They also brought to mind the glamor of the 1920s.

For photography, I was drawn to lush, romantic imagery with lots of food, flowers and humans. It felt abundant and indulgent.

CREATING THE UI

With the interface, I made a few key decisions:

not to use the display serif font in the app because it lost it's legibility at small sizes
use the brand gold as our primary button and make the secondary buttons greyscale so the primary button stood out
avoid using cards, if possible, because the app was a tool and they wasted valueable real estate

With the styling applied, the app came to life. It was much more clean, legible and organized.

MAKING CUSTOM BACKGROUNDS

The original MVP used generic stock photos as backgrounds behind the wine label on the wine detail page. It made the app feel repetitive.

To solve this, I intially thought about using an image of the vineyard that produced the wine. However, the vineyard images didn't always look great with the labels. It would also require working with photographers or requesting photo permissions from the vineyards.

Thankfully, the developer and I discovered an API that allowed us to sample colors from the wine label and create a custom background for each wine. It added the variety we needed and made sure the background never clashed with the label.

APPLYING THE BRAND TO MARKETING

We hired a freelance designer to apply the design direction to the marketing website. Due to the clear visual direction I created, they designed quickly and the end result felt cohesive with the app.

03

Improving the UX

COMPETITIVE ANALYSIS

To get to the bottom of how to win with UX, I looked into the competition.

It became clear that competitors:

confused users because they cluttered their interfaces with so many features that users didn't know where to start.
allowed users to enter wine data into their database. No one reviewed these contributions. Users felt confused and frustrated by inaccurate and duplicate information.

UX CONCLUSIONS

Based on all of my research, the UX needed to:

make onboarding from other apps or spreadsheets fast and easy
be easy to navigate and scannable, without losing functionality
appeal to the deeper reasons wine lovers collect (investing for later, celebrating their memories & learning and sharing wine knowledge)

EASY ONBOARDING

In order to make transfering over to our app easier, we created collection transfering tool. The user could upload their spreadsheet or login with their credentials from competitors and we would upload their collection in less than 5 minutes.

During the onboarding process, I made it clear that they could use this tool right away. To make sure they didn't get lost, I also included button that sent the user an email with a direct a link the tool.

FOCUSING ON VALUE

In the MVP, the 'home' screen confused users because they seemed to want to see their wine list first thing so we made the wine list the first tab.

It provided little value while taking up a lot of real estate. For these reasons, we removed it for the MVP. The Invintory team could explore this idea further in the future when they had more data.

The MVP also featured a 'news' tab that also didn't deliver unique value. It recycled content and wasn't delivering on the promise to help wine collectors manage their collection.

In order to follow the brand strategy of tapping into the reason they collect, we created a wishlist and a memories timeline instead.

FIXING PAGE CONFUSION

There were three pages that looked the same in the MVP but were actually different. In testing, this confused users. They didn't know what exactly they were looking at.

By clearly differentiating their header layouts and their appearance in lists, i helped the user quickly understand what they are looking at - a wine, a vintage(year edition of a wine), or a bottle.

THE RESULTS

After launch, InVintory was well recieved by the wine community. Users rated it 4.7 in the app store and many users specifically praised the UX/UI.

Since launching this MVP, InVintory has continued to listen to user feedback, develop the brand and add new features. Their future is looking bright!

Brinna Thomsen is a UX/UI designer who helps brands create valuable user experiences

Email
brinna.thomsen@gmail.com

LinkedIn
linkedin.com/in/brinna-thomsen