В понедельник прошла ежегодная WWDC, выставка новых операционок Apple. Лёгкое дежавю из такого же поста прошлого года: как и месяц назад в Android 14, интерфейсных обновлений особо нет, в основном развитие самой оболочки и ключевых приложений. Зато количество мемов про очки Vision Pro перебило всю новостную повестку. Если выделять какие-то вещи, то вот что:
 
——
VISIONOS
Очки виртуально-дополненной реальности Vision Pro работают на новой ветке операционных систем. Она относительно преемственна остальным — те же иконки приложений, аналогичные стандартные компоновки типа браузера и компоненты типа вкладок. Сами приложения могут иметь одно или несколько окон, глубину в 3D и своё пространство.
 
— Очки непрозрачные, но могут работать как в режиме дополненной, так и полностью виртуальной реальности (ну и показать ваши глаза на внешнем экране).
 
— Управление жестами (без специального контроллера), голосом и взглядом. Также авторизация по зрачку, включая Apple Pay. И отслеживание движений головы.
 
— 3D-камеры для картирования окружающей среды.
 
Кое что по созданию приложений для visionOS уже можно почитать и посмотреть:
— Ранняя документация для разработчиков
— Видео выступлений
— Интервью с первыми попробовавшими компаниями.
 
Коммерческая успешность под большим вопросом — только большие проекты типа Microsoft HoloLens, Google Glass / Cardboard / Daydream, Magic Leap или Meta остались нишевыми B2B-шными, а то и вовсе похоронили миллиарды инвестиций, не считая десятков менее известных. Но в плане мультиплатформенной дизайн-системы пример очень интересный. Профессия точно обогатится интересным опытом и наработками в этом плане.
 
——
IOS17:
1. Появился режим стенда с крупным ландшафтным представлением приложений
 
2. В библиотеке иконок SF Symbols теперь есть анимация
 
3. Виджеты стали интерактивными — например, можно включать приборы умного дома или выполнять задачи из напоминалок
 
4. Интересные стилистические приёмы:
— Всплывающее меню приложений для iMessage
— Настраиваемый экран звонка для конкретных контактов
— Отслеживание ментального здоровья
 
5. Airdrop позволяет передавать данные и контакты при прикосновении устройств
 
6. Предлагает дописать текст по нажатию на пробел в духе Gmail.
 
7. Упрощается подключение к гостиничным телевизорам через AirPlay с помощью QR-кода
 
8. Live Speech сможет говорить вашим голосом, если немного потренировать его

Немного полезных материалов и видео для дизайнеров:
— Официальные шаблоны iOS 17 и iPadOS 17 для Figma от Apple. Они наконец-то пришли в сообщество
— Единый подход к обучению в приложении TipKit
— Live activities
— Быстрый вход в разделы приложения через поиск в spotlight
 
Победители Apple Design Awards этого года.
 
——
IPADOS17:
1. Виджеты на экране блокировки
 
2. Можно реагировать с помощью жестов на звонках FaceTime
 
——
WATCHOS10:
1. Редизайн ключевых приложений
 
2. Прокручиваемая стопка виджетов

—— 
MACOS SONOMA:
1. Общие виджеты с iPhone
 
2. Любые приложения для созвонов могут накладывать вырезанную фигуру говорящего на презентацию
 
3. Можно поделиться любым файлом прямо в любое приложение для созвонов — хорошее соответствие стандарту удалённой работы
 
Традиционно всё это появится у массового пользователя в сентябре. Но бета-версия будет доступна в июле.
 
#ios #trends #events

Собрал дайджест продуктового дизайна за май 2023. Android 14 и Microsoft Fluent Design 2, алгоритмический дизайн, рифма иконок и шрифта, риски в дизайне, ChatGPT для UX-исследований, тёмные паттерны, дашборды, dynamic island и ещё полсотни свежих статей, инструментов, паттернов, кейсов, трендов и исторических рассказов.
 
