Юрий Ветров об интерфейсах
  • Главная
  • Статьи
  • Дайджест
  • Конференции
  • Дизайн-менеджмент
  • Дизайн-системы
  • Заметки
  • О блоге
Юрий Ветров об интерфейсах
Юрий Ветров об интерфейсах
  • Главная
  • Статьи
  • Дайджест
  • Конференции
  • Дизайн-менеджмент
  • Дизайн-системы
  • Заметки
  • О блоге

Дайджест продуктового дизайна, апрель 2024

  • 4 мая 2024

Дайджест собирает свежие статьи по дизайну интерфейсов, а также инструменты, паттерны, кейсы, тренды и исторические рассказы с 2009 года. Я тщательно фильтрую большой поток подписок, чтобы вы могли прокачать свои профессиональные навыки и лучше решить рабочие задачи. Предыдущие выпуски: апрель 2010-март 2024.

Дайджест продуктового дизайна, апрель 2024

Паттерны и лучшие практики

3 Types of Online Calculator and Quiz Tools

Tanner Kohler из Nielsen/Norman Group описывает принципы работы трёх видов калькуляторов: конвертеры, предположения и рекомендации. Во второй статье он даёт советы по дизайну таких интерфейсов.

The Perfect University Course Page — Design Guidance

Агентство Creative Navy изучило интерфейсы описания университетских курсов. Они прошлись по 280 вузам и провели 45 интервью.

Packaging & Filling Systems GUI — UX Design Guidance

Агентство Creative Navy изучило профессиональные интерфейсы для производственных линий по упаковке и наполнению товаров.

UX and NPS Benchmarks of Banking Websites (2024)

MeasuringU опубликовали новое сравнительное исследование сайтов американских банков. Как пользователи оценивают их по метрикам SUPR-Q, NPS и UX-Lite.

F-Shape Pattern And How Users Read

Краткий обзор паттернов сканирования информации на экране от Виталия Фридмана.

Making Product Value Obvious

Самая ценная вещь, которую дизайнеры могут дать продукту — лучше показать пользователю ценность этого продукта, напоминает Luke Wroblewski.

B2B Electronics: Use “Product Tables” to Display Product Listings on Desktop

Iva Olah из Baymard Institute советует использовать табличные списки на B2B-сайтах по продаже электроники на компьютере и обычные списки на телефоне.

B2B Electronics: Always Allow Users to Search Long Lists of Filter Options

Iva Olah из Baymard Institute разбирает сложные фильтры на B2B-сайтах по продаже электроники и даёт советы по организации поиска в них.

Дизайн-системы и гайдлайны

The Anatomy of a Component Sprint

Brian Alfar рассказывает о компонентном спринте при работе над дизайн-системой Washington Post. Дизайнер и разработчик в паре про прорабатывают все вопросы в течение 10 дней.

Maintaining a design system in Figma

Платиновая памятка по организации работы над дизайн-системой в Figma от Lukas Oppermann. Как вести версионирование, обновление компонентов, историю изменений — дотошно и основательно.

The Art of Design System Recipes

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

Proposal: CSS Variable Groups

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

Subframe — The best way to build UI, fast

Инструмент позволяет собирать интерфейс из компонентов в коде, а потом докручивать его под себя.

Meet Ritmo, Musixmatch’s cross-platform design system

Andrea Zilibotti рассказывает о создании дизайн-системы Ritmo для музыкального сервиса Musixmatch.

Don’t Put Crap in the Design System

Brad Frost пишет, что мусор в дизайн-системе неизбежен из-за природы продуктовой работы. Но его можно минимизировать.

State of Design Tokens 2024 Report

Supernova провела опрос около 200 дизайнеров и разработчиков о том, как они используют токены в своих дизайн-системах.

Новые инструменты дизайна интерфейсов

Figma

Запустили много фешенебельных новых функций: шрифтовые и градиентные токены, аналитика использования библиотек. И, самое главное — родная связка с реальным кодом компонентов через Code Connect, благодаря которой разработчики могут получить его прямо из макета (причём это не мусорная автогенерация). Они также отметили 1 апреля стилизованными курсорами под старые визуальные тренды и операционные системы.

Плагины

  • Обзор плагинов для связки кода и дизайна в Dev Mode.
  • Locofy Lightning: Экспортирует макеты в код на React, HTML/CSS, Next.js, Gatsby или Vue.
  • Figma to Replit: Экспортирует макеты в код на React.
  • Builder.io: Экспортирует макеты в код на React, Svelte и просто HTML.

