IA-A-logo

A Responsive Ecommerce Arts Website

Designing an end to end mobile application

Designing an end to end mobile application

IA&A-HeroImageMockups

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

Research

Research Plan

Participant Interviews

Competitor Analysis

information_architecture_icon

Information Architecture

POV Statements

Crazy Eights

User Flows

interaction_design_icon

Interaction Design

Responsive Wireframes

Low and Mid Fidelity Prototypes

ui_design_icon

User Interface Design

Branding

Usability Testing

High Fidelity Prototypes

testing_icon

Usability Testing

Remote Testing

In-Person Prototype Testing

Overview

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 who aspired to be a large part of the art community and open her own gallery in the near future.

User Persona
noun_quotes_953501

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

I usually find books on reddit, look it up on amazon to see if they are worth buying

I usually find books on reddit, look it up on amazon to see if they are worth buying

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

International Arts & Artists Empathy Map
Storyboard International Arts & Artists

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.

noun_quotes_953501

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.

I wish I could see what my library had on the same app, you know? That way I don't have to keep opening and closing a bunch of windows

I wish I could see what my library had on the same app, you know? That way I don't have to keep opening and closing a bunch of windows

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.

user flow – donation
user flow – membership
site map@1×0
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 – IA&A
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:

  • Explore and donate to the Hillyer Art Space
  • Explore membership options and sign up for the President circle Membership
  • Visit the Member account

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.

UIKit@1X

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_prototype@1x
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 an android phone using the invision app prototype. The participant’s interaction with the application was monitored by the facilitator seated in the same, as well as remote location.

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 a few revisions that informed and validated the design and features implemented on the prototypes.

noun_quotes_953501

I like the layout. It is very clear

I really like the colors. I’m excited to use the app!

I really like the colors. I’m excited to use the app!

noun_quotes_953501

This site is very easy to navigate

The site is very easy to navigate

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

You can also find me on

© Meghana Bowen

© Meghana Bowen

© Meghana Bowen

© Meghana Bowen

Artboard 1 copy
Artboard 1
Artboard 1 copy-2