📅 2026.06.11(목) - 39일차
- 인류가 직면한 AI의 기술적 지수 성장과 법 제도의 선형적 시차 공백을 메울 정책적 방향성을 고찰
- 이를 응용한 AI 네이티브 1세대의 커리어 전략을 수립
- WBS 수립법
- iTunes/YouTube API를 결합한 세대 통합형 오디오 프로덕트 '디토(Ditto)'의 PRD 및 Design Spec을 구체화
- 내가 만든 뮤직 플레이어 앱이다! 호호호
https://admirable-pastelito-3c2702.netlify.app/
1. 다리오 아모데이와 AI 지수성 정책론 (AI Safety) 관점 살펴보기
앤트로픽(Anthropic) CEO 다리오 아모데이(Dario Amodei)의 관점 살펴보기.
프린스턴에서 생물물리학 박사 -> 뇌! 관련!! -> LLM
생물물리학 신기하군~~~ 관련 책 :https://www.hellodd.com/news/articleView.html?idxno=106986
① 지수적 기술 성장 vs 선형적 제도 수립 (Exponential vs Linear)
- 지수적 기술 발전: AI 기술(예: 앤트로픽의 Claude 신규 모델군)은 어제와 오늘의 스펙이 24시간도 채 되지 않아 뒤바뀔 만큼 지수함수적($y = a^x$) 속도로 폭등. (오늘 내용만 해도, 채 24시간이 되지 않은 내용을 선생님이 정리해와주신 내용이다!)
- 선형적 제도 움직임: 사회적 합의, 개인정보 보호법, 저작권 가이드라인 등의 법적 제도는 구성원 간의 합의가 필요하므로 선형적($y = ax + b$)으로 완만하게 움직임.
- 💡 정책적 공백(Policy Gap) 발생: 이 두 그래프의 기울기 차이로 인해 극심한 법적·윤리적 공백 지대 발생. 큰 힘에는 큰 책임이 따르듯(With great power comes great responsibility), AI Safety는 단순한 경고문 삽입 수준이 아닌 '투명성(Transparency)' 강화를 통한 신뢰도 회복으로 해결해야 함. (신뢰도를 커버하기 위해서는 투명도를 높여야한다!) AI 모델 자체가 아니라, 이를 둘러싼 사회 시스템 재설계 필요.
② AI 네이티브 첫 세대의 커리어 전략
부트캠프 수료 후 현업 면접에서 "AI 발전으로 기획자/PM이 도태되는 것 아닌가?"라는 질문을 받았을 때 내가 할 수 있는 답변:
"현재 AI의 폭발적 발전이 기존 방식에 머물러 있는 현직자들을 위협하는 것은 사실입니다. 하지만 저는 새로운 AI 기술을 두려움 없이 수용하고 즉각 프로덕트에 이식할 수 있는 'AI 네이티브 첫 세대'입니다. AI 툴을 적극적으로 활용하여 업무 생산성을 극대화하고, 조직 내에서 기술을 비즈니스 가치로 치환할 수 있는 핵심 인재입니다."
2. WBS(Work Breakdown Structure) 수립 및 개발 프로세스
아이디어를 실제 배포 가능한 제품으로 만들기 위한 프로젝트 매니지먼트(PM)의 기본 흐름.
[PoC (개념 검증)] ➔ [PRD (요약/예외 정의)] ➔ [Design.md (스펙 자산화)] ➔ [Figma/Stitch 시각화] ➔ [Deployment (Netlify)] ➔ [Test Scenario 검증]
- WBS: 목적지까지 가기 위해 모든 할 일을 최소 단위로 쪼개고(Breakdown), 태스크 간의 선후 관계(Dependency, 의존성)를 파악하여 소요 시간 및 병목 리스크를 예측하는 도구.
- Jira 스토리 포인트: 작업의 절대적 일정(시간)이 아닌 복잡도와 위험도를 산정, 프로젝트 일정 드롭을 막기 위해 항상 Safety Buffer(안전 버퍼) 10~20%를 확보해야함.
3. 세대 통합 오디오 프로덕트 - '디토(Ditto)' 뮤직플레이어 만들기 실습해보기
proof of concept -> prd -> design md 만들기 순서로 진행함.
itunes API 사용하면 30초 무료듣기 제한없이 가능
Youtube Data API (GCP에서 YouTube Data API v3 검색해서 신청하고 key 받아두기 - API key 를 채팅에 넣으면 아니됨! / 프로그램에서 따로 물어보던가, 배포할 때 secret 넣는 것으로 하기)
모바일에 맞춰진 웹앱을 만든다고 생각하기
stitch에서 만들어서 ai 스튜디오로 전환해서 가능
stitch에서 만든거를 figma make에서 만드는 것도 가능
어느정도 아이디어 생기면 prd 만들기
① 제품 개요 및 문제 정의
- 기획 배경: '응답하라' 시리즈 OST처럼 시대를 풍미한 '원곡'과 트렌디하게 재해석된 '리메이크 곡'의 대치 구조를 활용하여 세대 통합과 아날로그 감성을 자극하는 경험 제공.
- 핵심 가치: 하나의 재생목록 안에서 원곡 감성과 리메이크 감성을 손가락 터치 한 번으로 오가며 들을 수 있는 모바일 웹앱 기반의 감성 오디오 플레이어.
② 3대 핵심 기능 스펙 (Core Features)
- 타임 셔틀 (Time Shuttle) 토글 버튼
- 기능: 플레이어 하단 슬라이더나 토글을 조작해 '원곡(예: 1997년 쿨)'과 '리메이크(예: 2012년 서인국&정은지)' 버전을 실시간 스왑.
- UX 핵심: 리메이크 곡을 듣다가 버튼을 누르면, 재생 위치(싱크 타임스탬프)를 최대한 유지한 채 원곡의 유튜브 음원으로 부드럽게 크로스페이드(Crossfade) 전환 제어.
- iTunes API 기반의 듀얼 메타데이터 매칭
- 기능: 리메이크 곡 정보(예: 성시경 - 너에게) 검색 시, iTunes API를 통해 원곡 정보(서태지와 아이들 - 너에게)를 역추적하여 30초 무료 듣기 제한 없이 두 세대의 앨범 아트, 발매 연도 데이터를 가져와 대조 화면 구성.
- 유튜브 듀얼 스트리밍 및 백그라운드 제어
- 기능: 웹앱 내부에서 원곡과 리메이크곡의 유튜브 오디오 소스 2개를 동시 로드(Dual Buffering). 유저 탭 인터랙션에 따라 실시간으로 각 소스의 볼륨을 교차 제어(Mute / Unmute)하여 끊김 없는 스트리밍 구현.
③ 기획자가 반드시 챙겨야 할 Edge Case (예외 상황)
- 원곡과 리메이크곡의 전체 재생 길이(Duration)가 달라 타임 셔틀 토글 시 싱크 계산 오류가 발생하는 경우 (➔ 곡의 진행률 % 단위로 환산하여 매핑하는 예외 정책 수립 필수).
- GCP YouTube Data API v3 호출 제한(Quota) 초과 리스크 및 API Key 노출 보안 (➔ 클라이언트 코드 내 하드코딩 절대 금지, 배포 시 Netlify 환경변수 Secret Key로 관리).
- 곡의 커버 이미지가 없는 경우에는 어떻게 할 지?
+ 추가로 생각해볼 것
// 제일 처음 자동 재생되는 곡을 원곡으로 할 지, 리메이크곡으로 할 지 결정 (혹은 설정 기능으로 추가할 지)
// 새로운 곳 검색할 때 어떻게 할지
4. [Design.md] 디토(Ditto) — Music App Design Spec
Figma Make나 Stitch 등의 AI 디자인 프로토타이핑 툴과 프론트엔드 개발자가 싱크를 맞출 수 있도록 문서화한 디자인 시스템.
① Overview & Layout 시스템
- 앱 이름 / 플랫폼: 디토 (Ditto.) / Mobile Web App
- 캔버스 스펙: 390 × 985px (모바일 타겟 고정 해상도)
- 간격 가이드: 화면 좌우 패딩 16px, 컴포넌트 수직 간격 16px, 하단 네비게이션 높이 64px, 상단 헤더 높이 52px.
- 비주얼 무드: 레트로-모던 하이브리드 (Warm, Analog-Digital Fusion). 민트 그린 배경으로 아날로그의 따뜻함을 주되, 오렌지 강조색으로 엣지 부여.
② 핵심 UI 컴포넌트 명세
+------------------------------------------+ -> Header (디토. / ⚙️)
| [DISCOVERY MODE] | -> Discovery Mode Badge (Pill)
| |
| +--------+ |
| | | |
| | Art | | -> Album Art Card (200x200px)
| | | |
| +--------+ |
| 성시경 <너에게> | -> Song Info (Center)
| |
| ========●--------------- | -> Progress Bar (Track 4px, Fill)
| 01:23 03:45 |
| |
| ← ▶ PLAY → | -> Playback Controls (Play 56px)
| SIGNAL POWER |
| |
| [ORIGINAL 1993] ---○--- [SELECTED 2013] | -> Year Selector (Time Slider)
| |
| [RETRO] | [GRID] | [MODERN] | -> View Mode Toggle
+------------------------------------------+
| Home | Search | Library | -> Bottom Navigation Bar (64px)
+------------------------------------------+
- Discovery Mode Badge: 우상단에 위치한 Pill 형태의 오렌지색(#F5793A) 강조 라벨.
- Playback Controls & SIGNAL POWER: 재생/이전/다음 버튼 배치 영역으로, 하단에 모노스페이스 스타일의 SIGNAL POWER 캡션을 달아 아날로그 계기판 감성 연출.
- Year Selector: 좌측 원곡 연도(베이지)와 우측 리메이크 연도(오렌지) 사이를 수평 타임라인 슬라이더로 조작하는 디토의 시그니처 인터랙션 컴포넌트.
 |
 |
5. QA 및 사용자 검증 단계 (Test Scenario)
Claude 페블스(Pebbles) 모델을 활용해봄. Claude에는 별도 배포 기능 없으므로 Netlify 배포를 마치면 링크가 생성됨! 이후에 제품의 신뢰성을 확보하기 위해 스프레드시트 기반의 기능별 테스트 시나리오 제작해서 달성 기준을 체크
- 핵심 테스트 과업:
- 1. 재생 중 타임 셔틀 슬라이더 작동 시 음원 오버랩이나 끊김(Buffering) 없이 크로스페이드가 정상 작동하는가?
- 2. 국내 리메이크 곡 검색 시 iTunes API가 매칭되는 해외/국내 원곡 메타데이터를 누락 없이 정확히 매핑해 오는가?
- 3. 백그라운드 환경이나 디바이스 홀드 상태에서 유튜브 오디오 제어 API가 가로채기(Mute 정책)를 정상 준수하는가?
'ditto (세대 공감 오디오 플레이어) PRD:
| No. | 항목 | 세부항목 | 질문 | 내용 |
| 1 | 제품 개요 | 문제 정의 | 이 프로젝트가 해결하려는 주요 문제점은 무엇인가? | - 기존 음악 앱들은 신곡이나 유행하는 플레이리스트 중심이어서 과거 원곡과 최신 리메이크곡이 파편화되어 있음 - 원곡을 그리워하는 5060 세대와 리메이크로 명곡을 접하는 2030 세대 간의 음악적 공감대와 소통 채널이 부재함 - 재생 중 원곡과 리메이크곡을 번갈아 듣고 싶을 때 매번 새로 검색하고 재생 위치를 맞춰야 하는 UX적 번거로움이 존재함 |
| 1-1 | 제품 개요 | 목표 정의 | 최종적으로 달성하고자 하는 비즈니스 목표는 무엇인가? | - 세대 통합형 오디오 플랫폼으로서 독점적인 UI/UX 포지셔닝 확보 - 음원 플랫폼(Spotify, 멜론 등)의 인앱 플러그인 확장 또는 독립 앱으로서의 유료 구독 모델(광고 제거, 고음질 듀얼 스트리밍) 구축 - 향후 음악 기반의 세대 공감 커뮤니티로 확장하여 유저 체류 시간 극대화 |
| 1-2 | 제품 개요 | 차별화 포인트 | 현재 유사한 서비스나 시스템이 있다면 우리의 차별점은 무엇인가? | - 단순히 한 곡의 여러버전을 리스트에 모아두는 것을 넘어, '타임 셔틀' 토글 버튼 하나로 재생 구간(싱크)을 유지한 채 원곡과 리메이크곡들을 심리스하게 오가는 최초의 하이브리드 플레이어 기능 제공 - 음원 전환 시 오디오가 엉키지 않도록 자연스러운 크로스페이드(Crossfade) 연출 적용 - 토글 상태에 따라 앱 전체의 UI 테마가 Y2K 레트로 스타일과 현대적 미니멀 스타일로 실시간 스위칭되는 디바이스 테마 제어 - 예시리스트 추가 |
| 1-3 | 제품 개요 | 트렌드 반영 | 현재 시장에서의 트렌드나 사용자의 기대치를 반영했는가? | - 뉴트로(New-tro) 및 Y2K 감성의 지속적인 유행 반영 - '응답하라' 시리즈, '싱어게인' 등 과거 명곡의 재해석 콘텐츠에 대한 전 세대적 높은 수요와 취향 맞춤형 오디오 큐레이션 기대치 충족 |
| 2 | 사용자 정의 | 타겟 사용자 | 주요 타겟 사용자는 누구인가? | - 2030 세대: 레트로/Y2K 감성을 힙하게 여겨 옛날 명곡을 찾아듣고, 트렌디한 리메이크 곡과 원곡의 매력을 동시에 소비하고 싶은 유저 |
| 2-1 | 사용자 정의 | 사용자 시나리오 | 사용자가 이 시스템을 사용할 주요 상황과 시나리오는 무엇인가? | - 앱 진입: 유저가 앱을 실행하여 'ditto 추천 타임슬립 셔틀 목록(예: 응답하라 수록곡 셋)'을 확인하고 트랙을 선택함 - 재생 및 토글: 기본 설정된 리메이크 버전(예: 성시경 - 너에게 2003)을 듣다가 화면 하단의 '타임 셔틀' 토글을 '원곡(서태지와 아이들 - 너에게 1993)'으로 전환함 - 감성 전환 경험: 앱 UI가 90년대 아날로그 카세트테이프 스킨으로 휙 바뀌면서, 듣고 있던 구간 정보를 유지한 채 서태지와 아이들의 원곡 음원이 크로스페이드되며 흘러나옴 |
| 2-2 | 사용자 정의 | 가치 정의 | 사용자에게 가장 중요한 가치(속도, 정확성, 편리성) | - 감성 및 연결(Emotion & Connection): 기술적 완벽함을 넘어 음악을 통해 유저가 과거와 현재를 넘나들며 느끼는 반전의 재미와 정서적 충족감 - 심리스한 사용성(Seamless UX): 토글 한 번으로 끊김 없이 음원과 비주얼 테마가 바뀌는 매끄러운 흐름 |
| 3 | 기능 정의 | 필수 기능 | 시스템에서 꼭 있어야 하는 필수 기능은 무엇인가? | - 앱 이름은 좌상단에 배치: 'ditto - 타임 셔틀(Time Shuttle) 오디오 제어: 토글 버튼 입력 시 [현재 재생 시간 저장 -> 기존 곡 일시정지 -> 새 음원 해당 시간대 이동(seekTo) -> 재생] 파이프라인 - 오디오 크로스페이드 효과: 전환 시 기존 음원은 페이드아웃, 새 음원은 페이드인 처리 - 듀얼 UI 스킨 실시간 전환: 원곡 모드(Y2K/LP/카세트테이프 테마) 및 리메이크 모드(글래스모피즘/미니멀 테마) 분기 UI - 이원화된 곡 메타데이터 노출: 한 화면에 두 세대의 앨범 아트, 아티스트명, 발매 연도를 대치하여 시각화 (iTunes API 연동) - 유튜브 오디오 소스 검색 및 매칭: 키워드 최적화 규칙(`곡명+가수명+Official Audio/Topic`)을 통한 유튜브 플레이어 바인딩 |
| 3-1 | 기능 정의 | 선택 기능 | 시스템에서 꼭 필요한 기능은 아니지만 있으면 좋을 것 같은 기능은? | - 나의 재생목록 리모델링: 로컬 MP3 파일 오디오 태그를 읽어와 유튜브에서 자동으로 리메이크 버전을 찾아 매칭해주는 기능 - 세대 공감 스플릿 댓글창: 원곡 모드와 리메이크 모드별로 댓글 창이 분리되거나 좌우 스플릿 형태로 제공되어 세대 간 소통 유도 |
| 3-2 | 기능 정의 | 기능 우선순위 | 기능의 우선순위를 어떻게 설정할 것인가? | - P0 (MVP/PoC 필수): 타임 셔틀 토글, 초 단위 시간 기억 및 오디오 전환 로직, 듀얼 테마 스킨 분기, PoC 전용 추천 트랙 10쌍 수동 데이터셋 구축 - P1 (고도화/제품화): iTunes 및 YouTube API 동적 매칭 알고리즘, 구간(Section) 매칭 고도화, 유저 커스텀 셔틀 트랙 등록 및 플레이리스트 공유 기능 |
| 4 | 데이터 및 기술 정의 | 데이터 수집 | 이 시스템에서 수집할 데이터는 무엇인가? | - 곡 기본 메타데이터: 곡 제목, 아티스트명, 발매 연도, 앨범 아트워크 URL (iTunes Search API) - 오디오 소스 데이터: 매칭된 원곡 및 리메이크곡의 YouTube 동영상 ID 및 스트리밍 URL (YouTube Data API v3) - PoC 검증 데이터: 추천 트랙 고유 식별값 및 매칭 테이블 데이터 |
| 4-1 | 데이터 및 기술 정의 | 데이터 처리 | 데이터를 처리하는 방식은 어떻게 되는가? | - 유저가 곡을 선택하거나 검색 시, 배후에서 두 곡의 메타데이터를 매칭하여 결합된 '하이브리드 트랙 데이터' 모델 생성 - 토글 이벤트 핸들링: 클라이언트 단에서 밀리초(ms) 단위의 재생 타임스탬프를 실시간 추적하고 전환 명령 시 파라미터로 전달 처리 |
| 4-2 | 데이터 및 기술 정의 | 적용 기술 | 시스템에서 사용할 기술은 어떤 것인가? | - 메타데이터 및 소스 검색: iTunes Search API, YouTube Data API v3 - 오디오 플레이어 엔진: YouTube IFrame Player API 또는 모바일 네이티브 YouTube SDK - 프론트엔드/테마 제어: 상태 관리 라이브러리 기반의 실시간 다이나믹 테마 스위칭 아키텍처 |
| 4-3 | 데이터 및 기술 정의 | 제약 사항 | 시스템이 작동하기 위해 필요한 기술적 제약 사항은 무엇인가? | - 모바일 OS(iOS/Android) 정책상 백그라운드에서의 유튜브 멀티/듀얼 스트리밍 재생 제약 (PoC 단계에서는 포그라운드 인앱 재생으로 제약 극복) - 두 음원의 원천적인 구조 차이(BPM, 인트로 길이 등)로 인한 절대 시간 싱크 오차 발생 가능성 존재 |
| 5 | 사용자 경험(UX/UI) | 핵심 화면 구성 | 사용자가 이 시스템과 상호작용할 주요 화면이나 인터페이스는 무엇인가? | - 1. 메인 대시보드 및 추천 목록: ditto가 큐레이션한 세대 공감 타임슬립 플레이리스트 카드 뷰 화면 - 2. 하이브리드 플레이어 화면: * 상단: 원곡 vs 리메이크 메타데이터가 하프 스플릿된 레이아웃 * 중앙: 현재 모드에 동기화된 메인 앨범 아트워크 및 스킨 (LP/카세트 vs 글래스모피즘) * 하단: 재생/일시정지 컨트롤러 및 가장 강조된 '타임 셔틀' 토글 스위치 셔틀 버튼 |
| 5-1 | 사용자 경험(UX/UI) | 사용성 차별화 | 사용성을 높이기 위한 UI/UX 요소는 무엇인가? | - 시각적 타임슬립 효과: 토글 시 화면 전체가 비디오 테이프 감기듯 지직거리는(Glitch) 효과 애니메이션 연출 - 원클릭 셔틀 피드백: 토글 버튼을 조작할 때 디바이스의 촉각(Haptic) 피드백을 주어 손맛 극대화 |
| 5-2 | 사용자 경험(UX/UI) | 오류 처리 | 예상되는 오류 상황과 처리 방법은? | - API 검색 실패 또는 잘못된 음원 매칭 시: 유저가 직접 유튜브 URL을 제보하거나 교체할 수 있는 '셔틀 링크 수정 요청' 링크 팝업 제공 - 네트워크 지연으로 인한 전환 버퍼링 발생 시: 재생 시간 싱크가 어긋나지 않도록 새 음원의 로딩(`BUFFERING`) 완료 상태를 확인한 후 구 음원을 Pause하고 새 음원을 Unmute/Play 처리하는 안전 락(Lock) 로직 적용 |
| 6 | 성과 측정과 성공기준 | 지표 설정 | 프로젝트 성공 여부를 판단할 주요 지표(KPI)는 무엇인가? | - 인당 평균 '타임 셔틀' 토글 버튼 클릭 횟수 (Target: 곡당 평균 3회 이상 - 인터랙션 재미 요소 검증) - 추천 트랙 10곡의 스트리밍 완청률(Completion Rate) 및 앱 재방문율(Retention) - 토글 전환 시 발생하는 버퍼링 대기 시간의 평균 값 (Target: 0.8초 이하) |
Design md: 디토 (Ditto) — Music App Design Spec
Overview
앱 이름: 디토 (Ditto)
화면: Home / Player
플랫폼: Mobile (iOS / Android)
캔버스 크기: 390 × 985px
Color Palette
Typography
Spacing & Layout
- 화면 좌우 패딩: `16px`
- 컴포넌트 간 수직 간격: `16px`
- 카드 내부 패딩: `16px`
- 하단 탭 높이: `64px`
- 상단 헤더 높이: `52px`
Components
1. Header
- 좌: 앱 로고 "디토." (텍스트, `color-text-primary`)
- 우: 설정 아이콘 (⚙️ 아웃라인)
- 배경: `color-bg-primary`
2. Discovery Mode Badge
- 레이블: "DISCOVERY MODE" (대문자)
- 배경: `color-accent` (#F5793A)
- 텍스트: 흰색, 11px, uppercase
- 모양: Pill shape (border-radius: 20px)
- 정렬: 우측 정렬 (카드 우상단)
3. Album Art Card
- 크기: ~200 × 200px
- 모서리: border-radius `12px`
- 내부 이미지 + 텍스트 오버레이 가능
- 배경: `color-card-bg`
4. Song Info
- 제목 (`text-song-title`): "성시경 〈너에게〉"
- 부제 (`text-song-subtitle`): "응답하라 1994 OST PART 2"
- 정렬: 가운데 정렬
5. Progress Bar
- 트랙 높이: `4px`, 배경 `color-progress-track`
- 필 색상: `color-progress-fill`
- 양 끝 시간 표시: 좌 (경과), 우 (총 길이)
- 썸 노브: 원형, `color-accent`, 지름 `12px`
6. Playback Controls
- 구성: PREV ← | ▶ PLAY | → NEXT
- Play 버튼: 56px 원형, `color-accent` 배경, 흰색 ▶
- Prev / Next: 40px 원형, `color-card-bg`
- 레이블: "SIGNAL POWER" — 중앙 하단 캡션
7. Year Selector
- 좌: "ORIGINAL" + 연도 "1993" (베이지)
- 우: "SELECTED" + 연도 "2013" (오렌지)
- 중앙: 수평 타임라인 슬라이더
8. View Mode Toggle (RETRO / MODERN)
- 구성: `RETRO` | 그리드 아이콘 | `MODERN`
- 활성: 오렌지 강조, 기본 선택: 그리드 아이콘
- 배경: `color-card-bg`
9. FAB (Floating Action Button)
- 아이콘: `+`, 색상: `color-accent`, 크기: 48px 원형
- 위치: 우하단, 하단 탭 위 `16px`
10. Bottom Navigation Bar
- 탭: Home | Search | Library
- 활성: `color-accent` / 비활성: 흰색/회색
- 높이: `64px`, 좌우 패딩: `24px`, 배경: `color-nav-bg`
Visual Mood & Style
- 무드: 레트로-모던 하이브리드
- 키워드: Nostalgic, Warm, Analog-Digital Fusion
- 민트 그린 배경으로 따뜻하고 편안한 느낌
- 오렌지 강조색으로 에너지감 부여
- 다크 카드 패널로 콘텐츠 계층 구분
- 대문자 라벨과 모노스페이스 타임 표시로 레트로 감성 강조
Interaction Notes
- Discovery Mode: 새로운 음악 탐색 모드. 배지로 상태 표시.
- Year Slider: 1993 ↔ 2013 드래그로 버전 전환. 디토의 핵심 UX.
- RETRO / MODERN 토글: 그리드 vs 리스트 뷰 모드 전환.
- SIGNAL POWER: 재생 컨트롤 영역의 강조 레이블.
 stitch & figma 사용 |
 ai 스튜디오 활용 |
뮤직 플레이어 앱 ditto 테스트 시나리오