Блог почты
Последние события из жизни Почты, Календаря и Облака Mail.Ru
04 декабря 2015
2267

Облако для Android в стиле Material Design

cloudmailru-2

Мы полностью обновили дизайн Облако Mail.Ru для Android. И новая версия приложения выполнена по всем правилам Material Design!

Расскажем сначала, что же такое Material Design и почему это круто. С развитием устройств неизбежно менялись и интерфейсы, постепенно избавляясь от излишеств, становясь все более минималистичными и приобретая динамику. Material Design – это концепция, объединяющая на текущий момент все передовые наработки в области дизайна интерфейсов в единую стройную и логичную схему. Организация пространства рабочей области и взаимодействия объектов между собой имеет в Material Design четкие и обоснованные универсальные принципы.

Свойства и поведение каждого объекта на экране должны быть предсказуемы и понятны, как любое событие в физическом мире. Поэтому одним из основных принципов Material Design является повторение физических свойств поверхности для создания у пользователя интуитивного ощущения работы с реальными объектами при работе с интерфейсом. Сюда же добавим анимацию, поскольку движение маскимально интуитивно и наилучшим образом обеспечивает понимание переходов и моментальные отклики на любые действия пользователя. Структура и иерархия объектов в интерфейсе очень понятно и естественно передаются с помощью слоев, которые расположены на разной высоте и отбрасывают тень друг на друга. И нельзя не упомянуть о том, что Material Design визуально очень легок благодаря полному отказу от использования градиентов и текстур.

before-after-4

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

А теперь перейдем от теории к конкретике и расскажем, наконец, об изменениях, которые вы заметите в нашем приложении:

Одно из основных удобных нововведений – появление акцентной плавающей круглой кнопки для добавление контента (кнопка основного действия на экране). А на странице свойств объекта – своя главная кнопка, которая открывает файл для просмотра или содержимое папки.

before-after-1

Обновлены все базовые элементы управления — кнопки, формы, диалоги, контекстные меню, полосы прокрутки.

Модульная сетка подчинена шагу 8dp. Используется размерная шрифтовая сетка, отступы и блоки, заданные гайдлайнами – все это делает дизайн «чище».

before-after-2

Навигационная панель теперь увеличивается по высоте на карточке объекта и в случае использования табов. Кроме того, при скролле в окне свойств навигационная панель перекрашивается в цвет типа файла или в преобладающий цвет картинки – это выглядит очень круто! А статусная панель теперь имеет цвет навигационной панели.

before-after-3

Используется «оркестровка» анимации, когда экраны сменяются не целым листом, а трансформацией ключевых элементов с плавным переходом одного в другой. А также эффекты при взаимодействии с интерфейсом.

И на последок, анимационное видео, демонстрирующее работу приложения в новом дизайне.

Cloud.Mail.Ru | Material Design from Mail.Ru Group on Vimeo.

И еще кое-что…

Также обновленное приложение Облака «узнает» вас по отпечатку пальца (если на мобильном устройстве есть сканер и версия ОС 6.0 Marshmallow). Теперь даже потеряв телефон, вы можете быть уверены, что до файлов не доберутся посторонние. При этом, чтобы открыть приложение, не нужно ничего запоминать и вводить дополнительно – достаточно приложить палец.

Уже воспользовались новой версией приложения? Ждем ваших оценок и отзывов на странице приложения в Google Play.

Поделиться
Комментарии