Как стать автором
Обновить
24.31

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

Приложения для iOS, Android, Windows Phone

Сначала показывать
Порог рейтинга
Уровень сложности

Почему навигация в Google, Booking и Spotify именно такая, и какую лучше выбрать вам

Уровень сложности Средний
Время на прочтение 12 мин
Количество просмотров 1.1K

При работе над паттерном навигации моя команда выяснила интересный факт — мало материалов для дизайнеров. Я провела своё исследование: поговорила с разработчиками, проанализировала множество приложений и заглянула в гайдлайны.

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

Вы узнаете:

какие основные виды навигации существуют,

как логически работает навигация,

некоторые особенности и различия платформенных решений (iOS vs Android).

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

Читать далее
Всего голосов 8: ↑7 и ↓1 +6
Комментарии 3

Новости

Рисуем эффект «Таноса» на Android (и не только)

Уровень сложности Средний
Время на прочтение 32 мин
Количество просмотров 6.6K

Привет! Вопрос мобильным разработчикам: часто ли вам приходится работать с необычным UI? Если вы ответили утвердительно, то я по-доброму вам завидую. В своей повседневной практике мне в основном приходится работать со стандартным набором компонентов и их базовой настройкой. Абсолютно ничего не имею против, но хочется чего-то «эдакого»: кастомных компонентов, написанных с нуля, необычных анимаций и эффектов. Часто подобные вещи вызывают много споров (как среди разработчиков, так и конечных пользователей) а-ля «А на кой оно вообще надо», но лично для меня это ни что иное, как творчество. Кто-то красиво рисует, кто-то красиво поёт, а кто-то пишет красивые уникальные приложения, которыми интересно и приятно пользоваться. И мы, пожалуй, не можем обвинять авторов за бессмысленность «украшательств», как по-хорошему не можем судить художника за его работу.

К чему я – спросите вы. Я отвечу: настраиваю на нужный лад :) В рамках этой статьи мы коснёмся полезной темы и создадим что-то бесполезное в практическом смысле, но несомненно интересное и достаточно уникальное.

Уже интересно
Всего голосов 23: ↑23 и ↓0 +23
Комментарии 9

Книга «Дизайн для разработчиков»

Время на прочтение 20 мин
Количество просмотров 6K
image

Привет, Хаброжители!

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

Книга раскрывает основные принципы дизайна и особенности пользовательского восприятия, которые должен знать каждый веб-разработчик. Читателю определенно понравится, как автор демонстрирует новые идеи на примерах популярных сайтов и пользовательских интерфейсов. Откройте методы исследования поведения юзеров и научитесь использовать цвет, типографику и верстку для создания удобных и привлекательных веб-интерфейсов. К концу книги вы поймете, что хорошее чувство дизайна действительно является ценным подспорьем для разработчика!
Читать дальше →
Всего голосов 10: ↑10 и ↓0 +10
Комментарии 5

Что ученые знают про темные паттерны в дизайне: как повышают конверсию и насколько роняют доверие?

Время на прочтение 5 мин
Количество просмотров 2.5K

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

Очевидно, что темные паттерны работают, иначе их бы не использовали. Но корпорации редко публикуют результаты своих экспериментов. Я решила поискать, проверялись ли какие-нибудь темные паттерны в научных статьях и что вообще исследователи знают про них. 

Читать далее
Всего голосов 9: ↑8 и ↓1 +7
Комментарии 12

Истории

«Не заставляйте меня вводить цифры»: реализуем сложный повтор в мобильном календаре

Уровень сложности Простой
Время на прочтение 5 мин
Количество просмотров 2.1K

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

Некоторые события в календарной сетке являются регулярными, то есть повторяются с определённой периодичностью. Например, можно отметить в календаре день рождения бабушки, чтобы вовремя её поздравить. Бывают повторы посложнее — скажем, для тренировок в фитнес-клубе, которые проходят каждую среду и пятницу в 19:00. Чтобы не вносить в календарь каждую тренировку по отдельности, есть возможность настроить повторяющееся событие.

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

Читать далее
Всего голосов 19: ↑19 и ↓0 +19
Комментарии 26

Паттерн поиска в мобильном приложении. Какую механику выбрать дизайнеру?

Уровень сложности Средний
Время на прочтение 11 мин
Количество просмотров 3.3K

Поиск помогает пользователям быстро находить то, что им нужно. Но как создать такой поиск, а главное — сделать его полезным инструментом?

В статье:

— проанализируем, какие варианты паттерна поиска есть,

