Navigation tools in windows

Новая панель Windows Tools заменит «Средства администрирования Windows» в Windows 10

Еще в ранних версиях Windows появился апплет панели управления «Администрирование». Он содержит множество ярлыков для различных инструментов, позволяющих выполнять разные административные задачи и настраивать систему.

С выходом предварительной сборки Windows 10 Build 21354 (Dev) Microsoft сообщила, что панель «Средства администрирования Windows» будет полностью удалена из меню «Пуск», а ее место займет новая панель Windows Tools с большим количеством ярлыков.

Windows Tools объединит ярлыки, которые ранее находились в папках «Системные – Windows», «Средства администрирования Windows», «Windows PowerShell» и «Служебные – Windows».

При клике по иконке Windows Tools будет открываться новая панель управления, содержащая более 40 различных ярлыков, ранее доступных в меню «Пуск», включая Windows PowerShell, Быстрая помощь, Power Automate Desktop, диалоговое окно «Выполнить», Средство записи действий, Подключение к удаленному рабочему столу и др.

Как и текущую панель «Средства администрирования Windows», новую панель Windows Tools можно будет запустить из командной строки с помощью команды control admintools .

Также новую панель можно будет запустить из диалогового окна «Выполнить» или с помощью ярлыка, содержащего следующую команду:

А как же полный отказ от панели управления?

Microsoft стала уделять больше времени улучшению панели управления. Это поразительный факт, ведь компания уже давно решила полностью перенести все существующие в Windows 10 апплеты панели управления в приложение «Параметры».

Еще в прошлом году в официальном блоге Microsoft один из руководителей программы Windows Insider, Брэндон ЛеБланк ( Brandon LeBlanc) заявлял, что долгосрочная цель Microsoft заключается в том, чтобы в приложении «Параметры» были доступны те же возможности, что и в устаревшей панели управления.

ЛеБланк сообщал в блоге:

Будут и другие улучшения, которые еще больше приблизят приложение «Параметры» к панели управления. Если вы до сих пор используете какие-либо функции, доступные только в панели управления, сообщите подробности с помощью обратной связи.

Одно время казалось, что Microsoft настроена очень решительно, и эра панели управления безнадежно уходит. Например, компания настроила перенаправление из панели управления на страницу «О программе» приложения «Параметры».

Текущее изменение идет вразрез с планом Microsoft по полному отказу от панели управления и ее замене на приложение «Параметры».

Navigation design basics for Windows apps

If you think of an app as a collection of pages, navigation describes the act of moving between pages and within a page. It’s the starting point of the user experience, and it’s how users find the content and features they’re interested in. It’s very important, and it can be difficult to get right.

We have a huge number of choices to make for navigation. We could:

Require users to go through a series of pages in order.

Provide a menu that allows users to jump directly to any page.

Place everything on a single page and provide filtering mechanisms for viewing content.

While there’s no single navigation design that works for every app, there are principles and guidelines to help you decide the right design for your app.

Principles of good navigation

Let’s start with the basic principles of good navigation design:

  • Consistency: Meet user expectations.
  • Simplicity: Don’t do more than you need to.
  • Clarity: Provide clear paths and options.

Consistency

Navigation should be consistent with user expectations. Using standard controls that users are familiar with and following standard conventions for icons, location, and styling will make navigation predictable and intuitive for users.

Users expect to find certain UI elements in standard locations.

Simplicity

Fewer navigation items simplify decision making for users. Providing easy access to important destinations and hiding less important items will help users get where they want, faster.

Present navigation items in a familiar navigation menu.

Overwhelm users with many navigation options.

Clarity

Clear paths allow for logical navigation for users. Making navigation options obvious and clarifying relationships between pages should prevent users from getting lost.

Destinations are clearly labeled so users know where they are.

General recommendations

Now, let’s take our design principles—consistency, simplicity, and clarity—and use them to come up with some general recommendations.

Think about your users. Trace out typical paths they might take through your app, and for each page, think about why the user is there and where they might want to go.

Avoid deep navigation hierarchies. If you go beyond three levels of navigation, you risk stranding your user in a deep hierarchy that they will have difficulty leaving.

Avoid «pogo-sticking.» Pogo-sticking occurs when there is related content, but navigating to it requires the user to go up a level and then down again.

Use the right structure

