QuizGen

상황

웹 기반 퀴즈 생성 플랫폼인 QuizGen에서 프론트엔드 개발을 담당했습니다. 사용자가 본인이 정리한 PDF 파일을 업로드하면, 이를 바탕으로 문제를 생성하고 풀 수 있는 서비스였고, 이용자가 '메인 기능을 직관적으로 찾기 어렵다', 'PDF 업로드가 제대로 적용된 건지 헷갈린다'는 피드백을 줄 정도로 초기 버전의 사용자 경험이 좋지 않았습니다.

원인 분석

초기에는 대학에서 배운 Z 패턴 이론을 그대로 적용해 메인 버튼을 배치했지만, 실제 화면에서는 주변에 불필요한 이미지와 기능이 많아 사용자의 시선이 분산되고 있었습니다. 또한 PDF 업로드 완료를 alert로만 알리려다 보니, 이용자에게는 불필요한 클릭을 강요하는 경험이 되고 있었습니다. 이론적으로는 '눈에 잘 띄는 위치'에 요소를 둔 것처럼 보였지만, 실제 사용자 흐름과는 맞지 않는다는 점을 깨닫게 되었습니다.

행동

먼저 메인 기능을 더 직관적으로 보이게 하기 위해, 주변의 장식적인 이미지와 덜 중요한 기능들을 정리하고 핵심 CTA에만 포인트 색상을 주어 화면 중앙에 배치했습니다. Z 패턴이나 F 패턴 같은 이론에만 의존하기보다, 어떤 시선 동선에서도 자연스럽게 메인 기능이 눈에 들어오도록 UI를 재구성했습니다. PDF 업로드 인지는 alert 대신 스낵바 패턴으로 바꿔, 추가 클릭 없이도 업로드 완료를 명확하게 전달하도록 수정했습니다. 이후 Clarity를 도입해 실제 사용자 행동 패턴을 수집·분석하면서, 수정 전후의 클릭 흐름과 이탈 지점을 비교했습니다.

결과

UI 개선과 피드백 방식을 조정한 뒤, 사용자가 메인 기능을 찾기까지 필요한 불필요한 클릭 수는 평균 7회에서 2회 이하로 줄었습니다. 또한 첫 번째 배포에서는 10명 중 1명만이 일주일 내 재방문했지만, 개선 이후에는 53명 중 38명이 일주일 이내에 재방문해 서비스 이탈률을 60% 이상 감소시켰습니다. 처음에는 '서비스를 한 번 배포하는 것'을 목표로 삼았다면, 이후에는 '사용자 50명 확보'와 '이탈률 50% 이하 유지' 같은 목표를 스스로 세우고 달성해 나가며, 한 번 만든 서비스를 계속 개선해 나가는 반복적인 도전이 얼마나 중요한지 체감할 수 있었습니다.