Напомню, что его можно получать разными способами:
— vc.ru
— ВКонтакте
— RSS

Свежая выгрузка из базы нового по дизайн-менеджменту. Загрузка начинается через 3, 2, 1…
 
1. Mia Blume: Советует дизайнерам говорить с бизнесом не об абстрактном улучшении качества продукта, а об инвестициях в ключевые метрики с помощью дизайна.
 
2. NN/g: Управление рисками при внедрении и обновлении дизайна. Как это влияет на пользователей и как предусмотреть потенциальные проблемы.
 
3. Контур: Координация сообщества пользовательских исследований. Как внедряются общие методы, проводится планирование и ретро.
 
4. Steve Bromley: Как ранжировать интерфейсные проблемы в игровых интерфейсах.
 
5. Clara Kuo: Персональная стратегия для пользовательских исследователей, которые первыми пришли в компанию.
 
6. Andrea Mignolo: Сила коучинга от дизайн-менеджера. Этот метод помогает не только самому дизайнеру, но и всей организации, которая думает в таком ключе.
 
7. Capital One: Стратегия развития UX-исследований в компании. Подход к её формированию и реализации.
 
8. SAP: Модель проникновения хорошего дизайна в компании. Это 4 этапа масштабирования.
 
9. Joshua McLaughlin: Матрица AAI (Awareness, Alignment, Inclusion) для вовлечения участников проекта, которая на вид проще классических RACI и аналогов. Перевод.
 
10. User Interviews: Шаблоны для проведения встреч по дизайну.
 
11. Microsoft: Вариация ретроспективы для дизайнеров, которая здорово помогла на удалёнке.
 
#management

Массивная инъекция свежего о пользовательских исследованиях:
 
1. MeasuringU: Эксперимент с ChatGPT — насколько хорошо он умеет выделять основные темы интерфейсных проблем по результатам исследования. Они дали одинаковое задание трём исследователям и сделали три прогона с ботом. В целом результат не идеальный, но пристойный.
 
2. User Interviews: Мясистая памятка по пользовательским исследованиям для дизайнеров и менеджеров продуктов. Как взаимодействовать с профессиональным исследователем, какие методы можно использовать самому, как задавать правильные вопросы и т.п. Правда, они зачем-то разделяют всё на проектировщика и продуктового дизайнера, но это можно игнорировать.
 
3. Condens: Универсальный подход, который поможет выбрать правильный способ донесения результатов исследований на разных этапах работы продуктовой команды.
 
4. User Interviews: Шаблоны для проведения юзабилити-тестирования.
 
5. Jeff Sauro и Jim Lewis: Продолжают изучать измерения технической подкованности. В этой статье они пытаются проследить влияние этого показателя на успешное выполнение задачи.
 
6. NN/g: Методы поиска респондентов и проведения юзабилити-тестов с пользователями, которые имеют ограничения по зрению. Выводах из соседнего исследования на тему ввода текста на мобильных такими пользователями.
 
7. Alison Jones: База знаний и инсайтов из исследований Atlassian Research Library. Как они собирали требования к ней, какие удачные и неудачные этапы прошли и как она работает сейчас.
 
8. NN/g: Советы по созданию своей панели респондентов.
 
9. Meghan Skapyak: Советы по проведению исследований с детьми. Как создать комфортную обстановку для них и получить дельные инсайты.
 
10. Liam O’Brien и Stephanie Wilson: Особенности вариации метода рассуждения респондентом вслух — когда модератор может прерывать и дополнять их в каких-то ситуациях.
 
11. MeasuringU: Проблема исследования, оценивающего записи немодерируемых юзабилити-тестов. Разные исследователи выделяют разные интерфейсные проблемы и пересечение между ними не сильно большое.
 
12. NN/g: Эффект Хоторна, который может искажать результаты пользовательских исследований. Сам факт наблюдения за ними может повлиять на поведение.
 
13. Дмитрий Старков: Методы тестирования продуктов на базе алгоритмов.

#research