Now that you’re familiar with general navigation principles, how should you structure your app? There are two general structures: flat and hierarchal.

Flat/lateral

In a flat/lateral structure, pages exist side-by-side. You can go from one page to another in any order.

We recommend using a flat structure when:

  • The pages can be viewed in any order.
  • The pages are clearly distinct from each other and don’t have an obvious parent/child relationship.
  • There are less than 8 pages in the group.
    (When there are more pages, it might be difficult for users to understand how the pages are unique or to understand their current location within the group. If you don’t think that’s an issue for your app, go ahead and make the pages peers. Otherwise, consider using a hierarchical structure to break the pages into two or more smaller groups.)
Читайте также:  Mac os образ для usb

Hierarchical

In a hierarchical structure, pages are organized into a tree-like structure. Each child page has one parent, but a parent can have one or more child pages. To reach a child page, you travel through the parent.

Hierarchical structures are good for organizing complex content that spans lots of pages. The downside is some navigation overhead: the deeper the structure, the more clicks it takes to get from page to page.

We recommend a hierarchical structure when:

  • Pages should be traversed in a specific order.
  • There is a clear parent-child relationship between pages.
  • There are more than 7 pages in the group.

Combining structures

You don’t have to choose one structure or the other; many well-design apps use both. An app can use flat structures for top-level pages that can be viewed in any order, and hierarchical structures for pages that have more complex relationships.

If your navigation structure has multiple levels, we recommend that peer-to-peer navigation elements only link to the peers within their current subtree. Consider the adjacent illustration, which shows a navigation structure that has two levels:

  • At level 1, the peer-to-peer navigation element should provide access to pages A, B, and C.
  • At level 2, the peer-to-peer navigation elements for the A2 pages should only link to the other A2 pages. They should not link to level 2 pages in the C subtree.

Use the right controls

Once you’ve decided on a page structure, you need to decide how users navigate through those pages. UWP provides a variety of navigation controls to help ensure a consistent, reliable navigation experience in your app.

With few exceptions, any app that has multiple pages uses a frame. Typically, an app has a main page that contains the frame and a primary navigation element, such as a navigation view control. When the user selects a page, the frame loads and displays it.

Displays a horizontal list of links to pages at the same level. The NavigationView control implements the top navigation pattern.

Use top navigation when:

  • You want to show all navigation options on the screen.
  • You desire more space for your app’s content.
  • Icons cannot clearly describe your navigation categories.

Displays a horizontal set of tabs and their respective content. The TabView control is useful for displaying several pages (or documents) while giving the user the capability to rearrange, open, or close tabs.

  • You want users to be able to dynamically open, close, or rearrange tabs.
  • You expect that there might be a large number of tabs open at once.
  • You expect users to be able to easily move tabs between windows in your application that use tabs, similar to web browsers like Microsoft Edge.

Displays a vertical list of links to top-level pages. Use when:

  • The pages exist at the top level.
  • There are many navigation items (more than 5)
  • You don’t expect users to switch between pages frequently.

Displays a list of items. Selecting an item displays its corresponding page in the details section. Use when:

  • You expect users to switch between child items frequently.
  • You want to enable the user to perform high-level operations, such as deleting or sorting, on individual items or groups of items, and also want to enable the user to view or update the details for each item.

List/details is well suited for email inboxes, contact lists, and data entry.

Embedded navigation elements can appear in a page’s content. Unlike other navigation elements, which should be consistent across the pages, content-embedded navigation elements are unique from page to page.

Next: Add navigation code to your app

The next article, Implement basic navigation, shows the code required to use a Frame control to enable basic navigation between two pages in your app.

Основы проектирования навигации для приложений для Windows Navigation design basics for Windows apps

Если вы рассматриваете приложение как коллекцию страниц, термин навигация описывает действие перемещения между страницами и на странице. If you think of an app as a collection of pages, navigation describes the act of moving between pages and within a page. Навигация является отправной точкой взаимодействия пользователя с интерфейсом. Она служит для поиска содержимого и функций, интересных пользователю. It’s the starting point of the user experience, and it’s how users find the content and features they’re interested in. Это очень важно, и иногда сложно сделать правильно. It’s very important, and it can be difficult to get right.

Есть огромное количество способов реализации навигации. We have a huge number of choices to make for navigation. Можно сделать следующее: We could:

