UX/UI

Website

UX/UI Design

My Role

6 months

Duration

GROUP PROJECT

About project

ANote Music is a music investment platform that enables users to purchase shares in music catalogues and earn monthly royalties from the songs’ performance within these catalogues. Usability testing conducted in 2024 revealed significant users' understanding issues around the music investing concept and the ANote Music product - starting from the website.

The findings showed that many users struggled to fully understand the product and how the platform worked, leading to low account creation and investing rates during non-promotional periods and an increase in customer support tickets. As the lead designer, I executed a complete end-to-end redesign of the platform’s public-facing website, from research and strategy to UI design and Webflow implementation. I focused on improving clarity, reducing cognitive friction, and ultimately enhancing user trust and engagement.

During the project I collaborated with: Irene Ciuci (Digital Marketing Strategist), Geoffrey Hamerlinck (Community Manager & Graphic Designer), Virginia La Torre (Product Manager), Ginna Lozano (Customer Success Officer), Marzio F. Schena (CEO).

The problems

Key user problems:

  • Confused users due to the lack of understanding regarding the benefits of investing in music.
  • Users become unhappy when their expectations are not met due to misunderstandings about the ANote Music platform.

Key business problems:

  • Low product engagement
  • Low account and investment conversion rates
  • High volume of customer support tickets

The goals

User Goals:

  • Help users fully understand their benefits and risks from music investment
  • Help users understand the ANote Music product so they can make the best investing decisions for them

Business Goals:

  • Position music royalties as a credible investment asset
  • Increase account creation and investor activity
  • Reduce customer support tickets
  • Optimize Website overall performance

The results

Key outcomes 2 months post-launch:

Design Process

Applying the 5 Planes of UX

The initial website (dating back over six years) was no longer aligned with user expectations or business goals. I began with a deep analysis of the current experience to identify friction points and content gaps. It became evident that aligning internal stakeholders around a shared vision was critical. I facilitated workshops and collaborative discussions with all team members to define the website’s new direction and ensure alignment across the team.

My responsibilities

It was a group design project where Marketing team, Product manager and the CEO of the company were included. From my side, I led independently, covering every stage of the UX and UI lifecycle:

  • User research
  • Heuristic evaluation
  • Competitor and market analysis
  • Journey mapping & comprehension analysis
  • Content & visual direction
  • Information architecture (IA) redesign
  • Wireframing & high-fidelity mockups
  • Custom visual asset creation
  • Responsive web design
  • Webflow implementation (End-to-end)

1. Strategy Plane

Understanding the Core Problem

Research Highlights

  • Heatmaps showed only 2 out of 15 pages were regularly visited
  • Only 30% of users scrolled past the midpoint of the homepage
  • Redundant pages and lengthy, jargon-filled content led to drop-offs
  • It was observed that a significant amount of users were drawn directly to the footer section and reading the disclaimers.

Main User Challenges

Findings based on previous tests and analyses:

  • Users didn’t fully understand the product or investment process
  • Confusion about what a music catalogue is and what happens post-purchase
  • Uncertainty about cashing out royalties or reselling shares
  • Concerns over platform legitimacy and trustworthiness
  • Misleading copy and overly complex language created false expectations

Strategic Objectives

Findings based on previous tests and analysis:

  • Improve product understanding by explaining ANote Music’s offering and investment process in a simple, digestible way.
  • Equip users with the right information at the right time, helping them feel confident enough to create an account and start investing.
  • Build trust in music as an investment class by clearly communicating its benefits and potential returns.
  • Deliver clear and concise messaging, removing ambiguity and minimizing the chance of misinterpretation.
  • Create a modern, fintech-aligned visual identity to reflect credibility and professionalism.
  • Reduce cognitive load by organizing and prioritizing content to avoid overwhelming users.
  • Equip users to make confident investment decisions.

2. Scope Plane

Defining Features & Content

Technical Considerations

  • The legacy site was built in HubSpot CMS, limiting flexibility
  • The new site needed to support multilingual content (3 languages)
  • Design consistency across breakpoints (desktop, tablet, mobile)
  • Shared elements (e.g., headers and footers) across all pages
  • Creating wireframes, prototypes, and high-fidelity mockups

Given these limitations, Webflow was selected for its flexibility, CMS capabilities, and alignment with our design system.

Content Strategy

  • Simplify copy into digestible, terminology-free paragraphs
  • Eliminate unnecessary pages to reduce cognitive overload
  • Include a dedicated “Why Invest in Music?” section or page for better user understanding
  • Use lifestyle imagery to build emotional resonance and trust
  • Incorporate testimonials and charts to support credibility
  • Prioritize clarity over persuasion: explain the product first, then pitch
  • Add clear CTAs to encourage account creation without hard selling
  • Include FAQs and index performance data to guide decision-making
  • Simplify the structured and the copy of the support articles

3. Structure Plane

Organizing the Information

The 3 pillars

In a previous usability test I analyzed what information users receives during their journey - Website & Platform. Based on this analysis, I defined the main 3 pillars that should be explained to the users in a simple way so they can understand the core product.

Information structure

Afterwards, I defined the information that should be provided in advance that would help them to structure on top all the additional information that they would meet later on in their journey.

Information Architecture

To simplify the user journey and reduce decision fatigue, the navigation was restructured to focus on 4 primary areas:

  • Home Page – Introducing the product
  • Why Music – Education on music as an investment
  • Marketplace – Available music catalogues
  • Company – Build trust by showing the team

Secondary pages (e.g., Rewards, Music creators, Support center articles, Legal) were moved to the footer to declutter the main navigation while remaining accessible. This allowed us to focus the core user flow on educating and onboarding new investors.

4. Skeleton Plane

Designing the layout

Wireframes

Wireframes were developed in three iterative rounds to align user needs, marketing goals and management expectations. These early prototypes focused heavily on:

  • Establishing a clear storytelling structure
  • Ensuring visual hierarchy and scannability
  • Designing intuitive and visible CTAs
  • Creating space for educational content and user reassurance

Insights from previous testing showed that users often missed CTAs or were unsure about what action to take. In response, buttons were redesigned with clearer affordances and strategic placement throughout each page.

5. Surface Plane

Crafting the Visual Experience

Visual direction

Visually, the new design needed to reflect ANote’s position as a fintech-forward, credible, and approachable brand.
Design aims:

  • Elegant, clean layout with fintech aesthetics
  • Vibrant accent colors to highlight key actions
  • High-contrast CTAs for better accessibility
  • Brand-aligned typography and iconography
  • Curated lifestyle imagery that users can relate to
  • Charts and performance graphics that simplify complex data

The result was a polished, professional interface that balances clarity, credibility, and emotional engagement – helping users feel informed and secure when getting involved with music investment.

Final Results

This project successfully aligned ANote Music’s website with modern UX best practices while addressing user pain points uncovered during testing. Early indicators post-launch included:

By applying the 5 Planes of UX, we ensured that every design decision was grounded in strategy, structured around real user needs, and executed with clarity and consistency.