디테일은 슬라이더로, 온보딩은 캐릭터로

🧙🏻에디터픽 UX: 채글 📊 인기 검색어 : 튜토리얼, 카테고리, 일정

2025. 4. 14.

뉴스레터는 UPA 가입자를 대상으로 발송됩니다.✨

안녕하세요!

이번 주에도 '튜토리얼'에 대한 관심이 뜨겁습니다. 지난주에 이어 이번 주 인기 검색어 1위를 차지했어요. 그래서 이번 주 에디터 픽은 캐릭터 기반 온보딩 튜토리얼이 돋보였던 서비스 '채글'을 소개드립니다. 튜토리얼 개편을 준비 중이시라면, 채글의 구조와 흐름을 참고해보세요.

이번 주 UI 요소는 '슬라이더'입니다. 가격, 신체 정보 기간 등 다양한 수치형 데이터를 손쉽게 조작할 수 있는 UI인데요. 슬라이더를 활용한 주요 서비스들의 UX패턴도 함께 확인해보세요.

그럼, 이번 주 UPA 사용자들의 인기 검색어부터 살펴볼까요?

🔎 가장 많이 검색한 레퍼런스

4월 2주 인기 검색어

지난 한 주 UPA에서 가장 많이 검색된 단어는 1. 튜토리얼 2. 카테고리 3. 일정입니다. 이 검색어를 통해 어떤 UX 레퍼런스를 조회했을까요?

[1위] '튜토리얼' (Feat. 런데이)

응원으로 습관 형성하기 💪🏻🍀

런데이는 러닝에 대한 부담을 줄이고 흥미를 높이기 위해, 6단계 걷기 운동 튜토리얼을 제공합니다. 초보자가 천천히 습관을 들일 수 있도록 시작 프로그램 3회와 반복 프로그램 3회로 구성되어 있어요.

각 튜토리얼은 타이머와 프로그레스 바로 진행 상황을 시각화해 주고, 지루함을 덜기 위해 음악 앱 연결 버튼을 함께 제공합니다. 무엇보다 인상적인 건, 운동을 멈추고 싶을 때 '더 해야 해요.' 대신 '지치면 쉬어도 돼요.'라고 말해주는 따뜻한 메시지에요. 압박보다는 응원으로 습관 형성을 유도하는 경험이 돋보여요.

초보자를 위한 운동 습관 설계

[2위] '카테고리' (Feat. 짐싸)

업체가 알려주는 견적이 아닌

사용자가 주도하는 견적 계산 경험🚚

짐싸는 견적 계산 과정에서 사용자가 직접 정보를 입력해서 결과를 조율할 수 있습니다. 이사 방식, 희망 날짜, 이삿짐 특성 등 주요 카테고리가 이사 단계별로 나뉘고, 각 단계에서 세부 항목을 선택하게 하죠.

정보 입력이 끝나면, 일반/반포장/포장 이사별로 견적이 정리돼요. 모든 정보를 입력했기에 사용자는 견적이 도출된 배경을 이해할 수 있고, 스스로 정한 기준에 따라 의사 결정할 수 있어요. 시스템이 주도하는 자동화 속에서 사용자 개입과 선택을 보장한 경험 설계가 인상적입니다.

사용자가 설계하는 이사 견적

[3위] '일정' (Feat. 루티너리)

플레이리스트처럼 흘러가는 루틴

시간과 음악의 공통점은 '흐른다'입니다. 루티너리는 이 특성을 활용해, 루틴을 일정표가 아닌 플레이리스트처럼 자동 재생되는 구조로 구성했어요.

보통 일정 관리는 수행 여부를 체크박스로 확인하지만, 루티너리는 원형 타이머와 프로그레스 바를 통해 루틴이 '진행 중'임을 보여줘요. 마치 음악이 재생되듯, 사용자는 시간 내에 루틴을 마치고 '완료' 버튼을 누르면 다음 루틴이 자연스럽게 이어지는 경험을 하게 됩니다. 흐름에 맞춘 UX 설계가 인상적입니다.

체크가 아닌 재생으로 일정 관리

🎯이번 주 추천 UX 패턴

UX 패턴이란? 사용자 경험을 구성하는 핵심 장치입니다. 알림, 구독 등이 대표적 예시입니다.

매주 UPA 사용자가 가장 많이 조회한 UX 패턴과 UX 레퍼런스를 추천해 드릴게요~!

사용자가 서비스 내에서 원하는 경험을 달성할 수 있게 적절한 UX 패턴을 사용해 보세요.

🧭 이번 주 추천 UI 요소

슬라이더

슬라이더는 정해진 범위 안에서 값을 직관적으로 조절할 수 있는 UI 요소에요. 특히 숫자나 시간, 가격 등 범위 설정이 필요한 상황에서 자주 사용되죠. 사용자는 범위를 직접 조절하며 설정값을 인지할 수 있기 때문에, 단순 입력보다는 훨씬 체감적이고 효율적인 조작 경험을 제공합니다.

예상 이자 수익률 확인하기

토스에서는 월 적금 금액과 기간을 슬라이더로 조절하면, 실시간으로 예상 이자 수익을 보여줘요. 숫자를 반복 입력하지 않고 수치 변화 흐름을 직관적으로 파악할 수 있어 편리해요. 숫자 범위 조정이 잦은 서비스라면, 토스처럼 슬라이더 UI를 활용해 보시면 어떨까요?

토스 UX 레퍼런스 보러 가기

체형 맞춤 리뷰 확인하기

29cm는 상품 리뷰를 신체 조건에 따라 필터링할 수 있어요. '내 맞춤 필터'를 활성화하면, 비슷한 키·체중의 사용자 후기를 모아 볼 수 있어 더욱 현실적인 상품 후기를 볼 수 있죠. 특히 슬라이더로 설정하는 방식이라, 미묘한 체형 차이도 직접 조절하여 비교할 수 있어요.

29cm UX 레퍼런스 보러 가기