Требовать от пользователей просматривать ряд страниц по порядку. Require users to go through a series of pages in order.

Создать меню, которое позволит пользователям переходить непосредственно к любой странице. Provide a menu that allows users to jump directly to any page.

Поместить все на одной странице и предоставить механизмы фильтрации для просмотра содержимого. Place everything on a single page and provide filtering mechanisms for viewing content.

Не существует единой схемы навигации, подходящей для каждого приложения. Существует набор принципов и рекомендаций, которым можно следовать, чтобы разработать правильный проект приложения. While there’s no single navigation design that works for every app, there are principles and guidelines to help you decide the right design for your app.

Принципы хорошей навигации Principles of good navigation

Начнем с базовых принципов разработки удобной навигации: Let’s start with the basic principles of good navigation design:

  • Согласованность: соответствуйте ожиданиям пользователя. Consistency: Meet user expectations.
  • Простота: не делайте больше, чем нужно сделать. Simplicity: Don’t do more than you need to.
  • Понятность: предоставляйте понятные пути навигации и варианты выбора. Clarity: Provide clear paths and options.

Consistency Consistency

Навигация должна быть согласована с ожиданиями пользователей. Navigation should be consistent with user expectations. Использование стандартных элементов управления, с которыми пользователи уже знакомы, и общепринятых обозначений для значков, расположений и стилей позволит сделать навигацию предсказуемой и интуитивно понятной для пользователей. Using standard controls that users are familiar with and following standard conventions for icons, location, and styling will make navigation predictable and intuitive for users.

Читайте также:  Аналоги зона для линукс

Пользователь ожидает найти определенные элементы пользовательского интерфейса в стандартных расположениях. Users expect to find certain UI elements in standard locations.

Простота Simplicity

Отсутствие большого числа элементов навигации упрощает принятие решений для пользователей. Fewer navigation items simplify decision making for users. Реализация удобного доступа к важным пунктам назначения и скрытие менее важных элементов поможет пользователям находить то, что им нужно, быстрее. Providing easy access to important destinations and hiding less important items will help users get where they want, faster.

Представляйте элементы навигации в знакомом меню навигации. Present navigation items in a familiar navigation menu.

Не перегружайте пользователя различными параметрами навигации. Overwhelm users with many navigation options.

Понятность Clarity

Понятные пути навигации обеспечивают возможность логической навигации для пользователей. Clear paths allow for logical navigation for users. Благодаря очевидным вариантам навигации и упрощению связей между страницами пользователь не потеряется в приложении. Making navigation options obvious and clarifying relationships between pages should prevent users from getting lost.

Пункты назначения должны иметь четкую разметку, чтобы пользователи знали, в каком разделе они находятся. Destinations are clearly labeled so users know where they are.

Общие рекомендации General recommendations

Теперь на основе знаний о наших принципах проектирования — единообразии, простоте и понятности — попробуем сформировать некоторые общие рекомендации. Now, let’s take our design principles—consistency, simplicity, and clarity—and use them to come up with some general recommendations.

Подумайте о пользователях. Think about your users. Подумайте над тем, какие пути пользователи могут часто использовать для навигации в вашем приложении, а также для каждой страницы, поразмышляйте о том, почему пользователь находится на конкретной странице и куда он собирается перейти в последствии. Trace out typical paths they might take through your app, and for each page, think about why the user is there and where they might want to go.

Избегайте глубоких навигационных иерархий. Avoid deep navigation hierarchies. Если уровней навигации будет больше трех, вы рискуете тем, что пользователь застрянет в многоуровневой иерархии, которую ему сложно будет покинуть. If you go beyond three levels of navigation, you risk stranding your user in a deep hierarchy that they will have difficulty leaving.

Избегайте прыжков вверх и вниз. Avoid «pogo-sticking.» Прыжки вверх и вниз возникают, когда есть связанное содержимое, но для перехода к нему необходимо, чтобы пользователь перешел на один уровень вверх, а затем снова вниз. Pogo-sticking occurs when there is related content, but navigating to it requires the user to go up a level and then down again.

Использование подходящей структуры Use the right structure

Теперь, когда вы ознакомились с общими принципами навигации, какую структуру вы бы создали для приложения? Now that you’re familiar with general navigation principles, how should you structure your app? Существует две общие структуры: плоская и иерархическая. There are two general structures: flat and hierarchal.

