wave: 80s music

experience

reimagined

My Role
  • UI/UX Design
    Designed core flows and high-fidelity interfaces that combine expressive retro-futurist visuals with recognizable interaction patterns.
  • Visual & Brand Development
    Established a cohesive identity inspired by retro-futurism while maintaining legibility and clear hierarchy.
  • Motion Design
    Created logo and UI animations, including playback states, record motion, audio visualization, and transitions, making interactions clearer while reinforcing Wave’s identity. Extended the motion language into an app promo to turn the product experience into a cohesive visual story.
  • Research & Testing
    ‍
    Reviewed existing music apps, identified recurring interaction patterns and friction points, and refined the interface through iterative evaluation.
Tools Used
⁕    Adobe XD
⁕    Adobe Photoshop
⁕    Adobe Illustrator
⁕    After Effects
Project Overview

Wave is a conceptual music app exploring how the atmosphere of nostalgic listening experiences can be translated into a contemporary digital product.

The project focuses on the relationship between emotional expression and usability: creating an interface with a distinctive character while keeping playback, discovery, and navigation direct.

The Challenge
Many mainstream music apps prioritize efficiency and scale but offer little visual personality. Nostalgia-driven concepts can create the opposite problem by favoring style over readability, accessibility, and familiar navigation.

The challenge was to create an immersive visual experience without slowing down the actions users perform most often.
Assumptions
⁕ A music product can support emotional connection as well as functional playback.

⁕ Nostalgic visual cues add value only when the interface remains recognizable.

⁕ Playback, track navigation, discovery, and playlist management should be immediately accessible.

‍Within the scope of a conceptual student project, these assumptions guided iterative design evaluation rather than formal behavioral research.
Approach
I established the main interaction flows before developing the visual language. This made usability a constraint for the aesthetic direction: expressive elements could be introduced only when they preserved clarity and access to core actions.

design prOcess

01

Defining Core Interaction Flows

I structured the experience around four recurring actions:

⁕ Start playback immediately
⁕ Move between tracks
⁕ Discover artists and music
⁕ Create and manage playlists

02

Designing Within Constraints

I adopted one guiding rule: no visual decision should slow down a core interaction. This led to simplified high-frequency screens, clear touch targets, and predictable navigation.

⁕ No hidden or gesture-dependent navigation
⁕ No heavily skeuomorphic controls
⁕ No visual effects that compromise readability

03

Translating Nostalgia into Usable Design

Instead of recreating a specific historical interface, I abstracted recognizable qualities of retro-futurism. Color and glow establish hierarchy, while animation communicates playback state and response. Spacing and familiar controls keep the visual richness structured.

04

Iteration & Validation

I reviewed the concept against three criteria: clarity, speed, and focus. Iteration concentrated on contrast, layout density, motion timing, and whether important actions remained immediately recognizable.




‍

key design decisions

1. Balancing Emotion and Efficiency
‍
Rather than treating visual expression and usability as competing goals, I used each to constrain the other. Expressive elements were concentrated around content and playback, while navigation remained familiar.

2. Reducing Cognitive Load
‍
Spacing, hierarchy, and predictable patterns organize the visually rich interface and help users identify the next relevant action.

3. Making Motion Functional
‍
Animation confirms actions, represents playback state, and directs attention. It is tied to interface behavior rather than added as independent entertainment.

login screen

customize profile screen

home screen

artist screen

music player screen

The final concept combines a distinctive retro-futurist identity with clear playback and navigation patterns. Motion communicates state, while hierarchy and familiar controls keep the main actions accessible.*
‍

* Because Wave remained a conceptual project, its outcome demonstrates the intended balance between emotion and usability rather than measured improvements in engagement or task performance.