Spec Work ✶Beat.box is a new & exciting startup that offers curated music playlists to their users
Overview
Role: UI Designer
Summary: Design a web and mobile landing page for a music streaming startup. Create friendly branding that stands out from the current lineup of music streamers.
Services: User Research
User Interface Design
Result
If this speculative work was implement I hypothesize the website would establish a distinct and approachable brand presence in a competitive music streaming market. By aligning visual identity with a clear, intuitive user experience, the platform should strengthen brand differentiation and increase engagement with key onboarding and discovery flows.Solution
Problem
Existing streaming platforms prioritize scale and algorithmic recommendations over personality and emotional connection, resulting in experiences that feel similar across services. For a new startup with a friendly, distinctive brand identity, the challenge was to create a website experience that communicates its unique tone and differentiates it from competitors.Designed a website experience for a music streaming startup that translates a friendly, human-centered brand identity into a clear and playful digital presence. Through expressive visual design the solution highlighted the platform’s unique personality while maintaining usability and reinforcing key product value propositions in a competitive streaming market.Research
✳︎
Competitive Analysis
✳︎
Personas
✳︎
Site Map
✳︎
Research ✳︎ Competitive Analysis ✳︎ Personas ✳︎ Site Map ✳︎
Competitive Analysis
Compare and evaluate the user experience (UX) of a product or service against competitors to better understand the market landscape, refine the design strategy, and create a product that stands out to users.
Personas
Utilize demographic and psychographic details to serve as a reference point to ensure the product design is focused on real user needs rather than assumptions.
Site Map
Outline how users can navigate through the content and interact with onboarding, providing a roadmap of how the information and functionality is organized.
Design
✳︎
Low Fidelity Wireframes
✳︎
Branding
✳︎
Style Guide
✳︎
High Fidelity Mock-ups (Desktop & Mobile)
Design ✳︎ Low Fidelity Wireframes ✳︎ Branding ✳︎ Style Guide ✳︎ High Fidelity Mock-ups (Desktop & Mobile)