Capstone 2: Event Paradise

Introduction

Overview

A startup company has launched a product that helps people meet new friends. The goal of the product is to create a social user experience that will help users get out and do activities in-person. Friends keep us company through the difficulties of our lives and help us grow, but when people move to a new city or town, fear and social anxiety can keep them from making new friends. How can we help people who have social anxiety step out and make new friends?

Challenge

The business team has identified a problem in that the number of people who say they are going to an event is significantly higher than the actual number of people who attend. What feature(s) should the company add so that the number of attendees who commit to going is more closely aligned with the number of actual attendees?

Role

Role: UX Designer

Timeline: 2 weeks

Platform: Android Mobile App

Team: Bart Mach, Justyna Mach, & Hee-gwon Jung

Result

Although we had to tweak the design after the second usability test, the main goal for making users less nervous about meeting new people and being willing to attend events was successful. In Capstone 2, it was not easy for us to come up with how to encourage users to come out to events without no-showing, but we’ve learned that it was not only important for us to figure out what features users would want to see in our app, but also to use proper wording to move users' minds to lead them to specific actions.

The Process

Project Plan

↓

Company Name & Visual/UI Style

↓

Research Plan

↓

Competitive Research (Heuristic Analysis)

↓

User Stories & HMW Questions

↓

Research Synthesis (Written Summary)

↓

User Flows via Miro

↓

Low Fidelity Designs (Sketching)

↓

First Usability Test Script

↓

Moderated Usability Test via Marvel

↓

First Usability Test Report

↓

High Fidelity Designs (Modification)

↓

Second Usability Test Script

↓

Moderated Usability Test via InVision

↓

Second Usability Test Report

↓

Final Design via Figma

Before we began…

1) Company Name & Visual/UI Style

First thing first, we decided that it’s crucial to create a company and visual style that will give our project a unique edge. For a closer look:
https://drive.google.com/drive/folders/11Fruo8B2Ipf0dBn0Gfy8x-VVcVVMQtCa?usp=sharing
We chose the company name ‘Event Paradise’ to give users a friendly impression that everybody will be welcome and happy to join events in our app.
To give our brand an optimistic image, we chose blue for primary and secondary colors.
We selected these five icons (confirmed, love, share, search, and message) since we thought that it is important for users to be confirmed to attend events, to empathize with other newcomers’ comments and freely send messages, to share events with others, and to search for any events without getting confused.

2) Project Plan

We decided to make a project plan to help stay on track. We also wanted to think through the methods we'll use while working on each phase of the project. For a closer look:
https://drive.google.com/file/d/1imlCimCGbU9ibnaQKxk4nDIacU2VsPIL/view?usp=sharing

Discover

1) Research Plan

To help our frustrated users, we needed to make our research plan more detailed.
Since we knew that only 20% of people usually show up at events, we needed to come up with some ideas to persuade users to actually come out without being nervous.
To convert invitees to event attendees, we needed some research questions that would lead us the way.
- Have they ever been to any events via apps?
- If they have, which app did they use?
- Have they ever felt nervous when they try to go to events?
- Have they ever signed up and not shown up? If they have, what would be the reason?
- What are the features that they would like to see in the app?
We wanted to hear the real stories from users who had a previous experience of attending any events. Also, since we assumed that social anxiety and lack of motivation was the main reason why users end up not showing up to events, we had to know how to help them in a specific way.
For methodologies, we decided to use competitive research (heuristic analysis) to see our competitors’ strengths and weaknesses first.
Second, more importantly, we decided to conduct two rounds of usability testing to know what bothers users and what features they would like to see in our potential app.
For participants of usability testing, we used our personal contacts (aged 20 - 40), asking them if they ever used web and mobile services regularly, have tried to go to an event on the web or an app at least once in their lives, and are interested in making new friends via social events.

2) Competitive Research (Heuristic Analysis)

After we made a research plan, we conducted competitive research to figure out the strengths and weaknesses of our competitors. For a closer look:
https://drive.google.com/file/d/18KVDXAsZnIznq49MxiQHh0JvCZV1glsf/view?usp=sharing
We selected three competitors (MeetUp, Facebook, and Eventbrite) since these are well-known ones that a lot of people use for attending events.
We decided that it would be best to apply heuristic analysis for this research to see how they are doing with 4 standards we have on social products (user control and freedom, consistency and standards, flexibility and efficiency of use, aesthetic and minimalist design).
MeetUp did an excellent job of allowing users to buy/cancel tickets and check events. Also, it was flexible and efficient to search upcoming events. However, they were a bit off with consistency (different heights for text fields) and visual hierarchy.
Facebook did an ok job when it comes to every standard, but we could see some things to be fixed (busy UI and inconsistency of button designs).
For Eventbrite, we didn’t find many weaknesses. User control was well done and every element was pretty consistent. They used a clean UI, so we, as users, could enjoy exploring every screen without getting confused.
After we found some strengths and weaknesses about our competitors, it got much clearer which brand we should refer to. We decided to take a look at the advantages of Eventbrite to make a better design of ours later.

