패널 섹션(허브 컨트롤)이 포함된 중앙 앱 허브(Windows Phone 스토어 앱)

이 항목에서 제공되는 모델은 Windows Phone용 홈페이지 메뉴(허브 또는 피벗 컨트롤)가 포함된 중앙 앱 허브에 설명된 모델과 비슷합니다. 이전 경우와 마찬가지로 사용자에게 노출할 다양한 기능 영역이 있습니다. 여기서 차이점은 홈페이지 메뉴에 필요 없는 모든 기본 UI를 상위 수준에서 제공할 수 있다는 점입니다.

축구팀 관리를 위한 중앙 앱 허브 UI

앱에 이동할 하위 영역이 없는 경우 모든 UI가 가로로 액세스할 수 있는 단일 섹션 집합에 포함될 수 있습니다. 허브 컨트롤을 사용할 수도 있지만, 이 경우 홈 섹션을 포함할 필요가 없습니다. Windows Phone의 피플 허브가 포함된 경우가 이런 경우입니다. 다음 그림에서는 허브의 기본 레이아웃이 동일함을 보여 줍니다.

피플 허브

피플 허브가 있는 각 섹션에는 고유 UI가 포함되고 기능 영역이 제공됩니다. 이 디자인 모델과 Windows Phone용 홈페이지 메뉴(허브 또는 피벗 컨트롤)가 포함된 중앙 앱 허브에서 설명한 모델의 차이점은 허브에서 앱의 더 낮은 앱 영역을 다시 표시하지 않는 다는 점입니다. 이전 모델에서 홈 섹션의 오른쪽에 있는 섹션에서는 메뉴를 사용하여 탐색을 통해 액세스할 콘텐츠를 빠르게 살펴볼 수 있습니다. 여기서 설명된 모델을 사용하면 섹션에는 다른 곳에 있는 영역이 다시 표시되지 않습니다.

각 영역에 대한 섹션

디자인을 위해 앱이 시작될 때 어떤 섹션을 선택할지 결정합니다. 한 가지 옵션은 사용자가 앱을 마지막으로 종료할 때 있었던 섹션을 선택하는 것입니다. 항상 첫 번째 섹션을 선택하게 결정할 수도 있습니다. 첫 번째 섹션은 그 위에 허브 타일의 맨 왼쪽 가장자리가 보이는 배경 이미지가 왼쪽에 맞춰서 정렬된 섹션입니다.

오른쪽에 포함할 섹션 수를 결정할 수 있지만 총 4개를 초과하지 않는 것이 좋습니다. 섹션이 4개를 초과하면 사용자가 자신의 현재 위치를 계속 추적하기가 어렵습니다.

각 섹션에 원하는 UI를 넣을 수 있습니다. 4개 기본 기능 영역을 포함하면 4개 섹션에 각각 하나의 영역을 넣을 수 있습니다. 첫 번째 섹션은 앱이 시작될 때 사용자가 가장 보고 싶어 할 것으로 생각되는 콘텐츠를 사용하여 디자인할 수 있습니다. 이전 그림에서는 허브를 중앙 응용 프로그램 허브로 사용하는 방법을 보여 줍니다.

허브의 각 섹션에는 클릭하면 해당 항목에 대한 세부 정보로 이동되는 항목이 포함됩니다. 예를 들어 피플 허브에는 탭할 항목이 포함된 새 소식 섹션이 있습니다. 항목은 세로로 스크롤되는 목록으로 제공되고 게시물을 Facebook에 다시 제공할 수도 있습니다. 항목 중 하나를 클릭하면 허브를 벗어나 해당 게시물의 세부 정보로 이동됩니다. 새 소식 섹션에는 각 항목에 대한 여러 가지 누르기 대상이 있습니다. 한 대상을 선택하면 게시물에 대한 응답을 확인할 수 있는 게시물로 이동됩니다. 다른 누르기 대상은 사람 이름입니다. 이 대상을 탭하면 해당하는 사람에 대한 정보의 여러 피벗 항목을 볼 수 있는 피벗 컨트롤로 이동됩니다.

다른 예

각 섹션은 확실히 구별되는 고유한 영역이 될 수 있으며 다른 섹션과 관련될 필요는 없습니다. 사용자가 개별 섹션에서 콘텐츠를 탭하면 기본 허브에서 벗어납니다. 탭한 항목의 세부 정보로 이동하고 홈 섹션 메뉴에서처럼 완전히 새로운 하위 영역으로 이동하지는 않습니다.

Samsung Now 앱에는 허브 컨트롤을 중앙 앱 허브로 사용하는 세 개 섹션이 있습니다. 이 앱의 내용은 사용자가 아침과 하루 내내 빠르게 액세스하려고 하는 날씨, 뉴스, 주식 시장 정보 등의 정보를 사용자에게 보여 주는 것입니다.

Samsung Now 앱

사용자는 허브에서 벗어날 수 있습니다. 예를 들어 주식 섹션에서 주식 기호를 클릭하면 해당 회사에 대한 세부 정보가 포함된 단일 페이지로 이동됩니다.

권장 사항

Windows Phone용 홈페이지 메뉴(허브 또는 피벗 컨트롤)가 포함된 중앙 앱 허브 항목과 이 항목은 둘 다 허브 컨트롤을 사용하며 설명된 사용에 대한 많은 동일한 권장 사항과 주의 사항이 적용됩니다.

관련 항목

허브

피벗