Fold Gallery
An E-Commerce & Brand Strategy Project
About
FOLD is an LA based vintage boutique and gallery tucked away in the same location as The Last Bookstore. Its goal is to promote new art and challenge artistic convention.
The Brief
Problem: FOLD’s in-store brand and website brand are completely mismatched. The website’s layout and navigation are also confusing.
Solution: Redesign FOLD's navigation, give it a branding overhaul, and add e-commerce.
My Role: UX/UI Designer, Brand Strategist
Project Type: Solo
Tools: Sketch, Invision, LucidChart
Platform: Desktop
Discovery
A Field Trip
To get a better idea of FOLD’s feel, I took a trip to its location.
It become instantly clear that FOLD’s store and website did not align. The website branded FOLD as a gallery when it was really a boutique-gallery hybrid. Now knowing this, I wanted to see what other successful gallery websites looked like for inspiration.
Gallery Inspiration
The basic features of a gallery include:
- Feature section
- Events calendar
- Exhibits feature
- About the artist pages
- Photos of current exhibit
- Search bar
However, FOLD had none of this. FOLD also had an extremely confusing home page.
FOLD's Current Home Page
Heuristic Evaluation
A heuristic evaluation was needed to assess what need to be rectified and how I should approach the redesign.
Interviews and Survey
It was clear that many past customers of FOLD were also confused by its website.
“Oh, I’ve actually been here before. It’s not really a gallery, more of a store. That’s why I didn’t recognize it, because the website says gallery.”
Next, I posted a survey on various social media sites to see if an e-commerce feature on FOLD’s website would be useful and make branding between the store and website more congruent.
Mode of shopping preferred:
The Ideation Phase
User Persona
Based on the data I acquired, I developed Laura to represent the target audience for FOLD's new e-commerce feature.
Card Sort
The card sort revealed that 4 primary navigation were needed instead of 8.
Current Site Map
As you can see, FOLD's navigation labels were confusing.
Updated Site Map
The updated site map is a lot more self-explanatory to users.
Laura's User Flow
This is Laura's flow through the updated site. Below are added features numbered in black.
- About artisan brands carried
- Shop by filtered category
- Shop boutique and gallery
- Added e-commerce feature
The Design Phase
Visual Design Strategy
I decided to take a look at what adjectives customers used to describe FOLD online. Through this, I believed I would find UI inspiration.
“FOLD is a place where you can find treasures. Where people can find small vintage items the likes used by Don Draper.”
“All treasures we’ve found on the shelves of FOLD. I cannot say enough good things about this adorable little shop.”
Core Value → Design Concept
Value: FOLD Gallery gives the LA community exposure to local artists that offer an alternative to mass produced goods in an effort to bring consumers back to a more thoughtful view of handcrafted items.
Design Concept: Modern meets vintage
MOOD Board
E-Commerce Wireframing
Step 1: Customer Info
Step 2: Shipping
Step 3: Payment