From Design pattern
Jump to: navigation, search
(File drawer)
Line 57: Line 57:
  
 
}}
 
}}
 +
File drawer는 컨텐츠 간 이동 및 삭제를 할 때 사용하는 pattern이다. 주로 현재 app안에서 제공된 다양한 컨텐츠 간을 이동할 때 사용된다.
  
File drawer은  컨텐츠 화면 이동할 때 사용하는 pattern이다. 주로 현재 페이지와 유사한 성격의 컨텐츠 간을 이동할 때 사용된다.
+
File drawer의 컨텐츠 간 이동은 File folder가 들어 있는 Drawer의 메타포를 사용하였으며, 각 리스트는 주로 컨텐츠의 축소 이미지로 이루어져 있다.
 
+
전후의 페이지를 이동하는 방식에 따라 구분이 가능한데, 주로 Paper flip 방식이 사용되며, Card flip, Cube flip, Slideshow 방식으로 분류할 수 있다. Page turn/ Page flip을 호출하는 방법은 주로 화면 좌우의 이동버튼이나 flick을 이용하여 동작시킨다.
+
  
 
=== With this pattern, we can solve... ===
 
=== With this pattern, we can solve... ===
저장 공간이 충분해 지면서 디지털기기의 컨텐츠 양이 기하급수적으로 증가하여, 많은 양의 컨텐츠를 효과적으로 보기 위한 pattern이 필요하다. Page turn/ Page flip은 많은 양의 컨텐츠를 쉽게 볼 수 있는 기능을 제공한다.
+
저장 공간이 충분해 지면서 디지털기기의 컨텐츠 양이 기하급수적으로 증가하여, 많은 양의 컨텐츠 간 이동을 효과적으로 하기 위한 pattern이 필요하다. File drawer은 많은 양의 컨텐츠를 각각 쉽게 볼 수 있는 기능을 제공한다. 한 번에 모든 컨텐츠를 수용하기에 화면 공간이 부족할 수 있기 때문에, 공간을 효율적으로 사용하면서 어려움 없이 직관적으로 둘러볼 수 있도록 한다.
  
* File drawer은 트랜지션 효과를 통해 전후의 컨텐츠로 이동을 하며, 전후에 다른 컨텐츠가 존재할 것이라는 기대를 주기 위해 시각적 힌트를 주기도 한다.
+
* 각각의 컨텐츠를 둘러보는 과정에서 더 동적이고 매력적으로 보이게 한다.
* File drawer 이전에는 Previous/Next button이나 이와 유사한 방식을 사용하였다.
+
* File drawer은 컨텐츠 간 이동할 때, 다른 컨텐츠를 동시에 표시해 사용자의 컨텐츠간 이동을 돕는다.
  
 
=== Example : 206번 사례 ===
 
=== Example : 206번 사례 ===

Revision as of 22:38, 28 May 2014

File drawer는 컨텐츠 간 이동 및 삭제를 할 때 사용하는 pattern이다. 주로 현재 app안에서 제공된 다양한 컨텐츠 간을 이동할 때 사용된다.

File drawer의 컨텐츠 간 이동은 File folder가 들어 있는 Drawer의 메타포를 사용하였으며, 각 리스트는 주로 컨텐츠의 축소 이미지로 이루어져 있다.

With this pattern, we can solve...

저장 공간이 충분해 지면서 디지털기기의 컨텐츠 양이 기하급수적으로 증가하여, 많은 양의 컨텐츠 간 이동을 효과적으로 하기 위한 pattern이 필요하다. File drawer은 많은 양의 컨텐츠를 각각 쉽게 볼 수 있는 기능을 제공한다. 한 번에 모든 컨텐츠를 수용하기에 화면 공간이 부족할 수 있기 때문에, 공간을 효율적으로 사용하면서 어려움 없이 직관적으로 둘러볼 수 있도록 한다.

  • 각각의 컨텐츠를 둘러보는 과정에서 더 동적이고 매력적으로 보이게 한다.
  • File drawer은 컨텐츠 간 이동할 때, 다른 컨텐츠를 동시에 표시해 사용자의 컨텐츠간 이동을 돕는다.

Example : 206번 사례


File drawer

Android_Chrome

  • 겹쳐저서 보이지 않는 여러개의 창을 위에서 아래로 drag하여 가려진 창의 정보를 본다.

iOS_Reminder

iOS_passbook