명령 기본 사항

Windows 앱에서 명령 요소는 사용자가 이메일 보내기, 항목 삭제 또는 양식 제출 같은 작업을 수행할 수 있게 해주는 대화형 UI 요소입니다. 명령 인터페이스는 일반적인 명령 요소, 명령 요소를 호스트하는 명령 화면, 명령 요소가 지원하는 상호 작용 및 제공하는 환경으로 구성됩니다.

최고의 명령 환경 제공

명령 인터페이스에서 가장 중요한 것은 사용자가 수행할 수 있도록 허용할 작업입니다. 앱의 기능을 계획할 때 이러한 작업을 수행하는 데 필요한 단계와 구현할 사용자 환경을 고려해야 합니다. 이러한 환경의 초안을 작성한 후에는 구현에 사용할 도구와 상호 작용을 결정할 수 있습니다.

다음은 몇 가지 일반적인 명령 환경입니다.

• 정보 보내기 또는 제출
• 설정 및 옵션 선택
• 콘텐츠 검색 및 필터링
• 파일 열기, 저장, 삭제
• 콘텐츠 편집 또는 만들기

독창적인 명령 환경을 디자인하세요. 앱에서 지원할 입력 디바이스와 앱이 각 디바이스에 응답하는 방식을 선택합니다. 광범위한 기능과 기본 설정을 지원하여 앱의 사용 편의성, 휴대성 및 접근성을 최대한 높여야 합니다(자세한 내용은 Windows 앱의 명령 디자인 참조).

올바른 명령 요소 선택

명령 인터페이스에 적합한 요소를 사용하면 직관적이고 쉽게 사용할 수 있는 앱을 만들 수 있고, 그렇지 않으면 앱이 어렵고 사용하기 까다롭게 됩니다. 포괄적인 명령 요소는 Windows 앱에서 사용할 수 있습니다. 다음은 가장 일반적인 UWP 명령 요소 목록입니다.

단추

Button은 즉각적인 작업을 트리거합니다. 예를 들어 이메일 보내기, 양식 데이터 제출 또는 대화 상자에서 작업 확인이 있습니다.

목록

List는 항목을 대화형 목록 또는 그리드로 표시합니다. 일반적으로 많은 옵션 또는 표시 항목에 사용합니다. 예를 들어 드롭다운 목록, 목록 상자, 목록 보기 및 그리드 보기가 있습니다.

선택 컨트롤

설문 조사를 작성하거나 앱 설정을 구성하는 경우와 같이 사용자가 몇 가지 옵션 중에서 선택할 수 있습니다. 예를 들어 CheckBox, RadioButton, 토글 스위치가 있습니다.

달력, 날짜 및 시간 선택기

달력, 날짜 및 시간 선택기를 사용하면 사용자가 이벤트를 만들거나 경보를 설정하는 경우와 같이 날짜 및 시간 정보를 보고 수정할 수 있습니다. 예를 들어 달력 날짜 선택기, 달력 보기, 날짜 선택기, 시간 선택기가 있습니다.

예측 텍스트 항목

데이터를 입력하거나 쿼리를 수행하는 경우와 같이 사용자가 입력함에 따라 제안을 제공합니다. 예를 들어 AutoSuggestBox가 있습니다.

전체 목록은 컨트롤 및 UI 요소를 참조하세요.

오른쪽 화면에 명령 배치

명령 모음, 명령 모음 플라이아웃, 메뉴 모음, 대화 상자 같은 앱 캔버스 또는 특수 명령 컨테이너를 포함하여 다양한 앱 화면에 명령 요소를 배치할 수 있습니다.

위쪽 및 아래쪽 명령 단추보다는 끌어서 놓아 목록 항목을 다시 정렬하는 것처럼, 항상 콘텐츠에서 작동하는 명령보다는 사용자가 콘텐츠를 직접 조작하는 방법을 사용합니다.

하지만 특정 입력 디바이스에서, 또는 특정 사용자 기능 및 기본 설정을 수용하는 경우에는 이렇게 하는 것이 불가능할 수 있습니다. 이 경우 최대한 많은 명령 어포던스를 제공하고, 이러한 명령 요소를 앱의 명령 화면에 배치합니다.

다음은 가장 일반적인 명령 표면 목록입니다.

앱 캔버스(콘텐츠 영역)

사용자가 핵심 시나리오를 완료하기 위한 명령이 지속적으로 필요한 경우 해당 명령을 캔버스에 배치합니다. 영향을 주는 객체 근처에 명령을 배치할 (또는 명령을 킬) 수 있기 때문에, 캔버스에 명령을 배치하면 사용이 좀 더 쉽고 명확해질 수 있습니다. 그러나 캔버스에 배치할 명령은 신중하게 선택하십시오. 앱 캔버스에 너무 많은 명령이 있으면 중요한 화면 공간을 차지하여 사용자를 당혹스럽게 할 수 있습니다. 자주 사용되지 않는 명령인 경우 다른 명령 화면에 배치하는 것이 좋습니다.

