
Some details of this case study are intentionally redacted to honor an NDA
Context
Internship Overview
After working at two startups, my curiosity about larger companies' design approaches led me to join Shure as a UX design intern on their general design team, where I worked on everything from design system maintenance to product redesigns.
As a musician and an avid user of Shure's microphones, I was fascinated by Shure's focus on audio. I was lucky to have amazing supervisors, who allowed me to go beyond the scope of my assigned task and explore my areas of interest, in the form of various smaller projects. Overall, this internship was a perfect introduction to audio-specific UX design, blending my passions for design and music.
Vibe check
If this case study was a song, it would be...
Why?
I can't help but associate Shure's bright green with the iconic brat cover art, an album which was the soundtrack of my summer. In this case, B2b means back to back.
I can't help but associate Shure's bright green with the iconic brat cover art, an album which was the soundtrack of my summer. In this case, B2b means back to back.
Content
In this case study, I discuss two of the projects I worked on:

Project 1
Prism 3 Components
problem
Outdated Components
Prism 2 (Shure's previous design system) lacked several audio-specific components, and needed a revamp. Designers had several requests for missing components, and had to create them on the go, often losing up to 20-30% of design time on manual adjustments.
Solution
Customizable components, based on designers' requests.
I added 15 new components to Prism 3, tailored to designers' needs, with enhanced customization through variants and instance swaps. All were approved for publishing.
Impact
- All 15 components were published!
- Components appeared in Designer 6
- I introduced 2-choice segmented controls
Toolkit

Figma

Sketch

Material
Design
Design
Research
Heuristic evaluation
Evaluating old components.
One of the components I created was a segmented control, which appeared in Prism 2 as a tabs component.

Segmented controls are a set of mutually exclusive options, presented horizontally.

Prism 2 tabs component
Some of the problems that come with only having a tabs component are:
No distinction between general and specific navigation
Slows down workflows that require quick contextual switching
Users lose context when switching between tabs for related tasks.
Competitive Analysis
How did other products use this component?
I explored the ways in which segmented controls were used in other products, to create a new and improved component.

Segmented controls competitive analysis
Research Insights
Most segmented controls had 2-5 options
Commonly used hover, selected, and focus states
Options differed in shape from standard buttons and were often visually connected
User Interviews
Audio-specific components were more complex.
To design components like audio meters and gain faders, I needed a deeper understanding of details like peak-indicator animation and decibel scales. I interviewed 3 designers who worked on relevant software to gain insights into their use of these components.
Interview Insights
Some components required manual adjustments due to spacing constraints or unique use cases.
Prism 2 over-relied on Material Design, which did not accommodate for audio-specific components.
Inconsistent components = visual inconsistencies across different products
The main use cases were horizontal and vertical input channels
Define
Opportunity Areas
Improve components' visual consistency
Make component variations, reducing the need to detach instances
Create audio-specific components, tailored to designers' needs
Ideation + Iterations
Iterations
Components should reference each other.
Even with lower-level components like segmented control, we tried to stay inspired by other components. For example, the design is highly influenced by the default and disabled state of standard buttons.

A lot of the low-level components like standard buttons were built on Material Design guidelines, which I had to familiarize myself with.
Design Process

Default & disabled states of Standard buttons
The segmented control's selected state is bright green and rounded, just like the standard button's default state, making it obvious and efficient in the case of two-option segmented controls.

standard button vs. segmented control option
After connecting the segmented options, I increased the unselected font's opacity to ensure proper contrast.

segmented controls old vs new iteration

old vs. new segmented control
Final Segmentred Control

Final component, as seen in prism 3
Audio-specific components needed more variation.
The goal was to reduce the need for manual adjustments. With the most common design scenario being vertical and horizontal channel strips, I began by creating vertical and horizontal scales.


Scales and their properties
In those scales, I utilized instance swaps to allow designers to hide/show right/left scales and numbers, switch between scales (decibel/log), and toggle between component types (meter/fader), as shown above.
Audio Meters & Faders

I interviewed designers to understand the way audio meter animations work, specifically the behavior of the Peak Indicator (the red mark), which showcases maximum loudness.

Solution
Final Deisgns
15 published components.
By the end of the internship, I created over 15 components, which were approved for publishing.

The visual is intentionally small to comply with an NDA regarding certain components.

standard button vs. segmented control option
Customizable Fader / Meter Component

Conclusion
Impact
I made it into Designer 6 :)
Although there is no concrete data on the time saved by designers using the new components, many of them—including the icon buttons, standard buttons, layouts, text inputs, the two-option segmented control I advocated for, and more—were included in Designer 6, released in February 2024.

Designer 6 screenshot (source)
Lessons Learned
What I learned from this project.
I learned a lot about specific Figma functions and components, from instance swaps, to nested instances, and more. I also got to learn about the format and organization of design systems, especially in the context of larger companies. This helped me understand how to utilize design systems in my designs correctly moving forward.
The main challenge was navigating the learning curve of Shure's organization of Prism 2 and my initial inexperience with Figma's component functionalities. I owe a huge thank you to my supervisors, Christina and Anna, who were always available to answer my questions.

