Большой редизайн Figma, iOS 18, генерация макетов в ChatGPT-4o и памятка по созданию осмысленных дизайн-концептов: главное в дизайне за июнь
Традиционный дайджест Юрия Ветрова, директора по дизайну и бренду Muse Group.
Ежегодная конференция Apple WWDC 2024 прошла 10–14 июня — это выставка их новых операционок. Интерфейсных обновлений особо нет, в основном развитие самой оболочки и ключевых приложений. Собрал самое ценное для дизайнеров интерфейсов.
Глава дизайна Gov.uk Tim Paul показал, как можно превращать обычную бумажную форму в веб-версию. Он использовал дизайн-систему Gov.uk и автоматически разбивал её на шаги. Демка работает даже на основе бумажного скетча. Исходный код и более ранний эксперимент его коллеги Kuba Bartwicki.
Отличная памятка по дизайну интерфейса меню в вебе от Page Laubheimer из Nielsen/Norman Group. Простой и наглядный чеклист, который начинается с одной из главных проблем — люди читают Рамса и Нормана, а потом прячут навигацию на больших мониторах под иконку.
Siva Sabaretnam описывает разницу между дизайнером роста (growth) и основного продукта в Atlassian. Нюансы могут отличаться от компании к компании, но в целом это отличная и достаточно универсальная модель.
Atlassian смогли стандартизировать интерфейс drag&drop и его реализацию в своих продуктах. Это позволило здорово поднять производительность и упростить его использование. Alex Reardon, Lewis Healey, Melissa Jaén и Maria Christley описывают процесс работы и детали паттерна, а также делятся кодом.
Figma: Большой редизайн самого инструмента под их новую дизайн-систему UI3
- Спрятали часть функций (что уже вызвало негатив), сильно обновили внешний вид, дали возможность менять размеры панелей. Новое представление со статусом макетов в DevMode. В FigJam появились страницы.
- Добавили целую линейку инструментов алгоритмического дизайна в основной сценарий работы. Можно сгенерировать дизайн по текстовому запросу (правда, временно отключили после пары публичных конфузов), превратить скриншот в макет по слоям (если он собран на ваших компонентах и стилях), автоматически связывать экраны в интерактивный прототип, генерировать тексты и изображения, убирать фон, переименовывать слои, искать макет или слой по текстовому описанию. В следующей версии планируют генерировать макеты на основе компонентов вашей дизайн-системы. Это тот самый момент, когда вчерашняя магия превращается в обычный повседневный инструмент — он может занять и 5-10 лет, но результат стоит ожидания.
- Переработали черновики (теперь они должны быть внутри пространства команды, хотя и и останутся приватными), упрощают тарифы и добавляют логику работы с фрилансерами/агентствами, можно менять базовые текстовые стили вроде курсива без открепления.
- Figma Slides: Запустили отдельный инструмент для презентаций. Многие дизайнеры и так делали их в инструменте, так что теперь это отдельная продуманная ветка развития. Есть шаблоны, таблицы, подсказки ИИ по тексту и стилю, можно использовать интерактивные прототипы и в целом коллаборацию со слушателями при показе в духе FigJam, а так же интерактивные опросы. Ну и, самое главное — комфортный совместный рассказ презентации без дурацкого «следующий слайд».
Новости инструментов дизайна:
- Canva: Johannes Ippen считает, что Canva имеет шансы выйти за рамки восприятия чипового инструмента для нубов. Во-первых, за счёт охвата широкого рабочего процесса от идеи до воплощения самых разных форматов. Во-вторых, за счёт недавней покупки Affinity.
- ChatGPT-4o может генерировать макеты в Figma на основе спецификации.
- Luma Dream Machine: Генератор видео по текстовому запросу. Может в том числе анимировать обычную картинку (поток оживших мемов в первые дни зашкаливал).
- ToonCrafter: Генератор анимационных роликов на основе их первого и последнего кадра.
Стёб над макетами подачи дизайна — максимальная бытовая кринжуха из реального мира.
Media готовит к выходу книгу Josh Clark и Veronika Kindred «Sentient Design» об алгоритмическом дизайне. Они запустили этот термин вместе с флагманским выступлением и обзорной статьёй, плюс продают услуги типа Sentient Design Sprint.
Памятка по использованию чекбоксов в интерфейсах от Maddie Brown из Nielsen/Norman Group. Одиночные, списки, вложенные и их нюансы.
Steve Bromley собрал обзорную статью-навигатор по процессу тестирования игр. Она описывает типичный проект на разных этапах.
«Синтетические пользователи» — мусорная концепция, которая обещает заменить общение с пользователями генерацией от ИИ. Maria Rosala и Kate Moran пытаются разобраться, есть ли какая-то польза от них (спойлёр: почти нет).
Хорошая памятка по написанию интерфейсных текстов от Ирины Сильяновой. Здорово, что они находятся на стыке дизайна (как использовать текст в контексте экрана) и редактуры (как правильно писать).
Nielsen/Norman Group сделали структурированную подборку своих статей о связке между дизайнером интерфейсов и менеджером продуктов.
Хорошая памятка по созданию осмысленных дизайн-концептов от журнала DOC. Они должны быть про основную концептуальную модель взаимодействия, а не просто пыль в глаза.
Jack Holmes предлагает заполнять модель Kano в 3 этапа. Сначала экспертная версия (единая картина мира у команды), потом опрос пользователей (то, что они ожидают), а в конце — пользовательское исследование, чтобы понять причины разницы во мнениях.
Команда iA предлагает по-другому посмотреть на ChatGPT и похожие сервисы. Если не ждать от них готовый результат, а использовать как собеседника и корректора — результат становится намного качественнее.
Christelle Ngnoumen описывает модель COM-B (Capability, Opportunity, Motivation, Behavior), которую она использует в Voya Financial. Она помогает анализировать поведение пользователей и помогает скорректировать его.
Новое сообщество дизайнеров и иллюстраторов, которое решило противопоставиться алгоритмическому дизайну. Они не дают ИИ-продуктам обучаться на основе своих материалов, ну и запрещает публикацию таких работ у себя. Cara запустилась несколько месяцев назад, но недавно резко выросла до 300 000 пользователей.
Microsoft обновили подход к цветам в своей дизайн-системе Fluent — ушли от утилитарных к более ярким и насыщенным.
В Storybook 8.1 можно создавать компоненты визуально из самого живого гайдлайна, не заходя в редактор. Конечно, это работает только для простого описания состояний, а не сложной логики, но уже упрощает работу.
Charmaine Lee рассказывает, как работает команда инструмента для разработчиков фильтров Snapchat. Отказ от назойливого onboarding, кросс-командное взаимодействие и другие бодрые штуки.
Читайте полную версию дайджеста в моём блоге. За свежими ссылками также можно следить в Telegram-канале или в группе во «ВКонтакте». Спасибо всем, кто помогает наполнять дайджест.
Есть опыт работы с редизайном интернет магазина мебели https://mebel-24.com.ua и какая средняя стоимость на такую работу была сделанна? В большенстве случаев не хотят заниматся таким, а предлагают делать новый. Почему?