빠른 고충실도 프로토타이핑은 제품 디자인 단계에서 핵심적인 부분이 되었습니다.
더 이상 움직이지 않는 이미지로는 충분하지 않습니다. 결국 설득해야 할 이해관계자들이 있고, 맞춰야 할 마감이 있으며, 시장은 그 어느 때보다 빠르게 움직입니다.
UX 디자이너들은 복잡한 애니메이션과 풍부한 인터랙션을 갖춘, 실제와 같은 느낌의 프로토타입을 제공해야 한다는 압박을 점점 더 크게 받고 있습니다.
폴란드 크라쿠프 출신의 시니어 UX/UI 디자이너 안나 제프카 역시 그런 압박을 받고 있었습니다. 하지만 그녀가 사용하던 프로토타이핑 소프트웨어로는 그녀가 필요로 하는 복잡하고 아름다운 프로토타입을 빠르게 구현할 수 없었습니다.
그녀는 디자인, 엔지니어링, 비즈니스 부서 사이의 간극을 메울 수 있는 빠른 고충실도 프로토타이핑 도구를 찾아야 했습니다.
우리는 그녀가 ProtoPie를 만나기까지의 여정, 이전 프로토타이핑 도구에서 겪었던 문제들, ProtoPie를 선택한 이유, 그리고 ProtoPie가 어떻게 그녀의 작업 흐름을 간소화하고 속도를 높였는지에 대해 이야기를 나눴습니다.
ProtoPie로 가는 나의 여정
저는 직업상 UX/UI 디자이너이지만, 지금은 디자인, 엔지니어링, 비즈니스 부서 간의 간극을 메우며 비즈니스 전략과 함께 움직이는 아름다운 디자인 솔루션을 개발하는 일을 하고 있습니다.
Figma는 처음에 제 주요 프로토타이핑 도구였습니다. 다이어그램을 작성하고 벡터 일러스트레이션을 그리는 것부터 모든 시각 요소를 하나로 모으는 일까지 맡았습니다.
하지만 시대는 변했습니다. 정적인 이미지로는 앱의 동작을 충분히 전달할 수 없습니다. 요컨대, Figma만으로는 부족했습니다.
복잡한 인터랙션을 만드는 일은 점점 더 어려워졌습니다. Figma에는 Smart Animate 기능이 있지만, 키프레임을 정밀하게 조정할 타임라인이 없습니다. 조건부 로직, 고급 수식, 변수도 없습니다. 저는 계속해서 타협해야 했고, 고충실도 프로토타입을 만들기는 어려웠습니다.
Figma에서 ProtoPie로 디자인 내보내기.
저는 할 수 있는 모든 것을 시도해 봤습니다. 어떤 도구는 디자이너에게는 훌륭했지만 엔지니어에게는 쓸모없었고, 이해관계자들에게는 번거로웠습니다.
예를 들어, Principle를 익히는 것은 식은 죽 먹기였습니다. 눈 깜짝할 사이에 화면 전환을 만들 수 있었죠. 하지만 아쉽게도 Mac 사용자만 사용할 수 있었고, 우리 프로그래머들은 Windows를 사용했습니다.
저는 Flinto도 사용해 보았는데, Behaviour Designer가 궁금했습니다. 새 화면으로 전환하지 않고 마이크로 인터랙션을 만든다는 아이디어는 매력적이었습니다. 하지만 다시 한번, 동료들과 단순한 동영상 녹화본만 공유하는 일은 지루하게 느껴졌습니다.
Origami는 제 UI 애니메이션에 많은 제어권을 제공했고, Patch Editor는 Blender Nodes를 떠올리게 했습니다. 그런데 파일을 미리 보려면 소프트웨어를 설치해야 한다는 사실을 알고는 실망했습니다.
저는 Framer에 큰 기대를 걸었습니다. 코드를 작성하며 창의성을 마음껏 발휘할 수 있게 해주었기 때문입니다. 하지만 대부분의 경우, 이는 과한 선택이었습니다.
저는 10개월 전 시험 삼아 ProtoPie를 다운로드했고, 그것이 바로 제가 필요로 하던 것임을 금방 알게 되었습니다. 디자인, 비즈니스, 기술의 세계를 연결해 주는 강력한 프로토타이핑 도구였습니다.
ProtoPie는 제 작업 흐름 퍼즐에서 빠져 있던 마지막 조각이었습니다.
내가 ProtoPie를 선택한 이유
ProtoPie는 모든 조건을 만족시켰습니다. Figma와 연동되고, 매우 빠른 프로토타이핑을 제공하며, 개발자는 아무것도 설치하지 않고도 Interaction Recordings에서 모든 속성을 확인할 수 있습니다.
ProtoPie를 배우는 일은 쉽고 끝없이 보람 있었습니다. 저는 적은 노력으로 첫 고충실도 프로토타입을 빠르게 만들 수 있었고, 운영체제나 소프트웨어와 상관없이 동료들과 매끄럽게 공유할 수 있었습니다.
시작은 간단했습니다. 프로토타이핑을 빠르게 시작할 수 있는 자료도 충분했습니다. 자세한 문서, 단계별 튜토리얼, 온라인 워크숍이 있었고, 다른 디자이너들의 유용한 팁을 배울 수 있는 예제 파일도 있었습니다.
ProtoPie는 제 호기심을 자극했습니다. 저는 실험하고 미지의 영역을 탐색하는 것을 좋아하는데, ProtoPie는 이전에는 넘을 수 없었던 창의적 한계를 뛰어넘게 해주었습니다.
무엇보다도 정말 재미있었습니다. 이렇게 소프트웨어를 가지고 즐거웠던 적은 없었습니다. 완곡하게 말해도, 저는 반했습니다. 업무 시간에만 ProtoPie를 사용한 것이 아니라, 퇴근 후에도 이것저것 만져 보며 놀았습니다.
가장 인상적이었던 것은 제어할 수 있는 범위가 놀라울 정도로 넓었다는 점이었습니다. 저는 눈 깜짝할 사이에 몰입감 있는 경험을 만들 수 있었습니다. 프로덕션용 Lottie 애니메이션을 사용할 수 있어서 GIF로 우회할 필요도 없었습니다. 게다가 누구나 브라우저나 모바일 기기에서 제 프로토타입을 손쉽게 볼 수 있었습니다.
ProtoPie가 내 작업 흐름을 어떻게 간소화했는가
ProtoPie는 제가 창의적으로 작업하고 시각물에 애니메이션을 더할 수 있게 해줍니다. 제 생각에 ProtoPie는 제 작품에 약간의 양념을 더해 줍니다.
ProtoPie는 복잡한 마이크로 인터랙션을 빠르게 만들고 다양한 콘셉트를 테스트할 수 있게 해줍니다. 새로운 기능이 구현되었을 때 어떤 모습일지 고객에게 보여주고 싶을 때 매우 유용합니다.
ProtoPie는 엄청난 시간 절약 도구로, 제 작업 과정을 간소화하고 생산성을 크게 높여줍니다. 빠른 프로토타이핑 덕분에 개발자 없이도 콘셉트를 테스트할 수 있었습니다. 비용도 크게 줄었고, 개발자 핸드오프 측면에서도 큰 도움이 되었습니다.
그리고 가장 중요한 것은, ProtoPie가 팀 내 커뮤니케이션을 개선했다는 점입니다. Interaction Recordings에는 추측이 들어갈 여지가 없습니다.
현재 저는 이커머스 약국 프로젝트에서 마이크로 인터랙션을 적극적으로 활용하고 있습니다. ProtoPie는 사용자가 흐름을 따라가도록 안내하는 데 도움을 줍니다. 또한 시선의 흐름을 관리하고 중요한 레이아웃 요소를 강조하는 데도 도움이 됩니다.
게다가 일관된 브랜드 보이스와 이미지를 확립하는 데도 도움이 됩니다. 웹사이트에서 문제가 생겼을 때 그것이 분명하게 드러납니다. 빈 상태, 오류 페이지, 잘못된 입력은 좀 더 장난스럽고 재미있는 시도를 해볼 수 있는 완벽한 지점입니다.
ProtoPie는 제가 이야기를 전달하고, 보통 막다른 길로 여겨지는 지점에서도 전환을 이끌어낼 수 있게 해줍니다.
ProtoPie와 함께라면 가능성은 끝이 없습니다
15,000개 이상의 기업이 프로토타이핑 요구를 충족하기 위해 ProtoPie를 신뢰합니다. 데모를 예약하고 ProtoPie가 여러분의 팀 성공에 어떻게 도움이 될 수 있는지 알아보세요.