명령 모음 및 메뉴 모음

명령 모음을 사용하면 명령을 구성하고 쉽게 액세스 할 수 있습니다. 명령 모음은 화면 위쪽, 화면 아래쪽 또는 양쪽 모두에 배치할 수 있습니다(앱의 기능이 명령 모음에 비해 너무 복잡한 경우 MenuBar를 사용할 수도 있음).

메뉴 및 상황에 맞는 메뉴

메뉴 및 바로 가기 메뉴는 명령을 구성하고 필요할 때까지 명령을 숨겨 공간을 절약합니다. 사용자는 일반적으로 단추를 클릭하거나 마우스 오른쪽 단추로 컨트롤을 클릭하여 메뉴 또는 상황에 맞는 메뉴에 액세스합니다.

CommandBarFlyout은 명령 모음과 상황에 맞는 메뉴의 이점을 단일 컨트롤로 결합한 상황에 맞는 메뉴의 한 유형입니다. 일반적으로 사용되는 작업에 대한 바로 가기를 제공하고 특정 상황에만 관련된 보조 명령(예: 클립보드 또는 사용자 지정 명령)에 대한 액세스를 제공할 수 있습니다.

또한 UWP는 기존 메뉴 및 상황에 맞는 메뉴 세트도 제공합니다. 자세한 내용은 메뉴 및 상황에 맞는 메뉴를 참조하세요.

명령 피드백 제공

명령 피드백은 상호 작용 또는 명령이 발견되었다는 사실과 명령을 해석하고 처리한 방법 및 명령의 성공 여부를 사용자에게 전달합니다. 이렇게 하면 사용자는 무엇을 했는지, 앞으로 무엇을 할 수 있는지 이해할 수 있습니다. 꼭 필요한 경우를 제외하고 사용자가 개입하거나 추가 작업을 할 필요가 없도록 피드백을 UI에 자연스럽게 통합하는 것이 가장 좋습니다.

참고 항목

꼭 필요하고 다른 곳에서 제공할 수 없는 경우에만 피드백을 제공합니다. 값을 추가하지 않는 이상 애플리케이션 UI를 깨끗하고 깔끔하게 유지합니다.

다음은 앱에서 피드백을 제공하는 방법입니다.

명령 모음

CommandBar의 콘텐츠 영역은 피드백을 확인하려는 사용자에게 상태를 전달하는 직관적인 장소입니다.

플라이아웃

플라이아웃 - 플라이아웃 바깥쪽의 아무 곳이나 탭하거나 클릭하여 해제할 수 있는 경량의 상황에 맞는 팝업입니다.

Dialog 컨트롤

Dialog 컨트롤은 상황에 맞는 앱 정보를 제공하는 모달 UI 오버레이입니다. 대부분의 경우 대화 상자는 명시적으로 해제될 때까지 앱 창과의 상호 작용을 차단하고 사용자로부터 받은 일종의 작업을 요청하는 경우가 많습니다. 대화 상자는 중단될 수 있으며 특정 상황에서만 사용해야 합니다. 자세한 내용은 작업을 확인하거나 실행을 취소하는 경우 섹션을 참조하세요.

팁

앱에서 확인 대화 상자를 사용하는 정도를 신경쓰십시오. 사용자가 실수를 할 때에는 매우 유용할 수 있지만, 사용자의 의도적인 작업이 수행될 때마다 방해로 작용할 수 있습니다.

작업을 확인하거나 실행을 취소하는 경우

앱의 UI가 아무리 잘 설계되었더라도 모든 사용자는 원치 않는 작업을 수행합니다. 앱에서 사용자에게 작업을 확인하도록 요구하거나 최근 작업을 실행 취소하는 방법을 제공하여 이러한 상황을 도와줄 수 있습니다.

실행을 취소할 수 없으며 큰 문제가 발생하는 작업의 경우, 확인 대화 상자를 사용하는 것이 좋습니다. 이러한 작업의 예는 다음과 같습니다.

• 파일 덮어쓰기
• 닫기 전에 파일을 저장하지 않기
• 파일 또는 데이터의 영구 삭제 확인
• 구매(사용자가 확인 필요를 옵트아웃하지 않는 경우 한정)
• 양식 제출(예: 등록 등)

실행을 취소할 수 있는 작업의 경우 일반적으로 간단한 실행 취소 명령을 제공하는 것으로 충분합니다. 이러한 작업의 예는 다음과 같습니다.

• 파일 삭제
• 이메일 삭제(영구적으로 삭제되지 않음)
• 콘텐츠 수정 또는 텍스트 편집
• 파일 이름 바꾸기

특정 입력 형식에 맞게 최적화

특정 입력 유형 및 디바이스에 대한 사용자 경험 최적화에 대한 자세한 내용은 상호 작용 입문서 를 참조하세요.