AI 분석
지식 소스를 하나씩 연결하며 아이소메트릭 일러스트와 상태 배지가 함께 바뀌는 패널 UI다.
사선 패턴 배경 중앙에 떠 있는 모달형 패널이 헤더, 일러스트와 빈 상태 영역, 소스 목록, 상태 푸터의 네 층으로 구성된다. 연회색 바탕에 흰 카드를 겹치고, 산세리프 본문과 고정폭 대문자 메타 정보로 위계를 나눈다. 소스를 연결할 때마다 아이소메트릭 서버 일러스트에 청록·자홍 연결선이 그려지고, 버튼이 녹색 CONNECTED 배지나 주황 SYNCING 배지와 점선 진행 바로 바뀌며 하단 토스트가 결과를 알린다. 빈 상태에서 준비 완료까지 이어지는 상태 전환과 마이크로 인터랙션을 설계할 때 참고하기 좋다.
minimal · light-mode · techy
claude-opus-5-5 · 2026-10-16 05:53 · 신뢰도 0.80