시제품을 진짜처럼 만든다

선만 그린 도면은 네모로 쓴 논설이다. 배치는 설명할 수 있고 흐름도 암시할 수 있다. 그러나 결정하는 사람이 정말 알고 싶은 단 하나의 물음, 쓰면 어떤 느낌인가에는 답하지 못한다. 그래서 검토 회의는 이러면 좋겠다로 끝나기 쉽고, 두 주 뒤에 같은 자리가 또 열린다. 이 도구는 그 반복을 끊기 위해 있다. 도구 줄에서의 자리는 분명하다. 정적인 도면보다 앞으로 나가고 실제 코드보다 싸다.

그 자리를 버티게 하는 것은 짜는 방식이다. 상호작용 논리는 타이핑이 아니라 부품을 쌓아 만든다. 누르기와 넘기기, 키 입력, 시간 세기가 방아쇠가 된다. 움직임과 투명도 변화, 값의 변화가 응답이 된다. 쌓고 변수와 조건을 더하면 예전에는 만드는 사람이 설명해야 했던 흐름이 반나절 만에 형태를 갖는다. 치면서 확인하는 입력, 머리글이 줄어드는 동안 펼쳐지는 카드, 진행 막대가 사실을 말하는 여러 단계 결제.

결과를 영리한 동작 너머로 밀어 올리는 것은 장비를 흉내 낼 수 있다는 점이다. 기울기 감지와 마이크, 지문 확인까지 대신할 수 있다. 그래서 시제품은 기울기에 반응하고 주변 소리의 크기를 듣고 어떤 화면을 생체 확인 뒤에 둘 수 있다. 평평한 도면이 이야기할 수 없는 상호작용이며, 팀이 몇 주를 증거 없이 다투는 종류의 것이다.

기기에서의 확인과 팀 검토

여기서의 재현도는 논리만의 문제가 아니다. 휴대 기기에 재생 도구를 넣으면 책상에서 편집 중인 내용이 그대로 실제 기기에 비친다. 그래서 넘기는 감촉도 움직임의 박자도 글로 설명하는 대신 손으로 정한다. 여러 기기에 걸친 줄거리도 같은 시제품 안에 짤 수 있다. 휴대 기기가 판형 기기를 움직이거나 두 화면이 일을 넘기는 식이다. 대부분의 설계 도구가 표현하지 못하는 종류의 상호작용이다.

흐름이 돌아가면 링크 하나로 팀과 시험하는 사람에게 보낼 수 있고, 반응은 문서 속 사진이 아니라 시제품에 붙는다. 매체를 바꾸는 것만으로 대화의 질이 달라진다. 전환이 느리게 느껴진다는 메모는 의견이다. 모두가 눌러 볼 수 있는 판의 그 전환 위에 붙은 메모는 자리를 가진 결함이다.

이런 시제품에는 두 번째 독자가 있다. 설계 팀이 아니다. 품을 어림하는 사람이다. 눌리는 흐름은 이미 어색한 상태가 발견된 흐름이기도 하다. 정적인 화면에서 낸 어림과 움직이는 판에서 낸 어림의 차이는 대개 놀라움과 계획의 차이다. 시제품을 넘기는 것은 장식이 아니라 시작 회의에서 질문 한 종류를 통째로 걷어내는 일이다.

이 도구가 일부러 하지 않는 일도 적어 둔다. 여기는 실제 환경이 아니고 여기서 출하하려 해서는 안 된다. 값어치는 이른 시점에 답을 강요하는 질문에 있다. 흐름 도중에 연결이 끊기면 어떻게 되는지, 쓸 수 없는 상태는 어떻게 보이는지, 두 번째 누름은 한 손으로 닿는지. 시제품 안에서는 답이 싸고 개발 한 구간 안에서는 비싸다.

이것은 설계와 개발 사이에서 말이 바닥나는 틈을 메운다. 상호작용은 회의 속 설명이 아니라 손에 쥘 수 있는 것이 된다. 좋은 시제품은 스스로 자기 값어치를 말한다.

무료 단계는 개인이 시작하는 데 필요한 것을 담고, 팀 협업과 고급 능력은 정기 결제 뒤에 있다. 작업실이 조금씩 받아들이는 도구로서 합당한 모양이다. Axure 나 Figma 시제품에서 옮겨 오는 사람에게 배움의 언덕은 완만하다. 방아쇠와 응답이라는 생각 구조가 원래 상호작용을 보던 방식과 맞기 때문이다.

어디에 둘지는 간단히 말할 수 있다. 상호작용을 설계하는 사람과 제품 담당자, 움직임을 중시하는 화면 설계자가 주로 쓴다. 순수하게 겉모습만 보는 도면이라면 Figma 로 충분하고 잃을 것이 없다. 물음이 복잡한 흐름이나 센서로 돌아서는 순간 이것을 열면 된다. Windows 와 macOS 에서 돌아가고 무료 단계는 설치한 날부터 쓸 수 있다.