패턴 조합
모바일과 알림모바일 폭에서 쓰는 카드형 정보, 메뉴 드로어, 조건 드로어, 앱 설치 안내, 실수 방지 확인을 모은 구성입니다.
모바일 화면을 설계할 때 좁은 폭에서 메뉴와 조건, 확인 동작을 어떻게 배치할지 정할 때 사용합니다.
모바일 에이전트 세션 카드 진행 상황을 카드 한 장에 압축해 보여 줍니다.
모바일 드로어 좁은 폭에서 전체 메뉴를 옆에서 끌어옵니다.
모바일 필터 드로어 검색 조건을 아래에서 올라오는 패널로 다룹니다.
앱 다운로드 오버레이 앱 설치나 계속 보기를 고르게 합니다.
길게 눌러 확인 실수하면 곤란한 동작을 길게 눌러 확인받습니다.
DUOLABS
실제 서비스에서는 에이전트 기능과 요금제를 설명하는 페이지로 연결합니다.
모바일 헤더의 햄버거 메뉴입니다. 오른쪽에서 밀려 들어옵니다.
Esc·배경 탭·링크 선택으로 닫히고, 열려 있는 동안 배경 스크롤이 잠깁니다. Tab은 패널 안에서만 순환하고, 닫으면 열기 버튼으로 포커스가 돌아옵니다.
Showing 73 curated objects.
버튼을 누르면 휴대폰 목업, 스토어 배지, QR로 앱을 소개하는 전체 화면 오버레이가 뜹니다.
내 기기 OS와 다른 스토어 배지를 누르면 확인 창이 뜨고, QR을 누르면 큰 QR 모달이 열립니다. 데스크톱·모바일 레이아웃이 다릅니다(모바일은 QR 숨김).
원이 다 찰 때까지 누르세요. 중간에 손을 떼면 실행하지 않습니다.