SoundScape

Human-Computer Interaction Junior Year Semester-Long Class Project

The Challenge:

“Technology-based experiences in
difficult environments”- design an experience intended to be used in non-traditional, complex settings where technology use is non-optimal.

Scope: 15 weeks

Role: UX designer, Visual Designer, and Researcher

Tools: Figma and Miro

Processes: User Research (Interviews & Surveys), User Personas, Requirement Gathering, Wireframing, Lo-Fi and Hi-Fi Prototyping, Affinity Mapping, Visual Design, A/B Testing, Task Flows

Project outline:

This a semester-long project, submitted in four phases:

  • Phase 1: Analysis

  • Phase 2: Design

  • Phase 3: Prototyping

  • Phase 4: Evaluation

The analysis and design phases are complete. In the next section, the analysis phase will be shown.

Analysis

Concept Statement:

The SoundScape mobile app is designed to enhance the concert experience by providing concertgoers with timely and relevant information, allowing them to focus more on the performance and less on logistical details.

Available on both mobile devices and Apple Watches, SoundScape offers two primary features:

  1. Real-time notifications of upcoming songs in the artist’s setlist

  2. Up-to-date wait-time information for food, beverage, and merchandise lines  

By delivering these updates efficiently, the app ensures users spend minimal time interacting with their devices, maximizing their enjoyment of the concert. Ultimately, the vision for SoundScape is to transform how concertgoers engage with live performances, making every moment count.

Analysis

Contextual Inquiry

Analysis

Contextual Analysis- Affinity Diagramming

  • After my team gathered the common pain points, frustrations, and goals for concertgoers, I synthesized these points into an affinity diagram.

Analysis

Creating a Usage Model – Hierarchical Task Inventory (Task Flow)

Goal: Staying informed about upcoming songs and minimizing time spent in lines 

  • This HTI model would help highlight how concertgoers interact with the SoundScape app to stay informed about the setlist, check wait times for food, merchandise, and restrooms, and manage their time efficiently.

  • We chose to implement a usage hierarchical task inventory model because it effectively breaks down the user’s goals into actionable steps, making it clear where the app can intervene to make processes smoother and more enjoyable.

 

  • The steps are outlined in sequence, showing how users manage their concert experience, from opening the app to returning to the stage in time for their favorite songs. Each task is connected by arrows to represent the user’s decision-making flow and how the app simplifies time management.

  • This approach will highlight specific user actions, allowing for a detailed analysis of micro-interaction patterns. 

Analysis

Gathering Design Requirements

Offline Functionality

The app must have excellent offline functionality, meaning that it can carry out its functions efficiently in the absence of a stable internet connection. This is a requirement due to the commonly reported poor cell reception in concert venues. 

Interactive venue map

The app must have an interactive map of the venues accessible through the app that users can click on to zoom into and highlight their destination. The map must include bathrooms, merchandise stands, and spots where pictures have been frequently taken. 

Setlist queue

The app must have a display of the setlist accessible on mobile and on smartwatches. The setlist being accessible on both devices reduces the number of times a concertgoer must check their phone or hold it above their head waiting for a song to come on. This is a requirement because concertgoers often miss songs.  

List of wait times for bathrooms and merchandise 

The app must have wait times for the bathroom and merchandise available. This is a requirement because long lines are a common damper on concert experiences, which was expressed in the work activity notes. 

Dark Mode Display

The app must be in dark mode due to the dark nature of concert venues. This is a requirement because we want to consider accessibility standards and inclusivity at each step of the design process, and dark mode would allow the most visible screens. Bright white, eye-straining in dark concert venues phone screens were also a common user complaint.

Project Outline:

The team has now completed the analysis and design phase of the project. The prototyping and evaluation phase will be assigned to the class within the next few weeks remaining in the semester

  • Phase 1: Analysis

  • Phase 2: Design

  • Phase 3: Prototyping

  • Phase 4: Evaluation

In the next section, the design phase will be shown.

Design

User Personas