Плоская или боковая Flat/lateral

В плоской или боковой структуре страницы располагаются рядом друг с другом. In a flat/lateral structure, pages exist side-by-side. Вы можете переходить от одной страницы к другой в любом порядке. You can go from one page to another in any order.

Мы рекомендуем использовать плоскую структуру в следующих случаях. We recommend using a flat structure when:

  • Страницы могут просматриваться в любом порядке. The pages can be viewed in any order.
  • Страницы явно отличаются друг от друга и не имеют очевидных отношений типа «предок — потомок». The pages are clearly distinct from each other and don’t have an obvious parent/child relationship.
  • Группа содержит менее 8 страниц. There are less than 8 pages in the group.
    (Если в группе больше страниц, пользователю может быть трудно понять, чем они отличаются друг от друга, или определить свое текущее местоположение в группе. (When there are more pages, it might be difficult for users to understand how the pages are unique or to understand their current location within the group. Если вам кажется, что затруднений не возникнет, используйте одноранговую модель организации страниц. If you don’t think that’s an issue for your app, go ahead and make the pages peers. В противном случае используйте иерархическую структуру, чтобы разбить страницы на две или несколько более мелких групп.) Otherwise, consider using a hierarchical structure to break the pages into two or more smaller groups.)

Иерархическая Hierarchical

В иерархической структуре страницы организованы в древовидную структуру. In a hierarchical structure, pages are organized into a tree-like structure. У каждой дочерней страницы имеется одна родительская, но одна родительская страница может иметь одну или несколько дочерних. Each child page has one parent, but a parent can have one or more child pages. Чтобы попасть на дочернюю страницу, сначала необходимо обратиться к родительской. To reach a child page, you travel through the parent.

Иерархические структуры хорошо подходят для упорядочивания сложного содержимого, занимающего большое количество страниц. Hierarchical structures are good for organizing complex content that spans lots of pages. Недостаток ее заключается в некоторых издержках навигации: чем глубже структура, тем больше нажатий требуется пользователям, чтобы перейти от страницы к странице. The downside is some navigation overhead: the deeper the structure, the more clicks it takes to get from page to page.

Мы рекомендуем иерархическую модель структуры в следующих случаях. We recommend a hierarchical structure when:

  • Просмотр страниц должен осуществляться в определенном порядке. Pages should be traversed in a specific order.
  • Существует четкая иерархическая связь между страницами — «родительский — дочерний». There is a clear parent-child relationship between pages.
  • Группа содержит более 7 страниц. There are more than 7 pages in the group.

Объединение структур Combining structures

Вам не нужно выбирать какую-то конкретную структуру. Многие хорошо разработанные приложения одновременно используют плоскую и иерархическую структуры. You don’t have to choose one structure or the other; many well-design apps use both. В приложении могут использоваться плоские структуры для страниц верхнего уровня, которые можно просматривать в любом порядке, и иерархические структуры для страниц, которые имеют более сложные связи. An app can use flat structures for top-level pages that can be viewed in any order, and hierarchical structures for pages that have more complex relationships.

Читайте также:  Как сделать прозрачную клавиатуру windows 10

Если в структуре навигации имеется несколько уровней, мы рекомендуем, чтобы одноранговые элементы ссылались друг на друга только в пределах своего текущего поддерева. If your navigation structure has multiple levels, we recommend that peer-to-peer navigation elements only link to the peers within their current subtree. Изучите следующую иллюстрацию, на которой показана трехуровневая структура навигации: Consider the adjacent illustration, which shows a navigation structure that has two levels:

  • На уровне 1 элемент одноранговой модели навигации должен предоставлять доступ к страницам A, B и C. At level 1, the peer-to-peer navigation element should provide access to pages A, B, and C.
  • На уровне 2 элементы одноранговой модели навигации страниц A2 должны ссылаться только на другие страницы A2. At level 2, the peer-to-peer navigation elements for the A2 pages should only link to the other A2 pages. Они не должны ссылаться на страницы уровня 2 поддерева C. They should not link to level 2 pages in the C subtree.

Использование правильных элементов управления Use the right controls

