Август '21

Arun Venkatesan описывает историю карьеры промышленного дизайнера Richard Sapper, который также повлиял компьютеры (красная кнопка на IBM/Lenovo ThinkPad — его затея). Он из той же немецкой плеяды, что и Dieter Rams, но использовал другие подходы.

Meghan Wenzel сделала обзор нескольких важных научных и исследовательских публикаций о дизайне. Ценность для бизнеса, поведение пользователей, креативность в целом.

Nick Groeneveld подсвечивает забавный движ — дизайнеры просят на LinkedIn выбрать один из вариантов дизайна (когда-то для этого использовали Dribbble). Само собой, этот формат не работает.

Отличный стёб над современным состоянием интернета. Он в утрированном виде показывает кучу ненужного геморроя и обвесов.

Berwyn Powell анализирует углеродный след, который оставляют сайты. Как изображения, видео, скрипты и другие части веба влияют на общую картину.

Генератор рисунков рыб на базе алгоритмического дизайна.

Owen Schoppe из Salesforce описывает роль прототипов в интерфейсах на базе искусственного интеллекта. Они помогают моделировать результат генерации и общую логику взаимодействия.

Tyler Hobbs рассказывает о набирающем обороты применении алгоритмического/генеративного дизайна. Это коллекционные серии произведений, которые продаются через NFT и даже генерируются по определённым верифицированным правилам. Он упоминает платформу Artblocks и свой проект Fidenza на ней.

Интересный эксперимент Hayk An, позволяющий настраивать интерфейс, собранный на базе компонентов с токенами. Можно получить случайную комбинацию параметров, так что это игрушка на стыке алгоритмического дизайна.

Цветовые тренды 2021 года от фотобанка Everypixel.

Дизайнеры агентства Zyro представили современные интернет-сервисы в виде программ и сайтов 90х.

Браузерная версия классического инструмента рисования для детей, выпущенного Apple в 1989 году.

Elise Blanchard разбирается, почему ссылки в браузерах обычно выделены синим цветом. Она разобрала кучу интерфейсов конца 80х и начала 90х и ссылается на конкретный пункт истории обновления версий у классического браузера Mosaic 12 апреля 1993 года.

WeTransfer запустили своё медиа. Они стали одним из самых ярких примеров связи бренда с интерфейсом и на этом сайте их стилистика раскрывается ещё сильнее.

Ребрендинг справочника Yelp.

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

Ребрендинг одной из главных бирж фрилансеров Upwork от американского агентства Porto Rocha.

Продолжение ребрендинга Циан от отечественного агентства Щука. Как и зачем его делали.

Nielsen/Norman Group сделали структурированную подборку своих статей о процессе и методах дизайн-мышления.

Maria Christley делится опытом создания видения будущего для корпоративных интерфейсов Atlassian. Это серия рабочих сессий, которая помогла обрисовать его.

Sarah Gibbons описывает первый уровень зрелости дизайна в фреймворке Nielsen/Norman Group.

• Анимированный шлейф за словом при движении курсора.

• Как сделать анимацию аморфных пятен на CSS.

Paul Ratcliffe показывает, как быстро поддержать навигацию с клавиатуры через кнопку «Tab» для пользователей с ограниченными возможностями.

Ahmad Shadeed предлагает интересный способ точного центрирования текста по вертикали в элементах управления. В вебе это сложнее, ведь межстрочное расстояние и базовая линия шрифта ведут себя по-другому.

Памятка по работе с трансформациями в CSS-анимации от Josh W Comeau.

Sara Soueidan показывает, как сделать индикатор фокуса с учётом требований accessibility.

Jim Nielsen запустил сопроводительный сайт к известному Can I Use, позволяющему убедиться, что определённые функции доступны в браузере. Со временем поддержка прекращается и он отмечает такие ситуации.

Devin Harold показывает, как компания может сформировать стандарты этики при проведении пользовательских исследований.

Статьи на тему того, почему качественные исследования не просто мнения, в отличие от количественных, никогда не выйдут из моды. Это вечная дискуссия в огромном количестве компаний на ранних стадиях зрелости. Page Laubheimer из Nielsen/Norman Group приводит хорошую памятку для таких разговоров.

Сообщество ResearchOps провело опрос среди 147 своих участников на тему навыков, образования и зарплат.

Yuling An из Facebook даёт советы по составлению сценариев удалённых немодерируемых пользовательских исследований.

Usethics рассказывают о методе проведения пользовательских исследований с детьми.

Katie Del Angel из Shopify делится опытом проведения UX-исследований для улучшения accessibility с помощью сервиса Fable. Она приводит в пример несколько сценариев.

Блог Ray Opata Olende об управлении UX-исследованиями в компании и их масштабировании.

Респонденты на пользовательских исследованиях часто забывают или путают произошедшие когда-то события. Jeff Sauro и Jim Lewis рекомендуют приёмы, помогающие им точнее вспомнить такие вещи.

Nielsen/Norman Group сделали структурированные подборки своих статей о методах пользовательских исследований. Уже есть качественное юзабилити-тестирование и количественные исследования. На подходе, наверняка, ещё много — контента у них завались.

Iconfinder запустили каталог иллюстраций.

