Уже пять лет я публикую регулярные обзоры свежих статей по теме интерфейсов, новых инструментов и коллекций паттернов, интересных кейсов и исторических рассказов. Из лент нескольких сотен тематических подписок отбирается примерно 5% стоящих публикаций, которыми интересно поделиться. Предыдущие материалы: апрель 2010-февраль 2015.
Baymard E-Commerce Product List Usability: Report & Benchmark
Новый отчет Baymard Institute, посвященный страницам списка продуктов на сайтах электронной коммерции. Публично доступные выдержки из него:
Getting Users Back From Multitasking
Ben Watanabe разбирает режим многозадачности в iOS как еще один способ сделать работу с приложением полезнее. В нем показывается уменьшенная версия последнего открытого экрана, хотя было бы куда полезнее заменять ее на выжимку свежей информации из приложения.
Инфографика: Шпаргалка по размерам графических элементов в социальных сетях
Подробная шпаргалка по размерам графических элементов в социальных сетях. Facebook, Twitter, LinkedIn, Google+, Pinterest, Instagram, YouTube, Вконтакте, Мой Мир, Одноклассники.
The Low Hanging Fruit of User Onboarding
История способов обучения пользователей на старте работы с продуктом и взгляд на их будущее от Des Traynor.
Выдержки из свежей книги UXPin про дизайн взаимодействия
Continuous Input In Mobile Devices — Pain Or Gain?
Игорь Фастовский разбирает способ клавиатурного ввода на мобильных с помощью swype-подобных жестов. Он предлагает несколько улучшений для него, позволяющих решить две главные проблемы — часть символов не видна, да и пользователь не всегда помнит, где находится следующая нужная ему буква. Решение спорное, но интересное.
Accessibility APIs: A Key To Web Accessibility
Про технические аспекты создания доступной среды в веб-браузере и немного про историю вопроса. С одной стороны статья для технарей, но юзабилити должно быть междисциплинарной областью. Без понимания ограничений или возможностей, которые нам представляют технологии, невозможна эффективная работа. А в этой статье очень доходчиво объяснено, на что можно обращать внимание при работе над доступностью веб-среды.
Паттерны анимации в известных приложениях
Beyond Blue Links — Making Clickable Elements Recognizable
Hoa Loraner приводит список правил выделения интерактивных элементов в интерфейсе.
Niice — A search engine with taste
Вышло приложение Niice для iOS, инструмента для создания мудбордов.
Customers Who Bought This Item Also Bought… Affinity Analysis Explained
Jeff Sauro о том, как работает формула предложения похожих товаров в интернет-магазинах. В статье есть наглядные расчеты, показывающие, как проверяются взаимосвязи между ними.
Как длина посадочной страницы влияет на ее конверсию
Когда выбирать короткую, а когда длинную версию.
UX Archive Animated
Теперь UX Archive тоже собирает примеры анимации в мобильных приложениях.
Mystical guidelines for creating great user experiences
Забавная параллель дизайн-процесса с тем, как Тора описывает процесс сотворения мира. Скорее смешно, чем полезно, но с этой стороны еще никто не заходил.
The Curse of the Mobile Strategy
Jared Spool о «проклятии» мобильной стратегии. Концентрация только на одном канале значительно сокращает выбор возможных вариантов. Следует думать и действовать на уровне общепродуктовой стратегии, не ограничиваясь одним из них.
67 Ways to Increase Conversion with Cognitive Biases
Jeremy Smith собрал крутую коллекцию из 67 когнитивных искажений, которые используются для управления поведением пользователей. Коллекция достаточно серьезная и обширная. Цепляет, что статья начинается с противопоказаний к использованию и принципа «не навреди».
Winning Over Wary Participants
Люди ведут себя по-разному, в том числе и участники юзабилити-тестирования. Для некоторых участников тестирование — стресс, излишние переживания. Jim Ross дает несколько поведенческих приемов, которые позволят предотвратить либо уменьшить излишнее волнение пользователей во время тестирования.
People Don’t Read, They Scan
Подборка теорий и концепций на тему того, что пользователи скорее сканируют, а не читают тексты в вебе. Концовка и выводы смазаны, но в статье много полезных отсылок по этому вопросу.
Positive Design Reference Guide
Книга «Positive Design Reference Guide» от S.Jimenez, A.E.Pohlmeyer и P.M.A.Desmet, которая собрала 29 моделей, теорий и фреймворков, посвященных «well-being-driven»-дизайну, оставляющему у пользователя хорошие впечатления от использования.
Дизайн для стран Азии
Change Blindness — Why People Don’t See What Designers Expect
Kathryn Whitenton о «слепоте к изменениям» — почему пользователи не замечают некоторые небольшие изменения на сайте или в приложении, которые они, по идее создателей продукта, должны были заметить. Например, появление сообщений об ошибках или об успешном завершении, фильтрацию результатов.
Understanding Context: Environment, Language, and Information Architecture
Выдержка из книги Andrew Hinton «Understanding Context: Environment, Language, and Information Architecture». Книга посвящена пониманию текущего контекста пользователя, а в этой главе говорится о важности историй в описании опыта взаимодействия.
In Design, Empathy is Not Enough
Dan Saffer о том, что иногда эмпатии не достаточно для создания хорошего дизайна. Для оптимального результата нужно соблюдать баланс между сопереживанием пользователю и наблюдением за переживаниями пользователей с беспристрастной точки зрения. Обе крайности не приводят к лучшим результатам. В продолжение темы:
Дизайн для пожилых людей
Card Generator
Простой онлайн-сервис для подготовки карточной сортировки от Lukas Mathis. Нужно вписать термины в столбец и можно получить их печатную версию, размеченную по карточкам.
Service Design: An Introduction to a Holistic Assessment Methodology of Library Services
Памятка на тему основ проектирования услуг и кейс их применения в библиотеке Университета Мичигана. Новой информации мало, но достаточно хорошо и подробно разложено по полочкам.
Adobe Comp CC
Adobe выпустил приложение Comp CC для прототипирования на iPad. В основе мало чем отличается от других подобных инструментов, но на практике очень приятные решения в мелочах. И самое главное — наработки можно перекинуть в InDesign, Photoshop или Illustrator для последующей доработки. Ну и в целом оно построено на технологиях Adobe, а значит отлично завязано на остальные сервисы — в том числе Typekit. В его создании участвовал Khoi Vinh.
Bind — Building an experimental UI design tool
Alastair Monk делает свой инструмент для дизайнеров Bind. Попробовать его пока нельзя, но он рассказывает о его основных принципах — версионность с Git, адаптивность по умолчанию с использованием Grid Style Sheets.
Napkin — Design quick mocks, directly on your phone
Еще одно приложение для создания прототипов мобильных приложений прямо на телефоне. Пока только iOS.
Новое для Sketch
Balsamiq 3
Вышла третья версия Balsamiq.
Introducing Noun Project for Mac
The Noun Project выпустили приложение для Mac. Подписка стоит $9,99 в месяц, есть 14-дневный пробник.
Pixel Squid
Зарождается новый тренд — стоки изображений с возможностью детальной настройки перед скачиванием и легкого использования после него. Первый — выбираете из быстро пополняемой коллекции изображение, подбираете нужный ракурс (!) и получаете изображение в PSD; все по слоям, даже освещение; маски для быстрого выбора и быстрого изолирования. Второй — Illustrio — векторный сток, перед скачиванием вы можете изменить множество параметров (для каждой картинки свои), например, удлинить руки у робота или перекрасить цвет медальки. В продолжение темы:
ai2html
Плагин для Adobe Illustrator, позволяющий перегонять графику из макетов в HTML5.
Nietzsche Ipsum
Генератор текста в духе Ницше вместо lorem ipsum.
Работа с iOS8
Инструменты паблишинга
How To Create Effective App Screenshots for Your App Page
Толковая инструкция по подготовке скриншотов для магазинов приложений Android, iOS и Windows Phone. Melanie Haselmayr приводит чеклист необходимой информации и графики для различных платформ, а также разбирает несколько подходов к сборке самих иллюстраций. В продолжение темы:
From Page to Stage to Screen — Designing an Omni-Channel Experience
Traci Lepore пытается выделить особенности среды для типов платформ — настольные ПК, планшеты, телефоны, киоски, почтовые рассылки, социальные сети. У каждой свои возможности и ограничения, которые важно учитывать при кросс-канальном взаимодействии между ними.
Новое для Material Design
Новое для Pebble
Apple Watch
Новое для Android Wear
Evangelising user research
Время толстых отчетов, которые никто не читает, прошло. David Travis дает обзор простых и эффективных lean-методов анализа и представления результатов пользовательских исследований.
The User Is Drunk
Отличный новый подход к тестированию интерфейсов — Richard Littauer за $250 проверит ваш сайт в пьяном состоянии. На выходе отчет с найденными проблемами и скринкаст.
How Hard Are Your Surveys to Take?
Jeff Sauro предлагает методику проверки пользовательских опросов для того чтобы их результаты были более качественными. Он назвал его SRS (Survey Respondent Score) и это что-то вроде нильсеновских эвристик, по которым рекомендуется прогнать опрос перед его запуском.
A Beginner’s Guide to Web Site Optimization
Хорошая методичка по ходу A/B-тестирования от Charles Shimooka. Как координироваться с другими командами, выбирать инструментарий, анализировать результаты.
Does Response Timing Matter in Online Research?
Jeff Sauro пытается понять, насколько влияет скорость ответа респондентов в опросах на качество оценки. Это позволит использовать данные по ходу исследования, не дожидаясь его окончания. Проводившиеся ранее исследования либо не показывают влияния, либо говорят о том, что отвечающие быстрее более благосклонны. Выводы из его эксперимента показывают, что значимого влияния нет.
Should Your Entire Product Team Observe Usability Testing?
Дискуссия на UXMatters о том, почему важно приглашать всю команду на сессии пользовательских исследований.
Uxeria — Remote usability testing and marketing tool
Еще один инструмент для удаленного юзабилити-тестирования Uxeria. Все достаточно стандартно по набору возможностей.
Tumult Hype 3 Pro — The Next Revolution in HTML5 Animation
Вышел релиз третьей версии Hype Pro. Интерактивные повторно используемые анимированные объекты с физической моделью и адаптивность для сайтов, iBooks, рекламы.
Новое для Quartz Composer
Компонентные системы и живые гайдлайны
Веб-типографика
CSS-анимация
Работа с SVG
Работа с цветом в вебе
Работа с Flexbox
Новые скрипты
Xcode для дизайнеров
One Magic Formula to Calculate User Experience?
Wouter de Bres пытается вывести универсальную формулу UX. Он использует параметры времени загрузки (технологической и когнитивной), ценность и качество взаимодействия. Есть много спорных моментов и нестыковок, но сама по себе идея интересная.
Дизайн государственных сайтов
No Dickheads! A Guide To Building Happy, Healthy, And Creative Teams.
Преприятнейшая духоподъемная статья о командообразовании от Rhys Newman. Он достаточно подробно разбирает ценности, которые должны лежать в основе сильной и слаженной команды, способной создавать крутые продукты. Один из лучших материалов на тему.
Understanding and Influencing Business
Liam Friedland пытается переложить цепочку создания добавленной стоимости Майкла Портера на дизайн-проекты.
What does Pair Design look like?
Парное программирование — достаточно известный метод. Chris Noessel и Suzy Thompson из Cooper рассказывают о парном дизайне.
False Dichotomies
Lukas Mathis о том, как избегать ложной дихотомии при обсуждении дизайн-решений. Часто в процессе спора команда разделяется вокруг пары вариантов и накаляет обстановку спором, вместо того чтобы копнуть дальше и найти другие подходы.
Overthinking vs. Underthinking — Finding the Sweet Spot
Хорошая колонка Kingshuk Das о перекосах в чистом дизайн-мышлении и классическом стратегическом бизнес-планировании. Первый генерирует уйму мотивирующих, но не привязанных к жизни и бизнесу идей, второй — бесконечный набор аналитических материалов, в которых сложно сделать осознанный выбор. Он предлагает таблицу ситуаций, в которых применим первый и второй подходы.
Disney’s $1 Billion Bet on a Magical Wristband
Disney MagicBand, в дизайне которого участвовали frog — возможно, самый большой UX-проект десятилетия.
Все по графику: как мониторинг активности пользователей на главной Mail.Ru помогает жить и...
Моя коллега Ольга Курицына рассказывает об аналитике главной страницы Mail.Ru в связке с крупными событиями в стране. Интересно о том, как офлайновые события влияют на работу большой аудитории с веб-сервисами.
Considerations When Conducting User Research In Other Countries — A Brazilian Case Study
Claire Carlson делится опытом проведения пользовательского исследования в Бразилии. Что нужно учитывать на этом рынке в частности и в целом при проведении международных исследований с выездом в страну.
Кейсы редизайна
Readable Wearables
Открывается новая эпоха для веба — адаптивность учитывает умные часы. Matt Griffin рассказывает о том, как они адаптировали сайт студии Bearded для совсем маленьких экранов.
Google HATES Your Non Mobile Site
Craig Tomlin о новых правилах поисковой выдачи Google, которая теперь учитывает не просто наличие мобильной версии сайта, но и ее качество. По словам коллег, компания обращает внимание даже на соответствие возможностей большой и мобильной версии. В статье простая методичка по поиску таких проблем. В продолжение темы:
Фаблеты
Автомобильные интерфейсы
Design In Tech Report 2015
Доклад John Maeda о значительном увеличении роли дизайна в современных технологических компаниях за последние несколько лет. Дизайнеры основывают успешные компании, крупные компании покупают дизайн-студии, дизайнеры становятся партнерами в компаниях венчурного капитала.
Виртуальная и дополненная реальность
UX Reactions
Коллекция гифок на злободневные аспекты дизайнерской работы. Хороший способ разнообразить проектную переписку.
The Web’s Grain by Frank Chimero
Статья на основе презентации Frank Chimero о профессиональной философии, в которой он пытается пересобрать текущее понимание роли и задач дизайнера в современном вебе. Интересный подход к адаптивному дизайну и в целом среде, для которой создаются продукты.
Helvetica / Objectified / Urbanized: The Complete Interviews
Вышла книга «Helvetica/Objectified/Urbanized: The Complete Interviews», собравшая 100 интервью из трех известных фильмов по дизайну. Fast Co Design публикует часть беседы с Dieter Rams оттуда.
Анонсы тренингов и семинаров
Новые онлайн-курсы
Designing for Medical
Ted Goas пишет об особенностях работы дизайнера в компании, делающей медицинские сервисы. Из-за жестких законов по охране личных данных в отрасли повышенная секретность, а оборудование у пользователей зачастую доисторическое. Но сами задачи и возможность помочь реальным людям дико интересны.
Critical Sharks
Очень толковый дискурс на тему того, можно ли критиковать работы крупных компаний. Конечно, им приходится учитывать тысячи нюансов и действовать в жестких рамках ограничений времени и ресурсов, плюс все это в агрессивной конкурентной среде. Но без диалога в индустрии ей будет сложнее развиваться. Сам повод (выход iOS7) уже протух, но материал свежий и тема все равно актуальна. Третья часть по ссылке самая толковая. Часть 1 и 2.
Перевод книги MailChimp «The UX Reader» от ФРИИ
Web UI Design for the Human Eye — Colors, Space, Contrast
Еще одна книга от UXPin в этом году, на этот раз про цвета, отступы и необходимый уровень контраста в интерфейсах.
Выдержки из книги Golden Krishna «The Best Interface is No Interface»
Эргономист № 40
Вышел в свет очередной, 40-й выпуск бюллетеня «Эргономист». В нем вы найдете материалы, посвященные проблемам профессиональной оценки и отбора персонала, информацию о новых конференциях и публикациях, а также несколько забавных эргономических «диверсий»
The Value of Apprenticeships in Cooking and Product Design
Melissa Mandelbaum сравнивает опыт стажерства в дизайне с тем, как учатся начинающие повара и рассказывает о своем приходе в профессию.
The Demise of LayerVault and the Market for Creative Tools
Еще одна внезапная новость в этом году — версионная система для дизайнеров LayerVault закрывается. Последний год-полтора новые инструменты для дизайнеров появлялись почти каждую неделю, а тут вдруг уход с рынка одного из старейших и известнейших среди них. Khoi Vinh размышляет, почему и коснется ли это остальных. Возможно, это связано с покупкой в чем-то схожего сервиса Pixelapse Дропбоксом — появился монструозный конкурент, который сильно подрезал перспективы развития.
How they got there — A book by Khoi Vinh
Khoi Vinh выпустил книгу «How They Got There» четырнадцати подробных интервью с известными дизайнерами. Они рассказывают о своей карьере в деталях, со всеми ее странными поворотами. В качестве пробника опубликовано первое из них, с UX-исследователем Erika Hall. Оказалось, что она какое-то время жила в России и немного знает язык. В продолжение темы:
Новые сессии AMA
Conference Review: UX Strategies Summit 2014, part 1
Отчет Pabini Gabriel-Petit о конференции UX Strategies Summit 2014, проходившей 10-12 июня в Сан-Франциско, США. Достаточно подробный конспект нескольких ключевых выступлений, хотя Kelly Goto свою презентацию повторяет уже не первый год.
Видео с Interaction15
Видео с конференции Interaction15, прошедившей 9-11 февраля в Сан-Франциско, США.
Свежие ссылки можно также отслеживать в одноименной Facebook-группе. Спасибо всем, кто также публикует ссылки в ней, особенно Геннадию Драгуну, Павлу Скрипкину, Дмитрию Подлужному, Антону Артемову, Денису Ефремову и Евгению Соколову. Все больше материалов в обзорах появляется благодаря им.
Паттерны и Best Practices
Baymard E-Commerce Product List Usability: Report & Benchmark
Новый отчет Baymard Institute, посвященный страницам списка продуктов на сайтах электронной коммерции. Публично доступные выдержки из него:
- О важности указания цены за единицу товара, даже если продается упаковка.
- О важности указания количества проголосовавших рядом с любыми цифрами рейтингов. Интересно, как меняется их восприятие с возрастом.
Getting Users Back From Multitasking
Ben Watanabe разбирает режим многозадачности в iOS как еще один способ сделать работу с приложением полезнее. В нем показывается уменьшенная версия последнего открытого экрана, хотя было бы куда полезнее заменять ее на выжимку свежей информации из приложения.
Инфографика: Шпаргалка по размерам графических элементов в социальных сетях
Подробная шпаргалка по размерам графических элементов в социальных сетях. Facebook, Twitter, LinkedIn, Google+, Pinterest, Instagram, YouTube, Вконтакте, Мой Мир, Одноклассники.
The Low Hanging Fruit of User Onboarding
История способов обучения пользователей на старте работы с продуктом и взгляд на их будущее от Des Traynor.
Выдержки из свежей книги UXPin про дизайн взаимодействия
- Статья про аффорданс.
- Четыре задачи для текста в интерфейсах (приветствие, навигация, действия, сервис).
Continuous Input In Mobile Devices — Pain Or Gain?
Игорь Фастовский разбирает способ клавиатурного ввода на мобильных с помощью swype-подобных жестов. Он предлагает несколько улучшений для него, позволяющих решить две главные проблемы — часть символов не видна, да и пользователь не всегда помнит, где находится следующая нужная ему буква. Решение спорное, но интересное.
Accessibility APIs: A Key To Web Accessibility
Про технические аспекты создания доступной среды в веб-браузере и немного про историю вопроса. С одной стороны статья для технарей, но юзабилити должно быть междисциплинарной областью. Без понимания ограничений или возможностей, которые нам представляют технологии, невозможна эффективная работа. А в этой статье очень доходчиво объяснено, на что можно обращать внимание при работе над доступностью веб-среды.
Паттерны анимации в известных приложениях
Beyond Blue Links — Making Clickable Elements Recognizable
Hoa Loraner приводит список правил выделения интерактивных элементов в интерфейсе.
Niice — A search engine with taste
Вышло приложение Niice для iOS, инструмента для создания мудбордов.
Customers Who Bought This Item Also Bought… Affinity Analysis Explained
Jeff Sauro о том, как работает формула предложения похожих товаров в интернет-магазинах. В статье есть наглядные расчеты, показывающие, как проверяются взаимосвязи между ними.
Как длина посадочной страницы влияет на ее конверсию
Когда выбирать короткую, а когда длинную версию.
UX Archive Animated
Теперь UX Archive тоже собирает примеры анимации в мобильных приложениях.
Mystical guidelines for creating great user experiences
Забавная параллель дизайн-процесса с тем, как Тора описывает процесс сотворения мира. Скорее смешно, чем полезно, но с этой стороны еще никто не заходил.
The Curse of the Mobile Strategy
Jared Spool о «проклятии» мобильной стратегии. Концентрация только на одном канале значительно сокращает выбор возможных вариантов. Следует думать и действовать на уровне общепродуктовой стратегии, не ограничиваясь одним из них.
Понимание пользователя
67 Ways to Increase Conversion with Cognitive Biases
Jeremy Smith собрал крутую коллекцию из 67 когнитивных искажений, которые используются для управления поведением пользователей. Коллекция достаточно серьезная и обширная. Цепляет, что статья начинается с противопоказаний к использованию и принципа «не навреди».
Winning Over Wary Participants
Люди ведут себя по-разному, в том числе и участники юзабилити-тестирования. Для некоторых участников тестирование — стресс, излишние переживания. Jim Ross дает несколько поведенческих приемов, которые позволят предотвратить либо уменьшить излишнее волнение пользователей во время тестирования.
People Don’t Read, They Scan
Подборка теорий и концепций на тему того, что пользователи скорее сканируют, а не читают тексты в вебе. Концовка и выводы смазаны, но в статье много полезных отсылок по этому вопросу.
Positive Design Reference Guide
Книга «Positive Design Reference Guide» от S.Jimenez, A.E.Pohlmeyer и P.M.A.Desmet, которая собрала 29 моделей, теорий и фреймворков, посвященных «well-being-driven»-дизайну, оставляющему у пользователя хорошие впечатления от использования.
Дизайн для стран Азии
Change Blindness — Why People Don’t See What Designers Expect
Kathryn Whitenton о «слепоте к изменениям» — почему пользователи не замечают некоторые небольшие изменения на сайте или в приложении, которые они, по идее создателей продукта, должны были заметить. Например, появление сообщений об ошибках или об успешном завершении, фильтрацию результатов.
Understanding Context: Environment, Language, and Information Architecture
Выдержка из книги Andrew Hinton «Understanding Context: Environment, Language, and Information Architecture». Книга посвящена пониманию текущего контекста пользователя, а в этой главе говорится о важности историй в описании опыта взаимодействия.
In Design, Empathy is Not Enough
Dan Saffer о том, что иногда эмпатии не достаточно для создания хорошего дизайна. Для оптимального результата нужно соблюдать баланс между сопереживанием пользователю и наблюдением за переживаниями пользователей с беспристрастной точки зрения. Обе крайности не приводят к лучшим результатам. В продолжение темы:
- Интересный подход к развитию эмпатии у дизайнеров и разработчиков. Сервис считает вес страниц сайта в деньгах разных стран, сколько будет стоить его посещение.
Дизайн для пожилых людей
Информационная архитектура, концептуальное проектирование, контент-стратегия
Card Generator
Простой онлайн-сервис для подготовки карточной сортировки от Lukas Mathis. Нужно вписать термины в столбец и можно получить их печатную версию, размеченную по карточкам.
Service Design: An Introduction to a Holistic Assessment Methodology of Library Services
Памятка на тему основ проектирования услуг и кейс их применения в библиотеке Университета Мичигана. Новой информации мало, но достаточно хорошо и подробно разложено по полочкам.
Проектирование и дизайн экранов интерфейса
Adobe Comp CC
Adobe выпустил приложение Comp CC для прототипирования на iPad. В основе мало чем отличается от других подобных инструментов, но на практике очень приятные решения в мелочах. И самое главное — наработки можно перекинуть в InDesign, Photoshop или Illustrator для последующей доработки. Ну и в целом оно построено на технологиях Adobe, а значит отлично завязано на остальные сервисы — в том числе Typekit. В его создании участвовал Khoi Vinh.
Bind — Building an experimental UI design tool
Alastair Monk делает свой инструмент для дизайнеров Bind. Попробовать его пока нельзя, но он рассказывает о его основных принципах — версионность с Git, адаптивность по умолчанию с использованием Grid Style Sheets.
Napkin — Design quick mocks, directly on your phone
Еще одно приложение для создания прототипов мобильных приложений прямо на телефоне. Пока только iOS.
Новое для Sketch
- Быстрая подготовка материалов для AppStore.
- Интеграция с Marvel.
- Шаблоны Apple Watch для Sketch от Meng To.
Balsamiq 3
Вышла третья версия Balsamiq.
Introducing Noun Project for Mac
The Noun Project выпустили приложение для Mac. Подписка стоит $9,99 в месяц, есть 14-дневный пробник.
Pixel Squid
Зарождается новый тренд — стоки изображений с возможностью детальной настройки перед скачиванием и легкого использования после него. Первый — выбираете из быстро пополняемой коллекции изображение, подбираете нужный ракурс (!) и получаете изображение в PSD; все по слоям, даже освещение; маски для быстрого выбора и быстрого изолирования. Второй — Illustrio — векторный сток, перед скачиванием вы можете изменить множество параметров (для каждой картинки свои), например, удлинить руки у робота или перекрасить цвет медальки. В продолжение темы:
ai2html
Плагин для Adobe Illustrator, позволяющий перегонять графику из макетов в HTML5.
Nietzsche Ipsum
Генератор текста в духе Ницше вместо lorem ipsum.
Работа с iOS8
Инструменты паблишинга
- Создатели Aesop запускают Lasso, еще один инструмент паблишинга в дополнение к Story.AM. Это плагин к WordPress за $129.
- Никита Обухов собрал на Тильде подборку сильных лонг-ридов, включая ключевые хиты.
- Интервью с Романом Мазуренко, одним из создателей отечественной паблишинговой платформы Stampsy.
How To Create Effective App Screenshots for Your App Page
Толковая инструкция по подготовке скриншотов для магазинов приложений Android, iOS и Windows Phone. Melanie Haselmayr приводит чеклист необходимой информации и графики для различных платформ, а также разбирает несколько подходов к сборке самих иллюстраций. В продолжение темы:
From Page to Stage to Screen — Designing an Omni-Channel Experience
Traci Lepore пытается выделить особенности среды для типов платформ — настольные ПК, планшеты, телефоны, киоски, почтовые рассылки, социальные сети. У каждой свои возможности и ограничения, которые важно учитывать при кросс-канальном взаимодействии между ними.
Новое для Material Design
Новое для Pebble
Apple Watch
- Немного о том, как в условиях строгой секретности компании тестируют свои приложения на устройстве.
- Тестовая лаборатория, в которой исследуются сценарии и особенности использования часов для спорта.
- Шаблоны для скетчей.
- Реализация фирменного индикатора физической нагрузки на CSS.
- Небольшой кейс создания версии Wunderlist для часов.
Новое для Android Wear
- Компания ELEKS предложила свое видение приложения для Tesla в развитие недавнего аналогичного концепта для Apple Watch. Оба кейса здорово показывают различия в подходах двух платформ, грозящих стать самыми распространенными.
Пользовательские исследования и тестирование, аналитика
Evangelising user research
Время толстых отчетов, которые никто не читает, прошло. David Travis дает обзор простых и эффективных lean-методов анализа и представления результатов пользовательских исследований.
The User Is Drunk
Отличный новый подход к тестированию интерфейсов — Richard Littauer за $250 проверит ваш сайт в пьяном состоянии. На выходе отчет с найденными проблемами и скринкаст.
How Hard Are Your Surveys to Take?
Jeff Sauro предлагает методику проверки пользовательских опросов для того чтобы их результаты были более качественными. Он назвал его SRS (Survey Respondent Score) и это что-то вроде нильсеновских эвристик, по которым рекомендуется прогнать опрос перед его запуском.
A Beginner’s Guide to Web Site Optimization
Хорошая методичка по ходу A/B-тестирования от Charles Shimooka. Как координироваться с другими командами, выбирать инструментарий, анализировать результаты.
Does Response Timing Matter in Online Research?
Jeff Sauro пытается понять, насколько влияет скорость ответа респондентов в опросах на качество оценки. Это позволит использовать данные по ходу исследования, не дожидаясь его окончания. Проводившиеся ранее исследования либо не показывают влияния, либо говорят о том, что отвечающие быстрее более благосклонны. Выводы из его эксперимента показывают, что значимого влияния нет.
Should Your Entire Product Team Observe Usability Testing?
Дискуссия на UXMatters о том, почему важно приглашать всю команду на сессии пользовательских исследований.
Uxeria — Remote usability testing and marketing tool
Еще один инструмент для удаленного юзабилити-тестирования Uxeria. Все достаточно стандартно по набору возможностей.
Визуальное программирование и дизайн в браузере
Tumult Hype 3 Pro — The Next Revolution in HTML5 Animation
Вышел релиз третьей версии Hype Pro. Интерактивные повторно используемые анимированные объекты с физической моделью и адаптивность для сайтов, iBooks, рекламы.
Новое для Quartz Composer
- Антон Карташов начал серию статей для начинающих работать в Quartz Composer. Это kartashov/%D0%B1%D0%B0%D0%B7%D0%BE%D0%B2%D1%8B%D0%B5-%D0%BA%D0%BE%D0%BD%D1%86%D0%B5%D0%BF%D1%86%D0%B8%D0%B8-quartz-composer-264b25f88cbb">конспект первой главы официального руководства пользователя.
- Еще одна мини-обучалка по работе с Origami от Francis Cortez. Он говорит о версии 2.0 на примере material design.
- Антон Карташов собрал отличейший справочник с описанием 50 самых используемых патчей на русском языке. kartashov/%D0%BE%D0%B1%D0%B7%D0%BE%D1%80-50-%D1%81%D0%B0%D0%BC%D1%8B%D1%85-%D0%B8%D1%81%D0%BF%D0%BE%D0%BB%D1%8C%D0%B7%D1%83%D0%B5%D0%BC%D1%8B%D1%85-%D0%BF%D0%B0%D1%82%D1%87%D0%B5%D0%B9-f5969048c64a">Сопроводительная статья.
Компонентные системы и живые гайдлайны
- Рассказ о SC5, фреймворке для создания живых гайдлайнов, а также базовая инструкция по работе с ним.
- Живой гайдлайн Primer от GitHub.
- Гайдлайны Purple для платформы Heroku.
Веб-типографика
- Подробнейшая шпаргалка по специальным типографическим символам в вебе и на клавиатуре.
- Type.js — библиотека для более простой реализации нормальной типографики на вебе.
- Способы делать надстрочные символы в CSS.
- Использование API шрифтовых событий для более мягкой загрузки веб-шрифтов.
CSS-анимация
Работа с SVG
- О работе с SVG-спрайтами.
- Три способа использования SVG-спрайтов для анимации.
- Практически бесполезный, но забавный с точки зрения альтернативного видения подход к созданию векторных иконок в коде с помощью ASCII-графики. Альтернатива SVG из параллельной вселенной.
- Хорошая наглядная памятка по работе с векторными иконками. Какие форматы использовать для разных платформ, как экспортировать файлы, какие инструменты лучше использовать.
- Шикарнейшая онлайн-презентация Sara Soueidan об использовании SVG для самого широкого спектра задач и его преимуществах над CSS. Инфографика, шрифты, иконочные спрайты, анимация и т.п.
- Библиотка для генерирования SVG-паттернов для последующей визуализации данных (например, вечере D3.js).
Работа с цветом в вебе
Работа с Flexbox
- Беглый обзор возможностей Flexbox и шесть наиболее востребованных паттернов его применения.
- Наглядная и понятная шпаргалка по Flexbox.
- Chris Wright делает наглядную памятку по основным ситуациям, в которых использование flexbox дает преимущества относительно привычных способов построения сетки. Это разделение страницы на несколько частей с одинаковой высотой и карточки, которые выглядят аккуратно вместе.
Новые скрипты
- Генератор круговых меню.
- Использование CSS-анимаций для создания довольно реалистичных часов (посмотрите на стрелку :-)
- Полуавтоматическое создание пиксельной графики (плагин к Photoshop).
- Эффектное переключение фотографий в галерее.
- Свежая пачка экспериментов от Tympanus.
- Решение на CSS и JavaScript для разбивки контента на несколько колонок, зависящих от контента.
- Прекрасная библиотека для реализации эффекта складывания.
- Скрипт Flickity для реализации адаптивных и тач-ориентированных каруселей.
- Динамичное представление данных на карте с помощью amCharts.
- Еще одна серия скриптов с анимацией полей ввода на CSS.
- Еще немного загрузчиков на SVG.
- Как ведет себя стандартное поле ввода цифровых данных в разных браузерах в большом вебе и на мобильных.
- Скрипт, позволяющий с помощью кнопки на сайте быстро переключать его мобильную и большую версии.
Xcode для дизайнеров
Метрики и ROI
One Magic Formula to Calculate User Experience?
Wouter de Bres пытается вывести универсальную формулу UX. Он использует параметры времени загрузки (технологической и когнитивной), ценность и качество взаимодействия. Есть много спорных моментов и нестыковок, но сама по себе идея интересная.
Дизайн государственных сайтов
- Еще один пример гос.аналитики от правительства США. Нет привязки к сценариям, как на Gov.uk, но в целом полезные цифры.
Управление интерфейсными проектами, процессами и командами
No Dickheads! A Guide To Building Happy, Healthy, And Creative Teams.
Преприятнейшая духоподъемная статья о командообразовании от Rhys Newman. Он достаточно подробно разбирает ценности, которые должны лежать в основе сильной и слаженной команды, способной создавать крутые продукты. Один из лучших материалов на тему.
Understanding and Influencing Business
Liam Friedland пытается переложить цепочку создания добавленной стоимости Майкла Портера на дизайн-проекты.
What does Pair Design look like?
Парное программирование — достаточно известный метод. Chris Noessel и Suzy Thompson из Cooper рассказывают о парном дизайне.
False Dichotomies
Lukas Mathis о том, как избегать ложной дихотомии при обсуждении дизайн-решений. Часто в процессе спора команда разделяется вокруг пары вариантов и накаляет обстановку спором, вместо того чтобы копнуть дальше и найти другие подходы.
Продуктовый менеджмент и аналитика
Overthinking vs. Underthinking — Finding the Sweet Spot
Хорошая колонка Kingshuk Das о перекосах в чистом дизайн-мышлении и классическом стратегическом бизнес-планировании. Первый генерирует уйму мотивирующих, но не привязанных к жизни и бизнесу идей, второй — бесконечный набор аналитических материалов, в которых сложно сделать осознанный выбор. Он предлагает таблицу ситуаций, в которых применим первый и второй подходы.
Кейсы
Disney’s $1 Billion Bet on a Magical Wristband
Disney MagicBand, в дизайне которого участвовали frog — возможно, самый большой UX-проект десятилетия.
Все по графику: как мониторинг активности пользователей на главной Mail.Ru помогает жить и...
Моя коллега Ольга Курицына рассказывает об аналитике главной страницы Mail.Ru в связке с крупными событиями в стране. Интересно о том, как офлайновые события влияют на работу большой аудитории с веб-сервисами.
Considerations When Conducting User Research In Other Countries — A Brazilian Case Study
Claire Carlson делится опытом проведения пользовательского исследования в Бразилии. Что нужно учитывать на этом рынке в частности и в целом при проведении международных исследований с выездом в страну.
Кейсы редизайна
- Толковый мини-кейс работы над аналитическим кусочков в Intercom. Пользователи просили аналитику, т.е. простой набор не очень полезных графиков в их понимании, но дизайнеры хотели понять, для чего им нужна эта информация, чтобы предложить более подходящее решение.
- Рассказ о редизайне The Seattle Times от Mike Monteiro. Он говорит в том числе о важности работы с отделом продаж.
Тренды
Readable Wearables
Открывается новая эпоха для веба — адаптивность учитывает умные часы. Matt Griffin рассказывает о том, как они адаптировали сайт студии Bearded для совсем маленьких экранов.
Google HATES Your Non Mobile Site
Craig Tomlin о новых правилах поисковой выдачи Google, которая теперь учитывает не просто наличие мобильной версии сайта, но и ее качество. По словам коллег, компания обращает внимание даже на соответствие возможностей большой и мобильной версии. В статье простая методичка по поиску таких проблем. В продолжение темы:
Фаблеты
Автомобильные интерфейсы
- Дизайн-студия USTWO представила занимательный концепт, описывающий переосмысленный подход к дизайну приборных панелей автомобилей.
- Вставил пять копеек по поводу концепта приборной панели от ustwo. Надеюсь, будет больше поводов написать о теме, которой интересуюсь уже лет шесть :)
- Еще один концепт автомобильного UI от неавтомобильной компании. На этот раз дизайн для большого скрина Tesla.
Design In Tech Report 2015
Доклад John Maeda о значительном увеличении роли дизайна в современных технологических компаниях за последние несколько лет. Дизайнеры основывают успешные компании, крупные компании покупают дизайн-студии, дизайнеры становятся партнерами в компаниях венчурного капитала.
Виртуальная и дополненная реальность
Для общего и профессионального развития
UX Reactions
Коллекция гифок на злободневные аспекты дизайнерской работы. Хороший способ разнообразить проектную переписку.
The Web’s Grain by Frank Chimero
Статья на основе презентации Frank Chimero о профессиональной философии, в которой он пытается пересобрать текущее понимание роли и задач дизайнера в современном вебе. Интересный подход к адаптивному дизайну и в целом среде, для которой создаются продукты.
Helvetica / Objectified / Urbanized: The Complete Interviews
Вышла книга «Helvetica/Objectified/Urbanized: The Complete Interviews», собравшая 100 интервью из трех известных фильмов по дизайну. Fast Co Design публикует часть беседы с Dieter Rams оттуда.
Анонсы тренингов и семинаров
- Bang! Bang! Studio запускает онлайн-школу для иллюстраторов.
- Яндекс запустил школу дизайна. Набирают 30 человек для бесплатных занятий по вечерам, посвященных работе дизайнера в крупной продуктовой компании. Небольшой анонс.
- На Цукерберг Позвонит вышло развернутое интервью с представителями Британки, школы Артема Горбунова и школы дизайна Яндекса. Сравниваются подходы, программы, условия.
Новые онлайн-курсы
- Обучалка от Gibbon University.
- Обучение дизайну, разработке и маркетингу в формате 5-секундных гифок.
Designing for Medical
Ted Goas пишет об особенностях работы дизайнера в компании, делающей медицинские сервисы. Из-за жестких законов по охране личных данных в отрасли повышенная секретность, а оборудование у пользователей зачастую доисторическое. Но сами задачи и возможность помочь реальным людям дико интересны.
Critical Sharks
Очень толковый дискурс на тему того, можно ли критиковать работы крупных компаний. Конечно, им приходится учитывать тысячи нюансов и действовать в жестких рамках ограничений времени и ресурсов, плюс все это в агрессивной конкурентной среде. Но без диалога в индустрии ей будет сложнее развиваться. Сам повод (выход iOS7) уже протух, но материал свежий и тема все равно актуальна. Третья часть по ссылке самая толковая. Часть 1 и 2.
Перевод книги MailChimp «The UX Reader» от ФРИИ
- Часть 3: Как мы проводим исследования.
- Часть 4: Дизайн.
- Часть 5: Паттерны и SVG-анимация.
- Часть 6: Разработка.
- Часть 7: Креативность и дорожные карты.
Web UI Design for the Human Eye — Colors, Space, Contrast
Еще одна книга от UXPin в этом году, на этот раз про цвета, отступы и необходимый уровень контраста в интерфейсах.
Выдержки из книги Golden Krishna «The Best Interface is No Interface»
Эргономист № 40
Вышел в свет очередной, 40-й выпуск бюллетеня «Эргономист». В нем вы найдете материалы, посвященные проблемам профессиональной оценки и отбора персонала, информацию о новых конференциях и публикациях, а также несколько забавных эргономических «диверсий»
The Value of Apprenticeships in Cooking and Product Design
Melissa Mandelbaum сравнивает опыт стажерства в дизайне с тем, как учатся начинающие повара и рассказывает о своем приходе в профессию.
Люди и компании в отрасли
The Demise of LayerVault and the Market for Creative Tools
Еще одна внезапная новость в этом году — версионная система для дизайнеров LayerVault закрывается. Последний год-полтора новые инструменты для дизайнеров появлялись почти каждую неделю, а тут вдруг уход с рынка одного из старейших и известнейших среди них. Khoi Vinh размышляет, почему и коснется ли это остальных. Возможно, это связано с покупкой в чем-то схожего сервиса Pixelapse Дропбоксом — появился монструозный конкурент, который сильно подрезал перспективы развития.
How they got there — A book by Khoi Vinh
Khoi Vinh выпустил книгу «How They Got There» четырнадцати подробных интервью с известными дизайнерами. Они рассказывают о своей карьере в деталях, со всеми ее странными поворотами. В качестве пробника опубликовано первое из них, с UX-исследователем Erika Hall. Оказалось, что она какое-то время жила в России и немного знает язык. В продолжение темы:
- Tobias van Schneider о том, как игра в World of Warcraft помогла его карьере.
- Как начинал свою карьеру Влад Головач.
Новые сессии AMA
Материалы конференций
Conference Review: UX Strategies Summit 2014, part 1
Отчет Pabini Gabriel-Petit о конференции UX Strategies Summit 2014, проходившей 10-12 июня в Сан-Франциско, США. Достаточно подробный конспект нескольких ключевых выступлений, хотя Kelly Goto свою презентацию повторяет уже не первый год.
Видео с Interaction15
Видео с конференции Interaction15, прошедившей 9-11 февраля в Сан-Франциско, США.
Свежие ссылки можно также отслеживать в одноименной Facebook-группе. Спасибо всем, кто также публикует ссылки в ней, особенно Геннадию Драгуну, Павлу Скрипкину, Дмитрию Подлужному, Антону Артемову, Денису Ефремову и Евгению Соколову. Все больше материалов в обзорах появляется благодаря им.
Комментарии (5)
damat
06.04.2015 14:13+1Прочитал, что вышел Balsamiq 3.0. Обновился, лучше бы я этого не делал — они убили альтернативный скин, в котором были нормальные тонкие линии. Работать стало невозможно =(
damat
06.04.2015 16:13+1Отбой. Оказывается, настройки вида wireframe вынесли из общих в проектные. Идейно даже понятно, и реально нужно: если кто-то открывает твой проект с неправильными настройками, все выглядит не так, как у тебя.
Краткая инструкция на всякий случай: bit.ly/1GYyHfu
PS ссылка нормальная, но некликабельна из-за кармы
kisel
Поправьте пожалуйста ссылку, не находится ничего такого.
kisel
UPD Видимо правильная ссылка kartashov/базовые-концепции-quartz-composer-264b25f88cbb">вот. Нашел в фейсбуке.
Хм. Тоже глючит. Парсер чудит?
jvetrau Автор
Да с ним вообще беда, не знаю как отключить :( Не первый раз проблема, если пользователь есть на Хабре и писал что-то на Медиум.