Уже три года я публикую регулярные обзоры свежих статей по теме интерфейсов, новых инструментов и коллекций паттернов, интересных кейсов и исторических рассказов. Из лент нескольких сотен тематических подписок отбирается примерно 5% стоящих публикаций, которыми интересно поделиться. Предыдущие материалы: апрель 2010-июнь 2013 ^[1].

Паттерны и Best Practices

Gestures, Transitions, Animations @ Pinterest ^[2]
Собрал в Pinterest свою коллекцию интерфейсных анимаций, переходов и жестов для их вызова. Две сотни примеров, которые особенно актуальны в свете перехода iOS от декора к motion-дизайну. Другие подборки:

• Приложения для iOS7 ^[3].
• Добротные мобильные приложения в metro- и флэт-дизайне ^[4].
• Еще пара десятков подборок по проектированию и дизайну интерфейсов ^[5].

Hollow Icons ^[6]
Aubrey Johnson критикует интерфейсные пиктограммы iOS7 за то, что они сложнее для восприятия. Множество исследований показывают, что тонкий контур считывается пользователем тяжелее, чем сплошная форма.

Designing the Perfect Hyperlink — It's Not as Simple as You Think ^[7]
Отличная статья John Macpherson на тему того, как оформлять ссылки. Важно, чтобы они были достаточно контрастными для заметности, но не мешали чтению. И еще пара дискуссий от отечественных специалистов — https://medium.com/ui-in-russian/ecaccd209a54 ^[8] и https://medium.com/interface-1/e6356aa5f023 ^[9].

A Guide To Designing Touch Keyboards (With Cheat Sheet) ^[10]
Baymard Institute собрали еще одну статью по результатам своего большого исследования мобильных интернет-магазинов, посвященную методам ввода. Она описывает идеальное поведение клавиатуры телефона в зависимости от вводимых данных.

Making Infield Form Labels Suck Less ^[11]
Jackson Fox из компании Viget предлагает удачное решение для названий полей форм, которые стоят внутри поля. Он предлагает показывать их в небольшом всплывающем слое над полем в момент ввода данных. Пример кода для реализации ^[12].

The Four Mobile Traps (UserTesting, PDF) ^[13]
Памятка по проектированию и дизайну мобильных приложений от UserTesting, сформированная на основе пользовательских исследований и выявленных в них ключевых проблем при работе с интерфейсами для смартфонов. Краткий обзор ^[14] и перевод на русский ^[15].

Users Continue to Double-Click Online ^[16]
Jamie Appleseed из Baymard Institute пишет о том, что в их исследованиях около 10% пользователей по привычке используют двойной клик в вебе. Это значит, что в формах нужно предусмотреть обработчики нажатий на этот случай.

How to Recoup 30% of «Card Declined» Abandonments ^[17]
Christian Holst предлагает интересный способ повышения конверсии в интернет-магазинах, который предполагает обработку ошибок оплаты, происходящих по вине платежной системы. В случае невозможности платежа они рекомендуют пользователю другие способы оплаты и на практике это повышало продажи примерно на 1%.

Planning for Responsive Layouts ^[18]
Полезная памятка от Cooper Consulting по проектированию адаптивных сайтов и приложений. Ее сопровождает обзорная презентация на тему ^[19].

The «Just Copy Amazon» Fallacy ^[20]
Baymard Institute пишет о том, почему интернет-магазинам нет смысла копировать интерфейс Amazon. Это актуально и для других типов продуктов — компании находятся в разных условиях, ставят разные бизнес-задачи, имеют разные источники трафика и т.п.

Here's what you need to know about the future of gesture-based UI design ^[21]
Неплохой обзор основных принципов создания жестов в мобильных приложениях от Rani Molla.

Beyond the Beep ^[22]
Уникальный блог Jordan Kolasinski, посвящённый теме использования звуков в интерфейсах.

How to Make Your Form Error Messages More Reassuring ^[23]
Небольшая памятка об ошибках в интерфейсах. Почему не стоит использовать негативные слова и как смягчить сообщение о проблемах ввода данных для пользователя.

5 Lessons Learned from 100,000 Usability Studies ^[24]
Компания UserTesting приводит пять особо распространенных интерфейсных проблем на основании нескольких сотен тысяч юзабилити-тестов. Это многоуровнемые каскадные меню, категоризация, поиск по сайту, обнаруживаемость ссылок и скучность.

