UX/UI Article
Enhancing Data Input with Layered Drawer Form
계층형 서랍 탐색을 통한 데이터 입력 향상
Improving complex form workflows by replacing modal dialogs with a scalable, user-friendly drawer system.
주방 및 레스토랑 관리 플랫폼인 Grubtech 에서 선임 제품 디자이너로 일할 당시 , 백오피스 인터페이스 전반에 걸쳐 길고 복잡한 폼으로 인해 반복적인 UX 문제에 직면했습니다. 기존의 모달 기반 구조는 사용자 경험을 단절시키고 불편하게 만들었습니다. 특히 중첩된 단계가 필요하거나 사용자가 여러 입력 수준을 번갈아가며 입력해야 할 때 더욱 그랬습니다.
요약 :)
Grubtech에서 선임 제품 디자이너로 일하며 기존의 모달 기반 폼 구조가 복잡성과 중첩으로 인해 사용자 경험을 저해한다는 문제를 발견했습니다. 사용자 인터뷰와 테스트를 통해 모달에서 길을 잃는 사용자, 단계 혼동, 데이터 손실 등의 이슈가 확인되었고, 이에 따라 폼 입력 워크플로를 계층형 '쌓인 서랍(drawer)' 구조로 전환하는 해결책을 고안했습니다.
서랍 기반 UI는 중첩 작업 중에도 컨텍스트를 유지하고, 단계별 피드백과 명확한 탐색을 제공하여 작업 성공률과 효율성을 크게 향상시켰습니다. 개선 결과, 오류율은 36% 감소하고 양식 작성 속도는 19% 빨라졌으며, 사용자의 통제감도 높아졌습니다. 이 접근 방식은 다른 제품 영역에도 확장 가능하다는 교훈을 남겼습니다.
서랍 기반 UI는 중첩 작업 중에도 컨텍스트를 유지하고, 단계별 피드백과 명확한 탐색을 제공하여 작업 성공률과 효율성을 크게 향상시켰습니다. 개선 결과, 오류율은 36% 감소하고 양식 작성 속도는 19% 빨라졌으며, 사용자의 통제감도 높아졌습니다. 이 접근 방식은 다른 제품 영역에도 확장 가능하다는 교훈을 남겼습니다.
더보기→
출처.
Mohsen Hosseinian. (2025.07.03). Medium. Enhancing Data Input with Layered Drawer Form. 2025.07.10. https://uxplanet.org/enhancing-data-input-with-layered-drawer-form-d9883b588cd3