Двойная Тройная порция свежих ссылок о лучших интерфейсных паттернах и практиках:
 
1. The Pudding: Крутой обзор тёмных паттернов прекращения подписки. Они потратили свои деньги на эксперимент с парой десятков сервисов. Спойлер: потеряли почти все.

2. Lyft: Виджет live activity и «динамический остров» в iOS.
 
3. Creative Navy: Подробная памятка по дизайну дашбордов на основе своего многолетнего опыта.
 
4. Alex Ivanovs: Памятка по поддержке accessibility на разных уровнях.
 
5. Baymard Institute: Актуализировали список лучших практик для интернет-магазинов. Edward Scott сделал обзор из их недавнего исследования.
 
6. NN/g: Ограничения и проблемы экранных дикторов на мобильных.
 
7. Marcus Herrmann: Как поддержать accessibility в запросах на сбор персональных данных на сайтах.
 
8. Christopher Butler: Правильный ритм в подаче информации на длинных страницах, чтобы пользователи докручивали их до конца. Он ссылается на исследования Nielsen/Norman Group и Chartbeat на эту тему. Он также показывает пример перестройки длинной промо-страницы в более читабельный формат. И выделяет ключевые правила такого переосмысления.
 
9. Luke Wroblewski: Сценарии использования дополненной реальности.
 
10. Uber: Редизайн навигации. Они делали много интерактивных прототипов разного уровня сложности и активно тестировали их.
 
11. NN/g: Памятка по показу сообщений об ошибках в интерфейсе.
 
12. Creative Navy: Изучили и сравнили медицинские интерфейсы.
 
13. Adam Silver: Проблемы «залипающей» навигации на сайте и заблокированных кнопок в формах (это древний спор, я на его стороне).
 
14. Camryn Manker: Чеклист по поддержке accessibility в игровых интерфейсах.
 
15. Коллекция идиотских вариантов интерфейса правил использования сайта и реализации старого эппловского жеста «проведите, чтобы разблокировать».
 
16. NN/g: Особенности использования «шторок» в мобильных интерфейсах. Статья полезная, но с оговоркой про спорную рекомендацию всегда использовать явную иконку «крестика» для закрытия — не нужно переизобретать системные элементы операционных систем.
 
17. Luke Wroblewski: Напоминает, что нудные длинные туры при встрече нового пользователя часто бесполезны. И приводит пару примеров продуктов, которые поменяли их на реальную ценность.
 
18. Asma Aldrees и Denis Gračanin: Большое исследование государственных цифровых сервисов. Что пользователи ожидают от них и как системно подступаться к работе такими проектами.
 
19. Peter Ramsey: Дикая механика покупки билетов в сервисе Ticketmaster. Он ограничивает время на оплату, что в условиях вереницы партнёров уполовинивает шансы на покупку.
 
20. Baymard: Удачные и плохие интерфейсные приёмы, чтобы показать состав витаминов в интернет-аптеках.
 
21. NN/g: Короткая шпаргалка по «скелетным» экранам загрузки.
 
22. Jim Lewis и Jeff Sauro: Сравнительные исследования сайтов интернет-магазинов офисных товаров и интернет-магазинов электроники. Как пользователи оценивают их по метрикам SUPR-Q, NPS и UX-Lite.
 
#patterns

На этой неделе снова будет выгрузка свежего по алгоритмическому дизайну в пару заходов. Пару месяцев не доходили руки собрать вместе (скорость появления нового запредельная), но момент за хвост сейчас пойман. Начнём с инструментов:
 
ДИЗАЙН
Framer сгенерирует сайт по текстовому описанию, а потом поможет докрутить отдельные элементы из набора предложений.
 
Figma купила нашумевший стартап Diagram, который запустил энтузиаст Jordan Singer с командой. Они делают простые и достаточно прагматичные решения, которые наверняка скоро попадут в Figma. В статье описаны несколько сценариев использования, которые уже помогут в повседневных задачах — например, автоматическая категоризация идей из брейнштормов (дико нудное дело).
 
