Executive summary
This project aimed to Improve onboarding of beginner music makers into Ableton products. As the in-house UX/UI designer, I led the end-to-end design process, creating a dedicated resource page with step-by-step tutorials and guides to help new users build confidence and maximise their experience with the flagship software.
Key learnings
Finding creative solutions to work within CMS limitations, ensuring a seamless user experience without custom development.
Maintaining a learning-first tone while still nudging toward conversion
Designing for scalability
The company: Ableton
Ableton makes industry-leading software and hardware for music creation and performance.
An estimated 70% of popular music is created using Ableton’s flagship product Live.
The problem
Ableton Live is a powerful software tool with a steep learning curve for beginners.
Many new users feel overwhelmed when getting started.
Ableton.com at the time lacked directly helpful information to get going with their product.
The goal
Ableton relies on new customer acquisition for continuous audience growth in order to generate revenue.
By offering more accessible, simple and engaging resources to make learning easier.
This would in turn increase user satisfaction, retention and upgrades from free to paid editions of the software.
Journey mapping
Various teams across the business have questioned how we can improve the learning experience. Specifically:
Providing better resources for onboarding new users
Increasing traffic to learning material across ableton.com
Making ableton.com the go-to learning platform
Revenue potential
In 2022, Ableton recorded low rates of conversion from free editions of Ableton Live to the full-price Suite.
Through collaboration with business intelligence and the product manager, we were able to ascertain that improving these conversion rates in 2023 were projected to generate an additional revenue of
500K EUR
I calculated this would require 835 Suite conversions from free editions to hit target (over the whole year). That’s about 70 a month.
Survey results
Users were asked “what helped you get started with Ableton Live”, and it was found that about 70% didn't use Ableton resources to get started with the software.
And when asked "how would you describe your experience using Ableton.com to find learning resources or support for getting started with the software?", users had the following to say:
Summarised learnings from research
Users were asked “what helped you get started with Ableton Live”, and it was found that about 70% didn't use Ableton resources to get started with the software.
And when asked "how would you describe your experience using Ableton.com to find learning resources or support for getting started with the software?", users had the following to say:
User pain points
Business considerations
Hypothesis
CMS components
In order to work within the limitation of developer resources, we opted to use CMS components to build the feature.
Limitations
Custom components not possible
Not every component works ideally for every situation
Adherence to more simplistic features
Opportunities
Aligns with user need for simplicity, and frees up developers for projects where custom components arise from specific user needs
Encourages creative solutions within constraints
Allows for rapid deployment of a responsive feature across desktop, tablet and mobile
Scalable and flexible, for a page that may require regular content updates
Low fidelity wireframes
Below are some early explorations with the existing components in mind. Consideration was given to:
💡 Responsive design across breakpoints
💡 A single scrollable layout for efficiency + intuitiveness
UI considerations: asset selection
Live 11 brand campaign
Approachable setup
A relatable time of day to make music
UI considerations: colour
Derived from latest branding
Feature consistency
Accessibility (WCAG)
UI considerations: design system
Creative choices within established design system
Site-wide consistency
UI considerations: layout & composition
Standard 12 column guides
Spacing units
Ample negative space
UI considerations: typography
Perfect Fourth Scale - balance & contrast
Futura - consistent with design system
UI considerations: components
Functionality and hierarchy
Unified across breakpoints
Goals
Identify usability issues
Measure clarity and flow of the experience
Validate design decisions
Understand user sentiment
Method
Moderated testing - observing behaviour and ask follow-up questions (meant the below could be more conservative)
1 round of usability testing - before launch (minding budget and time constraints)
5 participants, new users (enough to draw patterns without analysis and cost overload)
Task flows
Freely explore page, and:
Locate a particular step-by-step tutorial
Locate browser-based synthesis lessons
Navigate to the Live Suite upgrade link
Before – exposed layout
“Hmmm it’s kinda far to scroll to find the headers and to get to the stuff below”
After – collapsible panel
🔧 Organises content neatly
🔧 Reduces scrolling through videos user may not have interest
🔧 Existing CMS component – quick to implement
Before – smaller video cards
“If these videos were slightly bigger I could more easily check them out without having to go fullscreen”
After – larger videos (text beside media)
🔧 Offers ease by which user can preview without expanding
🔧 UI leads the eye across the page
Metrics & results
4/5 users completed all tasks under 1min
Ease of use rating averaged 4.4/5
Qualitative feedback validated the clarity and usefulness of the learning hub feature
Impact
I wrapped up my time on the project before any post-launch analysis could take place, but had a clear framework for measuring success:
Conversions & Revenue: tracking sales by edition (Suite, Standard, Intro) to understand upsell effectiveness and revenue contribution against the €500K annual target.
Onboarding Engagement: monitoring interaction with tutorials, guides, and edition comparisons as leading indicators for retention and reduced support demand.
Email Funnel Performance: analysing each step from open to conversion to identify drop-off points and refine follow-up strategy.
Support Enquiries: measuring changes in onboarding-related tickets to assess the clarity of self-service resources.
Had the results been available, the data would have guided adjustments to edition positioning, onboarding CTAs, and follow-up flows, ensuring the design delivered measurable business impact.
Reflections
Challenges
Designing within CMS constraints: limited flexibility meant relying on structure and hierarchy to keep it tailored and on-brand.
Balancing depth and simplicity in tutorials: testing showed users valued detail but risked feeling overwhelmed.
Maintaining a learning-first tone while still nudging towards conversion.
No historical baseline data: this was a brand-new resource, so I planned post-launch tracking (conversions by edition, engagement, email funnel, support tickets) to create benchmarks.
What I'd improve
Layout flexibility: collapsible panels reduced information overload but forced a single-column layout; I’d explore adaptive layouts to optimise space.
Interactive playlist: a custom video playlist to preview and switch tutorials more smoothly.
Data-led refinement: use post-launch insights to adjust edition positioning, tighten CTAs, and improve follow-up flows.