본문으로 이동
2초만에 불필요한 클릭 없애는 4가지 방법
문서

2초만에 불필요한 클릭 없애는 4가지 방법

강영화 토스 · 토스 기술 블로그

원문 보기

AI 핵심 요약

사용자가 원하는 작업을 더 빠르게 마치도록 입력 과정의 불필요한 클릭을 줄이는 네 가지 방법을 소개합니다. 정보 하나만 입력하거나 자릿수가 정해진 경우 CTA를 없애고, 입력값에 맞는 키보드를 설정하며, 화면 진입 시 입력 필드에 포커스를 주는 방식입니다. 더 나아가 기존 정보와 송금 내역을 활용해 값을 미리 채우거나 내부 도구를 템플릿화하는 방법도 제안합니다. 작은 인터랙션을 점검하고 사용자의 입력 자체를 줄이는 방향으로 설계하면 시간을 아끼고 더 나은 경험을 만들 수 있습니다.

  • 입력값이 하나뿐이거나 자릿수가 정해져 있다면 완료 CTA를 생략할 수 있는지 검토하세요.
  • 입력 데이터의 형식에 맞는 키보드를 처음부터 표시하면 키보드 전환 동작을 줄일 수 있습니다.
  • 화면 진입 시 입력 필드에 포커스를 주면 사용자가 필드를 다시 누르지 않아도 됩니다.
  • 기존 입력 정보, 송금 내역, 템플릿 등을 활용해 사용자가 직접 입력해야 하는 양을 줄이세요.

소개

토스 앱에는 little big detail 이 많은데요, 그중 하나를 소개하고 싶어요. 바로 불필요한 클릭 없애는 방법이에요.

비슷한 학습 자료

문서 강민우

'접근성은 어려운 것' 이라고 느끼는 분들을 위해 실무에서 바로 적용할 수 있는 접근성의 핵심 개념과 실수하기 쉬운 패턴을 알려주는 문서, A11y Fundamentals 을 소개합니다.

UI/UX

문서 임재후/최수민

웹에서 복잡한 퍼널 쉽게 관리하기

문서 임재후/최수민

토스페이먼츠 프론트엔드 챕터에서 웹에서 퍼널을 손쉽게 관리하기 위해 했던 고민과 해결 방법을 공유해요.

웹 개발 프론트엔드

문서 유아란

토스 디자인 컨퍼런스 Simplicity가 돌아왔어요.

문서 박수현

디자인 시스템은 제품의 어느 단계까지 기여할 수 있을까요? 더 이상 다른 것에는 신경쓰지 않아도 되는 Menu 컴포넌트를 만들었던 3가지 방법을 소개할게요.

UI/UX

문서 이지윤

디자이너들도 어떻게 하면 빠른 속도를 내며 전체적인 경험을 맞출 수 있을지 매 순간 고민하고 있어요.

UI/UX

문서 김소현

사용자 관점에서 본다는 게 엄청난 게 아닌데도, 왠지 엄청난 것으로 개선해야 할 것 같은 느낌이 들 때도 있죠. 그래서 오늘은 사용자 관점을 활용해 개선한 굉장히 가벼운 사례들을 가져와봤어요.

UI/UX