The Ultimate Guide to Tablet Web Design (Ebook) ^[25]
Бесплатная электронная книга «30 советов по веб-дизайну для планшетных устройств» от компании Mobify, в основном для базового и среднего уровня.

Понимание пользователя

Introducing the Mental Notes Behavior Cube! ^[26]
Stephen Anderson запускает новый инструмент для помощи в проектировании интерфейсов, учитывающих особенности поведения и психологии пользователей. Это игральный кубик в продолжение его популярных игральных карт, который помогает посмотреть на взаимодействие с пяти сторон — эмоции, память и восприятие, мотивация, вдохновение и разочарование, принятие решений.

Emotional Design with A.C.T. ^[27]
Затянувшееся продолжение отличнейшей статьи Trevor van Gorp об эмоциональной составляющей в интерфейсах. Он описывает очень интересную концепцию взаимоотношений продукта с пользователем, завязанную на посыл «useful, usable, desirable». Первая часть ^[28]. У автора вышла книга "Design for Emotion ^[29]" на эту тему.

Your app makes me fat ^[30]
Kathy Sierra предупреждает любителей вставлять неоправданно сложные и непривычные интерфейсные решения в целях самореализации — они заставляют пользователя тратить ценные когнитивные ресурсы. В статье много отсылок на исследования, которые подтверждают ее тезис.

On Perception and Reality — Q & A with Stephen Anderson ^[31]
Интервью Stephen Anderson, в котором он затрагивает роль восприятия и ожиданий в формировании пользовательских впечатлений. Один и тот же продукт может оставить разное впечатление в завсимости от того, как он был преподнесён. Важен не только контент, но и его подача.

Mapping Experiences ^[32]
Отличнейшая памятка по experience mapping от Adaptive Path, описывающая процесс и его основные нюансы. Прямая ссылка на PDF ^[33].

Kim Goodwin – Using Scenarios to Design Intuitive Experiences ^[34]
Интервью с Kim Goodwin о том, как совмещать два близких подхода — персонажи и customer journey maps. Она будет выступать с рассказом на эту тему на конференции User Interface 18.

Dopamine and games — Liking, learning, or wanting to play? ^[35]
Статья Bill Lewis-Evans о современном понимании нейрофизиологами роли допамина. А также том, как использовать эти знания для мотивации пользователей и игроков с помощью наград.

7 Signs You May Have a Problem Persona ^[36]
Craig Tomlin перечисляет проблемы при создании персонажей, которые сильно снижают полезность этого инструмента. Помимо актуальности и репрезентативности, они должны помогать в определении требуемой функциональности, а цели конкретных персонажей должны быть оцениваемы и иметь метрики своего достижения.

Left and Right Brain User Personas ^[37]
Статья Kevin Simler о том, как учитывать при проектировании персонажей с левополушарным и правополушарным мышлением ^[38].

Interesting Facts Make Web Pages Compelling ^[39]
Jakob Nielsen описывает выводы исследований NN/g среди журналистов. Краткая сводка фактов на странице сайта облегчает работу с информацией и повышает доверие к ней.

Проектирование структуры и экранов интерфейса

Designer’s Toolkit — Road Testing Prototype Tools ^[40]
Небольшой обзор инструментов для прототипирования от Emily Schwartzman из Cooper Consulting.

Интеграция дизайна мобильных приложений ^[41]
Мой коллега Евгений Беляев опубликовал две статьи, посвященные процессу интеграции дизайна мобильных приложений и его особенностям. В первой части он описывает работу с Android, во второй — iOS и Windows Phone ^[42].

Composite — A new, delightful way of designing apps with Photoshop ^[43]
Приложение Composite позволяет легко создавать интерактивные прототипы мобильных приложений на основе PSD-макетов. Он подключается к Photoshop на компьютере и в живом режиме показывает все изменения.

Style Guide Boilerplate ^[44]
Фреймворк Style Guide Boilerplate помогает создавать свои мини-Bootstrap. Он позволяет описать общую стилистику проекта и базовые паттерны, а после быстро собирать на этой основе прототипы.

