E-commerce Site
Building a online gallery to sell Kay Barneby’s watercolor art
I worked with 4 other designers to develop an e-commerce site to showcase and sell Kay Barneby’s art. Kay’s watercolors are well-known in Rockport, Texas.
Our client was her son, Robert Barneby. We met with him several times throughout the design process to understand his vision and get feedback on the site.
Survey
Our survey aimed to better understand how people engage with and shop for art online. We received 58 respondents from social media.
Are interested in the artist's process
Said art influenced their emotional state
Browsed art online just yesterday
Find the artist's story important
User Interviews
We dug further into what art elements interest our users. All users expressed an emotional connection to art.
"Art that makes you feel something or funny art, is great."
"[At an art] museum the info is on a tiny plaque ... on the internet, the info is more accessible."
"The painting we purchased ... reminds me of falling in love with my husband."
"My wife paints and normally her art is tied into [her] emotions."
"I’m interested in the creativity of the artist."
Client Requests
People can leave comments and talk about [Kay's artwork].
Each one of the pictures will have a description.
[Use] cool colors, whitish to light blues .. it'd be very easy on the eyes.
[A] searchable feature that we get to add keywords to each [item].
Problem Statement
We believe showcasing Kay’s artwork in an engaging digital exhibit will draw a community of people who are moved by her work.
Barnebeyinks.com will inspire both artists and those who appreciate it. We noticed Barnebey Inks would benefit from a wider audience. Who will not only be inspired by her art but also form connections because of it. This will result in a close, like-minded community.
Moodboard
Using our client's feedback as a guide, we incorporated colors and elements that complement Kay's work.
Sketches
We focused on layouts for the About page, checkout flow, and page not found error.
Mid-Fidelity Prototype
We researched and discussed several design decisions for the mid-fi prototypes.
Team’s considerations:
-
Implementing a user-controlled slider vs an automatic slider
-
Showing details about the painting in a modal
-
Executing the payment flow
-
Incorporating the About page on the payment confirmation screen
-
Using a full-page or partial-page slider menu vs a bottom-bar menu
-
Ensuring all interactions are understood without hover states
Client and user feedback:
-
Make the logo the home button
-
Pause on each homepage picture
-
Make the pictures full-width and all horizontal
-
Add a search bar and allow users to filter the art by price and content
-
Show larger versions of the art when users select it
High-Fidelity Prototype
We implemented all those considerations and insights into the high-fidelity design: