by
Mar 01. 2017
#02. 햄버거 메뉴 UI 인터랙션
인터랙션 트렌드 깊이 파고들기
햄버거 메뉴 인터랙션 유형
햄버거 메뉴 인터랙션 유형
햄버거 메뉴 영역이 화면 전체에 보이는 경우
햄버거 메뉴 영역이 화면 위에 보이는 경우
햄버거 메뉴 영역과 화면이 분리되는 경우
컨텍스트 화면 내 햄버거 버튼이 제공되는 경우
햄버거 메뉴가 상시 따라다니는 경우
햄버거 메뉴 트랜지션
햄버거 메뉴 영역이 화면 전체에 보이는 경우
1. 햄버거 메뉴 영역이 투명한 경우
출처: dribbble.com
출처: dribbble.com2. 햄버거 메뉴 영역이 투명하지 않는 경우
출처: dribbble.com
출처: dribbble.com햄버거 메뉴 영역이 화면 위에 보이는 경우
1. 햄버거 메뉴 영역이 현재 화면 위에 나타나는 경우
출처: dribbble.com
출처: dribbble.com2. 현재 보이는 화면이 반으로 축소되면서 햄버거 메뉴 영역이 나타나는 경우
출처: dribbble.com3. 햄버거 메뉴 영역이 상단 영역에서 떨어지는 경우
출처: dribbble.com
출처: dribbble.com
출처: dribbble.com
출처: dribbble.com
출처: dribbble.com햄버거 메뉴 영역과 화면이 분리되는 경우
1. 햄버거 메뉴 영역이 계층 구조로 나타나는 경우
출처: dribbble.com2. 햄버거 메뉴 영역에 개인화 서비스가 제공되는 경우
출처: dribbble.com3. 햄버거 메뉴 영역에 테마가 제공되는 경우
출처: dribbble.com4. 햄버거 메뉴 영역에 추가 콘텐츠 '>' 제공되는 경우
출처: dribbble.com
출처: dribbble.com컨텍스트 화면 내 햄버거 버튼이 제공되는 경우
출처: dribbble.com햄버거 메뉴가 상시 따라다니는 경우
출처: dribbble.com햄버거 메뉴 인터랙션
1. 햄버거 메뉴 선택 시 버튼 인터랙션
출처: dribbble.com2. 햄버거 메뉴 선택 시 메뉴 영역 인터랙션
출처: dribbble.com감사합니다.
(UX/PM/리서치) 라이브클래스 패키지 4월 한정 판매 이벤트
혜택1. (수강생) 178여개 UX 강의 (평생 무제한)
혜택2. (수강생) 매주 금요일 밤 9시-11시 [UX 방법론 A-Z Q&A]
줌 라이브 수업 초대 (평생 무료)
혜택3. (수강생) 네이버 카페 초대 (UX 아티클 14,000개 수집 자료 공유)