Interaction of Color by Josef Albers ^[45]
Культовый учебник по теории цвета стал интерактивным и доступен в виде приложения для iPad. Правда, только для аккаунтов американского AppStore.

Basiliq от Cloud Castle ^[46]
Симпатичный скетчевый шаблон для проектирования интерфейсов в Photoshop от компании Cloud Castle. Объекты векторные.

Windows Phone AppStudio ^[47]
Запущен официальный онлайн-конструктор типовых приложений для Windows Phone. Он поможет набросать простой концепт интерфейса. Небольшое описание ^[48].

Specctr — Blueprints for the Web ^[49]
Интересный инструмент для передачи гайдлайнов по дизайн-макетам разработчикам. Правда, работает только с Adobe Illustrator и Fireworks.

ANTETYPE — Visual Responsive Application Design Prototyping Software ^[50]
Новый инструмент визуального прототипирования под MacOS от немецкой компании Ergosign. Рекомендуют как замену уходящему Fireworks ^[51].

Mockup.io — The Great Tool to Manage and Present iOS App Mockups ^[52]
Сервис Mockup.io облегчает работу с макетами мобильных и планшетных приложений для iOS. Он позволяет легко посмотреть их на устройстве и в визуальной обвязке в вебе. Плюс помогает в общении с клиентами и командой разработки.

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

Apptimize — A/B Testing for Android and iOS ^[53]
Сервис AppTimize позволяет проводить A/B-тестирование в приложениях для Android и iOS. Он генерирует нативный код для показа различных версий экранов. Другой продукт Watchsend ^[54] решает похожие задачи — записывает видео работы и помогает анализировать их.

Seeing the Elephant — Defragmenting User Research ^[55]
Lois Rosenfeld о том, почему исследование пользователей может быть неэффективным в крупных компаниях, несмотря на вовлечение десятков опытных профессионалов. А также о построении эффективной и сбалансированной системы исследований и важности выстраивания процессов на корпоративном уровне.

Remote Site Visits — How to Do Field Research Without Ever Leaving the Office ^[56]
Alison Kather из интерфейсной команды Autodesk рассказывает, как они проводят «удаленные полевые исследования». Хотя звучит это как оксюморон, в ограниченном виде у них такой подход работает.

Continuous Customer Feedback Programs ^[57]
Очень полезная для продуктовых дизайнеров и менеджеров серия статей Marnie Andrews и April L. de Vries о том, как наладить процесс регулярного сбора пользовательского фидбека. Часть 2 ^[58] и 3 ^[59].

How to Summarize & Display Survey Data ^[60]
Отличная памятка от Jeff Sauro о том, как просуммировать и представить результаты пользовательских исследований. Он показывает подачу для разных выборок данных и помогает сделать выводы на их основе.

Creating Better UX Research Videos ^[61]
Jim Ross дает советы о поводу того, как готовить видео-ролики с нарезкой интересных моментов из пользовательских исследований. Полезная памятка с обзором основных нюансов и подводных камней.

How to Benchmark Website Usability ^[62]
Краткая памятка по процессу, метрикам и анализу результатов сравнительного юзабилити-тестирования сайтов от Jeff Sauro.

Rating the Severity of Usability Problems ^[63]
Отсутствие единых критериев оценки серьёзности интерфейсных проблем всегда было достаточно чувствительным местом в нашей профессии. Большинство изобретало собственную шкалу оценки. Проблема, оцененная одним специалистом как «серьёзная», вполне могла оказаться «небольшим дефектом» в оценке другого. Jeff Sauro делает обзор распространённых методов и предлагает свой собственный подход, объединяющий сильные стороны других методов.

Measuring the Effectiveness of a Product Name ^[64]
Jeff Sauro перечисляет методы исследования и тестирования для названий продуктов и компаний. Это одно из немногих мест, где пригодятся фокус-группы.

5 Things to Remember When Conducting UX Research with Children ^[65]
Catalina Naranjo-Bock дает пять советов по проведению пользовательских исследований с детьми. Они затрагивают особенности рекрутинга, выбор методов и места проведения исследования, участие родителей.

