Иллюстрации с подтекстом
Классный стиль иллюстраций в мобильном приложении: с одной стороны, сразу ясно, что про секс, с другой стороны — с аккуратными метафорами, без буквального воспроизведения тематики. Визуал живой, непосредственный, самоироничный и гибкий в использовании. За наводку спасибо @kirillooova


#mobile #иллюстрации

Визуальный код

Модуль-свитчер
Частая история: в приложении есть набор опций, которые можно включать/отключать, но сами по себе они не очень понятные и «продающие». А штука нужная. Приходится выкручиваться, добавляя к элементу управления подсказки и мелкие подписи.
В этом примере автор выкрутился иначе: сделал из переключателей отдельные модули с иконками, поясняющим текстом и дополнительными ссылками. Получилось просто, понятно и заметно.


#mobile #UI

Визуальный код

Фактоиды на мобильном
В мобильной версии сайта или в приложении с информационным уклоном вечно не хватает места под врезки и фактоиды.

В интерфейсе ВТБ-шного приложения это здорово свёрстано: фактоиды не просто идут друг под другом, а собраны в трёхколонники, расставлены по углам и по центру модулей. Получается аккуратно, чисто и экономно (хотя и мелковато).


#адаптив #mobile #фактоиды

Визуальный код

Пакет
В приложении доставки еды «Готово-ру» шторка стилизована под бумажный пакет.


#mobile

Визуальный код

Заголовки без отступов
Сочные контрастные цвета и крупные заголовки — настолько крупные, что подчёркнуто не влезают в экран и упираются в край без отступов. Приём про дерзость, напряжение, крик, вызов и молодость.


#композиция #mobile

Визуальный код

Фарш
Визуальный фарш, в котором есть свой шарм. Особенно когда это презентация.


#mobile #композиция

Визуальный код

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


#цвет #mobile

Визуальный код

Артборды
Интересная визуальная находка в кейсе — артборды со страницами на мобильных напоминают ленты и создают вертикальный ритм.


#mobile

Визуальный код

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


#навигация #mobile

Визуальный код

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


#mobile

Визуальный код

Минимум
Кайф минимализма в тач-интерфейсе. Не уверена в боеспособности проекта, но эстетика на высоте.


#mobile

Визуальный код

#модуль #mobile

Визуальный код

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


#типографика #mobile

Визуальный код

Мобильное меню
Пример мобильной навигации: переход нарочитый, но понятный, и свёрстано неплохо. Ещё понравилось, что пункты в меню сгруппированы по смыслу.


#mobile #навигация

Визуальный код

Эволюция сторис
В приложении Яндекс-такси сторис теперь показываются не в виде вертикальных карточек, а с помощью плитки.

: ios-приложение Яндекс-такси
#mobile

Визуальный код

Прогресс
Максимизация полезного действия: карточки с задачами, которые всем своим видом показывают прогресс. Обычно эта задача решается маленьким индикатором.


#интерактив #mobile

Визуальный код

Калькулятор
Шикарная эстетика и отклик на действия пользователя: выдавая результат, калькулятор аж выстреливает. Так рождается тактильный, физически ощутимый кайф от использования привычной вещи.


#mobile #анимация

Визуальный код

Яркая шапка
Пример брендирования приложения: яркая шапка-подложка разбавляет общую нейтральность. На мой вкус, графически пример не очень удачный (у автора есть работы лучше), но бесстрашный.


#mobile #композиция

Визуальный код

Подборки
Утилитарный, часто встречающийся, но годный UX-паттерн: пустое состояние поиска, где по умолчанию показываются популярные подборки и ссылки на разделы. Здорово, что подборки оформлены единообразно.


#mobile #UX

Визуальный код

Смена иллюстраций
В приложении Яндекс-маркета при смене светлого режима на тёмный меняются иллюстрации категорий товаров. Заморочно, но классно. За наводку спасибо @pptxman

: Яндекс-маркет
#иллюстрации #mobile

Визуальный код