8162
Блог о продуктовом дизайне. По рекламе — https://bit.ly/46IJwSH Канал с вакансиями — @dui_work Канал в Дзен — https://dzen.ru/dui Автор: @astract Поддержать канал https://t.me/duiux/1481
Figma update (13 ноября): обновленная пипетка
Вчера Figma выкатила новый небольшой, но прикольный апдейт связанный с использованием пипетки. Разберём, что добавили:
1️⃣ Теперь пипетка показывает не только цвет, но и стиль или токен. Зажимая Shift вы переключаете пипетку из режима взятия цвета, в режим взятия стиля или токена.
2️⃣ Выбрав какой-то слой, зажав Shift+Cmd в режиме пипетки и наведя на просто цвет можно перейти сразу в создания стиля или токена, который автоматически применится на выбранный слой или слои.
3️⃣ Через Tab можно переключаться между разными цветовыми форматами: hex, RGB, HSL, HSB.
4️⃣ Если у вас не выделен ни один слой, то пипеткой можно сразу получить цвет в буфер обмена кликнув на него. Также можно изменить цветовой формат на другой (hex, RGB, HSL, HSB) через Tab.
5️⃣ Если хочется только скопировать стиль пипеткой, но не создавать стиль, то можно зайти во флоу создания стиля и выйти из него, стиль применится на выбранный слой.
Дайджест продуктов и дизайна - 39
Если у вас проблемы с просмотром на YouTube, то можете смотреть видео тут. Но лайк и просмотры на YouTube для меня важнее.
Как поддержать проект и добавить мотивации
⭐️ Подкинуть немножко Старсов к посту в списке реакций
💸 Закинуть Донатик с любой суммой и любой валюте — /channel/duiux/1481
🔼 Поддержать канал Бустом — /channel/duiux?boost
Мне будет очень приятна ваша поддержка!
Статья с большим разбором всех возможных вариантов клавиатур для iOS и Android.
Если вы думали, что в целом пофиг какую там клавиатуру использовать и не думаете о ней в процессе создания дизайна, то это фатальная ошибка.
Помимо детального разбора вариаций клавиатур, есть наглядные примеры как эти типы используются в разных приложениях, по сути – best practice.
Ещё я узнал, что некоторые приложения на iOS имеют специальные типы клавиатур, например в X на кнопке действия есть символ #
В дополнении к статье прикрепил ссылку на файл Figma со всеми вариантами клавиатур, будет полезно в работе: ссылка раз, ссылка два.
Рекомендую эти каналы
Сегодня такое настроение, что просто хочется поделиться каналами, которые мне показались интересными и которые хочется подсветить без какой либо договоренности с авторами.
1. Канал Дизайн диктатура. Забавный факт, что я подписался на него сегодня и захотел сразу включить в подборку. Так как ранее уже видел несколько постов из канала и они мне показались хорошими и полезными. Например вот большой пост про прототипирование в Figma, обожаю эту тему, поэтому рекомендую посмотреть канал.
2. Канал моего хорошего друга Ильи Гришина (передаю тебе Приветик 👋), с которым я работал на заре своей карьеры продуктового дизайнера в ВКонтакте, было классно. Сейчас Илья в TON Wallet и пишет про свою работу там. Посмотрите его канал и подписывайтесь на него.
3. Канал Толи Вербицкого. С Толей я познакомился лично до его момента переезда в Берлин, и меня очень радует когда появляются новые и интересные знакомства. Толя работает в финтехе и обожает эту индустрию, поэтому в канале пишет на эту тему и в целом делится полезными и интересными статьями. Частенько забираю его посты на чтение. Толя, передаю тебе тоже Привет! 👋
4. Обожаю интерактив и анимации, поэтому не могу не подсветить канал «Наивная анимация». Там и про интерфейсы и про анимацию в целом!
5. Канал Олега. Приятный, ламповый и уютный канал. Олег пишет на тему дизайна и всё что с ним соседствует, например о кино и даже играх.
6. И ещё один канал от другого Олега. Он рассказывает о своём прошлом опыте работы в hh с интересными и детальными кейсами и о том, как вообще работать в небольшом стартапе про мастеров.
Дайджест продуктов и дизайна - 38
Для тех у кого с YouTube проблемы, можно смотреть видео тут. Но лайки и просмотры на YouTube будут приятней ❤️
🌟 Также вы можете поддержать проект разными удобными для вас способами:
⭐️ Подкинуть немножко Старсов к посту
💸 Закинуть Донатик — /channel/duiux/1481
🔼 Поддержать канал Бустом — /channel/duiux?boost
Мне будет очень приятна ваша поддержка!
Креативная команда Spotify вместе с художниками Джуном Ионедой, Сэмом Лайоном, Джеймсом Маршаллом и Шивани Параснис разработали иллюстрации и коллекцию стикеров, которые они будут использовать при оформлении плейлистов в сервисе.
Читать полностью…
Продолжим игру? Угадайте название этого цвета? Опрос с вариантами ответов следующим постом 👇
Пожалуйста не пишите ответы в комментарии, не портите игру для других. Ответ будет дан в опросе после голоса
Джош Кларк, основатель издания Big Medium и ведущий эксперт в области UX-дизайна, который помогает крупным компаниям улучшать взаимодействие с пользователями, написал короткую заметку о том, почему стоит прекратить использовать иконку «Звездочка ✨» для выделения ИИ-функций в программном обеспечении.
Он отмечает, что такие функции по своей сути ничем не отличаются от других опций в приложениях. Пользователю важно, чтобы функция решила его задачу, а не как она это будет делать. Приложения же не выделяют, как работают алгоритмы в других функциях, так почему же нужно акцентировать внимание на ИИ в отдельных опциях?
От себя добавлю, что ответ тут очевиден и прост — это маркетинг. ИИ-функции сейчас хорошо продаются и привлекают внимание, что, вероятно, объясняет их выделение.
Ссылка на статью
37-й дайджест о новостях продуктов уже на канале!
В этом выпуске: Adobe MAX 2024, ИИ питомец Mofin, 3D принтер без гравитации и другое!
😧 Ссылка на видео — https://youtu.be/wIUgSK9kd7A
Если у вас есть сложности с пониманием, как работают режимы наложения. То тут ребята из AWDEE выпустили наглядную инструкцию.
В самой статье обо всём это детально, что именно делает каждый из пунктов.
Читать статью полностью
Продолжим игру? Угадайте название этого цвета? Опрос с вариантами ответов следующим постом 👇
Читать полностью…
Видео «Дайджест продуктов» — вернулся!
К сожалению, из-за болезни длинной в месяц, я не мог выпускать видео. Но я вернулся и бросать рубрику не планирую, хоть иногда бывает и непросто.
👉 В этом выпуске: новый беспилотный автобус от Tesla, борьба между Epic Games и Google, DQD-851J-8JF и другие темы!
Приятного просмотра! И поставьте лайк к видосу пожалуйста 🙏 И вы всегда можете добавить мне мотивации 🤸
📹 Смотреть новый выпуск - https://youtu.be/315awfHVuRk
Давайте поиграем? Угадайте название этого цвета?
Опрос постом ниже👇, так как телега до сих пор не научилась в мультиаттачи.
Обновление Nothing OS 3.0
Наглядное сравнение обновленной версии системы с прошлой версией. В посте много картиночек.
Можно заметить, что многое было переработано и так же добавлены новые функции. Дизайн интерфейса в целом ушел от темных тонов в пользу светлого.
Из самого заметного, компания отказалась от моноширного шрифта для текста в пользу гротеска, из-за этого ширина блоков текста стала компактнее и читабельнее.
Тоже самое случилось и с заголовками. На смену фирменному точечному шрифту, пришла красивая антиква. На контрасте с таким хайтек интерфейсом, выглядит отлично! Нравится!
Появились новые функции: интерактивные виджеты и их шэринг, обновили приложение галереи, сетка которой разбавляется случайными формами. Переработан лок скрин и анимации.
Релиз системы в декабре, а в этом месяце будет открытая бета.
Продолжение скриншотов постом ниже
Как по мне обновление огонь, как вам?
39-й дайджест о новостях продуктов уже на YouTube
В этом выпуске: мебель из грибов, новый гаджет от создателей Flipper Zero, Робот продал картину за млн. и другое!
📹 Смотреть тут — https://youtu.be/J-AG9U8XJOw
#дайджест
Обожаю gpt нейронки. Сегодня мне нужно было создать систему размеров шрифтов с 5 шагами в диапазоне от 20 до 60, очень не хотелось думать и она мне сильно упростила эту задачу.
Жду в комменты, что это же просто и нужно было просто разделить разницу на пять :)
Продолжим игру? Угадайте название этого цвета? Опрос с вариантами ответов следующим постом 👇
Читать полностью…
Рекомендую типографскую раскладку Бирмана.
Устанавливаю её на все девайсы и использую уже много лет. С её помощью можно быстро набирать редкие и нужные символ — https://ilyabirman.ru/typography-layout/
И для удобства можете поставить эти обои со схемой раскладки для Windows и Mac. Станет ещё удобнее и понятнее, где какой символ находится.
upd: в комментарии покидали и другие варианты раскладок
38-й дайджест о новостях продуктов уже на YouTube
В этом выпуске: новинки от Apple, прозрачный пуховик на зиму, ребрендинг Bose и другое.
👀 Ссылка на видео — https://youtu.be/MMADQfHewh4
Про пасхалку ВКонтакте из 2019 года и как мы её делали
Разблокировал приятное воспоминание времён работы в VK, как мы с командой продукта и дизайна запускали большой редизайн приложения ВКонтакте в 2019 году. А точнее, как мы его преподнесли пользователям в момент раскатки, сделав классную пасхалку в стиле «прошивки устройства».
Идея заключалась в том, что после сканирования секретного кр кода, приложение как бы уходило в ребут и на экране включался процесс «прошивки». Бежали строки кода, обновления всяких модулей, имена участников команд которые занимались этим релизом. На андроиде даже смогли повторить иллюстрацию в духе Сяоми, где их заяц ковыряется в роботе, только у нас вместо него, был наш маскот – рыжий котик по имени Персик, который так же ковырял зелёного робота. По итогу приложение открывалось в новом дизайне.
Я даже смог найти видосик как это всё выглядело (спасибо интернету), где показан весь процесс апдейта приложения с этой анимацией.
Было крутое время, а всем кто работал над этим и читает меня - Большой и тёплый привет! 💙
Уважаемое мной издательство полезной литературы «Альпина», проведет с 3 по 4 ноября большой книжный фестиваль «Веранда» в Казани. Это не реклама, просто я хочу поддержать их проект.
На «Веранде» читателей ждут встречи с известными российскими авторами — лекции от Алексея Семихатова и Ильи Латыпова, встреча с Ксенией Буржской и Яной Вагнер и другими авторами. А также традиционно бесконечные полки с бестселлерами и новинками по истории, психологии, бизнесу и саморазвитию. Будет распродажа книг от 50 рублей.
Так же в рамках фестиваля будет проходить художественная выставка «Миф о Сизифе» от Казанских художников. Вход на выставку - свободный.
Вообщем если заинтересовались, то регистрируйтесь на событие, оно бесплатное. Все подробности по ссылке - https://veranda.alpina.ru/
Для тех у кого с YouTube проблемы, можно смотреть тут. Но лучше на YouTube, там ваши просмотры и лайки будут полезны.
А тут можете Старсы подкинуть :)
Создание тёмной темы в продукте
Статья рассказывает, как дизайн-команда из Compass разрабатывала тёмную тему для своего продукта.
Судя по статье, ребята проделали огромную работу, проработав более 2,5 тысяч экранов для трёх версий приложения: десктопной, Android и iOS.
Основные этапы и интересные моменты, которые выделились в процессе работы:
- Разработали правила использования цветов. Отказались от чрезмерной насыщенности и яркости, а также от чистого белого цвета, так как он слишком контрастен на чёрном фоне и вызывает утомляемость при длительной работе. Белый цвет был смягчён за счёт прозрачности.
- Создали тёмную тему для мобильного приложения и десктопа, переработав форматирование цветов и расставив акценты, которые терялись в тёмной теме.
- Весь дизайн тестировался на реальных прототипах. Например, при работе над десктопной версией сайта в офисе выключали свет и закрывали окна, чтобы убедиться, что дизайн соответствует задумке.
- В завершение команда создала систему токенов в Figma, что значительно упростило дальнейшую работу.
Читать статью полностью
Студия «Логомашина» провела анализ, что сбылось из их предсказания трендов графического дизайна на 2024 год. И рассказали зачем вообще пытаться что-то предсказывать, и вот для чего: «Предсказывание трендов помогает брендам предвосхищать запрос потребителей и оставаться актуальными, конкурентоспособными, вовремя реагировать на изменения в мире. Другими словами: опережаешь тренды — ты герой. Задержался — и твой бренд уже как вчерашняя газета.»
Я выписал основные тезисы из статьи.
⁃ Pantone 2024 «Персиковый пух» - часто встречался в брендинге люкс продуктов и бьюти индустрии.
⁃ Яркие и насыщенные цвета и смелые комбинации оказались не такими популярными в мире, но прижились на Российском рынке.
⁃ Чёрно-белую палитру использовали 20 проектов и 100 в мире, а на Ру рынке в каждом 20-м проекте.
⁃ Многоцветные градиенты хорошо приняли в России, хотя в мире они не набрали популярность. От себя добавлю, что обожаю подобные градиенты.
⁃ С учётом тренда на натуральность и экологию прижилась природная гамма цветов.
⁃ В иллюстрациях графика «от руки» не прижилась, а минимализм любят до сих пор.
⁃ Примитивная 3Д графика стала чаще применяться, так как ИИ и другие инструменты упростили её создание.
⁃ Гличи и цифровые эффекты не стал популярным, он нашёл своё место лишь в видео и рекламе, как Вау-эффект.
⁃ Флюид-арт и «Горох» и смешивание различных техник не прижились совсем.
⁃ А вот упрощённые и стилизованные иконки использовали многие.
⁃ Минимализм с классическими элементами. Простыми словами эксклюзивный люкс. Стал популярным лишь на западе тк ассоциируется с качеством и надежностью.
⁃ Про шрифты. Острая антиква, акцидентные шрифты в ретро и современном стиле, сочетание двух шрифтов в одном слове и другие сохранили популярность. А оказались ненужными лишь шрифты в духе 80-х и 90-х.
Читать статью полностью
Если у вас есть сложности с YouTube, то можете смотреть выпуски прямо тут в канале.
Но в любом случае ваш лайк на YouTube будет очень полезен. Ну и вы всегда можете полайкать пост тут, и может быть даже отсыпать немного Старсов ⭐️
В этом выпуске: новый беспилотный автобус от Tesla, борьба между Epic Games и Google, DQD-851J-8JF и другие темы!
Увидел сегодня это видео, где человек рассказывает про Camera Button в новых айфонах 16.
В целом кнопка камеры не упрощает процесс съемки, а усложняет и делает его медленнее. Например.
1. В момент съемки нужно сильно нажимать эту кнопку, чтобы получить снимок. Тем самым вы смещаете телефон вниз в момент нажатия кнопки. При экранной кнопке по центру такого не случится.
2. Для выбора нужной настройки через кнопку, нужно делать много движений и нажатий. Когда выбрать всё это софтово на экране, сильно проще и быстрее.
3. Кнопка имеет модальный режим работы, то есть нельзя иметь возможность зума и регулировки экспозиции одновременно. Экранный интерфейс камеры это позволяет делать.
4. Область кнопки очень маленькая и из-за этого у вас не получится сделать плавный зум от 0.5х до 5х. С кнопкой вы будете делать паузы, что бы перенести палец на начальную позицию и продолжить делать зум.
Конечно я сужу лишь по этому видео и не щупал пока новые айфоны лично, но я слышал очень много сомнений в адрес новой кнопки и её осмысленности.
Но возможно её надо воспринимать как дополнение к управлению камерой, а не основной кнопкой.
А вы что думаете про кнопку?
Прочитал статью про «глубину» в кино и интерфейсах
Rauno Freiberg в своём блоге написал статью о применении «глубины» в кино, и как это можно применять в интерфейсах. Всё это, он демонстрирует на примере интерфейсов iOS / iPadOS. К слову, после этого разбора, в очередной раз убеждаешься, что в Эпл сидят дрочеры дизайна. И мне это нравится!
Так же отмечу, что у автора очень красиво свёрстанный блог. Поэтому если не хотите читать, пробегитесь хотя бы глазами по нему. А сама статья очень короткая и наглядная.
https://rauno.me/craft/depth
Шестой год я провожу исследование: какие дизайн-команды в отечественных продуктовых компаниях самые сильные?
Такой рейтинг будет полезен рынку. Дизайнерам — лучше понимать, где есть хорошие вызовы и комфортная среда для профессионального роста. Компаниям и дизайн-командам — видеть, что нужно докачать.
Буду благодарен, если вы пройдёте опрос. Результаты исследования опубликую в январе. Вы найдёте отчёт в крупных дизайн-каналах и изданиях.
P.S. Результаты за 2023, 2021, 2020, 2019 и 2018.