Статьи

  • Snapp Automotive: Автомобильный интерфейс может иметь разные темы оформления для разных автопроизводителей. Casper Kessels рассказывает об архитектуре токенов и компонентов в Figma для этого.

Пользовательские исследования и тестирование

Conducting Accessibility Research In An Inaccessible Ecosystem

Годная памятка Michele Williams по проведению пользовательских исследований для улучшения accessibility. Инструменты и методы сильно ограничены, но она предлагает альтернативы.

A Decision Framework for UX Resourcing

Dawn Ta описывает свой метод для подбора пользовательских исследователей на конкретный проект. Он заточен под ситуации, когда ресурсов не хватает и нужно делать компромиссный выбор.

Surveys and the “True Score” Mistake

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

Just like magic — Dovetail’s newest features are here

Сервис для ведения базы знаний и инсайтов Dovetail анонсировал прорву новых возможностей по автоматизированной обработке результатов исследований, выделению тем, обработке видео и т.п.

Supercharge your research impact — 10 secrets to success you won’t learn in school

Советы Rebecca Knowe из IBM по подготовке, проведению и использованию результатов пользовательских исследований, с учётом ожиданий ключевых участников проекта.

Визуальное программирование и дизайн в браузере

Новые скрипты

  • Javascript-библиотека, имитирующая колесо прокрутки оригинального iPod.
  • Анимированный бедж для конференции в браузере на JavaScript.
  • Мультяшные векторные лица с помощью JavaScript-библиотеки.
  • Как «сложить фото пополам» на CSS.

Дизайн-менеджмент и DesignOps

Tinkoff Design career paths

Иван Звягин описал карьерные пути и карту компетенций для дизайнеров Тинькофф. Документ от Юлии Кондратьевой.

Setting Up Your UX Mentorship Program For Success

Kathryn Brookshier построила менторскую программу в Indeed и даёт советы для тех, кто хочет запустить её у себя.

How Research Ops can make or break critical partnerships

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

Кейсы

A design reset

Karri Saarinen рассказывает о редизайне сервиса управления задач Linear. В первой части говорит о том, как продавать такие изменения. Во второй — как шёл сам процесс.

Брендинг цифровых продуктов

The essential guide to matching icons with typefaces

Лучшая статья в мире про связь шрифта и пиктограмм в интерфейсах. Супер-детальный и дотошный метод поиска визуальной рифмы с топчанскими примерами для типовых ситуаций.

Hubbl

Айдентика видео-сервиса Hubbl, сделанная внутренней креативной студией Fox Creative.

Betterfly

Айдентика страхового сервиса Betterfly от британского агентства Design Studio.

Klarna

Обновление айдентики финтеха Klarna, сделанное внутренними силами.

Trust

Айдентика финтех-сервиса Trust от австралийского агентства Lovework.

Docusign

Ребрендинг сервиса цифрового документооборота Docusign, сделанный внутренними силами.

Uber

Обновление айдентики Uber от американского агентства Jones Knowles Ritchie.

Sendwave

Ребрендинг сервиса денежных переводов Sendwave от британского агентства Design Studio.

Customer.io

Ребрендинг сервиса рассылок Customer.io, сделанный внутренними силами.

Epidemic Sound

Ребрендинг каталога профессиональной музыки и звуковых эффектов Epidemic Sound от шведского агентства Bold.

ShareFile

Ребрендинг сервиса цифрового документооборота ShareFile от американского агентства Athletics.

Sports.ru

Ребрендинг спортивного издания Sports.ru от отечественного агентства Супрематика.

CafePay

Айдентика зарплатного проекта CafePay от американского агентства Clay.

The hidden power of typography

Rob McKaughan из Microsoft собрал пачку исследований о том, как шрифт влияет на скорость чтения в целом и восприятие конкретных сообщений в частности.

Тренды

Futurescape — Trajectories for Tomorrow

Прогноз трендов 2024 года от Frog design.

2024 Craft Beer Branding Trends Review

Тренды в пивном дизайне 2024 года.

Post-Neubrutalism — foreshadowing Figma’s next aesthetic ethos

Darren Yeo отметил термин «solarpunk» для обозначения тренда в дизайне из выступления Dylan Field и пытается понять, значит ли он что-то.

