Дайджест собирает свежие статьи по дизайну интерфейсов, а также инструменты, паттерны, кейсы, тренды и исторические рассказы с 2009 года. Я тщательно фильтрую большой поток подписок, чтобы вы могли прокачать свои профессиональные навыки и лучше решить рабочие задачи. Предыдущие выпуски: апрель 2010-декабрь 2021.
Лучшие продуктовые дизайн-команды в России: 2021
Зимой запустил исследование отношения к продуктовым дизайн-командам в России. Наконец-то собрал результаты. Участвовало 1427 человек. Вот, например, топ-10 по вопросу «Оффер какой компании вы бы приняли»:
- Яндекс
- Тинькофф
- Miro
- Альфа-Банк
- Сбер
- Aviasales
- Райффайзен
- Mail.ru Group / VK
- Ozon
- Avito
Теперь у каждой команды в каталоге есть динамика рейтинга — как их оценивали в разные годы. Карточки компаний будут развиваться. Результаты за 2020, 2019 и 2018 годы.
Сайт книги и курса «Паттерны дизайн-менеджмента»
Запустил обновлённый сайт всей одноимённой инициативы — это ещё и:
- Инструменты (обновлённая статья про карту компетенций с шаблонами в Google Sheets и Vectorly)
В прошлом году сделал огромный рывок, чтобы полностью перезаписать курс на русском и сделать пилот на английском, закончить все материалы для книги (редакционная вычитка и пара сотен диаграмм), ну и объединить всё это единой стилистикой и сводным сайтом. Наконец-то готово почти всё (жду первый свёрстанный вариант книги от издательства).
Я ещё отвешаю пару тонн нижайших поклонов за курс и книгу. Но пока поблагодарю за дизайн Колю Иванова — его концепция визуального стиля стала основой для всего. И агентство Pragmatica Жени Ярового — они сделали титаническую работу, связав общим дизайном сайт, курс, книгу, презентации и все остальные материалы. Я давний фанат Webflow и первую версию сайта собирал сам пару лет назад, но ребята подняли его на новый уровень.
Курс «Паттерны дизайн-менеджмента»
1 марта стартует седьмой поток моего курса о дизайн-менеджменте цифровых продуктов на Bang Bang Education.
На первых шести отучились 400 дизайн-директоров, дизайн-менеджеров, арт-директоров, ведущих дизайнеров, креативных директоров из многих отечественных (и нескольких международных) компаний: 1C, ABBYY, AIC, Альфа-Банк, Apalon, App in the Air, Arrival, Aviasales, Avito, Badoo, BBC, БКС, ВТБ, Chatfuel, Газпром, Delivery Club, Детский мир, Dodo Pizza, ДОМ.РФ, EPAM, Foodplex, inDriver, Kaspi, Klarna, Комитет, Красцветмет, Леруа Мерлен, Литрес, Луч, MacPaw, Mail.ru Group, ManyChat, М.Видео, Microsoft, Miro, Модульбанк, МТС, Okko, OneTwoTrip, Opera, Открытие, Ozon, PayPal, ПИК, ПСБ, QIWI, Qlean, Райффайзенбанк, Rambler Group, РБК, Readdle, Redmadrobot, Reg.ru, Росбанк, Россельхозбанк, Ростелеком, S7, Сбербанк, Ситимобил, Столото, Selectel, SEMrush, Skyeng, Tele2, Тинькофф, TomTom, Точка, Учи.ру, Уралхим, ЦИАН, Voximplant, Wargaming, Wrike, X5, Яндекс и многих других.
Я полностью перезаписал все видео, переехал на новую образовательную платформу и постоянно развиваю формат домашних заданий и вебинаров. Курс построен на базе будущей книги по паттернам дизайн-менеджмента (идёт подготовка к печати). Какие-то части вы уже могли прочитать ранее и, возможно, знакомы с общей концепцией модели зрелости дизайна и продвижения по ней, но это около 20% материала курса.
Получился огромный массив знаний из 37 уроков на 10 часов — 32 паттерна и 5 обзорных уроков, а также несколько инструментов-приложений к ним (помогут подниматься по уровням зрелости). Курс идёт 4 месяца. Помимо видео-лекций есть домашние задания и вебинары после каждого блока. Я постепенно добавляю шаблоны для домашних заданий, которые здорово структурируют мысли. Проверяю всё сам.
Самые вовлечённые студенты внедряли улучшения в дизайн-командах по ходу курса, так что к окончанию получили осязаемый выхлоп 🙂
Паттерны и лучшие практики
Badge UI design exploration — Tips & tricks, usability, and use cases review
Роман Камушкен описывает виды беджей в интерфейсе и ситуации для их использования.
Online Grocery UX — 5 High-Level UX Takeaways from 1,100 Hours of Testing Leading Grocery Websites
Baymard Institute провели большое исследование интерфейсов американских сайтов доставки продуктов. Edward Scott описывает основные проблемы. Одна из заметных — выбор замены товаров, которые недоступны.
SaaS UX Benchmark — 5 Pitfalls to Avoid
Baymard Institute провели большое пользовательское исследование профессиональных облачных сервисов. Sally Collins приводит основные проблемы.
Traditional and Hybrid Category Pages
Kate Moran из Nielsen/Norman Group приводит примеры полезных и бесполезных страниц категорий товаров в интернет-магазинах.
User Onboarding: Principles and Guidelines
Памятка по процессу встречи нового пользователя от Cibin KS.
Дизайн-системы и гайдлайны
Rationalise it! 5 steps to introduce a new component to the design system
Андрей Сундиев описывает процесс добавления нового компонента в дизайн-систему Beamery.
Structuring your Storybook
Советы по организации живого гайдлайна в Storybook от Varun Vachhar.
Open Props — Sub-atomic styles
Фреймворк для токенов в дизайн-системах.
Design integrations for Storybook
Обзор инструментов дизайна, которые работают в связке со Storybook.
Design systems are flawed. What we can do about it with 3 facts
José Torre из Shopify размышляет на тему гибкости и роли дизайн-систем.
NextUI — Beautiful, fast and modern React UI Library
Фреймворк для дизайн-систем на React.
Wanda Design System
Дизайн-система сервиса Wonderflow.
D2Design System
Дизайн-система компании Bank Soft System. Шаблоны в Figma.
Понимание пользователя
Katie Swindler — Life and Death Design
Rosenfeld Media выпустили книгу Katie Swindler «Life and Death Design». Она посвящена ситуациям на грани жизни и смерти, а также технологиям и интерфейсам, которые помогают в них. Выдержка из главы 1.
Why designers should remove “Hooked” from their reading list
Rubens Cantuni критикует известную книгу Nir Eyal «Hooked». Она использует психологию пользователей во вред для создания зависимостей не хуже табачной или игровой.
Autonomy, Relatedness, and Competence in UX Design
Tanner Kohler из Nielsen/Norman Group описывает три базовых потребности пользователей: автономность, родство и компетентность. Он показывает, как интерфейсы могут учитывать их.
Информационная архитектура, концептуальное проектирование, контент-стратегия
Service Design: Study Guide
Nielsen/Norman Group сделали структурированную подборку своих статей о проектировании услуг.
Новые инструменты дизайна интерфейсов
Figma
Готовят бету версии для iPad.
Конференция Figma Config 2022 пройдёт 10-11 мая в интернете. Можно подать свою презентацию в программу.
Плагины
- Storybook: Готовят официальный плагин, который позволит связать компоненты в коде и дизайне.
Шаблоны
Статьи
- Саша Нагорная: Композиционные компоненты. Они позволяют сильно сократить количество вариантов в дизайн-системе.
Adobe XD
Tails
Конструктор сайтов на базе фреймворка Tailwind.
Framer Sites
Framer запустили конструктор сайтов. Планируют конкурировать с Webflow по степени гибкости и управляемости.
Minimator
Создание иллюстраций из простых линий в браузере.
CSS Gradient Generator
Генератор градиентов на CSS в разных цветовых моделях. Как он устроен.
CSS Polka Dot Generator
Генератор фонов в горошек в браузере.
CSS Layout Generator
Генератор сеток на CSS.
Animated Backgrounds
Коллекция анимированных фонов на CSS и JavaScript.
Пользовательские исследования и тестирование
ResearchOps: Study Guide
Nielsen/Norman Group сделали структурированную подборку своих статей о ResearchOps.
Как улучшать продукт методом Fake Door
Александр Ревенок из Semrush делится опытом продуктовых экспериментов через метод «фальшивых дверей». Это функции, которые ещё не реализованы, но по интересу пользователей к которым можно предположить их востребованность.
Measuring Tech Savviness
Jim Lewis и Jeff Sauro описывают способы оценить техническую грамотность пользователей. И выясняют, насколько она влияет на эффективность использования интерфейса.
Choosing Chart Types: Consider Context
Kate Moran из Nielsen/Norman Group даёт советы по выбору диаграмм для представления отчётов о пользовательских исследованиях и данных аналитики.
Completion Times and Preference for Sliders vs. Numeric Scales
Jim Lewis и Jeff Sauro изучили разницу между опросниками в виде шкалы из радио-кнопок и ползунка. Подтвердилось, что радио-кнопки проще и быстрее.
Визуальное программирование и дизайн в браузере
Uisual — Free Landing Page Templates for Startups
Коллекция простых шаблонов структуры промо-сайтов с кодом на HTML и CSS.
Vizzu
Каталог скриптов для простой визуализации данных на JavaScript.
Modern Fluid Typography Using CSS Clamp
Adrian Bece показывает, как реализовать гибкую адаптивную типографику с помощью CSS-функции clamp.
Новые скрипты
Дизайн-менеджмент и DesignOps
The State of UX Maturity — Data from Our Self-Assessment Quiz
?Kate Moran проанализировала оценку зрелости дизайна нескольких тысяч компаний по модели Nielsen/Norman Group. В прошлом году они выпустили инструмент самостоятельной оценки зрелости, которым воспользовались 5 371 человек. Основная часть находится на 3 и 4 уровне из 6, хотя это специфика выборки.
Designing the Designer Role
Adam Doti размышляет о развитии роли дизайнера за 10 лет в Salesforce. Мини-сайт с её описанием.
Design at Gusto — Keeping Collaboration and Customers at the Core
Интервью с лидерами дизайна сервиса Gusto о том, как устроен дизайн в компании.
CX Centric Customer Centricity Assessment Tool
Модель зрелости CX от компании CX Centric.
Кейсы
Зачем умной колонке часы со стрелками и как объединить три устройства в одном
Как делали умную колонку с часами SberBox Time.
История
Why Are Hyperlinks Blue
Elise Blanchard продолжает изучать предысторию выбора синего цвета для ссылок в вебе. Она пообщалась с Ben Schneiderman и составила достаточно подробную хронологию событий.
Тренды
CES 2022
Ежегодная выставка технологических чудес и экспериментов CES 2022 в этом году прошла 5-7 января в Лас-Вегасе и интернете. Обычно здесь показывают кучу прорывной крутячки. Правда, из-за дефицита чипов многие крупные компании пропустили участие даже в онлайне. Но кой-чо занятное было.
Последние годы было много разной интересной дичи с гибкими экранами. Но не в этот раз — разве что 17″ планшет от ASUS с кучей степеней свободы. Ну и ещё один эксперимент со вторым экраном у клавиатуры ноутбука у Lenovo.
Компьютерная техника
Стандарт Evo PCs от Intel будет продвигать гибкие экраны и интеграцию Windows с iPhone.
Умные очки
Распознающие текст и лица очки MyEye Pro от OrCam помогают людям с проблемным зрением.
Носимые устройства
Razer всё-таки сделали свою киберпанковскую маску с усилителем голоса. Это было непросто.
Авто
Amazon будет встраивать свои экраны на базе Fire TV в машины. Например, огромный для задних сидений BMW.
ТВ
Samsung позволит смотреть и покупать NFT через телик. Ну и встроит игровой стриминг Stadia и GeForce Now.
Умный дом
Разная разорвишка
Не знаю, будет ли с такими показателями весенняя Mobile World Congress, но, мало ли.
The five Levels of Hype
Johannes Klingebiel описывает 5 видов технологического хайпа, когда желаемое выдают за действительное.
The tech industry’s accessibility report card for 2021
Обзор новых технологий в устройствах и операционных системах крупнейших технологических компаний, которые поддерживают accessibility.
Spatial Web Browsing
Maggie Appleton изучает ветку развития браузеров, которые позволяют смотреть разные сайты в едином полотне для сравнения и детального изучения.
Для общего и профессионального развития
The Future of Behavioral Science in Business: Part 1
Интересная модель развития профессиональных ролей и специализаций от Florent Buisson.
Designer Slack Communities
Каталог дизайн-сообществ в Slack.
Questions to ask when interviewing for a design job
Michael McWatters предлагает набор вопросов для дизайнера на собеседовании, которые стоит задать руководителю дизайна.
The Art of Storytelling for Case Studies
Советы Ingrid Elias из Indeed по структуре описания проекта в портфолио.
Люди и компании в отрасли
The role of delight and difference in UX at Shopify
Цитаты CEO Shopify о важности дизайна и его роли в компании.
Подпишитесь на дайджест в Facebook, ВКонтакте, Телеграме или на vc.ru ― там свежие ссылки появляются каждую неделю. Спасибо всем, кто делится ссылками в группе, особенно Геннадию Драгуну, Павлу Скрипкину, Дмитрию Подлужному, Антону Артемову, Денису Ефремову, Алексею Копылову, Тарасу Бризицкому, Евгению Соколову и Антону Олейнику. Отдельный благодарчик команде Сетки за редактор и Александру Орлову за визуальный стиль.
