|
|
(18 intermediate revisions by one user not shown) |
Line 1: |
Line 1: |
− | Double slider는 최소값과 최대값 사이에서 일정한 범위의 설정을 입력하기 위한 패턴이다. 대부분의 경우 Double slider 이미지 값의 범위가 바로 적용되어 보여지는 값이 함께 변화한다. | + | Double slider는 최소값과 최대값 사이에서 일정한 범위를 입력하기 위한 패턴이다. 대부분의 경우 Double slider 이미지 값의 범위가 바로 적용되어 결과값이 함께 변화한다. [[Slider]]와 다르게 최소값과 최대값을 설정할 수 있게 되어 있다. |
| | | |
− | 최소값과 최대값이 정해진 연속된 범위의 값 사이에서 최소값 조절점과 최대값 조절점을 움직이는 형태로 Double slider를 조작한다. 주로 Horizontal Double slider방식이 사용된다. | + | 최소값과 최대값이 정해진 연속된 범위의 값 사이에서 최소값 조절점과 최대값 조절점을 움직이는 형태로 Double slider를 조작한다. 주로 Horizontal double slider방식이 사용된다. |
| | | |
| === With this pattern, we can solve... === | | === With this pattern, we can solve... === |
− | 앱에서 사용자가 원하는 값를 입력하기 위한 패턴이 필요하다. Slider는 연속된 값 중 원하는 값을 선택하여 입력 할 수 있는 기능을 제공한다. 입력 가능한 범위를 모르는 상태에서 입력하는 상황을 막을 수 있어 사용자가 부적절한 값을 입력할 가능성이 없다. | + | 앱에서 사용자가 원하는 값를 입력하기 위한 패턴이 필요하다. Double slider는 연속된 값 중 원하는 범위의 값을 선택하여 입력 할 수 있는 기능을 제공한다. 입력 가능한 범위를 모르는 상태에서 입력하는 상황을 막을 수 있어 사용자가 부적절한 값을 입력할 가능성이 없다. |
| | | |
− | * Slider는 drag를 통해 원하는 연속된 값을 부드럽게 입력할 수 있다. | + | * Double slider는 drag를 통해 원하는 연속된 값의 범위를 부드럽게 입력할 수 있다. |
− | * Slider는 특정 범위안의 현재값을 상대적으로 파악할 수 있다. | + | * Double slider는 특정 범위안의 현재 범위값을 상대적으로 파악할 수 있다. |
| | | |
− | ----
| + | === Example : iOS_Etsy === |
| + | [[File:Doubleslider2.jpg]] |
| | | |
− | == Slider (Control volume/temperature) ==
| |
− |
| |
− | === iOS_Tune Player ===
| |
− | {{#Widget:Vimeo|id=96874966|width=300|height=450}}
| |
− |
| |
− | === Android_MX Player ===
| |
− | {{#Widget:Vimeo|id=94636812|width=533|height=303}}
| |
− |
| |
− | === Apple CarPlay ===
| |
− | * slide bar를 drag하여 차량 내부온도를 조절한다.
| |
− | [[File:Bmw_scolling.jpeg|665px]]
| |
| | | |
| ---- | | ---- |
− | == Slider (Control brightness) ==
| |
− |
| |
− | === Android_Candy Camera ===
| |
− | {{#Widget:Vimeo|id=93362374|width=300|height=480}}
| |
− |
| |
− | === iOS_Clocks ===
| |
− | {{#Widget:Vimeo|id=94740404|width=665|height=374}}
| |
− |
| |
− | === iOS_리디스토리 ===
| |
− | *화면을 위로 drag하면 밝게, 아래로 drag하면 어둡게 조절된다.
| |
− | {{#Widget:Vimeo|id=93367955|width=300|height=400}}
| |
− |
| |
− | ===iOS_손전등 ===
| |
− | {{#Widget:Vimeo|id=96666725|width=300|height=533}}
| |
− |
| |
− | ----
| |
− | == Slider (Set time) ==
| |
− |
| |
− | === iOS_Alarmmon ===
| |
− | {{#Widget:Vimeo|id=93552407|width=300|height=533}}
| |
− |
| |
− | === iOS_Solar ===
| |
− | * 손을 위로 drag 하면 현재시간을 기준으로 움직인 시간만큼의 날씨와 기온이 어떻게 변화하는지 보인다.
| |
− | * 손을 때면 현재시간으로 돌아가며, 배경 색은 그 시간 하늘의 색을 나타낸다.
| |
− | {{#Widget:Vimeo|id=93044690|width=300|height=449}}
| |
− |
| |
− | === iOS_Peek Calendar ===
| |
− | * 화면을 위에서 아래로 drag하면, drag한 만큼의 길이와 면적이 늘어나며 설정시간의 길이만큼 입력된다.
| |
− | {{#Widget:Vimeo|id=95488542|width=300|height=533}}
| |
− |
| |
− | ----
| |
− | == Slider (Enter number) ==
| |
− |
| |
− | === Android_Noom Diet Coach ===
| |
− | {{#Widget:Vimeo|id=93361639|width=300|height=480}}
| |
− |
| |
− | === iOS_Korailtalk ===
| |
− | {{#Widget:Vimeo|id=93044867|width=300|height=449}}
| |
− |
| |
− | ----
| |
− |
| |
− | == Slider (Enter relative value)==
| |
− |
| |
− | === iOS_Booklip ===
| |
− | {{#Widget:Vimeo|id=93938326|width=300|height=405}}
| |
− |
| |
− | === iOS_My Wonderful Days ===
| |
− | {{#Widget:Vimeo|id=94743852|width=300|height=533}}
| |
− |
| |
− | ----
| |
− |
| |
− | ==Slider (Set content's value)==
| |
− | === iOS_Adobe Photoshop Express ===
| |
− | * Slider bar의 조절점을 좌우로 drag하여 사진의 밝기,명도,대비 등을 입력한다.
| |
− | {{#Widget:Vimeo|id=93044156|width=300|height=400}}
| |
− |
| |
− | === iOS_SketchbookX ===
| |
− | {{#Widget:Vimeo|id=96422968|width=300|height=405}}
| |
| | | |
− | === iOS_USA TODAY === | + | === iOS_Etsy === |
− | * 오른쪽 하단의 Slider bar의 조절점을 좌우로 drag하여 화면의 글자 크기를 조절한다.
| + | {{#Widget:Vimeo|id=96422618|width=395|height=533}} |
− | {{#Widget:Vimeo|id=96420635|width=300|height=405}} | + | |
| | | |
− | === iOS_EnglishFlow === | + | === Android_Etsy === |
− | * 재생중인 영상화면에서, 위로 drag하여 현재 속도보다 0.1배속 더 빠르게, 아래로 drag하여 0.1배속 더 느리게 재생속도를 조절한다.
| + | {{#Widget:Vimeo|id=96420761|width=300|height=508}} |
− | {{#Widget:Vimeo|id=93368392|width=531|height=300}} | + | |
| | | |
| + | === iOS_Fab === |
| + | {{#Widget:Vimeo|id=96422964|width=395|height=533}} |
| | | |
− | [[Category:Enter a continuous value]] | + | [[Category:Enter continuous values]] |
Double slider는 최소값과 최대값 사이에서 일정한 범위를 입력하기 위한 패턴이다. 대부분의 경우 Double slider 이미지 값의 범위가 바로 적용되어 결과값이 함께 변화한다. Slider와 다르게 최소값과 최대값을 설정할 수 있게 되어 있다.
최소값과 최대값이 정해진 연속된 범위의 값 사이에서 최소값 조절점과 최대값 조절점을 움직이는 형태로 Double slider를 조작한다. 주로 Horizontal double slider방식이 사용된다.
앱에서 사용자가 원하는 값를 입력하기 위한 패턴이 필요하다. Double slider는 연속된 값 중 원하는 범위의 값을 선택하여 입력 할 수 있는 기능을 제공한다. 입력 가능한 범위를 모르는 상태에서 입력하는 상황을 막을 수 있어 사용자가 부적절한 값을 입력할 가능성이 없다.