From Design pattern
Jump to: navigation, search
(목록)
Line 8: Line 8:
 
{{#Widget:Vimeo|id=96709357|width=300|height=533}}
 
{{#Widget:Vimeo|id=96709357|width=300|height=533}}
  
=== WWF Together App 팬더 정보 제공 기능 ===
+
=== WWF Together App 팬더 정보 제공 기능 More details? ===
 
* 화면속 상자를 drag하여 늘려서 숨겨진 정보를 본다.
 
* 화면속 상자를 drag하여 늘려서 숨겨진 정보를 본다.
 
{{#Widget:Vimeo|id=93373544|width=533|height=395}}
 
{{#Widget:Vimeo|id=93373544|width=533|height=395}}
  
=== WWF Together App 팬더 정보 제공 기능 ===
+
=== WWF Together App 팬더 정보 제공 기능 More details? ===
 
* 화면의 일부분을 drag하여, 접촉된 위치를 잘라내어 화면 뒤에 있는 숨겨진 정보를 본다.
 
* 화면의 일부분을 drag하여, 접촉된 위치를 잘라내어 화면 뒤에 있는 숨겨진 정보를 본다.
 
{{#Widget:Vimeo|id=93373548|width=533|height=395}}
 
{{#Widget:Vimeo|id=93373548|width=533|height=395}}
  
 
----
 
----
----
 
 
 
== Controls? ==
 
== Controls? ==
 
=== 58번 사례 navigation ===
 
=== 58번 사례 navigation ===
Line 25: Line 23:
 
{{#Widget:Youtube|id=zmZGPpVrlS4|width=665|height=374}}
 
{{#Widget:Youtube|id=zmZGPpVrlS4|width=665|height=374}}
 
{{#Widget:Youtube|id=eWbsbdIxjOY|width=665|height=374}}
 
{{#Widget:Youtube|id=eWbsbdIxjOY|width=665|height=374}}
 
 
----
 
----
  
== Call hidden page? ==
+
=== iOS_airbnb 민경보가 일단 메타폴릭etc로 이동 ===
=== iOS_weathercube/ 민경보 메타폴릭인터렉션으로 옮겼습니다_cube===
+
* 다른 메뉴 활성화를 위해 작아졌던 화면을 드래그 하여 활성화 시킨다.(drawer와 유사하지만 컨텐츠 화면이 작아졌다 커지다 보니 같이 묶이 어려움)
* 손가락을 통해 좌우로 벌려 알고자 하는 날씨의 지역정보를 입력한다.
+
{{#Widget:Vimeo|id=94905862|width=300|height=500}}
{{#Widget:Vimeo|id=94907107|width=300|height=533}}
+
  
=== iOS_weathercube / 민경보 메타폴릭인터렉션에 옮김!===
+
=== iOS_airbnb ===
* 손가락을 통해 상하로 벌려 숨어있는 정보를 살펴본다.
+
* 카테고리별로 나누어진 메뉴를 위 아래로 스크롤 하여 본다.
{{#Widget:Vimeo|id=94906931|width=300|height=533}}
+
{{#Widget:Vimeo|id=94906088|width=300|height=500}}
 
----
 
----
 
== 옵션 ==
 
== 옵션 ==
Line 43: Line 39:
 
=== iOS_USAToday / 민경보가 메타폴릭으로 이동 ===
 
=== iOS_USAToday / 민경보가 메타폴릭으로 이동 ===
 
{{#Widget:Vimeo|id=95773708|width=300|height=533}}
 
{{#Widget:Vimeo|id=95773708|width=300|height=533}}
----
 
 
=== iOS_Paper / 민경보가 슬라이딩레이어로이동 ===
 
* 화면을 아래로 드래그 하여 자신의 정보에 관련된 페이지를 볼 수 있다.
 
{{#Widget:Vimeo|id=94902939|width=300|height=533}}
 
 
=== iOS_airbnb 민경보가 일단 메타폴릭etc로 이동 ===
 
* 다른 메뉴 활성화를 위해 작아졌던 화면을 드래그 하여 활성화 시킨다.(drawer와 유사하지만 컨텐츠 화면이 작아졌다 커지다 보니 같이 묶이 어려움)
 
{{#Widget:Vimeo|id=94905862|width=300|height=500}}
 
 
=== iOS_airbnb ===
 
* 카테고리별로 나누어진 메뉴를 위 아래로 스크롤 하여 본다.
 
{{#Widget:Vimeo|id=94906088|width=300|height=500}}
 
  
 
----
 
----
Line 74: Line 57:
 
* 팔을 45도 각도로 들어올려 화면 왼쪽 모서리를 향하여 화면에 보이지 않았던 메뉴를 본다.
 
* 팔을 45도 각도로 들어올려 화면 왼쪽 모서리를 향하여 화면에 보이지 않았던 메뉴를 본다.
 
{{#Widget:Vimeo|id=94742456|width=665|height=374}}
 
{{#Widget:Vimeo|id=94742456|width=665|height=374}}
 +
 +
=== iOS_Paper / 민경보가 슬라이딩레이어로이동 ===
 +
* 화면을 아래로 드래그 하여 자신의 정보에 관련된 페이지를 볼 수 있다.
 +
{{#Widget:Vimeo|id=94902939|width=300|height=533}}
 +
----
 +
== Call hidden page? ==
 +
=== iOS_weathercube/ 민경보 메타폴릭인터렉션으로 옮겼습니다_cube===
 +
* 손가락을 통해 좌우로 벌려 알고자 하는 날씨의 지역정보를 입력한다.
 +
{{#Widget:Vimeo|id=94907107|width=300|height=533}}
 +
 +
=== iOS_weathercube / 민경보 메타폴릭인터렉션에 옮김!===
 +
* 손가락을 통해 상하로 벌려 숨어있는 정보를 살펴본다.
 +
{{#Widget:Vimeo|id=94906931|width=300|height=533}}
 
----
 
----
 
== Menu 더 보기 ==
 
== Menu 더 보기 ==
Line 102: Line 98:
  
 
==여기부터는 sliding 방식의 하위 컨텐츠 열기 ==
 
==여기부터는 sliding 방식의 하위 컨텐츠 열기 ==
 
+
* [[Sliding layer]]로 옮긴 사례 생략(숨김) 상태
 
=== iOS_Amazon ===
 
=== iOS_Amazon ===
 
{{#Widget:Vimeo|id=95762048|width=300|height=533}}
 
{{#Widget:Vimeo|id=95762048|width=300|height=533}}
Line 112: Line 108:
 
<!-- 중복사례 {{#Widget:Vimeo|id=95772042|width=300|height=533}}-->
 
<!-- 중복사례 {{#Widget:Vimeo|id=95772042|width=300|height=533}}-->
 
{{#Widget:Vimeo|id=95771676|width=300|height=533}}
 
{{#Widget:Vimeo|id=95771676|width=300|height=533}}
 +
 
<!--
 
<!--
 
=== iOS_Learnist 민경보가 슬라이딩레이어로 옮김요 ===
 
=== iOS_Learnist 민경보가 슬라이딩레이어로 옮김요 ===

Revision as of 12:01, 21 July 2014

navigation의 사례들 중, 현재 바로 navigation 패턴으로 들어가기 어려운 것들을 모아둔 최종 sandbox 입니다.

  • 손승희 모두 점검완료
  • 민경보 검토완료/ wff는 WWF입니다. 수정했습니다.

iOS_Applauze

  • dial 형태의 메뉴로, 한바퀴 돌지 않고 끝이 있다.

WWF Together App 팬더 정보 제공 기능 More details?

  • 화면속 상자를 drag하여 늘려서 숨겨진 정보를 본다.

WWF Together App 팬더 정보 제공 기능 More details?

  • 화면의 일부분을 drag하여, 접촉된 위치를 잘라내어 화면 뒤에 있는 숨겨진 정보를 본다.


Controls?

58번 사례 navigation

  • 현재 기기의 일반정보를 터치나 버튼의 조작 없이 확인한다.
  • 슬리핑 모드에서 근접 센서 위에 손을 가져가면 터치 없이도 시간, 날짜, 부재중 전화, 문자 메시지, 잔여 베터리 용량 등을 한눈에 확인할 수 있다.

"" ""


iOS_airbnb 민경보가 일단 메타폴릭etc로 이동

  • 다른 메뉴 활성화를 위해 작아졌던 화면을 드래그 하여 활성화 시킨다.(drawer와 유사하지만 컨텐츠 화면이 작아졌다 커지다 보니 같이 묶이 어려움)

iOS_airbnb

  • 카테고리별로 나누어진 메뉴를 위 아래로 스크롤 하여 본다.


옵션

iOS_Hangout

iOS_USAToday / 민경보가 메타폴릭으로 이동


Call hidden menus 관련

Samsung Galaxy Note(Android)_Internet

  • 인터넷 사용 중 화면 가장자리를 tap & hold 하여 보이지 않는 퀵 메뉴를 오버레이하여 불러온다.
  • 화면 가장자리를 tap & hold 하여 불러온 퀵메뉴에서 hold & drag를 통하여 하위메뉴를 연다.

GUI gallery 민경보가 메타폴릭etc로 옮겨정리

  • tap 을 통해 메뉴를 선택하면 하위 메뉴가 문이 열리듯 보여진다.

Xbox_Kinect Adventures

  • 제스처를 통해 화면에 보이지 않는 메뉴를 오버레이하여 불러온다.
  • 팔을 45도 각도로 들어올려 화면 왼쪽 모서리를 향하여 화면에 보이지 않았던 메뉴를 본다.

iOS_Paper / 민경보가 슬라이딩레이어로이동

  • 화면을 아래로 드래그 하여 자신의 정보에 관련된 페이지를 볼 수 있다.


Call hidden page?

iOS_weathercube/ 민경보 메타폴릭인터렉션으로 옮겼습니다_cube

  • 손가락을 통해 좌우로 벌려 알고자 하는 날씨의 지역정보를 입력한다.

iOS_weathercube / 민경보 메타폴릭인터렉션에 옮김!

  • 손가락을 통해 상하로 벌려 숨어있는 정보를 살펴본다.


Menu 더 보기

  • Action bar, Tab bar에서의 더 보기 ...버튼

Android_Evernote

  • Navigation의 Drop menu에도 있는 사례
  • 메뉴 더보기 버튼을 패턴으로 만들지


page turn/page flip?

iOS_Jelly 민경보가 메타폴릭etc로 이동


계층 이동(하위 컨텐츠 화면 열기)

  • More details와 성격이 다른데, 여기 사례는 하위 컨텐츠를 열어보는 거라 세부정보보기는 아닙니다.

아래 세개는 썸네일이 확대되는 방식

iOS_Carousel

iOS_Jetsetter

iOS_Paper

여기부터는 sliding 방식의 하위 컨텐츠 열기

iOS_Amazon

iOS_HuffPost

iOS_Jetsetter