{3줄 요약}

프로토타입은 아이디어가 실제로 통하는지 빠르고 저렴하게 확인하는 도구예요.
완성도보다 학습이 목적이라서 빨리 만들어 보고 빨리 틀려 보는 편이 유리해요.
프로토타입을 알면 개발 전에 구조와 흐름을 검증해 큰 수정 비용을 줄여요.

프로토타입 없이 설계하면 생기는 일

기획서와 와이어프레임이 아무리 잘 만들어져도, 실제로 클릭해보기 전에는 모르는 것들이 있어요.

화면 전환이 자연스러운지, 버튼을 눌렀을 때 어디로 가야 할지 직관적으로 아는지, 입력 흐름이 막히지 않는지 — 이것들은 "움직이는 것"을 봐야 알 수 있어요.

실제 사례예요.
카카오페이 팀이 새로운 이체 흐름을 설계했어요.
와이어프레임에서는 논리적으로 보였어요.
하지만 클릭 가능한 프로토타입을 만들어서 내부 팀원들에게 테스트했더니, 두 번째 단계에서 "다음 버튼"을 찾지 못하는 사람이 절반이었어요.
화면 아래에 있어서 스크롤이 필요한데, 아무도 스크롤이 있다는 것을 몰랐어요.
와이어프레임에서는 전혀 보이지 않던 문제였어요.

이 원칙을 무시하면: 개발이 완료된 후 같은 문제를 발견해요.
그러면 "어떻게 할까요?"를 처음부터 다시 결정해야 해요.
비용은 이미 발생했고요.

프로토타입의 충실도를 목적에 맞게 정하는 법

프로토타입도 와이어프레임처럼 충실도를 조절할 수 있어요.

Paper Prototype (종이 프로토타입)

종이에 화면을 그리고, 사용자 앞에서 직접 "버튼"을 들었다 놨다 하는 방법이에요. 듣기엔 원시적으로 느껴지지만, 초기 개념 검증에서 매우 강력해요.

IDEO가 쇼핑카트를 재설계할 때 첫 검증은 종이 스케치로 시작했어요.
하루 만에 10개 이상의 방향을 탐색했어요.

쓸 때: 여러 방향 중 어떤 흐름이 맞는지 빠르게 확인할 때.

Click-through Prototype (클릭 가능 목업)

Figma나 InVision으로 화면을 연결해서 클릭하면 다음 화면이 나오게 만드는 방법이에요. 실제 데이터는 없지만 흐름을 경험할 수 있어요.

쓸 때: 내비게이션 흐름, 폼 입력 과정, 온보딩 경험을 검증할 때. 사용성 테스트에서 가장 많이 쓰여요.

Coded Prototype (코드 프로토타입)

실제 코드로 만든 프로토타입이에요. 애니메이션, 인터랙션 타이밍, 퍼포먼스를 확인할 수 있어요.

쓸 때: 기술적 가능성을 검증해야 할 때, 또는 실제 느낌이 결정에 중요한 인터랙션일 때.

좋은 프로토타입의 세 가지 원칙

1. 가설을 먼저 정해요

"이 프로토타입으로 무엇을 확인할 것인가"가 없으면, 만들기는 했는데 배우는 게 없어요.

좋은 가설 예시:

  • "사용자가 온보딩 3단계에서 아무 도움 없이 첫 기능을 완료할 수 있을 것이다"
  • "결제 화면에서 배송비 위치가 전환율에 영향을 줄 것이다"

가설이 있으면 테스트 후 "맞았다/틀렸다"를 판단할 수 있어요.

2. 진짜 콘텐츠를 써요

"Lorem ipsum"이나 "상품명"처럼 임시 텍스트를 쓰면, 실제 콘텐츠가 들어왔을 때 레이아웃이 어떻게 달라지는지 알 수 없어요.
가능한 한 실제처럼 느껴지는 콘텐츠를 써야 의미 있는 피드백이 나와요.

3. 테스트하는 부분만 완성도를 높여요

프로토타입 전체를 완성하려 하지 마세요.
검증하려는 특정 흐름이나 화면만 클릭 가능하게 만들어도 충분해요.
나머지는 정적 화면이어도 돼요.

프로토타입이 특히 필요한 상황

A/B 선택이 어려울 때: 두 방향 중 어느 것이 더 나은지 팀 내에서 의견이 갈릴 때, 각각을 프로토타입으로 만들어서 실제 사용자에게 보여줘요.

새로운 인터랙션 패턴을 도입할 때: 스와이프로 삭제, 오래 눌러 메뉴 표시처럼 익숙하지 않은 제스처를 도입할 때는 반드시 프로토타입으로 검증해요.

이해관계자 승인이 필요할 때: 문서보다 클릭 가능한 프로토타입이 "이게 이렇게 작동해요"를 훨씬 빠르게 전달해요.

이 원칙을 적용할 때 스스로에게 물어보세요

  • 이 프로토타입으로 검증하려는 가설이 명확한가요?
  • 충실도가 가설 검증에 적합한 수준인가요? (너무 높거나 낮지 않은지)
  • 실제 사용자에게 보여줬나요, 아니면 팀 내부에서만 봤나요?
  • 프로토타입 결과가 실제 설계 결정에 반영됐나요?

관련 아티클

참고 문헌

  • Jake Knapp, 《Sprint》(2016) - 5일 안에 프로토타입을 만들고 검증하는 방법론이에요. "Friday Prototype" 접근이 핵심이에요.
  • Jaime Levy, 《UX Strategy》(2021) - 전략적 프로토타이핑과 가장 빠른 학습 방법을 다뤄요.