소프트웨어 제품을 운영하시나요? 무료로 등록하세요. 담당자가 읽어 보고 하루 안에 공개합니다.제품을 운영하시나요? 무료로 등록하세요.

제품 등록
제품 등록

프로토타이핑

코드를 쓰기 전에 만들어 보는 클릭 가능한 목업.

프로토타이핑

이 카테고리에는 아직 제품이 없습니다

아직 등록된 제품이 없습니다. 이 선반에 어울리는 제품을 만들고 계시다면 등록해 주세요. 담당자가 읽어 보겠습니다.

제품 등록

이 카테고리가 다루는 범위

누가 만들기 전에 클릭해 볼 수 있는 것을 만드는 일입니다. 인터랙티브 목업, 상태 변화, 사람들이 직접 해 볼 수 있는 흐름, 의견을 관찰로 바꿔 주는 테스트가 여기에 들어갑니다.

디자인 소프트웨어와 겹치는 부분이 큽니다. 대부분의 디자인 플랫폼이 이제 프로토타이핑을 포함하기 때문입니다. 인터랙션에 실제 로직이 담기거나 리서치에 녹화와 분석이 붙어야 하는 경우를 위한 전용 도구가 따로 있습니다.

화면 디자인과 디자인 시스템은 디자인에 있습니다. 코드 없이 애플리케이션 전체를 만드는 일은 노코드·자동화에 속합니다.

충실도는 기본값이 아니라 결정입니다

이 카테고리에서 가장 흔한 낭비는 회색 상자로 해결될 질문에 답하려고 아름다운 프로토타입을 만드는 일입니다.

낮은 충실도는 구조를 테스트합니다. 사람들이 흐름을 이해하는지, 다음에 무엇을 기대하는지, 어디서 망설이는지입니다. 빠르고 저렴하며 과투자하기가 거의 불가능합니다.

높은 충실도는 이해도와 확신을 테스트합니다. 완성도는 행동을 바꾸며, 거친 화면은 실제 제품에는 하지 않을 너그러움을 사람들에게 불러일으키므로 신뢰나 구매에 관한 것은 완성된 모습이어야 합니다.

먼저 질문을 정하고, 그다음 충실도를 고르세요. 거꾸로 하면 아무도 묻지 않은 애니메이션에 3주가 사라집니다.

도구를 가르는 것

  • 인터랙션 깊이: 단순한 링크부터 조건과 변수까지.
  • 상태: 방금 입력한 내용을 화면이 기억하도록.
  • 컴포넌트: 작업을 중복하지 않고 여러 화면에서 재사용.
  • 데이터: 어디에나 같은 자리표시자가 아닌 실제 또는 현실적인 데이터.
  • 기기 테스트: 축소된 프레임이 아니라 실제 휴대폰에서.

변수와 조건이 경계선입니다. 폼 입력을 담고, 그에 따라 분기하고, 선택을 기억하고, 진짜 오류 상태를 보여 줄 수 있는 프로토타입은 화면을 링크로 잇는 방식으로는 답할 수 없는 질문에 답합니다.

현실적인 콘텐츠는 생각보다 더 중요합니다. 긴 이름, 빈 목록, 없는 이미지, 오류 메시지에서 디자인이 깨지는데, 자리표시자 텍스트는 그 모두를 가립니다.

테스트, 이것이 진짜 목적입니다

프로토타입은 그 자리에 없던 사람에게 보여 주려고 존재합니다.

진행자가 있는 세션은 이유를 알려 줍니다. 사람이 왜 망설였는지, 단어를 무슨 뜻으로 받아들였는지입니다. 진행자 없는 테스트는 후속 질문 없이 더 낮은 비용으로 대규모 행동을 알려 줍니다. 둘 다 목소리 큰 의견이 이기는 검토 회의보다 낫습니다.

대상 그룹당 다섯 명이면 대부분의 사용성 문제를 찾습니다. 그 뒤로는 효과가 급격히 떨어지므로, 찾은 것을 고치고 다시 테스트하는 데 시간을 쓰는 편이 낫습니다.