Генератор аморфных пятен в SVG.

Плагин для Chrome позволяет легко сохранить любые SVG-изображения на странице. Можно быстро получить версию в PNG.

• Font Awesome: Почему перешли на Figma.

• Про Figma пишут уже в Forbes.

• Clara Ujiie: Помогает наглядно показать и протестировать состояния адаптивности.
• Карта сайта в FigJam.
  

• Шаблоны и тарифы для студентов и образовательных организаций.
  

• Variables: Плагин позволяет задать глобальные переменные (считай, токены) для самых разных видов стилей. Размеры, эффекты вроде размытия, тени и т.п.
• Figmage: Публичная ссылка в виде картинки на любой слой или фрейм.
  

• Copy & Rotate: Плагин позволяет быстро расположить по кругу копии элемента.
• Вячеслав Трушкин: Делает плагин, который позволит вставлять пиктограммы из популярных бесплатных наборов.
• Janet John: Большая подборка.
  

Августовские обновления. Улучшение работы с дизайн-системами, плагины и виджеты в FigJam, плагины смогут обновлять прототипы на лету.

Запустили звонки внутри макета, а также сообщения чата внутри курсора.

Jonas Downey анализирует новый интерфейс Safari в iOS 15, где адресная строка переехала вниз экрана и совмещена с основными элементами навигации. Как это влияет на пользовательский опыт и что можно было бы сделать лучше.

Свежий CSS-фреймворк для создания компонентов и сайтов.

Storybook готовят к запуску возможность тестирования интерактивных компонентов.

Varun Vachhar показывает, как тестировать целые пользовательские сценарии в дизайн-системе с помощью Storybook и Cypress.

Chris LaChance рассказывает, как дизайн-система Pega Cosmos поддерживает accessibility из коробки.

Перезапустили сайт-коллекцию отечественных дизайн-систем. Первая версия здорово помогла подсветить наработки компаний на рынке, но со временем её стало сложно обновлять. В новой версии всё актуально и легко поддерживается — помимо старых знакомых (Альфа-Банк, БАРС Груп, Дизайн государственных систем, IVI, Контур, Mail.ru Group, Рамблер, Яндекс) наконец-то появились B2B Center, Вконтакте, Газпром Нефть, Райффайзенбанк, Ростелеком и Semrush. Кто-то выпал, ведь основное условие участия — компоненты на технологическом уровне, открытые для всех. Если мы почему-то не знаем о вашей дизайн-системе — присылайте её боту @DSClubbot в Телеграме, обязательно добавим.

Adrian Roselli описывает проблемы с некогда хайповыми формами, встроенными в повествование.

Eli Penner рассказывает об экспериментах с анимацией в вебе, которые он подсмотрел в играх.

Sally Collins сделала обзор типичных ошибок при проектировании навигации в интернет-магазинах из свежего исследования Baymard. Многое повторяется из года в год, но в любом случае полезная напоминалка.

Alex Krzyminski из Baymard даёт советы по грамотному описанию сути изображений в HTML для интернет-магазинов.

Jim Lewis и Jeff Sauro делятся новым сравнительным исследованием американских интернет-магазинов. Они замеряют NPS, SUPR-Q и UMUX-Lite.

Ещё один простой чеклист для проверки accessibility.

Peter Ramsey разбирает интерфейс продажи NFT в сервисе OpenSea. Много детских проблем, хотя при таком ажиотаже в теме многие напрягутся, чтобы решить их.

Fabiola Einhorn из athenahealth приводит лучшие практики интерфейсов дистанционного медицинского обслуживания. Они основаны на её многолетней практике и многочисленных UX-исследованиях.

Сайт Growth Design подробно разбирает знакомую дизайнерам боль — отписку от Adobe Creative Cloud. И даёт немного советов по лечению интерфейса.

Наглядный справочник по сеткам в вебе от агентства Obys. Показывают, как они работают на примере своих проектов.

Роман Камушкен собрал неплохой обзор возможных состояний аватара пользователя.

Andrea Drugay из Slack рассказывает о создании и внедрении принципов хороших текстов для маркетинговой коммуникации.

Kate Kaplan из Nielsen/Norman Group применяет интерфейсные эвристики Якоба Нильсена к профессиональным веб-интерфейсам. Она подсвечивает хорошие и плохие примеры.

Есть две школы: те, кто не блокирует кнопки в интерфейсе (потому что пользователь часто не понимает причины) и те, кто делает это (мол, это помогает избежать ошибок). Виталий Фридман наглядно разбирает, почему первый подход правильный.

Конференция от Райффайзенбанка пройдёт 30 сентября в онлайне. Дизайн-команды современных банков покажут, что интересного происходит в отрасли и расскажут, куда движется индустрия. Они расскажут про интересные запуски и покажут, как устроены дизайн-процессы. Состав: Klarna, Ак Барс, ВТБ, МТС Банк, Райффайзенбанк, Росбанк, Тинькофф, Angry × Хайс и ONY × Blanc. В прошлом году у нас получилось нащупать интересный формат для онлайна, который смотрели 15 000 человек. В этот раз хотим поднять планку и сделать трансляцию ещё более вовлекающей и визуально приятной. Конференция, как всегда, бесплатна и открыта для всех.