From Design pattern
Jump to: navigation, search
 
(37 intermediate revisions by 4 users not shown)
Line 1: Line 1:
 +
Wheel은 숫자를 입력하거나 항목을 선택 할 때 사용되며, 주로 날짜와 시간의 숫치를 입력할 때 사용되는 패턴이다. Pickers라고도 불려지며, 화면의 Wheel을 상하로 움직여 원하는 수치를 찾아 입력한다.
  
{{#css:
+
=== With this pattern, we can solve... ===
#mw-content-text h3 span {
+
font-weight: 600;
+
padding-left: 0px;
+
}
+
  
.mw-headline {
+
앱에서 특정한 숫자나 항목을 입력하기 위한 패턴이 필요하다. Wheel은 원하는 숫자나 항목을 쉽게 보고 입력할 수 있는 기능을 제공한다. 입력가능한 범위나 항목에 한계를 가지고 있어 사용자가 부적절한 값을 입력할 가능성이 없다.
font-weight: 600;
+
}
+
  
span.mw-editsection {
+
* Wheel은 원하는 숫자나 항목을 입력할 때, 선택된 숫자나 항목의 이전과 이후의 정보를 제공한다.
font-weight: 200;
+
* 각 입력란에 대하여 상하로 Drag하여 Wheel을 회전 시켜 원하는 숫자나 항목을 입력한다.
position: relative;
+
float:right;
+
margin-right: 25px
+
}
+
  
span.mw-editsection a {
 
font-weight: 200;
 
}
 
  
.art-subpage {
+
=== Example : iOS_TIME Alarm===
background: #F7F7F7;
+
[[File:Wheel3.jpg]]
}
+
  
#mw-content-text p {
+
----
padding-top: 0px;
+
padding-bottom: 6px;
+
}
+
  
.mw-content-ltr ul {
+
== Date and time pickers ==
margin: 0.3em 0 0 42px;
+
}
+
  
 +
=== iOS_Map my run===
 +
{{#Widget:Vimeo|id=95776842|width=300|height=533}}
  
hr {
+
=== iOS_My fitness pal ===
margin-top: 0px;
+
{{#Widget:Vimeo|id=95776747|width=300|height=533}}
margin-bottom: 0px;
+
margin-left: -31px;
+
width: 720px;
+
border-bottom: 1px solid #E0E0DD;
+
border-left: 0px;
+
border-right: 0px;
+
border-top: 30px solid #F7F7F7;
+
}
+
<!--
+
#sun-col {
+
-webkit-column-count:2; /* Chrome, Safari, Opera */
+
-moz-column-count:2; /* Firefox */
+
column-count:2;
+
}
+
  
#sun-col p {
+
=== iOS_TIME Alarm ===
padding-left: 0px;
+
{{#Widget:Vimeo|id=96496729|width=300|height=533}}
-->
+
}
+
  
}}
+
=== iOS_Smart Alarm ===
 +
{{#Widget:Vimeo|id=93367959|width=300|height=533}}
  
Wheel은 숫자를 입력하거나 항목을 선택 할 때 사용하는 pattern이다. 주로 날짜와 시간을 입력할 때 사용된다.
+
=== iOS_Evernote ===
 +
{{#Widget:Vimeo|id=96605484|width=300|height=541}}
  
=== With this pattern, we can solve... ===
+
=== iOS_지하철 ===
 +
{{#Widget:Vimeo|id=93367655|width=395|height=533}}
  
디지털기기의 스크린이 발전함에 따라 이미지작업을 하거나 필기를 할 때 원하는 색을 선택하기 위한 pattern이 필요하다. Color palette는 원하는 색을 쉽게 보고 선택할 수 있는 기능을 제공한다.
+
=== iOS_Sunrise Calendar ===
 +
{{#Widget:Vimeo|id=93939088|width=533|height=395}}
  
* Color palette는 원하는 색을 입력하기 위하여 색을 보고 선택할 수 있는 공간을 가지고 있다.
+
=== Android_Calendar ===
* 사용자가 입력을 위해 선택한 색을 화면에서 표시해줌으로, 입력될 색에 대한 정보를 제공한다.
+
{{#Widget:Vimeo|id=96420713|width=300|height=541}}
* Color palette는 기존의 데스크탑에서 사용되던 일러스트툴과 유사한 방식을 사용하였다.
+
 
+
=== Example :  iOS_TIME Alarm ===
+
{{#Widget:Vimeo|id=96496729|width=300|height=533|start=4s}}
+
  
 
----
 
----
  
== Wheel(Picker) ==
+
== Etc ==
<div id="sun-col">
+
 
+
=== 37번 사례 ===
+
{{#Widget:Vimeo|id=93367655|width=300|height=405}}
+
 
+
=== 345번 사례 ===
+
{{#Widget:Vimeo|id=93367959|width=300|height=405}}
+
 
+
=== 579번 사례 ===
+
{{#Widget:Vimeo|id=93939088|width=533|height=395}}
+
  
=== 215번 사례 ===
+
=== Android_Noom ===
{{#Widget:Vimeo|id=93372820|width=300|height=405}}
+
{{#Widget:Vimeo|id=96421017|width=300|height=541}}
  
</div>
+
=== iOS_Mixology™ ===
 +
{{#Widget:Vimeo|id=93372820|width=395|height=533}}
  
[[Category:Enter a continuous value]]
+
[[Category:Enter continuous values]]

Latest revision as of 23:08, 24 July 2014

Wheel은 숫자를 입력하거나 항목을 선택 할 때 사용되며, 주로 날짜와 시간의 숫치를 입력할 때 사용되는 패턴이다. Pickers라고도 불려지며, 화면의 Wheel을 상하로 움직여 원하는 수치를 찾아 입력한다.

With this pattern, we can solve...

앱에서 특정한 숫자나 항목을 입력하기 위한 패턴이 필요하다. Wheel은 원하는 숫자나 항목을 쉽게 보고 입력할 수 있는 기능을 제공한다. 입력가능한 범위나 항목에 한계를 가지고 있어 사용자가 부적절한 값을 입력할 가능성이 없다.

  • Wheel은 원하는 숫자나 항목을 입력할 때, 선택된 숫자나 항목의 이전과 이후의 정보를 제공한다.
  • 각 입력란에 대하여 상하로 Drag하여 Wheel을 회전 시켜 원하는 숫자나 항목을 입력한다.


Example : iOS_TIME Alarm

Wheel3.jpg


Date and time pickers

iOS_Map my run

iOS_My fitness pal

iOS_TIME Alarm

iOS_Smart Alarm

iOS_Evernote

iOS_지하철

iOS_Sunrise Calendar

Android_Calendar


Etc

Android_Noom

iOS_Mixology™