Дизайн мобильных приложений *

Весна в самом разгаре, а вместе с ней — обновления, гайды, инсайды и бум активности в экосистеме Dart и Flutter. В этом выпуске вы найдёте мощные инструменты для DevTools, свежие идеи для архитектуры, backend-направление на Dart и многое другое.

Привет, Хабр! Уже по традиции собрал семь новостей дизайна уходящего месяца, на которые обратил внимание сам, и теперь вам рекомендую. 

1. Обновление приложения и сайта «Подружки»
2. Новая схема карты метро Нью-Йорка
3. Первоапрельское обновление главной страницы Яндекса
4. Игра «Thank Goodness you're here» от Panic
5. Обновление сайта Jitter
6. Новая айдентика Хельсинки
7. Раздел «Library» в ChatGPT

Уууу, страшное слово — концепт... На фоне пугающие звуки...

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

И, возможно, поэтому энтузиазм коллег при слове «концепт» я вижу нечасто. Вместо него чаще появляются дизайнерские страхи, тревоги и сомнения. Хочется их развеять — хотя бы немного. Попробуем?

Привет, Хабр! Меня зовут Сергей Захаров, я разработчик в онлайн-кинотеатре KION. Jetpack Compose постепенно становится стандартом разработки UI для Android, и Android TV не остался в стороне. Вместо устаревшего и громоздкого Leanback теперь есть гибкий и мощный фреймворк, который обещает упростить разработку.

Однако на Android TV ключевую роль играет управление фокусом — без него невозможна навигация. Как же Compose справляется с этой задачей? Достаточно ли он удобен для больших TV-проектов, или лучше ограничиться им в мобильных приложениях? В этом и следующих материалах я отвечу на эти вопросы на примере конкретных кейсов. 

Это первый пост моего цикла про работу с фокусом в Jetpack Compose. В нем я расскажу, как в Jetpack Compose перемещается фокус, рассмотрю используемые при этом компоненты, покажу их плюсы и минусы, а также дам рекомендации по их применению в приложениях для Android TV.

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

В этой статье мы будем раскрашивать MaterialCardView и её дочерние элементы в цвета, сочетающиеся с цветами изображения. Для этого воспользуемся DynamicColors API.

Продолжаю изучать различные UI/UX/CX кейсы в мобильных приложениях, веб-сайтах и в реальном мире. Дизайнерам и менеджерам по продукту, чтобы вдохновиться и добавить в заметки.

Под катом: Кухня на районе, Дзен, Google, Яндекс.Еда.

Вы студент, которому предстоит выучить гору материала к экзамену, подготовиться к презентации, написать курсовую, а еще успеть поработать, сходить на тренировку и встретиться с друзьями? Или, может быть, вы просто хотите лучше организовать свой день, чтобы успевать больше и чувствовать себя менее уставшим?

Если вам когда-нибудь приходилось копировать переменные из одного файла в другой, то вы тоже наверняка сталкивались с тем, что Фигма НЕ сохраняет связи между переменными! То есть, если скопировать semantic/brand/primary и base/brand/500 (первый наследует значение второго) — фигма удалит их связь! И оставит связь с другой переменной, оставшейся в другом файле. Это ужаснейший флоу. И к сожалению, это фича, а не баг, и они его не планируют чинить.

Слегка поискав и не найдя подходящего плагина, я уже отчаялся, но вспомнил, что можно написать такой плагин, не штудируя api, подключив к этой задаче нейросети.

Продолжаю изучать различные UI/UX/CX кейсы в мобильных приложениях, веб-сайтах и в реальном мире. Дизайнерам и менеджерам по продукту, чтобы вдохновиться и добавить в заметки.

Под катом: Aviasales, Яндекс.Карты, Яндекс.Поиск, Airbnb, Citroen.

Привет, Хабр! Сегодня мы в коротком формате сравним SwiftUI и UIKit: где SwiftUI реально выигрывает, а где старый добрый UIKit остаётся незаменимым.

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

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

Продолжаю изучать различные UI/UX/CX кейсы в мобильных приложениях, веб-сайтах и в реальном мире. Дизайнерам и менеджерам по продукту, чтобы вдохновиться и добавить в заметки.

Под катом: BBVA, Duolingo, Google Photos, Wise, Дзен.

Привет, Хабр! Я Маша, продуктовый дизайнер в ОТП Банке. Наш банк последнее время активно развивает дизайн, сегодня хочу поделиться опытом работы с иконками. Сразу скажу, большинство перечисленных принципов вам скорее всего знакомы, но есть некоторые неочевидные нюансы, на которые стоит обратить внимание 👇

Я люблю историю развития компьютерной индустрии. На днях мне попался к чтению цикл статей «Удивительный и забытый Palm», в которых рассказывалось, как Palm, Inc. удалось создать класс устройств на новой мобильной ОС — Palm OS, которые сначала захватили 80% рынка карманных компьютеров, а после ушли в забвение из-за принятия некоторых неверных решений и скорого прихода iOS/Android.

Однако тот цикл был посвящён в первую очередь самим устройствам и операционной системе. Меня же особо привлекла ссылка на «Zen of Palm» — брошюру, содержащую философию и руководство компании Palm по разработке приложений для устройств на Palm OS.

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

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

Представьте себе рыбу. Она плывёт по течению, думая, что сама выбирает путь. Но стоит взглянуть шире — и становится видно: течение, водовороты, подводные скалы формируют её маршрут гораздо больше, чем её воля...

3 апреля в офисе red_mad_robot соберутся лидеры индустрии дизайна, чтобы обсудить, как совместить креативность с эффективностью, использовать AI для ускорения рабочих процессов и сделать дизайн по-настоящему живым.

В программе — четыре доклада от дизайн-лидов и креативных директоров компаний red_mad_robot, ecom.tech, SberDevices и Иви.ру. После выступлений — живое общение и нетворкинг.

«Сделай удобно» #1. «Сделай удобно» #2. «Сделай удобно» #3. «Сделай удобно» #4, «Сделай удобно» #5, «Сделай удобно» #6, «Сделай удобно» #7, «Сделай удобно» #8, «Сделай удобно» #9.

Продолжаю изучать различные UI/UX/CX кейсы в мобильных приложениях, веб-сайтах и в реальном мире. Дизайнерам и менеджерам по продукту, чтобы вдохновиться и добавить в заметки.

Под катом: Yandex Go, Intsagram, Amie, Aviasales, Tinder.

Привет, Хабр! Меня зовут Катя Меркулова, я CPO Сlatch. Летом мы работали над улучшением нашего приложения. На первый взгляд, задача была простой: перенести кнопку технической поддержки из веб в мобильную версию. Но, как это часто бывает, нюансы сделали свое дело. Мы пропустили слово «техническая». И все завертелось.

Как одно слово чуть не поломало нам все процессы, заставило неделю работать в две смены и как мы развили новый инструмент для общения с аудиторией, я расскажу в этом материале. И заодно поделюсь своими выводами: что же действительно нужно сейчас подросткам и какой интерфейс для них является по-настоящему нативным.

Привет! Я Влад — старший дизайнер в Альфа-Банке, занимаюсь фичами в «Платежах и переводах». Неровно дышу к улучшению внутренних процессов в компании, поэтому часто выступаю с различными инициативами, одна из которых — разработка стандарта оформления макетов для мобильного банка.

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

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