Seven visual trends and how they’ll unfold in 2024

Прогноз трендов 2024 года от It’s Nice That.

AIC Trends

AIC собрали сайт-коллекцию обзоров трендов в разных областях.

Алгоритмический дизайн

User Research with Humans vs. AI

Jakob Nielsen здорово проанализировал все гипотетические варианты использования ИИ в пользовательских исследованиях. И трезво оценил, какие потенциально могут автоматизироваться, а какие — никогда.

AI for UX: User Research Prompt Best Practices and Framework

Kuldeep Kelkar предлагает пользовательским исследованиям интересный подход REFINE (Role, Expectations, Format, Iterate, Nuance, Example) для формулирования полезных запросов к алгоритмическим чат-ботам. В теории это поможет в подготовке исследований.

Relume — Websites designed & built faster with AI. AI website builder

Грамотная концепция конструктора сайтов на базе алгоритмического дизайна. Он помогает составить карту сайта, сделать wireframes и собрать стиль на основе мудбордов. Всё это можно экспортировать в Webflow или Figma (они сделали тонну компонентов для типовых ситуаций).

Google Vids — Online Video Creator and Editor

Генератор видео для Google Workspace на базе презентаций Google Slides. Можно выбрать стиль и записать себя.

Video Interpolation With Diffusion Models

Экспериментальный инструмент Google дорисовывает промежуточные кадры видео по первому и последнему.

New Adobe Photoshop with Advanced Generative Fill and Generate Image Brings New Superpowers to All

Adobe развивают алгоритмические инструменты в Photoshop. Можно стилизовать часть изображения на основе другого стилистического изображения-примера, менять части изображения на похожие по духу объекты, вырезать и сгенерировать фон.

AI Video Editing in Adobe Premiere Pro

Adobe добавит алгоритмические функции в видео-редактор Premiere Pro. Можно генерировать видео по текстовому запросу, добавлять или удалять объекты, расширять кадр. Будет возможность подключить сторонние модели вроде OpenAI Sora, Pika Labs или Runway.

Spline AI 3D Generation — The power of AI for the 3rd dimension

Spline добавили генератор 3D-объектов по текстовому запросу.

Flair — The AI design tool for product photography. Drag and drop to create stunning photoshoots in seconds

Сервис алгоритмически генерирует эффектную сцену подачи вашего продукта (например, упаковка или одежда).

Using ChatGPT in Tree Testing — Experimental Results

Jeff Sauro, Will Schiavone и Jim Lewis разбираются, можно ли использовать ChatGPT для тестирования дерева в информационной архитектуре. Успешность выполнения задач сильно завышена, а вот простоту решения задачи предполагает неплохо.

Key Trends and Forecasts Influencing the GenAI Market in 2024

Команда Everypixel разбирается, что происходит с авторскими правами на контент, который используют для обучения больших языковых моделей. Кто с кем судится, есть ли легальные варианты для компаний.

VASA-1

Инструмент для генерации человекоподобных аватаров от Microsoft.

Meta AI

Алгоритмический чат-бот от Meta. Работает как отдельный инструмент и внутри продуктов типа Facebook.

The GenAI Compass — a UX framework to design generative AI experiences

Vincent Koc описывает свой фреймворк «компас генеративного ИИ». Он помогает проектировать интерфейсы таких продуктов.

UX Pilot — Your AI-UX Assistant

Многофункциональный инструмент алгоритмического дизайна. Умеет генерировать макеты, wireframes, цветовые палитры, тексты, планы рабочих сессий. Также может сделать оценку дизайна.

Models All The Way Down

Christo Buschek & Jer Thorp из Knowing Machines решила раскопать, откуда берут данные для обучения алгоритмов популярные генераторы фото и иллюстраций. Они пользуются базой LAION-5B, для которой сделали несколько курированных людьми выборок. Исходя из особенностей этих выборок становится понятно, почему многие картинки от Midjourney или Stable Diffusion выглядят однообразно.

Blaze — The AI Tool for Teams of One

Алгоритмический генератор текстов для блогов, социальных сетей и рекламы.

Leonardo AI — AI Art Generator. Create Art, Images & More

Генератор фото и иллюстраций по текстовому описанию.

«Яндекс» добавил в «Почту» фильтр на основе YandexGPT

