AI 분석
세로 4단계 스테퍼의 활성 표시가 이동할 때마다 왼쪽 프리뷰 카드가 해당 단계 화면으로 바뀌는 인터랙션이다.
밝은 회색 배경 위에 큰 2줄 헤드라인을 두고, 아래를 왼쪽 정사각 프리뷰 카드와 오른쪽 4단계 세로 스테퍼로 나눈 스플릿 레이아웃이다. 헤드라인은 굵은 산세리프에서 핵심 단어만 검정, 나머지는 연회색으로 칠해 위계를 만들고, 스텝 역시 진한 제목과 회색 설명의 두 단으로 정리했다. 각 스텝 왼쪽의 얇은 회색 레일 안에서 검정 인디케이터가 채워지며 진행을 보여주고, 그에 맞춰 프리뷰가 스타일 썸네일 3×3 그리드, 스타일 칩과 복사 버튼, 색 토큰 입력 패널, 완성된 돈 저금통 3D 아이콘 순으로 전환된다. 단계 설명과 시각 결과를 한 화면에서 동기화하는 온보딩·기능 소개 섹션 레퍼런스로 유용하다.
minimal · light-mode · playful
claude-opus-5-5 · 2026-10-16 17:52 · 신뢰도 0.75
