User Experience

Designing an event mobile app for hundreds of users

Role
Designer and Researcher
For
Cambridge University Press
Year
2018
Duration
3 weeks
Designing an event mobile app for hundreds of users

Overview

Our mobile development team asked me to build on an existing event mobile app for a global event in our organization. Since a mobile app had previously been built by them, the expectation was to simply improve the user interface. But then I took a step back and suggested that we go back to the drawing board and start questioning if we were tackling the right user problems in the right way, given the challenges highlighted by the team from prior attendance at the event. I am glad that the team trusted my recommendations, so we began working together—putting the users at the center of all we do. We began redesigning the mobile app.

Results

  • 87% task success rate — addressing key usability issues and allowing the team to rapidly develop the mobile app.
  • All features were validated to be needed by the users in completing their tasks — allowing the team to prioritize making the right features to work.
  • Increased event participation and engagement — resulting to the use of the mobile app in the next global events. Note: Data to be requested from the mobile development team.

Scope and limitations

  • Timeline. I had roughly 3 weeks to complete the UX work (while juggling other work priorities) before the development stage takes full throttle, including QA.
  • Deliverables. At best, I was able to provide high-fidelity mobile app designs validated by user research, alongside providing other UX artifacts for future use.
  • Participant recruitment for usability testing. Given the tight timeline, I was only able to get participants from our Manila office, instead of getting representative samples across our offices globally.

What is Digital Day?

The Digital Day at the Press is a chance to learn and share ideas on digital product and process development. There are professional speakers and panel discussions on a variety of themes including digital education, open technology, and future strategy, among others.

Photo of past Digital Day event
Scenes from the Digital Day in 2018

An opportunity to improve the Digital Day experience

We believe that designing and developing a mobile app for Cambridge events will aid in its growth by providing audiences with engaging and informative experiences that boost participation and engagement.

The idea: All-in-one mobile app designed for better experience of Cambridge events. To support this, the mobile app has three (3) main goals:

  1. To increase participant engagement;
  2. To equip the participants with the right and timely information; and
  3. To learn more about the users and the event.

What were my testable hypotheses?

  • Users are mostly on mobile at events and prefer to utilize it while they move between sessions or rooms.
  • Users dislike having to sign and respond to a large number of papers or online questionnaires.

What did I want to learn?

  • Would a mobile app enhance our users' event experience?
  • Where are the disconnects between the event and our users?
  • What changes in user behavior do we intend to make?
  • What are the essential characteristics required to assist our users in achieving their objectives?
  • Is a mobile app a realistic tool for raising questions and concerns?
  • Could the mobile app provide us with helpful insights into our users?

Who are the users?

We need to understand our users and get a feeling of how the event looks and feels, as well as the problems that come with it. I interviewed the mobile development team as well as other participants, such as managers and leaders, because they had previously attended the event. Then, I created proto-personas based on the qualitative data from interviews to envision who we are designing for:

Jacob the Attendee is present in-person or remote
Jacob the Attendee is present in-person or remote
Alex the Speaker is present in the event
Alex the Speaker is present in the event
Mary the Organizer is present in-person or remote
Mary the Organizer is present in-person or remote

Visualizing the user journey

I needed to learn more about the context of the typical user journey (snapshot) and flow specific on using the mobile app so I sketched the event based from the qualitative interviews.

Snapshot of user journeys
Snapshot of user journeys

Listing the features and enhancements

Based on what we know from the users and the event, I highlighted the essential features, using the Impact and Effort matrix, that will assist the users in achieving their goals:

  • Integrated sign-in portal for both Cambridge University Press and Cambridge Assessment participants (Attendees).
  • Event schedule (Attendees).
  • Event feedback (Attendees).
  • Real-time posting of questions (Attendees).
  • On-site booth verification through QR code scanning (Organizer).
  • Real-time notification (Organizer).
  • Rate topics and booths (Speaker/Booth).

Improving the existing user interface

Old designs. It was helpful that the team already had a draft UI — I did not have to start from scratch. Given the short timeline, there was no sense in completely redesigning everything, so I worked with what I had, and that was addressing key usability issues such as UI inconsistencies, layout and content design.

Old designs
Old designs
Old designs
Old designs

Testing the new designs

I did a usability test of my designs to rapidly uncover usability issues and further understand user behavior to validate our assumptions.

The task success rate was my prioritized metric to know if the users can complete their goals using our features. I also identified which specific tasks the users failed to complete. In a sense, I had an idea of the error metric, both qualitative and quantitative.

5 participants from our Manila office of different employee levels, age groups, and affinity to technology were asked to participate. I facilitated the entire usability test and had 1 observer from the team. The users were asked to complete the tasks using a mobile phone to access the prototype.

I prioritized testing these key user tasks:

  1. Rate a topic of choice.
  2. Ask a question about any topic of choice.
  3. Vote a question of choice.
  4. Rate a booth of choice.
  5. Learn the event details (e.g. Schedule).
  6. Check notification.
During the moderated usability testing
Moderated usability testing

Interacting with the designs

To mimic the mobile experience, I created a prototype of the mobile app that was then used by the participants to complete the tasks in the usability test.

Check out the prototype: https://goo.gl/PgcMTQ

Mobile prototype
Mobile prototype

Usability test results

My designs were able to yield an 87% task success rate. Meaning, majority of the participants successfully completed the tasks in the usability test. With this success, the team was able to proceed rapidly in creating the mobile app, allowing me to focus on other UX tasks such as making sure that the UI is translated accurately into code.

Top user pain points, in order:

  1. High impact: Noticing the bottom navigation. I observed that the users are not accustomed to having bottom navigation. They often check the hamburger menu at the top or scan the top part of the screen to find most of the links they need.
  2. Low impact: The layout of the talks or sessions was a bit confusing. Some users took time scanning.
  3. Low impact: Checking that there is a notification from the event. Few users did not notice easily the notification icon at the top right signaling that there is a notification for them.

Learning from crowd testing

The mobile app will be used by hundreds of people all at the same time so we wanted to mimic that experience to ensure that the mobile app can handle the volume. The team wanted some of the newly developed features and UI to be tested since another problem with the previously developed mobile app was that it crashes when used by many users so the team wanted to know how the mobile app performs when used simultaneously by many users. Thus, we tested the mobile app internally — having around 30 volunteer participants. We gathered useful feedback on performance, responsiveness, compatibility, UI, feature, copywriting, among others.

Photo during the crowd testing
Crowd testing with around 30 volunteer participants

Welcoming a fresh look

New designs. I based my color scheme on the logo (credits to the designer) to ensure that the branding and identity of both companies are consistent. Material Design was my primary reference for the interface since it allowed me to rapidly develop wireframes, construct new components, and take advantage of the advantages of having an existing design system.

New designs

Key learnings

Overall, it was a fun learning experience! Happy that the team was open to everyone's ideas. What I liked most was being able to test our designs through an Agile and a lean way of development. Being able to see user feedback and empathize with real users improved the mobile app so much. Props to an amazing team!

Read more ↓