— заглянем в гайдлайны,

— рассмотрим UX-ошибки.

Как же выбрать оптимальный вариант поиска для вашего мобильного приложения?

Давайте разберемся
Всего голосов 17: ↑16 и ↓1 +15
Комментарии 0

AndroidFoodRecipesGuideTutorial

Уровень сложности Простой
Время на прочтение 4 мин
Количество просмотров 1.4K

В данной статье мы создадим простое приложение для отображения списков блюд на платформе Android с использованием языка программирования Kotlin.

Мы погрузимся в увлекательный мир мобильной разработки и научимся использовать различные технологии, включая RecyclerView для отображения списков, фрагменты для организации интерфейса, и многое другое. Наше приложение будет не только функциональным, но и простым в создании благодаря мощным инструментам, которые предоставляет нам Kotlin и Android SDK.

Давайте вместе разберемся, как создать этот простой, но полезный инструмент, который может быть использован в различных контекстах, будь то кулинарное приложение, список покупок или что-то еще. Погнали!

Погнали!
Всего голосов 6: ↑3 и ↓3 0
Комментарии 3

Я создал подробнейший гайд для карьеры дизайнера

Уровень сложности Простой
Время на прочтение 1 мин
Количество просмотров 4.1K

Привет! Я Дима, автор телеграм канала Дизайн тусовка. Я собрал полноценный гайд для всех грейдов на основе своего опыта и недавнего поиска работы в топ IT компаниях России, вот мой результат:

Читать далее
Всего голосов 20: ↑4 и ↓16 -12
Комментарии 1

Создаем гироскопический параллакс-эффект во Flutter

Уровень сложности Простой
Время на прочтение 6 мин
Количество просмотров 3.1K

Сегодня расскажу, как с помощью гироскопа или акселерометра можно оживить картинку при простом наклоне телефона.

Читать далее
Всего голосов 5: ↑5 и ↓0 +5
Комментарии 0

Как на ваш выбор влияет дизайн. Подробно про тёмные паттерны в UX

Уровень сложности Средний
Время на прочтение 20 мин
Количество просмотров 7.4K

Вы знаете, каково это.

Часто ли у вас бывало, что отклонение куки вызывало дискомфорт? Вроде есть уведомление на половину экрана. Есть кнопка «настроить свои параметры», при нажатии которой открывается меню, где нужно выбрать конкретные параметры. Но зато в любой момент, конечно, вы можете «принять всё» и не думать о дополнительных шагах.

Или, может, вам была нужна та самая пробная подписка на 7 дней, но когда вы решили её отменить, то это резко из одного действия превратилось в лабиринт до надписи «Отменить подписку». Все эти техники объединены в группу, называемую «Тёмные паттерны», шаблоны для создания манипулятивных схем взаимодействия системы и пользователя.

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

Узнать как мной управляют
Всего голосов 29: ↑28 и ↓1 +27
Комментарии 9

Создаем параллакс-эффект во Flutter с CustomPaint

Уровень сложности Простой
Время на прочтение 5 мин
Количество просмотров 1.5K

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

Читать далее
Всего голосов 1: ↑1 и ↓0 +1
Комментарии 0

Подробный гайд как сделать темную тему с помощью variables фигмы

Уровень сложности Простой
Время на прочтение 5 мин
Количество просмотров 1.7K

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

Читать далее
Всего голосов 6: ↑6 и ↓0 +6
Комментарии 0

Как оценивать Дизайн (метод 3К)

Уровень сложности Средний
Время на прочтение 10 мин
Количество просмотров 3.6K

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

Читать далее
Всего голосов 3: ↑2 и ↓1 +1
Комментарии 0

Ближайшие события

Московский туристический хакатон
Дата 23 марта – 7 апреля
Место
Москва Онлайн

Приглашаем на Ozon Tech Community Design Meetup

Время на прочтение 2 мин
Количество просмотров 1.2K

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

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

Приглашаем присоединиться к этому разговору 21 февраля в 18:30 — офлайн в Москва Сити и онлайн в трансляции на Youtube. Под катом найдёте подробный анонс и ссылку на регистрацию

Читать далее
Всего голосов 16: ↑14 и ↓2 +12
Комментарии 2

Как уменьшить вес продуктовой анимации в 400 раз (без AI)

Уровень сложности Средний
Время на прочтение 4 мин
Количество просмотров 9.7K

