Being material

Being Material Акбашев Джалиль

gBeiMaterialn

WWW.REDMADROBOT.RU 2015

Долгое время информацию получали с листа бумаги


Типографика Искусство расположения/создания композиции из наборного материала на плоскости листа.


Скевоморфизм Направление в дизайне интерфейсов, целью которого является графическая имитация объектов реального мира


Скевоморфизм Направление в дизайне интерфейсов, целью которого является графическая имитация объектов реального мира

Сложность в разработке

Идет вразрез с принципом — как

можно меньше интерфейса


Плоский дизайн Минималистичный подход к дизайну объектов, который подчеркивает удобство использования

Много шума вокруг и хочется быть более сфокусированным

Люди привыкли к определенным символам и их можно упростить

M A T E R I A L D E S I G N

Давным-давно в Гугле…

majorgeeks.com zdnet.comcomputer.howstuffworks.com

Gmail.com Android Mobile Web

Проект Кеннеди

theverge.com

loliboat.wordpress.com

Holo

smartphoneblogging.com

Gmail for Android (Holo)

Gmail.com (Kennedy)

M A T E R I A L D E S I G N


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

Согласованный опыт на всех платформах


Более гибкая системадизайна для Android


Более гибкая системадизайна для Android

Рациональный подход к дизайну интерфейса

Тактильные поверхности

Полиграфический дизайн

Осмысленнаяанимация

Адаптивныйдизайн

Тактильные поверхности

Поверхность?

Да. Нет.

Поверхность?


Инструменты


CardView

RecyclerView

NavigationView TextInputLayout FloatingActionButton Snackbar AppBarLayout, TabLayout CoordinatorLayout CollapsingToolbar


До Material:


Material:


Пользуйтесь палитрой


values/

colors.xml dimens.xml

text_style.xml style.xml

атрибуты


colorPrimaryDark colorPrimary colorAccent

Расскажите дизайнерам про инструменты

Light Vibrant Vibrant Dark Vibrant

Light Muted Muted Dark Muted


Почему не стоит копировать гайдлайны один в один?


Section Title

12:30

Title 1 Title 1

Title 1 Title 1


Explore

12:30

VIEW ALL

Type of Restaurant - $$$$$

Address Line 1.,Address Line 2

Name of Restaurant

Collections Section

Type of Restaurant - $$$$$

Address Line 1.,Address Line 2

Name of Restaurant


Брэнд размывается и приложение может оказаться на «свалке» Google Play Store


Экспериментируйте и не бойтесь включать узнаваемые элементы вашего имиджа в приложение


Pesto


Crane Air


Abisko


Shrine


The Fortnightly


https://design.google.com/articles/expressing-brand-in-material/

https://design.google.com/articles/expressing-brand-in-material/


А зачем вообще обновлять дизайн?


Empathyперевод с англ. — сочувствие

хороший дизайнер сопереживает пользователю

1. Позаботьтесь о «логистике»

2. Не стоит насиловать кнопку

3. Не всё должно быть на карточке

4. Стоит уделять внимание деталям

5. Анимация — дорогая штучка

6. Почитайте про принципы Гештальт психологии

Крутыесоветы!

Вопросы?

Спасибо за внимание!

Акбашев Джалиль [email protected]

mailto:[email protected]

Being material

Design

Transcript of Being material