3) User Stories & HMW Questions

We ended up having informal interviews with a few of our friends, being curious about their experiences. Some introverted friends confessed that they had concerns about attending events without knowing anybody and were nervous. Their experiences helped us figure out what features they would want to see in an app and how we would help them.
For further understanding of users, we made user stories. For a closer look: https://docs.google.com/spreadsheets/d/1UV9r50WhGBeEhKtTb5mU8tG9SJlWngc31STbHWLL-Dw/edit?usp=sharing
We focused on what users would want to look at as new users and divided the main menu into 5 sections (Home, Your Events, Messages, Notifications, and My Account).
- Home: At first, we decided to put what features should be applied in ‘Home’ (users’ location, kinds of events, and tips for not being nervous at meetups).
- Event page: For any event pages, we wanted to prioritize some details of events (location, time, numbers of people, hosts, etc). We thought it would be also nice to allow users to see other people’s comments and what incentives there would be for attending events.
- Messages: Additionally, we decided to add ‘Messages’, so that users can send and receive any kind of message (talking and getting acquainted with other newcomers in advance would also help to make them less nervous).
- Notifications: We thought it’s also important for users to be informed about upcoming events via both emails and reminders. In this way, it would help users not to forget about events they want to attend and to get information about other events that they would be interested in.
- Your Events: This part would show the events that users are planning to attend and are simply interested in.
- Explore: It’s crucial for users to search events by time, location, and category.
- My Account: Users can edit their profile, see what events they participated in before, how many likes they got on their comments, and settings.
After this, we came up with 5 HMW questions to make our goal clearer.
- How might we help users attend events without being nervous?
- How might we help users see details of events without getting confused?
- How might we encourage users to attend events without no-showing?
- How might we effectively communicate information about upcoming events to users?
- How might we apply rewards in a cost-effective way both for users and event hosts?

4) Takeaways

Not everybody ends up attending events they said they would.
We concluded that the main reason would be social anxiety (meeting new people in unfamiliar places) and lack of motivation.
We decided that the overall project goal is to be solving the pain point of nervousness. To resolve the frustration of users, we focused on putting ourselves in the users’ shoes.

Design

1) User Flows

To make our design more visible, we made user flows via Miro. For a closer look:
https://drive.google.com/file/d/1oHpCBzISDlTaFVZflZjZwzPpNQC3MJZe/view?usp=sharing
Contrary to what we had planned on user stories, we reorganized the main menu to meet the needs of the users.

Home, Your Events, Messages, Notifications, and My Account

↓

Home, Explore (search bar), Your Events, and My Account

For Home, we decided to put some friendly messages for newcomers so they can see some tips and benefits of our events (we wanted them to be fully motivated to attend events). Also, some popular events can draw their attention when they scroll down.
For Explore, users can either use a search bar or search by category.
Your Events shows users the events they are planning to attend and those they are simply interested in.
We decided to put the parts for Messages and Notifications in My Account, since the space for the under menu is limited. My Account includes Following and Settings as well.

2) Low Fidelity Designs

From the user flows and heuristic analysis of our competitors, it got clearer how and what we should prioritize on our design. For a closer look:
https://drive.google.com/file/d/12GpGPPOxXTLkCVlGVPWS2Aguig0SzjoO/view?usp=sharing
We sketched every screen for a quick and efficient result. It was a bit of a tricky process since we had to discuss where to put each element on which screen. We also had to think about visual hierarchy, which we thought was the most essential thing for users.
We tried to keep our 5 HMW questions in our mind to concentrate on our goals.
- How might we help users attend events without being nervous?
- How might we help users see details of events without getting confused?
- How might we encourage users to attend events without no-showing?
- How might we effectively communicate information about upcoming events to users?
- How might we apply rewards in a cost-effective way both for users and event hosts?
To help users to attend events without getting nervous, we decided to put some articles about tips for newcomers.
It would also be important for users to see detailed information about events, so we made a decision that we would make it possible for users to scroll down the entire page of events via InVision.
We thought it would be all about wordings to encourage users to actually come out to events. We also had to think about rewards in a cost-effective way, so we concluded to put some benefits of attending our events (free entrance fee, free food, small thank-you gifts, etc).
For smooth communication with other people and hosts of events, we decided to design buttons for ‘follow’ and ‘messages’. We’ll also make it possible for users to receive reminders and notifications about upcoming events.

Validate

1) First Usability Test Script

For our first testing sessions, we prepared for the test script. For a closer look:
https://docs.google.com/document/d/1prbCYZ9-bg7UBcIGbw_rVY4pnAbQFI69Rs4tBcUGqwA/edit?usp=sharing
For a smooth testing process, we had 4 tasks that we asked users to perform.
- Can users be motivated to attend an event with the tips and incentives provided?
- Can users find any events they want to attend?
- Can users see details of events without getting confused?
- Can users get effective communication about upcoming events via reminders or emails?
We met 5 participants in person and focused on making an easy, comfortable atmosphere for them. We started from a friendly message which emphasized that we were testing the app, not them beforehand.

