[UX UI 디자인 부트캠프 #1] 애플뮤직 클론디자인
2026 스터디
안녕하세요
UX UI 디자이너 댄비입니다
Apple Music 클론 디자인을 회고글을 작성해보려고 합니다
클론 디자인을 진행하며 느꼈던 UI/UX 포인트를 담아보겠습니다 ო̤̮
클론 디자인은 화면을 똑같이 따라 만드는 작업이라 느껴질 수도 있겠지만, 디자인 구조와 인터렉션 의도를 해석하고, 사용자의 입장에서 나은 방향을 고민해 보는 연습 과정이라고 생각합니다.
이번 Apple Music 클론 디자인에서는 홈 화면, 라디오 화면, 그리고 서비스 전반으로 나누어 클론디자인과 UX UI 디자인 개선 방향을 정리해 보았습니다
홈 화면
애플뮤직(좌)/클론디자인(우)✔️ 좋았던 UI/UX 포인트
둥근 이미지와 레이어 처리
→ 카드, 이미지, 버튼 전반에 둥글기(corner-radius) 값이 적용되어 있어
전체적으로 부드러운 인상을 준다.
음악 서비스 특유의 ‘감성적 경험’을 시각적으로 잘 표현하고 있다고 느꼈다.
화이트 배경 + 여백 중심 레이아웃
→ 불필요한 시각적 요소를 최소화하고 콘텐츠에 집중할 수 있도록 설계되어 있음
→ 복잡한 기능이 많은 음악 앱에서 사용자 피로도를 낮춰주는 역할을 한다.
❌ 아쉬웠던 UI/UX 포인트
음악 재생과 관련된 즉각적인 액션 버튼의 부족
→ 홈 화면에서 활용할 수 있는 버튼이 제한적이라
‘바로 듣기’보다는 ‘탐색’에 치중된 인상을 받았다.
(좋아요, 이전 곡, 되돌리기, 한 곡 반복 등)
개선 방향
홈 화면에서도 핵심 재생 액션을 즉각적으로 수행할 수 있도록 버튼을 구체화
사용자의 음악 소비 흐름을 끊지 않도록
최소한의 인터랙션으로 재생 → 조작까지 가능하게 설계할 필요가 있다.
라디오 화면
애플뮤직(좌)/클론디자인(우)✔️ 좋았던 UI/UX 포인트
라디오 기반 큐레이션 서비스
→ 광고, 브랜드 협업 등 수익 모델 확장 가능성
툴바의 background-blur 효과
→ 스크롤 시에도 콘텐츠 맥락이 유지되어 사용자가 현재 어떤 콘텐츠를 보고 있는지 인지하기 쉽다.
아이콘 중심의 직관적인 인터페이스
→ 재생, 스케줄, 더보기 등의 기능이 텍스트 설명 없이도 이해 가능하도록 잘 설계되어 있다.
❌ 아쉬웠던 UI/UX 포인트
‘더 알아보기’ 영역의 정보 밀도
→ 한 카드가 차지하는 가로 영역이 커서 한 화면에서 확인할 수 있는 정보량이 제한적이다.
UX Writing의 톤 미스매치
→ ‘놓쳐서는 안 될 신곡’이라는 카피는 큐레이션·라디오 중심 콘텐츠의 성격과 다소 어긋난다고 느꼈다.
개선 방향
리스트형 UI를 칩(Chip) 형태로 전환
(사용자: 스크롤 피로도 감소 → 빠른 탐색 가능→ 자주 듣는 장르를 고정할 수 있는 기능 추가 시 개인화 경험 강화)
콘텐츠 성격과 일치하는 UX Writing 적용
(예시:“팝 컬처를 가장 잘 아는 전문가의 큐레이션을 들어보세요”)
→ 정보 전달 + 브랜드 톤을 동시에 강화
보관함 화면
바텀 시트로 올라오는 프레임입니다.
오토 레이아웃을 움직이면, 컨스트레인 재조정이 필요하다는 점!
검색 화면
두 페이지는 연결된 프레임이지만, 디자인할 때는 분리해서 작업했습니다.
이후 프로토타이핑 과정에서 연결했습니다.
상단 툴바를 컴포넌트로 조정해서 사용했습니다
컴포넌트 사용해 디자인 시스템을 구축하는 과정이 초반에 어려웠지만 재미를 붙이고 있는 요즘.. ᵔᴥᵔ
전체화면
[프로토타이핑 영상]
✔️ 좋았던 UI/UX 포인트
1. 컬러 시스템
기존 음악 앱에서 흔하지 않은 primary 컬러를 사용해 Apple Music만의 독창적인 브랜드 아이덴티티 구축
아이콘과 주요 UI 요소 간 컬러 위계가 명확해 사용자의 시선 흐름을 자연스럽게 유도한다.
2. 그림자와 레이어 활용
음악 재생바와 배경, 카드 그리드와 배경이
적절한 그림자 처리로 명확히 분리되어 있다.
3. 여백 설계
앨범 커버와 곡 제목의 좌측 정렬 + 충분한 여백
→ 안정감 있고 정돈된 인상
❌ 아쉬웠던 UI/UX 포인트
1. 사용자의 핵심 목적 반영 부족
사용자가 앱에 접속하는 가장 큰 목적은 ‘빠른 음악 재생’
하지만 홈 화면에서 즉각적인 재생이 불가능해
초기 이탈 가능성이 높아 보였다.
2. 음악 재생바 정보 부족
재생바에 가수 이름이 노출되지 않음
→ 특정 아티스트를 중심으로 음악을 소비하는 팬층에게는 아쉬운 요소
버튼 구성이 단순해 홈 화면에서 재생바 활용도가 낮고, 서브 페이지 진입이 필수적이다.
3. 카드 그리드 크기
카드 height가 커 한 화면에서 다양한 콘텐츠를 보기 어렵다.
이는 콘텐츠 노출 감소로 이어져 광고 수익 및 콘텐츠 탐색 측면에서 아쉬움이 있다.
개선 방향
1. 사용자 목적 중심 구조 개선
홈 화면에 즉시 재생 가능한 영역 추가
사용자의 음악 취향 및 청취 이력을 기반으로 개인화된 추천 콘텐츠 노출 강화 (AI 활용)
2. 음악 재생바 개선
가수 이름 추가로 정보 명확화
좋아요, 이전 곡, 반복 등
자주 사용하는 버튼을 홈 화면에서도 활용 가능하게 확장
3. 카드 그리드 개선
카드 height 축소 → 정보 밀도 증가
더 많은 콘텐츠 노출로 사용자 탐색 경험 및 수익 구조 개선
이번 Apple Music 클론 디자인을 통해
사용자의 행동, 목적, 그리고 브랜드의 의도를 함께 고민하는 UX 사고의 중요성을 다시 느꼈습니다.
아자스!