top of page
SXSW Website Header.jpg
Overview

OVERVIEW

Increased usability by 68% with new quiz feature and redesigned filter function

 

In an end-to-end UX design sprint, our team designed a solution for the user's challenge with the filter function and the thousands of entries for SXSW events.

 

We tested our redesigned filter function on this app and created a new 3-step quiz with unmoderated and moderated usability tests of our clickable prototypes.

SXSW Website - App Screens.jpg
Business Needs

EMPATHIZE

In this step, we demonstrated and researched the business and user needs.

BUSINESS NEEDS

The SXSW Go App is used for festival attendees to view the schedule and exhibitions, read details about the festival and save events of interest.

 

Based on our research, the business developed this app to:

  1. Centralize festival details and information;

  2. Increase app downloads;

  3. Promote brand partnerships;

  4. Increase revenue from in-app ads; and,

  5. Enhance the festival experience of the attendee.

The challenge: If users used it, they were overwhelmed by the amount of events they had to review to curate their schedule.

CURRENT REVIEWS

Reviews.jpg

Users give the current app 3 stars even though they like the in-person experience.

 

We read the reviews and a resounding majority focused on the use of the filter function and the unsatisfactory changes to it that made their experience with the app and at the festival more frustrating.

Reviews.jpg

UI AUDIT / EXPERT REVIEW

The filter function was not consistent for every listing.

UI Audit 1.jpg

The iOS & Android versions of the app used different elements

like using the word "cancel" or "X".

UI Audit 2.jpg

COMPETITIVE ANALYSIS

Top rated conference and festival apps all used an icon to signal users

to save events of interest. This is an UI standard in the industry.

competitors.jpg

We also noted some similarities and differences in our feature analysis.

0 Feature Analysis.png
Current Reviews
UI Audit
Competitive Analysis

Our hypothesis based on research: 
We believe that by implementing a robust sorting, filtering, and organization functionality in the SXSW app, users will have an improved, optimized and personalized experience.

User Interviews

DEFINE

Using research findings, we identified insights user needs, patterns in a persona and opportunity areas.

USER INTERVIEWS

We were interested in speaking to SXSW attendees who went within the past 3 years. We found 8 people from different backgrounds -- musicians, journalists, students, vendors, speakers and industry executives. To our surprise when we questioned them about their experience with the app and the festival, they all said the same thing.

  1. They go to SXSW to network.

  2. They plan ahead.

  3. They want to know where the bathroom is.

That may seem simple, but it is usually the small things that can make a good experience great. We discovered more pain points during our user interviews and organized them in an affinity map.

AFFINITY MAPPING

After 8 interviews, we collected over 100 notes and organized it into 11 groupings. The top 3 helpful insights to inform our ideation are:

  1. I went to network.

  2. I prefer to have things planned out ahead of time.

  3. I like to know where things are in relation to where I am.

Group 1 Jam Board.png
Group 1 Jam Board (1).png

THE PERSONA WE FOCUSED ON

SXSW attracts so many different people so we developed multiple personas. For this case study, allow us to introduce you to Brittany.

Brittany.jpg
Affinity Mapping
Persona
Sketches

IDEATE

We ideated toward a solution through multiple sketches and wireframes.

SKETCHING IN DESIGN STUDIO

The team went through rounds of sketching to get our ideas on paper. We mapped out some concepts based on our UI Audit, current app reviews, competitive analysis, and user interviews.

 

Here are a few things that come up in the design studio.
 

  1. There are over a hundred exhibits. Let's put the number at the top of the list so the user is aware of their options.

  2. A card grid menu UI element is very popular on mobile apps. Visuals and large card buttons help users see the option and enough finger room to select the choice they really want.

  3. The filter function on the Schedule Page gave us all we needed to form the buttons on the quiz. Using the same information keeps copy close and will make developers happy.

filter v2.jpg
quiz v2 -1.jpg

MID-FI WIREFRAMES

We combined the best of our ideas and provided grayscale versions of our design. In order to form the categories for the card grid, we facilitated an open card sorting exercise for the 118 exhibitions at the Wellness Expo.

 

Twenty of 41 participants completed the study. It took the participants a median time of 13 mins and 52 secs to complete the study. Participants created a total of 136 categories forming 7 groups. Those seven became the menu you see on the left screen.

MidFi - App Screens.jpg

HOW TESTING IMPACTED THE DESIGN

To save time and money, testing our mid-fidelity prototype with four of the attendees we interviewed. The top 3 insights we considered as we moved from mid-fi to hi-fi are:

  1. We created a text button signaling the user to continue the quiz.

  2. We included a pagination element so the user knows the progress of the quiz.

  3. They were confused by the star icon so we replaced it with a "heart" icon.

Midfi iteration.jpg
Mid-Fi Wireframes
Mid-Fi Iterations
Hi-Fi Prototype

LETS ADD SOME COLOR

SXSW Website - App Screens.jpg

PROTOTYPE

We effectively narrowed down our solution by designing a clickable, full color prototype.

Ready to try it? Follow the instructions below to see how our features work.

NEW QUIZ FEATURE

  1. Select "Take the Quiz"

  2. Select "Future of Music." Next Step.

  3. Select "Meet Up." Next Step.

  4. Select "Music Publishing." Next Step.

  5. Congrats! You can now see Recommended and Popular Events based on your selections.

REDESIGNED FILTER FEATURE

  1. Select the menu icon.

  2. Select "Exhibitions."

  3. Select "Wellness Expo."

  4. Filter your options and select "Yoga."

  5. Like the "Funk It Wellness" event.

  6. Select the"Yoga with Adriene" event.

  7. Add it to your calendar.

  8. Congrats! You've found great events you love and curated your SXSW experience

Usability Testing

TESTING

We implemented our design solution guided by direction from users and responded appropriatly to their valuable feedback.

Hi-fi Testing.jpg
Hi-fi Testing.jpg

First, we tried unmoderated remote testing to gather as many users as possible.

Although we had 68 users test out the hi-fi prototype, we learned very quickly that this testing method was not helpful. Our tasks were very specific to the persona we created and not their personal preferences. Therefore, a majority of testers abandoned the exercise, which was not helpful for our purposes.

Then, we executed moderated remote testing and gathered more valuable feedback to take back to the design and development team.

Hi-fi 2.jpg
Next Steps

DESIGN SYSTEM

I defined the design system for the SXSW Go App project because it was not publically available. Check out the Building Blocks, Pattern Library, and Style Guide information below.

DS 1 Building Blocks.jpg
DS 2 Pattern Library.jpg
DS 4 Style Guide.jpg

BRING THE AGILE PROCESS TO YOUR VISION

SXSW Website - App Screens.jpg

EXPLORE MORE OF THE CRAFT.

bottom of page