Яндекс Почта научилась пересказывать важные письма за последнюю неделю с помощью YandexGPT.

SoundID VoiceAI — The first AI voice transformer plugin

Плагин для DAW превращает запись вашего голоса в любой другой и делает его звучание более профессиональным.

AI and the Beauty of Human Flaws

Интервью с Oliver Reichenstein (основателем iA) на тему стоковости результатов работы инструментов алгоритмического дизайна. И то, как может измениться подход дизайнеров, которые хотят этого избежать.

Apple’s Risky Bet on CarPlay

Casper Kessels рассуждает о разнице в брендировании автомобильных интерфейсов, которую Apple и Google дают производителям. И почему у Apple более слабая позиция.

Для общего и профессионального развития

Commodification and Pancaking of UX — Accept Reality and Plan New Career Paths

Jakob Nielsen рассуждает о коммодизации профессии дизайна интерфейсов по мере роста рынка. Чем это хорошо и плохо, как строить карьеру в такой реальности.

Duelity — Design duels

Занятный концепт дизайн-дуэлей. Два дизайнера решают одинаковую задачу, сообщество выбирает победителя.

Люди и компании в отрасли

What does a head of typography do?

Tim Brown, глава типографики в Adobe, рассказывает в чём состоит его роль и обязанности.

Материалы конференций

Designing with AI

Rosenfeld Media запускают новую конференцию с фокусом на дизайн с ИИ. Она пройдёт 4-5 июня в онлайне.

Подпишитесь на дайджест в Телеграме ― там свежие ссылки появляются каждую неделю, а также в RSS, ВКонтакте или на vc.ru. Отдельный благодарчик команде Сетки за редактор. А ещё — командам Funky Branding за новую айдентику и Бюробукв за шрифт. Сто тыщ респектов Александру Орлову за прошлые два визуальных стиля.

Юрий Ветров

Директор по бренду и дизайну (ex-Muse Group (Ultimate Guitar, MuseScore, Audacity и другие), Райффайзен Банк и Mail.ru Group). Я руковожу командами, которые отвечают за дизайн, исследования и редактуру бренда и интерфейсов, а также дизайн-систему в коде. Автор книги и курса «Паттерны дизайн-менеджмента» и «Дайджеста продуктового дизайна». Со-организовывал Fintech Design Conf, Mail Design Conf и московский Dribbble Meetup, а также Russian Design Cup. Читал лекции в Британке, курировал курс Future London Academy в Лондоне. Мои публикации есть на Smashing Magazine, UXmatters и UX Collective. Подробнее обо мне.

Другие статьи по теме
Дайджест продуктового дизайна, май 2025
View Post
  • Дайджест

Дайджест продуктового дизайна, май 2025

  • Юрий Ветров
  • 24 июня 2025
Дайджест продуктового дизайна, апрель 2025
View Post
  • Дайджест

Дайджест продуктового дизайна, апрель 2025

  • Юрий Ветров
  • 20 мая 2025
Дайджест продуктового дизайна, март 2025
View Post
  • Дайджест

Дайджест продуктового дизайна, март 2025

  • Юрий Ветров
  • 17 апреля 2025
Дайджест продуктового дизайна, февраль 2025
View Post
  • Дайджест

Дайджест продуктового дизайна, февраль 2025

  • Юрий Ветров
  • 16 марта 2025
Дайджест продуктового дизайна, январь 2025
View Post
  • Дайджест

Дайджест продуктового дизайна, январь 2025

  • Юрий Ветров
  • 8 февраля 2025
Дайджест продуктового дизайна, декабрь 2024
View Post
  • Дайджест

Дайджест продуктового дизайна, декабрь 2024

  • Юрий Ветров
  • 29 декабря 2024
Дайджест продуктового дизайна, ноябрь 2024
View Post
  • Дайджест

Дайджест продуктового дизайна, ноябрь 2024

  • Юрий Ветров
  • 5 декабря 2024
Дайджест продуктового дизайна, октябрь 2024
View Post
  • Дайджест

Дайджест продуктового дизайна, октябрь 2024

  • Юрий Ветров
  • 9 ноября 2024

Добавить комментарий Отменить ответ

Ваш адрес email не будет опубликован. Обязательные поля помечены *

Юрий Ветров об интерфейсах
Дизайн-менеджмент цифровых продуктов, © 2007-2018

Input your search keywords and press Enter.