Designing for Guitarists
Mobile Tab Creation Tool
Overview
Transforming Ultimate Guitar’s mobile experience to remove creative barriers and help musicians turn ideas into playable tabs effortlessly
During the redesign, I created the end-to-end experience of the mobile tab creation tool on Ultimate Guitar
Role
UX/UI Designer
Timeline
January - May 2025
Project Type
University Capstone
Mobile
Key Skills
Prototyping
Wireframing
Mobile Design
Brand Design
Background
Ultimate Guitar is a go-to resource for guitar players of different skill levels when learning tabs or chords for songs
Problem
On mobile, guitarists that want to create chords or tabs don't have accessible tools to help with the process
Current Ui - Lack of tools
Solution
Streamlines tab creation, making music creation faster, more intuitive, and accessible for players at every level
How I Reached this Solution…
My Starting Point
Web experience isn’t available on mobile, limiting user creativity and accesibility .
Difficult tab creation makes the learning process frustrating and less engaging.
Submitting tabs upgrades users to premium — but the current experience discourages participation due to lack of tools
The Web Experience
Submitting tabs requires following detailed formatting guidelines.
The process is time-consuming and leads users to post lower-quality tabs or avoid posting altogether, resulting in fewer learning resources for others.
First step in creating a tab - lots of steps
Guitar notation
Publishing Requirements
Users must follow strict publishing guidelines that are:
hard to verify
time-consuming
unsupported by tools beyond a basic template.
If users don't meet all requirements when publishing, their tab won't be approved and uploaded
Publishing Guidelines
Looking at Competitors + Existing Solutions
I looked at Guitar tab creator + Tabmaker to identify patterns across experiences :
Functional/technical UI
Visual representation of fretboard to help with input
Click notes instead of typing
Gives notification to user on interface of what certain notation means by hovering
Narrow Down Insights
Taking insights from competitors and initial user research enabled me to design a tool that takes the basic structure of the web experience and enhances it with new functionality within the mobile experience.
Finalized Design Requirement to Guide Prototyping:
Tab mode with visual representation of fret board that enables users to press notes
Chord mode that has library of existing chord diagrams users can input into content
‘Automagic’ feature from web experience that checks if user’s content follows formatting guidelines
Share, export, and enable version history so users can revert back to older versions
Nest Components
Nesting components allowed me to easily scale and tweak my work as I tested my designs throughout prototyping. By building components within each other, I was able to better showcase user interactions and speed up design
How I nested components for the tab/chord modes
More…
If you made it this far, maybe you like guitar & design
I wanted to showcase a way AI is impacting the UX of everyday musicians — especially those who record music. One of the most accessible ways to record music is Audacity, a product I use frequently. Audacity enables me to easily plug in my Mustang micro (a portable amp) to my computer and record my guitar.
After getting the setup down, I often import backing tracks or songs I want to play along to. This is where I often run into a problem. If I want to turn down different parts of the song to better match my tone, there aren't many easy and free ways to alter tracks.
This is where the amazing world of plugins and AI comes in. An OpenVino plugin uses AI to isolate vocals, drums, bass, and other instruments from any track, while also enhancing and transcribing audio (and also has music generation 😞).
Why Does this Matter?
I believe these types of open source tools showcase the best ways AI can make a visible impact on the everyday person. This tool allows me, a novice guitar player, to have some of the capabilities of programs and tools that sometimes cost a lot of money.
Not only does AI help users in processes like these, but design does as well. Further exploration in user journeys using tools like these will allow people to focus more on creating rather than on technical or financial barriers.