Adobe Firefly теперь встроен и в Photoshop через функцию Generative Fill. Можно выделить место на фото и добавить туда любой объект. Как это работает. Это лучшая реализация алгоритмических функций в инструменте дизайна на текущий момент — они встроены органично в существующий процесс и прокачивают его, а не делают костыльные надстройки. Как и должны быть везде.
 
Adobe Express: Новый простой инструмент дизайна для несложных макетов и видео. Он умеет генерировать изображения и шрифты с помощью Firefly, готовит макет под разные размеры.
 
Adobe добавили в Illustrator экспериментальную функцию Generative Recolor. Она меняет цвета на сложных иллюстрациях с помощью их движка Firefly.
 
Uizard Autodesigner: Видео-обзор от Kim Alban.
 
Shaper: Вторая версия инструмента от Hayk An, который позволяет настраивать интерфейс, собранный на базе компонентов с токенами. Можно получить случайную комбинацию параметров, так что это игрушка на стыке алгоритмического дизайна.
 
Drag Your GAN: Можно простым способом указать, как нужно поменять параметры объекта или персонажа на фото.
 
Durer: Генерирует иллюстрации в вашем собственном стиле. Он учится на нескольких примерах.
 
Recraft: Генератор и редактор иконок и иллюстраций в разных стилях. Это смесь текстового запроса и выбора параметров.
 
Mandala: Интеграция Stable Diffusion в инструмент для 3D-моделирования Maya. А ещё там появится официальный ассистент на базе OpenAI.
 
Spline для 3D научился генерировать объекты по текстовому описанию и накладывать стиль по примеру.
 
Zoo: Сервис сравнивает результаты популярных инструментов генерации картинок по текстовому запросу.
 
Gamma App: Может сгенерировать черновик презентации с графикой на основе тезисов.
 
Shap-E: Новый проект OpenAI генерирует трёхмерные объекты по текстовому запросу. Научная публикация.
 
Insightface Swap: Бот для Midjourney грамотно вставит ваше лицо на сгенерированное фото или иллюстрацию.
 
Photoleap: Фоторедактор для мобильных, умеющих кучу приёмов по стилизации и переосмыслению фото.
 
Illustroke: Генератор векторных иллюстраций по текстовому запросу.
 
ClipDrop Uncrop: Дорисовать то, что было за границами изображения (примерно как Generative Fill у Photoshop).
 
UX-ИССЛЕДОВАНИЯ
Dovetail сможет сгруппировать инсайты в темы или набросать черновик инсайта.
 
ИНСТРУМЕНТЫ ДЛЯ ТЕКСТОВ
Яндекс Маркет генерирует описание товаров с помощью YandexGPT.
 
TikTok: Генератор сценариев для рекламы.
 
LinkedIn генерирует текст сопроводительного письма для отклика на вакансию.
 
ПРОМДИЗАЙН И АРХИТЕКТУРА
Toyota экспериментирует с алгоритмическим дизайном для работы над машинами. Это один из самых разумных процессов — дизайнер делает первый набросок стиля, дальше алгоритм предлагает несколько вариантов его оптимизации (например, для лучшей аэродинамики). Дизайнер выбирает одно из предложений и дорабатывает его.
 
Finch и PlanFinder: Планы помещений.
 
МУЗЫКА И ВИДЕО
TikTok Ripple генерирует и редактирует музыку. Можно напеть мотив и оно превратит его в заготовку песни.

Генератор музыки по текстовому описанию от Меты.

Synthesizer V: Генерирует вокал для музыки. Он обещает упростить ранние наброски песен.
 
NVIDIA Align Your Latents и Runway Gen-2: Видео по текстовому описанию.
 
Вторая часть — в четверг.
 
#al #algorithms

Продолжу выгрузку накопившегося по алгоритмическому дизайну, которая копилась последние пару месяцев:
 
