Оффтоп Philipp Kontsarenko
31 948

10 Android-приложений в стиле Material Design, которые уже доступны в Google Play

Material Design был продемонстрирован на конференции разработчиков Google I/O летом 2014 года. По мнению многих UX-дизайнеров, корпорация впервые представила реальную альтернативу гайдлайнам Apple. Издание The Verge подготовило список десяти Android-приложений, которые являются хорошими примерами реализации стиля Material Design.

В основе гайдлайнов Material Design лежат простые лаконичные формы и графические элементы. В гайдлайне Google у объектов отсутствует объем, мелкие детали и детализация в целом.

Первое практическое применение Material Design получил в сервисе Google Now. Стиль стал основой для операционной системы Android 5.0, известной также как Android Lollipop.

Action Launcher 3

Простой лаунчер для операционной системы Android. Action Launcher 3 добавляет «быстрое меню» для доступа к приложениям, может изменять дизайн интерфейса, фоновое изображение, меню и прочее.

Скачать (бесплатно).

Falcon Pro 3

Альтернативный Twitter-клиент для Android-смартфона или планшета обновил свою графику и анимацию в соответствии с гайдлайнами Material Design.

Скачать ($3,99).

FeedlyReader

RSS-ридер для сервиса Feedly также обновил свой интерфейс в соответствии с гайдлайнами Google.

Скачать (бесплатно).

Cabinet

Разработчики файлового менеджера первыми обновили интерфейс сервиса — Cabinet в Material Design появился еще до официального выхода операционной системы Android Lollipop. Приложение позволяет управлять файлами в смартфоне.

Скачать (бесплатно).

Google Inbox

Один из лучших, по мнению редакции The Verge, примеров применения концепции Material Design. Inbox заимствует идею стартапа Mailbox, который каждое входящее письмо представляет в виде задачи. Сервис доступен по приглашениям.

Скачать (бесплатно, требуется приглашение).

Weather Timeline

Простое приложение с прогнозом погоды. Разработчики предусмотрели возможностью установки виджета — также в стиле Material Design.

Скачать ($0,99).

Simplenote

Кроссплатформенное приложение для создания «быстрых» заметок. В последней версии разработчики переработали интерфейс в соответствии с новыми гайдлайнами Google.

Скачать (бесплатно).

Google Messenger

Еще одно приложение Google, обновленное в Material Design. Пользователи могут менять цвета диалогов, настраивать уведомления и прочее.

Скачать (бесплатно).

QuickPic

Просмотрщик фотографий и видео для Android.

Скачать (бесплатно).

Google Calendar

По мнению The Verge, Google Calendar является примером того, как применять Material Design в разработке приложений: полноэкранный виджет, анимация элементов и палитра цветов.

Скачать (бесплатно).

#Интерфейсы #мобильные_приложения #Android #интерфейсы #Material_Design

Статьи по теме
Редизайн: Поиск Google в стиле Material Design
{ "author_name": "Philipp Kontsarenko", "author_type": "editor", "tags": ["\u043c\u043e\u0431\u0438\u043b\u044c\u043d\u044b\u0435_\u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f","\u0438\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441\u044b","\u0434\u0438\u0437\u0430\u0439\u043d","material_design","android"], "comments": 54, "likes": 40, "favorites": 1, "is_advertisement": false, "subsite_label": "flood", "id": 6494, "is_wide": true }
00
дни
00
часы
00
мин
00
сек
(function(){ var banner = document.querySelector('.teaserSberbank'); var isAdsDisabled = document.querySelector('noad'); if (!isAdsDisabled){ var countdownTimer = null; var timerItem = document.querySelectorAll('[data-sber-timer]'); var seconds = parseInt('15388' + '59599') - now(); function now(){ return Math.round(new Date().getTime()/1000.0); } function timer() { var days = Math.floor(seconds / 24 / 60 / 60); var hoursLeft = Math.floor((seconds) - (days * 86400)); var hours = Math.floor(hoursLeft / 3600); var minutesLeft = Math.floor((hoursLeft) - (hours * 3600)); var minutes = Math.floor(minutesLeft / 60); var remainingSeconds = seconds % 60; if (days < 10) days = '0' + days; if (hours < 10) hours = '0' + hours; if (minutes < 10) minutes = '0' + minutes; if (remainingSeconds < 10) remainingSeconds = '0' + remainingSeconds; if (seconds <= 0) { clearInterval(countdownTimer); } else { timerItem[0].textContent = days; timerItem[1].textContent = hours; timerItem[2].textContent = minutes; timerItem[3].textContent = remainingSeconds; seconds -= 1; } } timer(); countdownTimer = setInterval(timer, 1000); } else { banner.style.display = 'none'; } })();
{ "id": 6494, "author_id": 4, "diff_limit": 1000, "urls": {"diff":"\/comments\/6494\/get","add":"\/comments\/6494\/add","edit":"\/comments\/edit","remove":"\/admin\/comments\/remove","pin":"\/admin\/comments\/pin","get4edit":"\/comments\/get4edit","complain":"\/comments\/complain","load_more":"\/comments\/loading\/6494"}, "attach_limit": 2, "max_comment_text_length": 5000, "subsite_id": 199791 }