Когда вы решите, какую структуру страниц хотите использовать, вам нужно решить, как пользователи будут переходить по этим страницам. Once you’ve decided on a page structure, you need to decide how users navigate through those pages. UWP предоставляет разнообразные элементы управления навигацией, позволяющие обеспечить единообразную и надежную навигацию в приложении. UWP provides a variety of navigation controls to help ensure a consistent, reliable navigation experience in your app.

С некоторыми исключениями любое приложение, которое состоит из нескольких страниц, использует кадры. With few exceptions, any app that has multiple pages uses a frame. Как правило, приложение имеет главную страницу, содержащую кадр, и элемент первичной навигации, например элемент управления представлением навигации. Typically, an app has a main page that contains the frame and a primary navigation element, such as a navigation view control. Когда пользователь выбирает страницу, кадр загружает и отображает ее. When the user selects a page, the frame loads and displays it.

Отображают горизонтальный список ссылок на страницы одного уровня. Displays a horizontal list of links to pages at the same level. Элемент управления NavigationView реализует шаблоны верхней панели навигации. The NavigationView control implements the top navigation pattern.

Используйте верхнюю панель навигации, если: Use top navigation when:

  • вы хотите отобразить все параметры навигации на экране; You want to show all navigation options on the screen.
  • вам требуется больше места для содержимого приложения; You desire more space for your app’s content.
  • значки не четко описывают категории навигации. Icons cannot clearly describe your navigation categories.

Отображает горизонтальный набор вкладок и соответствующее содержимое. Displays a horizontal set of tabs and their respective content. Элементы управления TabView удобно использовать, чтобы отображать несколько страниц (или документов). С их помощью пользователь может изменять порядок вкладок, а также открывать и закрывать их. The TabView control is useful for displaying several pages (or documents) while giving the user the capability to rearrange, open, or close tabs.

Используйте вкладки, если: Use tabs when:

  • пользователи должны иметь возможность динамически открывать, закрывать или переупорядочивать вкладки; You want users to be able to dynamically open, close, or rearrange tabs.
  • предполагается, что одновременно может быть открыто большое количество вкладок; You expect that there might be a large number of tabs open at once.
  • предполагается, что пользователи смогут легко перемещать вкладки между окнами в приложении, которое использует вкладки, как и другие веб-браузеры, например Microsoft Edge. You expect users to be able to easily move tabs between windows in your application that use tabs, similar to web browsers like Microsoft Edge.

Отображает вертикальный список ссылок на страницы верхнего уровня. Displays a vertical list of links to top-level pages. Используется, когда: Use when:

  • Страницы располагаются на верхнем уровне. The pages exist at the top level.
  • Есть много элементов навигации (более 5). There are many navigation items (more than 5)
  • Предполагается, что пользователи не будут часто переключаться между страницами. You don’t expect users to switch between pages frequently.

Выводит список элементов. Displays a list of items. При выборе элемента отображается соответствующая ему страница в разделе сведений. Selecting an item displays its corresponding page in the details section. Используется, когда: Use when:

  • Предполагается, что пользователи будут часто переключаться между дочерними элементами. You expect users to switch between child items frequently.
  • Вы хотите позволить пользователю выполнять операции высокого уровня, например удаление или сортировку, с отдельными элементами или группами элементов, а также хотите позволить им просматривать или обновлять сведения о каждом элементе. You want to enable the user to perform high-level operations, such as deleting or sorting, on individual items or groups of items, and also want to enable the user to view or update the details for each item.

Шаблон «Список и подробные сведения» хорошо подходит для почтовых приложений, списков контактов и ввода данных. List/details is well suited for email inboxes, contact lists, and data entry.

Встроенные элементы навигации могут отображаться в содержимом страницы. Embedded navigation elements can appear in a page’s content. В отличие от других элементов навигации, которые должны сохранять единообразие на страницах, элементы управления, встроенные в содержимое, различаются от страницы к странице. Unlike other navigation elements, which should be consistent across the pages, content-embedded navigation elements are unique from page to page.

Далее: добавление кода навигации в приложение Next: Add navigation code to your app

В следующей статье Implement navigation between two pages (Реализация навигации между двумя страницами) показан код, необходимый для использования элемента управления Frame, чтобы реализовать базовую навигацию между двумя страницами в приложении. The next article, Implement basic navigation, shows the code required to use a Frame control to enable basic navigation between two pages in your app.

Оцените статью