Calmify — Music App for Night Relaxation
Calm your mind before bedtime through sound and design.
專案概述 /
Overview
Calmify 是一款為上班族打造的概念音樂播放 App，設計靈感來自 Spotify 與 Calm，希望以柔和的視覺、簡潔的互動流程與個人化推薦，幫助用戶在睡前放鬆心情、進入平靜狀態。
Calmify is a conceptual music streaming app designed for busy professionals who need a gentle way to unwind before sleep. Inspired by Spotify and Calm, the goal was to create a soft, intuitive, and personalized user experience that promotes relaxation through visuals and sound.
設計目標 /
Design Goals
- 夜間友好的介面與色彩氛圍。
- 降低操作負擔、簡化導覽層級。
- 提供個人化音樂探索與情緒連結。
- Create a calming and minimal interface suitable for night use.
- Simplify the user flow to reduce cognitive load.
- Encourage personalized music discovery and emotional connection.
設計流程 /
Process
研究音樂與冥想類 App，分析使用者痛點（資訊雜亂、操作層級深）。
規劃以「首頁／搜尋／動態／音樂庫」為主的清晰結構。
使用夜間友好的深藍與紫色漸層，打造柔和氛圍。
加入微互動與統一的圖示節奏，讓體驗更流暢。
Research — Studied music and meditation apps to understand their pain points (visual clutter, cognitive overload).
Wireframe — Structured a simple navigation with 4 core tabs: Home / Search / Feed / Library.
UI Design — Applied deep navy, violet gradients, and blurred visuals to evoke calmness.
Prototype — Added light motion feedbacks and cohesive iconography for a smoother feel.
視覺語言 /
Visual System
研究音樂與冥想類 App，分析使用者痛點（資訊雜亂、操作層級深）。
規劃以「首頁／搜尋／動態／音樂庫」為主的清晰結構。
使用夜間友好的深藍與紫色漸層，打造柔和氛圍。
加入微互動與統一的圖示節奏，讓體驗更流暢。
Typography ： Rounded Sans — friendly and comfortable for nighttime reading.
Color Palette ：Violet gradient × Navy shadow × Cyan highlight — symbolizing calm meets tech.
Motion & Icons ：Soft drop shadows, floating transitions, and minimal shapes to enhance visual rhythm.
主要畫面 /
Key Screens
研究音樂與冥想類 App，分析使用者痛點（資訊雜亂、操作層級深）。
規劃以「首頁／搜尋／動態／音樂庫」為主的清晰結構。
使用夜間友好的深藍與紫色漸層，打造柔和氛圍。
加入微互動與統一的圖示節奏，讓體驗更流暢。
| Page | Function | Focus |
|---|---|---|
| Home | Daily recommendations | Greeting layout & curated playlists |
| Search | Song / artist discovery | Clear category tabs |
| Feed | Social interaction | Share & comment features |
| Player | Play & relax | Minimal waveform + focus mode |
| Subscription | Premium upsell | Clean pricing and benefits |
專案回顧 /
Reflection
這次練習讓我理解如何運用色彩、留白與動態節奏，建立能安撫情緒的互動體驗。設計不僅是視覺語言，更是轉譯情緒與共感的媒介。
This project allowed me to explore emotional UX and UI hierarchy in a relaxation context. I learned how color, motion, and whitespace can guide mood, and how to translate empathy into functional interface design.
🛠️ Tools: Figma, Visily, Photoshop