ДИЗАЙН-ПРОЦЕСС
1. Dan Mall: Простыми и чёткими мыслями пересказал стандартную логику процесса алгоритмического дизайна, актуальную на сегодняшний день. Она повторяется из года в год, не меняясь при смене волн хайпа.
 
2. Matty Brownell: Иллюстративная графика для бренда в едином стиле с помощью Midjourney.
 
3. David Truog: Смогут ли такие инструменты развиваться, если сами дизайнеры не будут поставлять им свежие обучающие данные из своих работ.
 
4. Jay Anthony: Реалистично ли писать сценарии для юзабилити-тестирования через ChatGPT. Конкретики мало, но ограничения подсвечены.
 
5. Как сделать иллюстративные QR-коды от nhciao через Stable Diffusion, которые работают на самом деле.
 
ПОЛЬЗОВАТЕЛЬСКОЕ ВЗАИМОДЕЙСТВИЕ С НИМИ
1. Jakob Nielsen: Современные генераторы по текстовому запросу — это новая интерфейсная парадигма после пакетной обработки в первых компьютерах и командной строки. Впервые пользователь описывает сам конечный результат, а не последовательность команд для его получения.
 
2. Luke Wroblewski: Прикрутил поиск по своему блогу на базе ChatGPT (включая видео и подкасты). Затея интересная — он отвечает на вопросы в свободной форме выводами из статей Люка (а он написал очень много материалов за 25 лет). Его мысли про стандартную иконку такого поиска через «магические искры».
 
3. Stephen P Anderson: Проблемы генераторов текстов а-ля ChatGPT. Они способны создавать черновики, но многие забывают, что эти черновики нужно критически анализировать и доводить до ума.
 
4. Jakob Nielsen: Одно из первых вменяемых исследований на тему продуктивности и качества работы специалистов, использующих ChatGPT. Они стали тратить меньше времени на написание черновиков, но больше на редактуру. В целом качество материалов достойное. Бонусом они традиционно шутканули на 1 апреля на эту тему.
 
5. Luke Wroblewski: Переход редакторов графики и видео от инструменто-центричных интерфейсов к объекто-центричным. Алгоритмический дизайн подталкивает к этому.
 
6. Maggie Appleton: Концепты взаимодействия с чат-ботами. Как они могут уточнять и дополнять текст.
 
КАК ВСЁ ЭТО РАБОТАЕТ
1. Алина Валяева: Политика фотобанков и сайтов вопросов и ответов по поводу использования контента, сгенерированного алгоритмами.
 
КУЛЬТУРНЫЙ ЭФФЕКТ
1. Amy Goodchild: Примеры алгоритмического дизайна из 50х и 60х. Забавно, что даже дискурс про роль таких инструментов местами такой же, как в текущую волну.
 
2. Fast Company: Значительная часть логотипов современных сервисов вокруг ИИ ходят вокруг разного рода шестигранников.
 
КАКИЕ РАБОТЫ УЙДУТ
Идущие и планирующиеся сокращения в IBM, Bild, Bluefocus Intelligent Communications Group Co.
  
НЕ ДЕЛАЙТЕ ТАК
1. Niloufar Salehi: Попробовал сервис Synthetic Users, который якобы генерирует персонажей на основе публичных данных без проведения пользовательских исследований. По факту это просто мусорная информация — не сильно лучше высосанных из пальца персонажей, которые пишут дизайнеры без исследований. ChatGPT создаёт похожие по бесполезности материалы.
 
2. Arvind Sanjeev: Как закрытые личные данные утекают для обучения алгоритмов. Например, многие генераторы лиц как будто ненастоящих людей на самом деле берут настоящие фото и просто немного дорабатывают их.
 
3. Использовались ли ваши данные или фото для обучения алгоритмов. Это часть более крупной инициативы Spawning по защите своих персональных данных от обработки.
 
4. Bloomberg: Как сервисы генерации изображений по текстовому запросу воспроизводят расовые и гендерные стереотипы.
 
#al #algorithms