54 комментария 54 комм.

Популярные

По порядку

Написать комментарий...
7

В гайдлайне Google у объектов отсутствует объем, мелкие детали и детализация в целом.

Это не совсем корректно, потому что объём — как раз одно из ключевых отличий material дизайна от того же флэта. И как раз в гайдлайнах, на которые вы ссылаетесь, об этом прекрасно написано:

Ответить
4

На мой взгляд получилось гораздо лучше, чем у MS и Apple

Ответить
0

Ну точно лучше чем у MS.

Ответить
4

PushBullet забыли. Очень полезный сервис (Уведомления с Андроид отображаются в Google Now на PC) и полностью material.

Ответить
0

Там еще файлики-ссылки перекидывать можно с разных устройств, что бывает выручает

Ответить
0

Сервис зачетный, и модно выглядит очень давно

Ответить
2

Воу, не знал, что вышла новая версия фалкон (она кстати бесплатная, а у вас написано, что стоит 3 доллара), надо будет затетстить, раньше он был лучшим твиттер-клиентом, до тех пор пока твиттер его не убил.

Ответить
3

А, прошу прощения, фалконом действительно невозможно пользоваться без покупки.

Ответить
0

че к чему вообще? в эпл уже давно весь этот флет, или я не прав?

Ответить
20

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

Ответить
3

мое забыли!)

Ответить
0

что-то не находится ваше приложение

Ответить
0

Нужно что бы заголовок занимал весь экран.

Ответить
–15

Невольно вспоминаются упреки эплхейтеров по поводу ярких цветов iOS для «гомосексуалистов». Ну наслаждайтесь теперь в 10 раз более ядреным Андороидом :)

Ответить
9

Если Вы не видите разницы в цветах из скриншотов выше и iOS, то здесь явно что-то не так.
А вообще - слишком толсто ;-)

Ответить
–10

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

Ответить
1

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

Ответить
0

Шикарная шторка из iOS, имитирующая матовое стекло, кстати.

Ответить
0

даже MS уже считает что матовое стекло это слишком попсово и убого.

Ответить
0

да то что уж они-то точно не передовики интерфейсостроения

Ответить
0

То-то и оно.

Ответить

Комментарий удален

Комментарий удален

Комментарий удален

Комментарий удален

Комментарий удален

–9

Мне одной это dermo не нравится?

Ответить
13

Закрой glazzies и uspokoisya.

Ответить
1