Method 23 of 100: RITE Method ^[66]
Chauncey Wilson описывает метод быстрого итеративного тестирования и прототипирования, который позволяет в оперативном режиме дорабатывать интерфейс для решения очевидных проблем и получать на следующей сессии более свежие результаты. А его коллега Veronica Meuris рассказывает об используемой в Google версии этого метода ^[67].

Best Practices for Using Statistics on Small Sample Sizes ^[68]
Jeff Sauro дает краткий обзор того, какие статистически достоверные выводы сделать на основе малой выборки пользователей.

Sins of a UX Researcher (презентация Kyle Soucy) ^[69]
Презентация Kyle Soucy о 13 грехах UX-исследований. Наиболее типичные, грубые и банальные ошибки при проведении юзабилити-тестирования и интервьюирования пользователей, которые могут испортить результаты и привести к неправильным выводам.

Управление интерфейсными проектами и процессами

Connected UX ^[70]
Aarron Walter рассказывает о прорывном подходе к сбору и анализу любой входящей информации об интерфейсе, которую они собирают в MailChimp. Это уникальный инструмент для получения продуктовых инсайтов на основе знаний о пользователях и влияния на бизнес. И ключевой элемент UX-стратегии. Я был на его презентации про эту базу знаний на португальской UXLx, порвало шаблоны. Заметки о его выступлении ^[71] на эту тему на конференции An Event Apart.

Why Write Requirements ^[72]
Scott Sehlhorst пишет о том, в каких случаях стоит описывать требования к создаваемому продукту. Они помогают лучше понять рынок, спланировать запуск, управлять ожиданиями, повысить эффективность разработки, а также не забыть с какой целью вообще создается продукт.

Applying Lean UX ^[73]
Небольшой отчет команды Cooper Consulting о том, как они участвовали в lean UX-проекте в рамках сотрудничества с одним из стартапов. Полезный обзор основных моментов методологии.

Building in-house innovation teams — Small, collocated, dedicated, self-sufficient ^[74]
Серия статей Jeff Gothelf, в которых он описывает идеальную современную продуктовую команду. В первой части рассказывается об общих требованиях. Во второй он пишет о ее внутренней организации и процессах ^[75].

How Carl Sagan's Baloney Detection Kit Can Help Save Your Project (and Maybe Your Company) ^[76]
Philip Hodgson из UserFocus говорит о том, как проектировщику и менеджеру сократить количество ошибочных решений. Он предлагает опираться на научный метод и lean-мышление — тщательно проверять все факты и входящую информацию, ставить и проверять гипотезы, измерять ключевые показатели и экспериментировать, не бояться споров и дискуссий.

Why Agile Is So Hard ^[77]
Проектирование и дизайн в agile-процессе уже давно освоили большинство специалистов. Но если кто-то еще мыслит по-старому, у Traci Lepore есть отличный разбор и опровержение заблуждений об этой связке.

Методологии, процедуры, стандарты

UX Concepts and Practices That We Wish Would Just Go Away! ^[78]
Колонка UX Matters о том, какие практики в нашей специальности морально устарели или используются неправильно. Попытки построить идеальный процесс, вложение усилий в визуальную шлифовку еще не проверенных решений, имитация других компаний, фокус-группы, терминологические споры, lorem ipsum, маниакальное стремление уменьшить количество кликов, разделение работы проектировщика на уйму ролей, расчет ROI.

Interaction design — What we know and what we need to know ^[79]
Взгляд профессора HCI Steve Whittaker из Калифорнийского Университета на нынешнее состояние дисциплины проектирования взаимодействия, а также необходимое направление ее развития как процесса.

Кейсы

Tale Of A Top-10 App, part 1 — Idea And Design ^[80]
Неплохой кейс создания мобильного приложения, описывающий по шагам все этапы от рождения идеи до перехода к разработке.

Email Marketing For Mobile App Creators ^[81]
Ross Hodgekiss дает рекомендации по эффективному анонсированию запуска мобильных приложений. Он говорит в том числе о том, какими должны быть промо-сайты и письма рассылки.

История

