본문으로

Prototyping · 온라인

클릭able 프로토: 상태도표로 덜 빠지기

빈 상태/로딩/성공/에러/권한부족… 상태도표 먼저, 그다음 클릭 흐름. 심사 면접용 데모도 맞춥니다.

형광 하이라이트로 표시한 여정 맵
가격(참고) ₩890,000 · 발급
기간 5주, 주 1회 100분 + 과제 5h
난이도 중급 · 월·수 저녁

본문

기능 플로우에 숨은 “상태”를 먼저 캔버스에 그립니다. 프로토타이핑 도구(피그마)만으로 끝내는 대신, 스토리보드 1장을 함께 제출하도록 합니다. 수료 후 1:1 “데모 8분” 리허설 슬롯이 1회(선택) 있습니다.

다루는 것

  • 상태도표 템플릿(5열)
  • 에러/권한/빈 상태 카피 가이드
  • 8분 데모 대본 + 타이밍
  • 접근성(포커스 링) 옵션

이후(개인/팀·체감)

  1. 1플로에 대한 상태도표+프로토
  2. 팀이 고르는 "데모 슬라이드" 1장
김도윤 프로필

김도윤

UX 멘토, B2C 핀/커머스 프로토 8년.

썸네일: 수업 담당(역할)입니다. 프로필 사진은 생성형 아이콘(외부)입니다.

읽기(경험 중심)

상태도표 먼저 쓰니까 8분 데모가 안 흐트러졌어요. “빈 상태 문구”만 다시 쓰자는 피드백이 꽤 박스 안이었죠.

— 하림 , 취준 · 4.3/5(표기) · 내부 설문

일정이 빡빡한 주가 있어 과제는 밀렸는데, “최소 3상태”로 줄이는 멘트가 정직했습니다.

— 익명 · survey

자주 묻는

왜 스토리보드가 있나요?

팀/면접관이 “맥락”을 보게 하려는 장치이며, 없어도 수료는 가능하나 루브릭에 반영됩니다.

프린시플/프로토 사용은?

이 과정은 피그마 기준, 다른 툴은 병행은 가능·멘토링은 제한.