내보내기(0) 인쇄
모두 확장

Windows Phone용 Slider 컨트롤 디자인 지침

2013-12-05

적용 대상: Windows Phone 8 | Windows Phone OS 7.1

Slider 컨트롤을 사용하면 사용자가 트랙을 앞뒤로 스크럽하여 허용되는 값 범위에서 값을 선택할 수 있습니다.

UI_Slider

이 항목에는 다음 단원이 포함되어 있습니다.

Slider 컨트롤에는 두 가지 시각적 요소인 "트랙"과 "엄지"가 있습니다. 트랙은 직선이며 엄지는 트랙을 따라 이동하는 선택기입니다. 사용자는 트랙을 따라 엄지를 Slider의 값을 변경합니다. 사용자는 Slider 컨트롤의 트랙을 탭하여 특정 값으로 설정할 수도 있습니다.

Slider를 사용하면 사용자가 자연 제스처를 사용하고 화상 키보드가 필요 없도록 하여 앱별 값 범위에서 쉽고 빠르게 값을 선택할 수 있습니다.

Slider 컨트롤을 사용하여 알려진 상대 수량 집합 내에서 선택합니다. 일반적으로 이러한 값은 연속적으로 제공 시 적합하며 예측 가능한 증분으로 증가하거나 감소합니다.

값 그룹 중에서 선택하는 빠르고 명료하며 직관적인 방법이므로 가능한 한 Slider 컨트롤을 사용해야 합니다. 하지만 Slider 컨트롤이 적합하지 않은 경우도 있습니다.

  • Slider 컨트롤을 사용하여 사용자에게 알려진 정확한 숫자 값을 설정하게 하려는 경우 대신에 TextBox 컨트롤을 사용할 수 있습니다.

  • 사용자가 이 컨트롤을 사용하여 변경 사항을 설정할 때 즉각적인 피드백이 도움이 됩니까? 그렇지 않은 경우 CheckBox or RadioButton 컨트롤이 더 적합할 수도 있습니다.

  • 값이 Slider 컨트롤에서 제공하는 네 개 개별 값보다 적은 경우 대신에 RadioButton 컨트롤을 사용할 수 있습니다.

Slider 컨트롤을 사용하면 사용자가 연속되는 값 범위에서 특정 값을 보다 세부적으로 선택할 수 있습니다. 일반적인 예로 볼륨 Slider 컨트롤이나 밝기 레벨 Slider 컨트롤이 있습니다. Slider를 사용하면 사용자가 Slider 컨트롤 값을 조절할 때 앱의 다른 시각적 요소 내에서 즉각적인 피드백을 표시할 수 있습니다.

Slider 컨트롤에는 최소값 및 최대값이 있습니다. Slider 컨트롤은 세로 또는 가로 방향일 수 있지만 끝이 항상 뷰의 범위 내에 있습니다.

또한 Slider 컨트롤은 사용자가 값을 조절할 때 즉각적인 피드백이 도움이 되는 모든 곳에서 유용할 수 있습니다. 경우에 따라 Slider 컨트롤의 사용 가능성이나 모양이 CheckBox 컨트롤과 같은 다른 컨트롤에 따라 달라질 수도 있습니다.

Slider 컨트롤은 다양한 시나리오에서 효율적으로 사용할 수 있는 비교적 유연한 컨트롤입니다. 하지만 Slider 컨트롤을 사용자 지정하려는 경우 다음 사항에 유의하세요.

  • Slider 컨트롤의 증분 변경을 사용자에게 적합한 방식으로 설정합니다. 서양 문화권에서는 대체로 Slider 컨트롤의 값이 왼쪽에서 오른쪽으로 증가하는 것을 선호하는 반면, 다른 지역의 사용자는 오른쪽에서 왼쪽이나 세로 방향을 선호할 수 있습니다.

  • 사용자가 대략적인 설정 값을 알아야 하는 경우 Slider 컨트롤 아래에 그래픽 눈금 표시를 사용합니다.

  • 동일한 설정에 대해 Slider 컨트롤과 숫자 TextBox 컨트롤을 사용하는 것이 바람직하지 않습니다. 더 적절한 컨트롤 한 개만 사용합니다. 여기서 중복은 혼동을 줄 수 있습니다. 사용자가 즉각적인 피드백과 정확한 숫자 값을 설정하는 기능이 모두 필요한 경우에만 두 컨트롤을 사용합니다.

  • Slider 컨트롤의 시각적 요소인 엄지가 사용자의 손가락으로 가려질 수 있으므로 피드백을 최대화하고 Slider 컨트롤의 값 변경 사항을 외부 메커니즘(Slider 컨트롤이 조작될 때 동적으로 조정되는 레이블이든 표시 매개 변수)으로 동기화하는 것이 좋습니다.

일반적인 실수

효율적인 Slider 컨트롤을 디자인하는 것은 사용자의 책임이지만 피해야 할 몇 가지 규칙이 있습니다.

  • Slider 컨트롤을 사용하지 않도록 설정하는 경우 연결된 레이블도 사용하지 않도록 설정합니다.

  • Slider 컨트롤을 진행률 표시기로 사용하지 마세요.

  • 모든 눈금 표시에 레이블을 지정하지 마세요.

  • 엄지 크기를 기본 크기에서 변경하지 마세요.

  • Slider 컨트롤 트랙을 직선이 아닌 다른 형태로 만들지 마세요.

  • Slider 컨트롤의 적중 대상 영역은 큽니다. 적절한 터치 액세스 가능성을 유지하려면 Slider 컨트롤을 디스플레이의 가장자리에 너무 가깝게 배치해서는 안 됩니다.

  • 모든 끌기 가능한 컨트롤처럼, Slider 컨트롤을 Pivot 컨트롤이나 Panorama 컨트롤 등 자체적으로 끌기를 지원하는 컨트롤 내에서 사용해서는 안 됩니다.

사용자 지정 Slider 컨트롤을 디자인하는 경우 사용자에게 필요한 모든 정보를 가능한 한 간단하게 제공하는 방법을 고려합니다. 사용자가 설정을 이해하기 위해 단위를 알아야 하는 경우 항상 값 레이블을 사용하지만, 이러한 값을 그래픽으로 나타내는 독창적인 방법을 찾아보세요. 예를 들어 볼륨을 제어하는 SliderSlider의 최소값 끝에 작은 스피커 그래픽을 표시하고 최대값 끝에 큰 스피커 그래픽을 표시할 수 있습니다.

Slider 컨트롤의 동작을 사용자 지정할 수도 있습니다. 사용되는 방식에 따라 Slider 컨트롤에서 다음 동작을 활용할 수 있습니다.

  • 위치로 이동: 엄지가 접촉 지점으로 점프합니다.

  • 눈금에 맞추기: 엄지가 접촉 방향에서 현재 위치에 가장 가까운 눈금 값으로 점프합니다.

참고 항목

표시:
© 2014 Microsoft