A Responsive Ecommerce Arts Website

Hero Image 1

Goal

To redesign an e-commerce website and include responsiveness where the users are encouraged to donate more and and convert to members in larger numbers through the digital channel.

Design Process

research-icon

Research

Research plan

Participant Interviews

Research Debrief

Feature Matrices

Information Architecture

Information Architecture

Product Requirements

Site Map

Business & User Goals

User Flows

Interaction Design

Interaction Design

Responsive Wireframes

Low and Mid Fidelity Prototypes

User Interface Design

User Interface Design

Branding

Usability Testing

High Fidelity Prototypes

Usability Testing

Usability Testing

Remote Testing

In-Person Prototype Testing

Overview

International Arts & Artists hosts a lot of global events and exhibitions and wants to redesign their current website to be responsive and user based to help increase donations and membership sign ups by 40%.

research-icon

Research

The goal of the research was to understand what motivates the user to donate to an art gallery and what would create an incentive to increase membership sign ups through the digital channel. The primary research was then correlated with research data and user goals and the results from the interviews, research and surveys were used to inform us on how we can give the donation functionailty higher visibility and increase conversions for membership sign ups.

Research Process

The primary and secondary research led to creating a user persona, Amanda Brandt, a 28 year old driven Exhibition Designer living in Washington, DC with an aspiration for be a large part of the art community and opening her own gallery in the near future.

user persona

"

If I’m interested in different cultures and varieties that are available and really curious to get to know the community

The creation of Amanda, led to empathy maps and a storyboard which helped understand what motivated her to visit and book events and shows at a gallery and validated the assumptions about the process a user would go through when choosing to convert to a member through low fidelity usability tests

empathy map
storyboards

The results from the interviews, research and surveys were used to inform us on what elements we can incorporate into the event booking process, what encourages users to sign up for memberships and how we can make the donate and membership signups stand out.


The biggest pain point discovered during the research stage was that the participants were not motivated to pay any amount of money, whether it was to donate or be a member because the incentives were unclear, unappealing and difficult to find.

"

Going in for free (talking about the incentives to sign up for a membership) would be something I would like to know if I was thinking of signing up. Supporting the organization and mission - particularly if it supports my personal mission of owning my gallery will motivate me too.

information-architecture-icon

Information Architecture

Understanding how Amanda thinks and prioritizes, led to a 2 user flows with a donation and membership sign up happy path which led to a site map depicting the process of landing on the site to join membership and donate easily

Donation User Flow Membership User Flow Site map
interaction-design-icon

Interaction Design

The site map, user flow and research led to wireframes that covered the flow from the landing page to the end of the membership signup, as well as a donation with a successful payment.

wireframes@1x
ui-design-icon

User Interface Design

The wireframes were combined with the UI Kit to create high fidelity prototypes in invision, using craft, which were then usability tested by 4 participants. The tasks they were expected to complete were:



International Arts & Artists caters to a global audience while supporting local artists in Washington, DC. The brand represents diversity, color and clean lines. To emphasize this, the layout consisted of clean lines, and ample white space. The colors were chosen to create a sense of flow and movement , while focussing on visual content to have the users get excited about visiting, being a part of, and donating to the institution.

UI kit

Combining the research and implementation, the final prototypes were created. If you would like to take a look at the protoype and experience it yourself, please click Here

prototypes@1x

Based on the desktop wireframes and protoypes, mobile protypes were created. If you would like to take a look at the protoype and experience it yourself, please click Here

mobile prototypes
testing-icon

Usability Testing

4 Participants that fit the requirements for this project were recruited for this usability test and completed the required tasks at their homes on a MacBook using google chrome to navigate the prototype on the Invision app . The participant’s interaction with the Web site/Web application was monitored by the facilitator seated in the same location. Two participants did remote testing and was monitored by the facilitator through the Skype screen sharing feature.


The participants' responsibilities were to attempt to complete a set of representative task scenarios presented to them in as efficient and timely a manner as possible, and provide feedback regarding the usability and acceptability of the user interface.


The testing process led to an affinity map that informed and validated the design and features implemented on the prototypes.

"

I like the layout. It is very clear

"

The site is very easy to navigate

Summary

Most of the expectations and hypothesis were validated by the usability testing, and with a few exceptions, which were mostly related to the lack of feature interaction due to the mid fidelity protoype, the International Arts and Artists responsive ecommerce usability testing was successful. A few suggestions were repeatedly made by the participants, which included increasing the font size on the text blocks like the history section on the about page, as well as highlighting the main points like dates and prices of events on the homepage.

Working with a non profit institution was very rewarding and insightful. There is so much more that can be done to increase membership sign ups and get users excited about being a part of the community through the site, and is something I look forward to continue to work on and be a part of.

More Case Studies

Digital Music Sharing Mobile Application Responsive Futuristic Booking Site