Будет темно. И страшно(((...

Ответить
0

Нет. То есть, идея исходно неплохая, но переборщили. Особенно с анимацией: многослойное соскальзывание контента за экран при скроллинге раздражает.

Кстати, похоже, Гугл-таки сам втихаря правит это дело. Раньше в том же Google Play при просмотре страницы приложения от анимации аж в глазах рябило. Сейчас посмотрел - стало явно меньше. Предчувствую, что еще через несколько месяцев все сведется к старому Holo дизайну, отличаясь только цветами и шрифтами.

Ну и конкретно мне очень не нравится выбор цветов - грязные какие-то. Впрочем, это готов списать на вкусовщину.

Ответить
1

Кстати, странно, что не указаны гугл карты.

Ответить
4

еще и telegram. tumblr. link2sd

Ответить
2

Укажите, action launcher 3 тоже условно бесплатный - большая часть настроек и фишек доступна лишь при покупке plus-статуса)

Ответить
2

Мне казалось Wally + попадает под этот концепт. Хотя, наверное, слишком много деталей.

Ответить
1

Цукерберганы, скажите у меня похоже приложение на материал дизайн? http://goo.gl/yFyxU1

Ответить
2

Абсолютно нет. Ни капельку.

Ответить
0

Старался делать всё по инструкции!

Ответить
1

Нет такого в инструкциях.

Ответить
0

нет

Ответить
1

Давайте конкретнее, что не га гайдам?

Ответить
0

Таси ханбон март чусэйо?

Ответить
0

Кантонский диалект? Или уханьский??

Ответить
–1

Корейский с опечаткой :(((((((((

Ответить
0

"не по гайдам" всмысле

Ответить
0

Иконка не в том стиле

Ответить
0

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

Ответить
3

Кто захотел тот обновился за две недели. Да-да, я про Telegram.

Ответить
1

Тупо скопировали список приложений из the Verg, и выдали за свой. Красавцы. Могли бы и сами поработать, потому как приложений куда больше

Ответить
0

где написано, что ЦП позиционирует подборку как "свою"?

Ответить
0

Дело в том, что ни где источник не указан. А раз не указан то...

Ответить
1

Специально для Вас не поленился сделать скриншот, не благодарите

Ответить
1

Извиняюсь тогда, наверное я ослеп немного. Реально не видел это, когда читал.

Ответить
1

Календарь - ужасное уёбище. Ну как можно было сделать основной режим, в котором отображается 5 дней вместо всей недели?

Ответить
1

А Telegram?

Ответить
0

телеграмм реально забыли!

Ответить

Комментарий удален

1

http://on.be.net/1wm4TAd

Наконец дельное сделали.

Ответить
0

Придожениями в материал-сииле приятно пользоваться.

Они выглядят... не такими сумбурными

Но это сейчас, пока школота такие дизайны клепать не начала

Ответить

Комментарий удален

0

Прямой эфир

[ { "id": 1, "label": "100%×150_Branding_desktop", "provider": "adfox", "adaptive": [ "desktop" ], "adfox_method": "createAdaptive", "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "ezfl" } } }, { "id": 2, "label": "1200х400", "provider": "adfox", "adaptive": [ "phone" ], "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "ezfn" } } }, { "id": 3, "label": "240х200 _ТГБ_desktop", "provider": "adfox", "adaptive": [ "desktop" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "fizc" } } }, { "id": 4, "label": "240х200_mobile", "provider": "adfox", "adaptive": [ "phone" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "flbq" } } }, { "id": 5, "label": "300x500_desktop", "provider": "adfox", "adaptive": [ "desktop" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "ezfk" } } }, { "id": 6, "label": "1180х250_Interpool_баннер над комментариями_Desktop", "provider": "adfox", "adaptive": [ "desktop" ], "adfox": { "ownerId": 228129, "params": { "pp": "h", "ps": "bugf", "p2": "ffyh" } } }, { "id": 7, "label": "Article Footer 100%_desktop_mobile", "provider": "adfox", "adaptive": [ "desktop", "tablet", "phone" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "fjxb" } } }, { "id": 8, "label": "Fullscreen Desktop", "provider": "adfox", "adaptive": [ "desktop", "tablet" ], "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "fjoh" } } }, { "id": 9, "label": "Fullscreen Mobile", "provider": "adfox", "adaptive": [ "phone" ], "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "fjog" } } }, { "id": 10, "disable": true, "label": "Native Partner Desktop", "provider": "adfox", "adaptive": [ "desktop", "tablet" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "clmf", "p2": "fmyb" } } }, { "id": 11, "disable": true, "label": "Native Partner Mobile", "provider": "adfox", "adaptive": [ "phone" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "clmf", "p2": "fmyc" } } }, { "id": 12, "label": "Кнопка в шапке", "provider": "adfox", "adaptive": [ "desktop" ], "adfox": { "ownerId": 228129, "params": { "p1": "bscsh", "p2": "fdhx" } } }, { "id": 13, "label": "DM InPage Video PartnerCode", "provider": "adfox", "adaptive": [ "desktop", "tablet", "phone" ], "adfox_method": "createAdaptive", "adfox": { "ownerId": 228129, "params": { "pp": "h", "ps": "bugf", "p2": "flvn" } } }, { "id": 14, "label": "Yandex context video banner", "provider": "yandex", "yandex": { "block_id": "VI-223676-0", "render_to": "inpage_VI-223676-0-1104503429", "adfox_url": "//ads.adfox.ru/228129/getCode?pp=h&ps=bugf&p2=fpjw&puid1=&puid2=&puid3=&puid4=&puid8=&puid9=&puid10=&puid21=&puid22=&puid31=&puid32=&puid33=&fmt=1&dl={REFERER}&pr=" } }, { "id": 15, "label": "Плашка на главной", "provider": "adfox", "adaptive": [ "desktop", "tablet", "phone" ], "adfox": { "ownerId": 228129, "params": { "p1": "byudx", "p2": "ftjf" } } }, { "id": 16, "label": "Кнопка в шапке мобайл", "provider": "adfox", "adaptive": [ "tablet", "phone" ], "adfox": { "ownerId": 228129, "params": { "p1": "byzqf", "p2": "ftwx" } } }, { "id": 17, "label": "Stratum Desktop", "provider": "adfox", "adaptive": [ "desktop" ], "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "fzvb" } } }, { "id": 18, "label": "Stratum Mobile", "provider": "adfox", "adaptive": [ "tablet", "phone" ], "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "fzvc" } } }, { "id": 19, "label": "Тизер на главной", "provider": "adfox", "adaptive": [ "desktop", "tablet", "phone" ], "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "p1": "cbltd", "p2": "gazs" } } } ]
Команда калифорнийского проекта
оказалась нейронной сетью
Подписаться на push-уведомления