In a Silent Way

Designing an e-commerce site for a niche wine shop & bar

The project

In a Silent Way, a niche wine bar and shop in Maine, asked me to polish their marketing site and design an e-commerce platform to augment their brick-and-mortar wine shop.

My contribution

As the sole designer on the project, everything you see here is my work.

Role

  • UI/UX Designer

Client

  • In a Silent Way

Year

  • 2021

Role

  • UI/UX Designer

Client

  • In a Silent Way

Year

  • 2021

// Initial steps... //

Ask

Before I came in, the client had a basic marketing landing page with a distinct visual identity. Initially they asked me to refine the landing page, diverging minimally from the original design.

original landing page
refined landing page

// Developing look and feel... //

colors

Based on the brown schemes of the client's existing visual identity and their desire for a real-life menu-like feel to the site, I created a palette of browns and creams with a complimentary take on the traditional red, yellow, and green accents.

typography

Based on the client's existing site, I explored over twenty serif & sans-serif typeface pairs. From there I chose the three most viable options which I presented to the client. Together we decided to go with Crimson Text & Prompt.

// Initial design steps... //

grids

To create design that responded attractively on all screen sizes, I established grids for each frame size to work within and establish consistency across pages and devices.

mobile grids
tablet grids
desktop grid

Navigation

Because the client is a small, niche wine shop, I was able to keep the information architecture very simple throughout the site, leaving room to focus on presentation and experience. Ultimately there are two sides to the site, Wine Bar and Wine Shop, which the user chooses between on the landing page.

// Designing the site... //

Landing

I built upon the refined landing page to accommodate the two sides of the site. The goal was to make the landing page as striking and on-brand as possible, as the rest of the site would need to be a bit more function-oriented.

Wine Bar

For the bar side of the site, I used a dark theme to pull the user in and add mystery and drama. Because this side is so simple content wise, I was able to take full advantage of the dark theme which would not have been possible on more functionality and content dense pages like the shop.

Wine Shop

By contrast, I used a light, menu-like theme for the shop side. Because the inventory of the shop would be very limited, I was able to utilize more space per product in designing the browsing presentation. Ultimately this allowed me to incorporate beautiful interactions and eliminate the possibility of overwhelming the user.

For the cart and check-out process, I carried the navigation style over from the browse process, but used very minimal elements so as not to distract the user from inputting their information. I focused on the smoothness of the process to encourage more completed orders.