Все любят красивую и качественную графику, но обычно такая графика весит много и влечёт проблемы с её добавлением в дистрибутив проекта. А, возможно, и доработки по внешней загрузке или самое частое — сжатие с потерей качества. Каждый дизайнер хоть раз, да говорил «Вот бы можно было и качество сохранить, и отдать разработчикам легкие файлы…». Сегодня нет классных AI-решений для этой задачи, но в этой статье мы расскажем о том, как нам удаётся значительно ужимать графику с использованием растровых и векторных элементов, содержащей альфа-канал.

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

Читать далее
Всего голосов 17: ↑13 и ↓4 +9
Комментарии 20

Удобство и/или безопасность? Tinkoff edition

Уровень сложности Простой
Время на прочтение 2 мин
Количество просмотров 5.6K

Вы приходите домой и открываете почтовый ящик. Одновременно с этим на 5 минут открывается сейф у вас в доме. Удобно? Возможно, в некоторых случаях, да. Очевидно и интуитивно? Каждый решит в своём случае.

Читать далее
Всего голосов 22: ↑18 и ↓4 +14
Комментарии 45

5 идей, как улучшить Discovery-процессы в команде, если ты продуктовый дизайнер

Время на прочтение 10 мин
Количество просмотров 2.1K

Всем привет! Меня зовут Дарья Томилова, я старший продуктовый дизайнер в СберМаркете. Полтора года назад я пришла в кроссфункциональную команду, которая работает над сервисом самовывоза, — это когда клиент оформляет заказ через приложение СберМаркета, но не пользуется опцией доставки, а забирает товары из магазина своим ходом. Мы отвечаем за весь флоу таких заказов и разрабатываем новые фичи, чтобы сделать этот сервис лучше.

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

Читать далее
Всего голосов 9: ↑7 и ↓2 +5
Комментарии 2

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

Уровень сложности Простой
Время на прочтение 8 мин
Количество просмотров 4.9K

Привет, Хабр! Меня зовут Алексей, в Пиробайте я разрабатываю мобильные приложения на Flutter. Недавно я зашел в Twitter и не знал — радоваться мне или плакать, ведь эпопея об айтишниках и кринжовых тредах получила новый виток развития. 

Если вкратце, парень рассказал о том, что женился на девушке, с которой общался не он, а ChatGPT. И это было не просто пару сообщений, а поставленная на поток схема, где чат-бот искал, общался и звал на свидания тысячи девушек из Тиндера. Пока не нашел ту единственную, на которую перенастроил бота. А потом, слава Богу, начал общение самостоятельно. На других же девушках он зарабатывал реферальным путем (приводя их в разные компании). What a story, Mark!

История хоть и интересная, но в целом непонятно, зачем о ней писать здесь… Или не совсем? Давайте разбираться.

Читать далее
Всего голосов 15: ↑2 и ↓13 -11
Комментарии 4

UX-мракобесие

Уровень сложности Простой
Время на прочтение 5 мин
Количество просмотров 9.5K

UI/UX дизайн, UX-исследования, UX-стратегия, UX-копирайтинг, UX-команда, UX-маркетинг, бренд-экспириенс, AX-algorithmic experience, Client / Customer experience. Вам не показалось, что засилье новых терминов и дисциплин намекает на то, что UX — это не просто конкретный этап разработки или специализация, а нечто большее? Может Дон Норман был прав, определяя UX как «подход через опыт» к управлению продуктом, который охватывает «буквально все»?

Читать далее
Всего голосов 10: ↑6 и ↓4 +2
Комментарии 14

Руководство по проектированию интерфейсов с Drag and Drop

Уровень сложности Средний
Время на прочтение 22 мин
Количество просмотров 8.9K

Всем привет! Меня зовут Александр Григоренко, я фронтенд-разработчик, и я часто сталкиваюсь с разработкой веб-интерфейсов с использованием Drag and Drop. В своей предыдущей статье про Drag and Drop я рассказывал про историю появления и развития этого подхода: появившись в первом в мире графическом интерфейсе, Drag and Drop продолжает быть одной из самых актуальных технологий и на сегодняшний день. В этой статье я хочу поговорить об особенностях проектирования дизайна и юзабилити интерфейсов с Drag and Drop. В первую очередь, я буду приводить примеры и говорить об особенностях Drag and Drop в рамках сложившихся практик в современных веб-интерфейсах, но многое из этого будет справедливо и для интерфейсов классических настольных приложений.

Устроиться поудобнее и читать далее
Всего голосов 9: ↑9 и ↓0 +9
Комментарии 12

Вклад авторов