На конференції розробників Google I/O, що проходить в Лос-Анджелесі, компанія представила велику кількість нововведень для своїх служб і операційних систем. Дизайн-концепція Material, яка буде впроваджена в нову версію Android, Chrome OS, а також служби Google, слідуючи загальній тенденції, передбачає використання однотонних кольорів і простих плоских форм в об'ємному просторі.
Інтерфейс поділяється на шари і візуалізується в 3D-сцені з урахуванням джерела світла, правильної перспективи і реалістичних тіней. Велику увагу було приділено анімації: майже кожна дія, включаючи дотик до екрану, супроводжується плавними візуальними ефектами. Анімація підтримується не тільки всередині програм, але і при переході між ними.
Дизайн став набагато більш жорстким, поєднуючи приглушені кольори з насиченими і часто навіть їдкими акцентами. Інструмент Pallete надає розробникам функцію автоматичного підбору кольору на основі присутніх на екрані зображень. Активно використовуються круглі кнопки. Звертає на себе увагу кнопка між будь-якими двома блоками, яка виконує різні функції управління.
Причому цей дизайн буде використовуватися у всіх продуктах Google, а також у веб-службах, уніфікувавши їх зовнішній вигляд і елементи управління. Був удосконалений шрифт Roboto, який виступає основоположною частиною дизайну Android, для оптимальної роботи в будь-яких оточеннях: від годин до телевізорів.
Новий дизайн Google демонструвала на прикладі стандартних додатків Android. Відразу звертає на себе увагу велика кількість білого кольору та плаский інтерфейс, а також присутність круглих форм і тіней від верхніх шарів. Наприклад, у поштовому клієнті Gmail фотографії адресатів відображаються в колах за аналогією з Google +.
Сповіщення тепер виводяться у вигляді окремих карток, які групуються на екрані блокування, де їх можна пролистати, а непотрібні - змахнути в бік. Якщо важливе повідомлення приходить під час гри, то воно спливає зверху, а гра завмирає.
material
patterns-promotedactions-associatedcontent-FAB03do2_large_mdpi_verge_super_wide.png
Дивитися всі зображення (12)
patterns-search-persistentsearch2-search_persistent_zero_large_mdpi_verge_super_wide.png patterns-selection-selection-textfields_select_03b_large_mdpi_verge_super_wide.png patterns-selection-selection-textfields_select_11a_large_mdpi_verge_super_wide.png style-imagery-integration-imagetypeherob_large_mdpi_verge_super_wide.png style-imagery-integration-introduce_scaleb_large_mdpi_verge_super_wide.png style-imagery-integration-typetreatment1do_large_mdpi_verge_super_wide.png style-imagery-integration-typetreatment2do_large_mdpi_verge_super_wide.png style-imagery-principles-ubiquitous_20delight_large_mdpi_verge_super_wide.png style-typography2_large_mdpi_verge_super_wide.png style-typography6_large_mdpi_verge_super_wide.png style-typography12_large_mdpi_verge_super_wide.png
Дивитися все
зображення (12)
Веб-інструмент Polymer, який включає понад 250 API, дозволить розробникам легко слідувати новій концепції дизайну при створенні сайтів, у тому числі застосовувати впізнавану анімацію з частотою 60 кадрів/с і звичні елементи інтерфейсу Material. Познайомитися із застосуванням нової мови дизайну в Інтернеті можна за допомогою демонстраційного сайту тестування.
Використання Polymer на прикладі API Google Maps
У найближчі місяці всі додатки і служби Google стануть відповідати новим правилам дизайну. Більш детально з філософією дизайну Google можна ознайомитися на відповідній сторінці.