Traditionally, in my design process, I would include user personas in the analysis section. However, this class includes user personas in the design phase.

I created the target persona for SoundScape with the user research from phase 1 (analysis) in mind. Most of the interviewees who expressed that they would be likely to use the app were frequent concertgoers who were sociable and like to plan ahead. 

When discussing their experiences with concerts in the past, concert lovers often expressed in the interviews their passion for certain genres and specific artists but stated feeling constantly stressed at concerts as a complaint. These themes were included in Cassie’s interests & hobbies, and weaknesses section.

Design

User Persona Explanations

Design

Ideation Session Takeaways

The team decided to move away from the ticket cost tracking aspect of SoundScape, since we came to the conclusion that it would not contribute to our goal of creating an application that would help users be more present at their concert experiences.

However, we did want to continue to include the involvement of our stakeholders, such as performing artists and their management teams, and the venue concessions, security, and productions employees.

One major focus we had this phase was on concert preparation, where we envisioned features that would facilitate users in planning their concert outings. For instance, we considered a “Concert Prep Checklist” that would allow users to track what they need to bring or cannot bring.

Additionally, we brainstormed the concept of a personalized “Setlist Playlist” feature that would help users familiarize themselves with songs, enhancing their overall enjoyment during the concert. 

 

Design

Ideation Session Takeaways

Another area of exploration was navigating the venue. We proposed an interactive venue map that would provide real-time updates on the location of food, merchandise, and restroom facilities. This would not only help users find their way but also include a “Hotspot Finder” feature that highlights crowded areas based on user-generated data.

In a big jump, we discussed the possibility of integrating augmented reality elements to guide users to specific location within the venue, allowing them to visualize their paths and avoid congested areas.  

These ideation sessions, along with others, generated a wide range of ideas—some feasible and practical, while others stretched the limits of reality—each designed to tackle the specific pain points faced by concertgoers. 

 

Design

Peer Design Critique Session Takeaways

  1. “Find Your Friends” feature would add to the usefulness of the app

  2. A poll system for the artist to use and ask questions like “Which song should I play?” could be a great way for artists to engage with their fans through the app.

Design

Storyboarding

This scenario demonstrates how SoundScape prioritizes efficiency and minimal disruption to a user’s concert experience, allowing concertgoers to make informed decisions in real-time with minimal effort.

  • For this example, I wanted to emphasize how SoundScape can help users be more present, ensuring efficient use of the application when time is of the essence. 

  • In this storyboard, the user needs to quickly check the setlist to decide whether to use the bathroom, and the interaction with SoundScape is designed to be fast and intuitive. By accessing the application on a smartwatch, SoundScape reduces the effort needed to interact with the app in a busy concert environment. The app immediately scrolls to the next song in the setlist, minimizing the time the user spends navigating the menu. The quick, glanceable interface also encourages short, efficient interactions, allowing the user to put down their technology and remain immersed in the concert experience. 

Design

Sketches

Design

Wireframes

Project Outline:

The team has now completed the analysis and design phase of the project. The prototyping and evaluation phase will be assigned to the class within the next few weeks remaining in the semester

  • Phase 1: Analysis

  • Phase 2: Design

  • Phase 3: Prototyping

  • Phase 4: Evaluation

In the next section, the design phase will be shown.

Prototype Walkthrough

What I Learned from SoundScape

The faster a design descion “fails” to produce the desired resolution to a problem, the faster we find the correct solution.

This is the benefit of rapid iteration, whihc is a work flow that definitely took some time getting comfortable with. In previous design projects and the early phases of this project, I often felt burnt out after designing for hours on end, which resulted in a lower quality of work than desired.

After deciding to design in short and frequent sprints, we I was able to finish designs several days before the deadlines, which allowed the team to iterate through design choices and solutions quickly.

Asking non-leading and unbiased questions in user interviews

Since this project was dense in user research, I got a lot of practice conducting productive user interviews. Through writing the questions for the user interviews, I learned the importance of focusing the questions on the user journey and pain points, rather than what asking what features the users would like to have.