From Design pattern
Jump to: navigation, search
(→‎Example)
 
(18 intermediate revisions by 5 users not shown)
Line 1: Line 1:
−
화면에서 보여지는 이미지의 각도를 조절하다. 화면 전체에서 나타나는 이미지가 아니라 화면에 나타난 작업물이나 항목의 각도를 변경하는 경우 Dealing with data의 Rotate object나 Free transformation에 해당한다.
+
Rotate screen은 화면에 나타난 상을  돌려보는 패턴이다. 화면 자체가 돌아가거나 화면에 나타난 이미지가 돌아간다.
  
 +
손가락을 터치하여 90도로 꺾거나 rotate button을 활용할 수 있다. rotate button의 경우 90도 각도로 회전되는 경우가 많으며, 터치할 때마다 시계방향 혹은 시계반대방향으로 계속하여 회전한다.
  
−
== Examples ==
+
=== With this pattern, we can solve... ===
−
=== 60번 사례 ===
+
가로 혹은 세로로 긴 화면의 경우 기기의 비율에 적합하게 화면을 볼 필요가 있는 경우, 정보가 방향을 가지고 있어, 방향이 바뀜에 따라 정보를 인식하는 방식이 다른 경우에 활용된다.
−
* 현재 보고 있는 화면 혹은 사진 및 동영상에서 손가락으로 화면을 누른 상태에서 오른쪽 또는 왼쪽으로 비틀어 화면을 90도 회전한다
+
−
<videoflash>7PKIbDLOb1c|665|374</videoflash>
+
  
−
=== 367번 사례 ===
+
* 화면이 돌아감으로 새로운 기능이 나타나나는 경우는 해당하지 않는다.
−
* 사례 설명 입력 예정
+
* 기기들이 네모형태가 많기 때문에 주로 90도 각도로 회전된다.
−
<videoflash type="vimeo">94916615|665|374</videoflash>
+
* 기기를 세로로 세워두었을 때, 중력 방향에 해당하는 부분이 아래쪽이 되는 경우가 많다.
 +
* 이미지가 1:1 비율이 아닐 경우 화면을 돌림으로 인해 검은 여분의 면적이 생기거나 보이지 않던 면적이 보일 수 있다.
 +
* 편집을 위해 이미지를 돌리는 경우는 [[Rotate object]]에 해당한다. Rotate screen은 화면 전체가 돌아가는 것으로 제한한다.
 +
* 편집을 위해 이미지를 돌리는 경우이나, 크기, 비율, 각도를 하나 혹은 두 개의 점을 조작하여 진행하는 경우는 [[Free transform]]에 해당한다.
  
−
=== 404번 사례 ===
+
=== Example : Android_Samsung Galaxy Note ===
−
* 개체를 두 손가락을 이용해서 drag하여 크기와 위치 등을 변경할 수 있다.
+
[[File:Rotate screen.jpeg]]
−
<videoflash type="vimeo">94745469|665|374</videoflash>
+
----
  
−
=== 440번 사례 ===
+
=== Android_Samsung Galaxy Note ===
−
* 두 손가락으로 위쪽으로 drag를 하면 지도가 눕듯이 기울어진다. 다시 아래로 drag하면 화면에 정면으로 세워진다.
+
{{#Widget:Youtube|id=7PKIbDLOb1c|width=665|height=374}}
−
<videoflash type="vimeo">93045120|300|405</videoflash>
+
  
−
=== 441번 사례 ===
+
=== Samsung Smart TV ===
−
* 두 손가락으로 rotate하여 지도를 회전한다. 오른쪽 위에 방위가 표시되며, 이 부분을 tap하면 원래 방향으로 돌아간다.
+
{{#Widget:Vimeo|id=94916615|width=665|height=374}}
−
<videoflash type="vimeo">93045289|300|405</videoflash>
+
  
 +
=== iOS_Map ===
 +
* 두 손가락으로 위쪽으로 drag를 하면 지도가 눕듯이 기울어진다. 다시 아래로 drag하면 화면에 정면으로 세워진다.
 +
{{#Widget:Vimeo|id=96657019|width=665|height=374}}
 +
* 두 손가락으로 rotate하여 지도를 회전한다. 오른쪽 위에 방위가 표시되며, 이 부분을 tap하면 원래 방향으로 돌아간다.
 +
{{#Widget:Vimeo|id=93045289|width=300|height=400}}
  
−
[[Category:Control screen image]]
+
[[Category:Edit screen view]]

Latest revision as of 17:12, 31 July 2014

Rotate screen은 화면에 나타난 상을 돌려보는 패턴이다. 화면 자체가 돌아가거나 화면에 나타난 이미지가 돌아간다.

손가락을 터치하여 90도로 꺾거나 rotate button을 활용할 수 있다. rotate button의 경우 90도 각도로 회전되는 경우가 많으며, 터치할 때마다 시계방향 혹은 시계반대방향으로 계속하여 회전한다.

With this pattern, we can solve...

가로 혹은 세로로 긴 화면의 경우 기기의 비율에 적합하게 화면을 볼 필요가 있는 경우, 정보가 방향을 가지고 있어, 방향이 바뀜에 따라 정보를 인식하는 방식이 다른 경우에 활용된다.

  • 화면이 돌아감으로 새로운 기능이 나타나나는 경우는 해당하지 않는다.
  • 기기들이 네모형태가 많기 때문에 주로 90도 각도로 회전된다.
  • 기기를 세로로 세워두었을 때, 중력 방향에 해당하는 부분이 아래쪽이 되는 경우가 많다.
  • 이미지가 1:1 비율이 아닐 경우 화면을 돌림으로 인해 검은 여분의 면적이 생기거나 보이지 않던 면적이 보일 수 있다.
  • 편집을 위해 이미지를 돌리는 경우는 Rotate object에 해당한다. Rotate screen은 화면 전체가 돌아가는 것으로 제한한다.
  • 편집을 위해 이미지를 돌리는 경우이나, 크기, 비율, 각도를 하나 혹은 두 개의 점을 조작하여 진행하는 경우는 Free transform에 해당한다.

Example : Android_Samsung Galaxy Note

Rotate screen.jpeg

Android_Samsung Galaxy Note

""

Samsung Smart TV

iOS_Map

  • 두 손가락으로 위쪽으로 drag를 하면 지도가 눕듯이 기울어진다. 다시 아래로 drag하면 화면에 정면으로 세워진다.

  • 두 손가락으로 rotate하여 지도를 회전한다. 오른쪽 위에 방위가 표시되며, 이 부분을 tap하면 원래 방향으로 돌아간다.

Retrieved from "http://www.ixpatterns.com/index.php?title=Rotate_screen&oldid=109557"