Create/Edit Flow

Rebrand and optimizing the products experience

Client: Indiegogo       Role: Visual Design & UX       Case Study Source: An Yu (UX)

Background

"Indiegogo is a global crowdfunding platform that empowers anyone to raise money for any project or cause. Every day, thousands of entrepreneurs, artists, nonprofits, and organizations use the site to create, launch, or edit their campaigns."

Before: The original campaign create/edit flow

Rebranding the experience

We worked with an agency to establish a overall tone and brand guideline for our product. The next step was to apply that brand and style guideline into our new create/edit flow. The most important page was the first page we wanted to launch to lead users into the experience. Prior, users had to start with a lot of forms but we worked with engineers to refine the requirements to the basics to launch the users into the process.

We simplified and made this start page less intimidating for users

Creating the campaign

Creating a crowdfunding campaign required creators to input a lot of content. Taking from prior framework we established we focused on creating a step process that users could accomplish tasks. We allowed users to save their campaign along the process and to revist their campaign often. Creators never finished their campaigns in one sitting and often had many people review each section of their campaign prior to launching.

Without changing the experience too much we maintained a stepped approach

An important concept in the design and ux of the page was creating the forms in a similar pseudo inline fashion as they would percieve it when the previewed the campaign creation.

Our goal was to create a semblance in fields and live preview

Handling media on the old platform was troublesome as users could only interface with 1 object at a time. The goal on the new UX was to combine both types of media on 1 page and allow users the aibility to edit all of the information without a lot of back and forth actions.

Designing the media gallery feature

Development

I worked closely with our engineering team in defining all elements of the brand and translating it into digestable documents and annotations. I worked extensively and paired with developers in maintaining and updating our living style guides as well as working to define proper patters across the teams.

The color palette Spacing guidelines

Testing

Our UX Researcher primarily focused on answering key questions to the create process:

  • How does error validation work/differ in the various campaign modes? What information gets saved, what gets lost?
  • How should we let users upload videos/images in a user-friendly way?
  • How do we improve the experience of adding team admins/members to a campaign?

These questions came from features had been tacked on in one-off ways, resulting in an unwieldy flow fraught with bugs and usability issues. An overwhelming percentage of customer support tickets were from frustrated campaigners asking how to perform basic actions or how to recover hours worth of work lost to bugs. Usability test session: potential campaigner adding a perk

Iterating

Research found while users generally found the flow easy to use, a few key issues were exposed. People wanted to preview their campaign throughout the process, but had difficulty figuring out how to do so. They were also often uncertain whether their changes were saved. Their solution was to accommodate a more prominent View Campaign button and added an indicator to show when there were unsaved changes

Unsaved changes indicator