2) First Usability Test via Marvel

For this testing session, we conducted moderated usability tests for 5 friends of mine (in-person) by using Marvel. For a closer look: https://marvelapp.com/1552i6gj
All of the participants had experiences attending meetups and events that they can relate to (aged 30 to 40) and were interested in taking part in the testing session.
We tried to look for any hesitancy and difficulty when users tried to reach each task. On top of that, we wanted to see if users feel comfortable and certain about attending upcoming events and meeting new people.

3) First Usability Test Report

After the first round of the usability test, we got both positive and negative feedback from the participants. We were glad to be told that the overall image about this app was refreshing and pleasant to look at. Also, the tips and benefits made them feel like they were more confident about meeting new people and wanted to go to events. Despite the positive comments we’ve got, we couldn’t stop our journey to make the design better.
There was one major issue about the absence of a bell icon for notifications. A participant was confused about where to quickly find notifications and thought it would be nice to see a floating icon on the home page.
One minor issue we had was the absence of icons on the ‘Your Account’ page. Users thought it would be better to use icons in front of each section on the account page (messages, following, and settings).
The other minor issue was about a title for a submenu. Although the section for ‘Explore’ sounded clear enough, they thought ‘Search’ would sound better.

4) High Fidelity Designs via Figma

To make our designs tangible, we designed high fidelity using Figma. For a closer look:
https://drive.google.com/drive/folders/1lwouHVbqRhSkan2zt-I8XItttJyYu5FO?usp=sharing
At first, we focused on reflecting feedback from the participants by adding a bell icon on ‘Home’, icons in front of each section on ‘Account’, and changing ‘Explore’ to ‘Search’ on the submenu.
On top of that, this whole process gave us a great opportunity to try actual colors from the color palette. As we planned earlier, we put the darker blue on every CTA button and the lighter one for the background for a main page and less priority buttons.
We had a lot of fun playing around with some colors and discussing what colors we should use on which part.

5) Second Usability Test Script

For the second usability test, we had to write a script first. We had the same goal as the first one. For a closer look:
https://docs.google.com/document/d/1hUyiyU1zyW0JmI8zDdR1byY1oPkN0MczSBZ-4DS0-2A/edit?usp=sharing
Since it’s the first test for our new 5 participants, we did our best to make them feel comfortable by delivering the message that we were testing the app, not them.
We found some holes in our questions for the first session. For that reason, we changed some questions a bit (in a detailed way), so the new participants could understand better this time. We could see the participants had no problem understanding the questions and following the direction. The test session went more smoothly than the first one.

6) Second Usability Test via InVision

This time, we had the test session via Zoom, since the participants couldn’t find time to come out during weekdays. We conducted moderated usability tests for 5 other friends by using InVision. For a closer look:
https://jennyjung535745.invisionapp.com/console/share/ZS2RJ853H4
All of the participants had experiences attending meetups and events that they can relate to (aged 30 to 40) and were interested in taking part in the testing session.
The participants this time around were more introverted than the first group and generally were more sympathetic to social anxiety. Like the previous testing session, we tried to look for any hesitancy and difficulty when users tried to reach each task. We also wanted to see if users feel comfortable and certain about attending upcoming events and meeting new people.

7) Second Usability Test Report

After the second round, we found there is still room for improvement in our app but overall, the participants had positive reactions about the app. They especially liked clean UI and straightforward descriptions.
One major issue that one participant found was absence of an icon for navigation and directions when users hit ‘OK’ for Google location. Sometimes, users still want to look at events in other cities while their GPS is on. We decided to put the icon and description under a search bar for better understanding.
The other participant found one minor issue that line spacing on the page for newcomers was a bit narrow. Enough space between letters is important and it would make it easier for users to read.
It always surprises us how many flaws we can’t see while users can find out very easily. This second test session gave us a valuable lesson that no design is perfect, so we have to stay humble when it comes to design in a user-centered mind.

8) Iteration on High Fidelity

From what we learned from the second round of tests, we ended up iterating a couple of screens.
For a closer look of the whole design via Figma:
https://drive.google.com/drive/folders/11iszWe0NFEPU8w62z4hKi8eeWHC2DPKH?usp=sharing
We could see the whole design got much improved from the feedback of our participants. The whole process was worth it spending a lot of time thinking about what we should prioritize in this app and how we could make our users’ lives better.

Next Steps

We are very happy that the goals for our project are accomplished. We succeeded in making users want to participate in events without being too nervous by providing articles and tips for social anxiety. We allowed users to search for events freely and take a look at upcoming events that they were planning to attend. Also, we provided notifications, sufficient benefits, and enough information about events. Lastly, we made it possible for users to communicate with other newcomers and hosts anytime they want.
With reference to the last round of feedback, we will make another prototype and ask for more feedback from usability tests. Since no design is perfect, we will not stop exploring what we can do for users.