TRI VINTAGE + WARES

E-commerce Store Redesign |  Responsive | Desktop | Mobile

I completed an on-spec redesign for TRI Vintage + Wares.
I focused on clarity, simplicity, and connecting users to the unique mission of the boutique.

"We believe our success is measured by our impact."

TRI Vintage + Wares is a boutique store that embodies the creation of a fluid and dynamic shopping experience. It is constantly evolving with handmade home décor and accessories. Born as an NGO (Non-government Organization) in 2003, it has a heart for women and children at risk of sexual exploitation in India. Its desire is to sustain NGO status by partnering with skilled artisans, both local and international, to create modern, handcrafted products for the store. In turn, the aim is to provide fair trade jobs that create dignified work to the most vulnerable while impacting the greater good.

USER RESEARCH

After engaging the owners, I interviewed and observed 5 customers in-store. I synthesized the data through affinity mapping and card sorting. This helped me to identify visual patterns like pain points, key goals, preferences, and frustrations. I then developed personas in order to begin the ideation process of iterative design.

THE CUSTOMER IS
ALWAYS RIGHT

Through grouping related observations, I identified these needs of the target audience.

Customers appreciate a curated shopping experience.

Users expressed the desire to see the product on real people.

Users wanted the ability to share their own unique style.

There was a desire to have “Lookbooks” available. What is a look book rather

A large amount of users are uncomfortable giving out their personal details.

TAKING STOCK

The owners and I decided to strip the site of all items that hadn’t been made by an Artisan Partner. This brought clarity, simplicity, and foregrounded the boutique's unique mission. I was then able to really dive into card sorting which resulted in a seamless and digestable user-flows for customers.

A PERSONAL TOUCH

Based on my research, I identified two key personas, which helped me shape key features and designs.

Jacci

"I love to smell the candles and feel the scarves!"

Jacci is a free spirit and enjoys the outdoors. She is very social and enjoys a good laugh with friends. Collecting antiques, decorating, and frequently visiting boutique stores are passions of hers. If Jacci likes the vibe and it suits her style, she becomes a loyal customer. It’s all about the experience for her. She uses social media heavily to follow fashion trends and to showcase her own style. Although she does shop online, Jacci still prefers the in-store experience.

Behaviors

  • She visits Boutique stores frequently.

  • Social media (Instagram) is her platform to follow fashion influencers and show-case her own particular style.

  • Supports businesses that promote fair trade and local talent.

  • Is a repeat customer who takes the time to read marketing emails, browse the website and is interested in the highlighted products.

  • Always engages with the staff and listens to sales advice in-store.

Needs/Goals

  • Latest and trending fashion products.

  • Collections of products that go well together for a particular look or style.

  • Inspirations from fellow fashion conscious people.

  • Sharing her own unique style.

  • Must feel like she is promoting fair trade or helping the world in some way.

  • Needs to trust the site she is buying from.

Frustrations

  • Not enough ‘recommended’ products or ‘complete the look’ products associated with desired item on current webpage.

  • Low-quality visuals.

Jacci needs a better way to browse style collections, easily share her own personal style, and securely purchase items from the site.

Steve

“Boutique stores intimidate me.
They have a reputation for being fancy, and I am not!”

Steve rarely visits boutique stores, he feels like they don't suit his style. In his mind, they have a reputation for being fancy and very expensive. The times he does find himself in a boutique store situation, it's probably to only buy a one-off gift. He is more comfortable using big-box online stores and can't imagine that a "cute" boutique shop would have a big online presence.

Behaviors

  • Shops both online and in-store.

  • What devices I use: Mobile, tablet, and desktop.

  • Where I go for advice: Nowhere in particular, heard about this shop from my wife.

Needs/Goals

  • Easy/ quick navigation to products.

  • Great discount offers and coupons - incentives.

  • Best value products.

  • I’m here to buy a gift

Frustrations

  • High prices of items.

  • Intimidated by boutique stores.

  • High shipping fees and taxes.

  • Complicated checkout process.

Steve needs a better way to quickly navigate to a desired product and either check out as a guest or pick the item up in-store.

New Features

TRI Vintage + Wares’ new and improved website allows users to browse Lookbooks while also appealing to their sense of imagination and inspiring them to buy. Embedded Instagram feeds improve the sites authenticity and follower base. Users can even share their unique style with family and friends. Subscribed customers are able to curate their shopping experience with product suggestions based on their shopping habits and purchase history. The site also caters to users who want to navigate to specific items and purchase them or check for in-store availability without having to signup.

Clarity &

Simplicity

INFORMATION ARCHITECTURE

I simplified TRI Vintage's Site Map for a more intuitive user experience.

SIteMap.jpg

USER FLOWS

I used my personas to create realistic and digestible user flows.

Flow 01 - Jacci's user flow
UserFlow1.jpg

You are in the shopping mood! Browse the lookbook and all the style collections personally curated for you. Once you have found something of interest or that suits your particular style, add it to your cart and proceed to checkout.

Flow 02 - Steve's user flow
UserFlow1.jpg

You are NOT in the shopping mood! It's your wife's birthday and she has mentioned on more than one occasion that she has seen these really cute earrings at the TRI Vintage + Wares. Navigate the site to the earrings, add them to your cart, and proceed to checkout. Because you don't particularly trust small business websites or giving out your personal information, opt instead for checking in-store availability. I mean, you only live 10 minutes away!

MY DESIGN PROCESS

I grounded my design in solving the pain points uncovered in the initial research. I sketched, created user flows, and then moved on to wireframes. At every stage, I conducted user testing, which provided me with invaluable feedback.

I solved a lot of the major flow and design problems, which meant that I could quickly iterate in Sketch and design the best possible solution.

From wireframes, I moved to High Fidelity Mockups. I applied product branding, grid structure, typography, color schemes, and icons.

Prototypes - Web

Prototypes - Mobile

REFLECTIONS/ CONCLUSION

I conducted research and usability testing, but I still ran up against a few walls in my design phase. I adapted and iterated, however, and always kept the user’s needs in the forefront of my design thinking to create a seamless and functional experience.

NEXT

LET'S

GET

IN

TOUCH

© 2020 Mark Chittenden.