Douglas Engelbart: The Hut Where the Internet Began ^[82]
2 июля 2013 года не стало Дугласа Энгельбарта, самого важного человека в истории интерфейсов и практического использования компьютеров для массовых задач, в понятном простому пользователю виде :( В своей легендарной Mother of All Demos ^[83] он показал концепцию GUI и растрового вывода изображения, интернета и гипертекста, инструментов коллективной работы, управления мышью. Жаль, что многие запомнили его только как изобретателя мыши ^[84]. Стив Возняк говорил, что мы обязаны ему всем что сейчас есть в компьютерах. R.I.P.

Baer’s Odyssey — Meet the serial inventor who built the world’s first game console ^[85]
История того, как Ralph H. Baer стал создателем первой массовой игровой приставки Magnavox Odyssey. Она вышла на рынок в 1972 году и заложила основу игровой индустрии домашних консолей.

Authentic Design ^[86]
Дмитрий Фадеев описал историю возникновения аутентичного дизайна в архитектуре, промышленных товарах и интерфейсах. Он рассказывает, почему в каждой из этих отраслей возникало увлечение орнаменталистикой и избыточными декорациями и что приводило к отказу от них в пользу фокуса на основных функциях продукта.

Тренды

User Experience Is More Than Design — It’s Strategy ^[87]
Christopher Grant Ward об общих чертах и отличиях между UX и продукт-менеджментом. UX-специалистам стоит попробовать переходить на стратегический уровень, а не оставаться ведомыми исполнителями.

Метрика #16, 17, 18 — Обсуждаем iOS7 ^[88]
Три выпуска подкаста Метрика от UI Design Group, в котором мы с Платоном Днепровским обсуждаем iOS7 спустя ровно месяц с момента ее анонса. Прошлись, наверное, по всем больным точкам и возможным сценариям развития. Продолжение ^[89] и окончание ^[90].

Kit FUI ^[91]
Компания Noteloop запустила базу знаний по интерфейсам будущего и фантазиям на их тему. В ней содержится общая информация о фильмах, дизайнерах, компаниях-создателях, рекламе, сериалах и концептах. Интервью с Nathan Schedroff и Chris Noessel ^[92] об их книге Make It So на эту тему.

Designing for Transparency and the Myth of the Modern Interface ^[93]
Движение «No UI» предлагает отказаться от видимого пользовательского интерфейса. Но Thomas Wendt разбирает эти понятия и говорит о том, что «невидимый» интерфейс не обязательно должен в буквальном смысле отсутствовать.

Tablet Usability — Findings from User Research ^[94]
Jacob Nielsen описывает две основные угрозы для юзабилити планшетов. Это плоский дизайн и неудачно сжатые десктопные либо растянутые телефонные интерфейсы.

Designing for Google Glass — It's not what it appears ^[95]
Небольшая памятка по проектированию и дизайну интерфейсов для Google Glass. Marvin Ammori, автор статьи, работает в компании Silica Labs, которая специализируется на приложениях для таких очков.

Cameron Moll — Cross-Screen Experiences @ Breaking Development ^[96]
Заметки с выступления Cameron Moll о сложных взаимодействиях пользователя с несколькими устройствами. Много интересных тезисов о том, как они строятся.

Like Magic — Designers Weave the Digital World Into Everyday Lives ^[97]
Неплохой обзор ближайшего будущего профессии от Wired с проектированием для связки устройств, причем зачастую без экрана.

Content re-framing — A digital disruption survival kit ^[98]
Bas Evers и Peter Bogaards из Infomaat приводят десять правил современной контент-стратегии.

Профессиональное развитие

Industry Contributors’ Roles in Professional Practice ^[99]
Nathaniel Davis описывает типы участников проф.сообщества и их вклад в развитие дисциплины. Каждый может поискать себя и подумать, к чему стремиться.

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

Conferences Roundup — Upcoming Web Design Events (Sept. 2013 – Feb. 2014) ^[100]
Smashing Magazine перечисляет основные международные UX-конференции сезона осень-зима 2013-2014. Минская UX People ^[101] также попала в список.

Breaking Development 2013 ^[102]
Видео с конференции Breaking Development 2013, проходившей 22-24 июля в Сан Диего. Ее тема в этом году — выход за пределы десктопа. Среди презентаций — выступление Luke Wroblewski о едином дизайне для всего спектра устройств от умных часов до телевизоров, адаптивный ввод информации, мобильный контент.

Свежие ссылки можно также отслеживать в одноименной Facebook-группе ^[103].

Автор: jvetrau

Источник ^[104]