Skills Unlocked

Advanced
Techniques
Techniques

Design
Systems
Systems

User
Reserach
Reserach

Domain
Expertise
Expertise

Project 2
Beginner Error-Handling Workflow

problem Space
What is Wireless Workbench?

Wireless Microphone managing System

Intense learning curve for inexperienced users

Often used for rented equipment by inexperienced users
problem
Wireless Workbench is too technical for beginners.
For inexperienced users, the current success rate of the error handling process is 30%. I was tasked with creating a more intuitive error-handling workflow.
Solution
User segmentation.
Providing users with tailored interfaces based on their experience with audio equipment, minimizing on-screen information to essentials, and automating error handling as much as possible.
Impact
- 100% of users successfully initiated error handling
- 90% of users understood the next steps
- Approved to be used as reference for future designs
Toolkit

Figma

Miro
Research
User interviews
I watched the users struggling.
To learn about the issues users had with the software, I watched 3 product walkthroughs with inexperienced users, and used afinity diagraming to identify the main pain points.

The walkthroughs were of mobile version of WWB, which has similar features to the desktop one.
Product walkthrough video & Grouped Affinity Diagram
Some of the main problems users had were:
Users did not know/care about error types.
Users were not sure where to tap to fix microphones.
Confusing hardware-specific language like "deploy backup."
Misunderstood difference between channels vs. microphones
Heuristic evaluation
I looked at existing wireframes.
Shure already had existing wireframes of desktop beginner error handling flows which I was tasked with improving, while keeping the following user scenario in mind.
User Scenario:
You just rented a few of microphones for an event, which for some reason, do not seem to work. You now have to fix them, so you open the software they come with and see the screen below.

Wireframes are intentionally blurred to comply with an NDA.

initial home screen Wireframe with MY notes
Some of the issues I found were:
Vague error state
Irrelevant information for beginner users
Visual layout issues - small font, distracting background, confusing hierarchy
Define
Opportunity Areas
Straightforward error state
Showcase only relevant information
Include more intuitive visuals & clear CTAs
Ideation
Iterations
Errors needed to be straightforward.
Instead of each card representing multiple devices, the new card represents a single device, with a red border, showing an error. I replaced the red checkmark with an "error" icon for clarity.

equipment error state iterations old vs new
I removed unnecessary information.
Users simply needed to see the malfunctioning devices. Thus, I hid information such as location-based optimization, and the wireless spectrum forecast. I also moved the 'getting started' section down in the hierarchy, since it is not relevant when the user is in a crisis.

home screen iterations 1 & 2
I made sure to showcase all of the individual devices, and provide more visibility regarding their amount. I made the sections collapsable, with functioning devices not showing by default.
Clear instructions & visuals.
I proposed giving users clear visual steps when it comes to handling different errors. The instructions should be simple enough to follow without understanding the error types, and will appear as popups once a user clicks on a CTA.

error handling popup
Solution
Final Deisgns
Beginner's error handling workflow.
Bellow are the screens in order.

User segmentation screen

home screen showcasing an error

popup template once the user clicks on a cta
Conclusion
Impact
I tested the designs on 10 users.
100%
of users successfully initiated error handling
90%
felt like they understand the next steps
Approved
as reference for future designs
next stpes
Future opportunities.
Group devices based on error type to avoid overwhelming the user.
Explain error implications in simple language.
Remove redundant CTAs
Clearer steps and progress indicators
Create a complete error-handling workflow based on a real-life scenario
Lessons Learned
What I learned from this project.
This project taught me that simplicity wins, especially in stressful situations. The main thing that helped me with creating the home screen was taking the users' mental state into account, and prioritizing their main concern - identifying which devices are malfunctioning, and taking the first step to fix them.
The main challenge was leaving my own bias and knowledge regarding audio and microphones behind, and "pretending" to be a complete beginner when designing.

Skills Unlocked

User
Reserach
Reserach

Domain
Expertise
Expertise

Testing
Protocols
Protocols

Relfection
Interning at Shure
Lessons Learned
First time at a big company.

Leave personal bias behind.
I observed professionals conducting user testing sessions and noticed that instead of correcting confused users or over-explaining their intentions they asked them to reflect on their decisions.

Users' emotional state is important.
Envisioning the users' emotional state while interacting with your design is critical to creating a good product. It was interesting to see just how important it is especially in the case of error-handling.

It takes a lot of people to make things work.
It was amazing to see how many different people with different strengths comprised the design team. I constantly felt inspired by my supervisors' visual design and research techniques.

Everything is a question away.
By reaching out to fellow designers and offering to help, I was able to explore additional audio-focused mini projects, and thus leveraged my background as a musician, utilizing this opportunity to the fullest.
a few photos from my orientation week (wish i took more!)
Read next