Материальный дизайн — навигационные переходы

Навигационные переходы — это перемещение пользователя между экранами.

Про навигационные переходы

Движение

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

Например, когда элемент при взаимодействии расширяется и заполняет весь экран, это даёт понимание, что новый экран стал дочерным по отношению к предыдущему.

Иерархия

Навигация пользователя на уровень вверх или вниз называется иерархической, в то время одноранговые переходы перемещают пользователя между одноуровневыми элементами (экранами одинаковой иерархии).

Иерархические переходы

Такие переходы явно показывают когда пользователь перемещается вверх или вниз по уровням навигации приложения. Экраны на смежных уровнях друг с другом имеют родительские и дочерние отношения друг с другом, в которых родительский уровень находится на более высоком уровне иерархии, чем его дочерний элемент.

В родительский элемент встроен дочерный, при активации он поднимается и заполняет всё доступное пространство. Движение привлекает внимание на дочерный элемент, при этом усиливая связь между обоими элементами.

Одноранговые переходы

Такие переходы используются между экранами одного уровня иерархии.

Например, разделы в профиле пользователя или пошаговое оформление заказа. Экраны перемещаются в унисон, чтобы усилить связь друг с другом.

Высокоуровневые переходы

Такие переходы используются между несвязанными между собой экранами. Во время появления экраны используют прозрачность и масштабирование.