누구를 모집하기 전에 과제를 먼저 작성하세요. 특정한 일을 해 보는 모습을 지켜보는 것은 증거이고, 화면에 대한 의견을 묻는 것은 취향에 관한 대화입니다.

프로토타입에서 개발로

인계에서 묻는 것은 무엇이 남는가입니다.

프로토타입을 명세서로 다루는 팀도 있습니다. 구현 중에 논쟁이 될 모든 상태, 전환, 빈 경우, 예외 상황의 기록입니다. 가치의 대부분이 거기 있습니다.

생성된 코드가 나아졌지만 실서비스에는 여전히 다시 써야 합니다. 어떤 내보내기든 지름길이 아니라 출발점이 되는 스케치로 다루고, 특히 성능과 접근성에서 프로토타입이 마주하지 않은 질문을 실제 구현이 제기할 것으로 예상하세요.

비용과 현실적인 제약

요금은 편집자당 월 단위이며 열람자는 대개 무료이고, 전용 리서치 플랫폼은 대신 연구당 또는 참가자당 과금합니다.

더 큰 비용은 시간입니다. 만드는 데 2주가 걸린 프로토타입은 그것이 대체한 회의보다 더 큰 비용이 들었으므로, 범위를 질문에 맞춰 두세요. 테스트 서비스는 참가자당 요금이 붙고 모집이 포함되기도 하며, 추측하는 것에 비하면 대개 잘 쓴 돈입니다. 소프트웨어 전반의 요금 습관은 요금 페이지가 숨기는 것에 설명되어 있습니다.

프로토타입이 값을 하는 곳

세 가지 상황에서는 만드는 수고가 확실히 보답합니다.

실제로 복잡한 흐름입니다. 글로 된 설명이 머릿속마다 다른 그림을 만들고, 그 불일치가 구현 중에야 드러나는 경우입니다.

돈이 걸린 결정입니다. 결제 화면, 요금 페이지, 가입 경로를 누구도 만들기 전에 실제 사람들과 테스트할 수 있습니다.

사내외 제안입니다. 작동하는 것을 보여 주면 대화가 의견에서 세부 사항으로 바뀝니다.

그 밖에는 잘 쓴 설명과 정적인 화면 하나가 일을 해내는 경우가 많습니다. 지킬 만한 원칙은 프로토타입이 어떤 질문에 답하는지 묻고, 파일에서 작업하는 것이 즐겁다고 계속하지 말고 답이 나오는 즉시 멈추는 것입니다.

자주 묻는 질문

프로토타입은 디자인 파일과 다른가요?

프로토타입은 동작합니다. 탭에 반응하고, 상태가 바뀌고, 화면 사이에서 데이터를 유지하며, 처음 보는 사람과 테스트할 수 있습니다. 디자인 파일은 어떻게 보여야 하는지를 설명합니다.

프로토타입은 어느 정도의 충실도가 필요한가요?

던진 질문에 답할 수 있을 만큼이면 충분하고 그 이상은 필요 없습니다. 구조 테스트는 회색 상자로도 됩니다. 이해도와 신뢰는 실제에 가까운 모습이 필요합니다. 완성도가 사람들의 반응을 바꾸기 때문입니다.

프로토타입을 원격으로 테스트할 수 있나요?

네, 통화로 진행자가 함께하거나 세션을 녹화하는 테스트 서비스를 통해 진행자 없이 할 수 있습니다. 진행자 없는 방식은 더 저렴하고 행동은 보여 주지만 그 뒤의 이유는 알려 주지 않습니다.

프로토타입은 몇 명이 테스트해야 하나요?

대상 그룹당 다섯 명이면 대부분의 사용성 문제를 찾습니다. 그 이상은 발견이 아니라 확인에 가깝고, 그 시간은 처음 다섯 명이 찾은 것을 고치는 데 쓰는 편이 낫습니다.

프로토타입이 코드가 되나요?

생성된 결과물이 나아졌지만 실제 서비스에는 여전히 다시 써야 합니다. 프로토타입은 구현의 선행 작업이 아니라 모호함을 없애 주는 명세서로 보세요.