BYTE Audio
The BYTE Audio project includes a mobile website and an interactive app prototype, both built for music producers of various expertise. Users can purchase music producing software in-site and create their own audio samples in-app. Designed for The New Media Certificate.
My Role
Lead UX Designer, Brand Designer
Date
Spring 2025
Tools
Figma, Photoshop, Canva
Problem
How can beginner producers dive into the world of music production without crashing straight into the barriers to entry? The challenge was to create a brand and design two products that were welcoming to new music producers but still enticing to seasoned professionals.
To engage new users, the branding and software design had to feel playful and engaging, while conveying the professionalism of a reputable software company.
A one-stop shop for all your music production needs.
Background
Music production software is often built for experienced creators, leaving beginners overwhelmed. As a result, many aspiring producers struggle to take their first steps into music creation despite their interest in the field. This project explored how thoughtful user-centered design and branding could make music production feel less intimidating. By balancing accessibility with sophistication, Byte Audio aimed to create an ecosystem where everyone could confidently learn and create.
O1 Research
Conducting a competitive analysis to shape BYTE Audio.
As a creative, I understand the challenges of exploring a new interest and being overwhelmed by difficult jargon, complex tools, and a steep learning curve. I approached research with empathy and care, centering the user’s perspective as I began a competitive analysis.
Teenage Engineering, Ableton, Native Instruments - I explored these three companies with aims of gaining insight into how successful music producing software brands establish themselves. Here’s what I found:
Creative software companies establish trust through a cohesive visual identity.
They communicate credibility through clear, digestible information hierarchies.
They communicate their value by showcasing what users can create, not just what the software can do.
02 Empathize
Understanding users and learning how to meet their needs.
To ensure my designs were grounded in the needs and challenges of real music producers, I created two user personas to represent the novice and the experienced user. They guided every design decision to ensure the BYTE Audio brand resonated to each member of our entire audience.
My Two User Personas
Understanding Our Novice User: Meet Samira!
Understanding Our Experienced User: Meet Randy!
HOW MIGHT WE?…
Design a brand and product experience that encourages new users to start creating music with confidence?
03 Ideate
Designing BYTE Audio’s brand, website, and app.
Colors, Typeface, UI Library
I curated a soothing color palette of various blues and a bright red, which signifies a sense of comfort and credibility. I chose Acier Sans as our heading because of it’s retro aesthetic, with Computer Says No as our sub-heading because of its aesthetic and readability. Rugrats Sans follows as the body because of its familiarity, perfect for a company that is setting itself apart but still wants to be welcoming. I designed the UI Components with simplicity and brand cohesion in mind.
Brand Identity
To exemplify the brand’s welcoming and playful nature, I settled on a retro, cyber-y2K brand aesthetic. I created a mood board to guide my design decisions in building the brand and the products.
BYTE Audio Style Guide
Logo and Mascot
One of my earliest design decisions was to incorporate an animal mascot in the brand, adding to the fun and approachability of this faux company. My idea evolved both into the logo system and mascot design.
LOGO: Blocky and y2k inspired, subtly integrating feline characteristics through a cat-like "Y" and a bite mark taken from the "E”.
MASCOT: Beginning with my hand-drawn concepts in Procreate before vectorizing the final version in Illustrator. The mascot features a sly smile, headphones, and surrounding soundwaves, visual elements that reinforce BYTE Audio's playful nature and connection to music creation.
BYTE Audio Logos and Mascot
Website and App Wireframes
With the visual foundation set, I began designing BYTE Audio’s digital interfaces through early sketches and wireframes. This iterative process allowed me to quickly test different layouts and visual hierarchies for the mobile website and mobile app. The website encourages users to purchase our production software and share their creations, while the app (SMPLR, pronounced Sampler) allows users to record and edit their own samples.
These low-fidelity explorations laid the groundwork for a seamless transition into high-fidelity design.
BYTE Audio Wireframes
04 Prototype
Transforming sketches into finalized polished and interactive designs.
I took my initial wireframes to Figma, where I refined them and integrated the colors and components from my branding and UI library. I then designed prototypes for both products, maintaining visual consistency and intuitive interactions across each touchpoint.
Click media for closeup.
BYTE Audio Mobile Website
SMPLR - BYTE Audio App
Takeaways
I loved that this project gave me the chance to combine UX design and branding across two platforms. Since the current design is an MVP, there is a lot of potential for future improvements. In the future I’d strengthen the hero section of the website with a short product demo or testimonial carousel to better communicate value and capture attention faster. I would also integrate a profile section to both products for a more personalized experience. Building this product strengthened my ability to design cohesive digital experiences from concept to prototype while balancing business goals with user needs.
Next Project…
