Дайджест продуктового дизайна, январь 2015
Уже почти пять лет я публикую регулярные обзоры свежих статей по теме интерфейсов, новых инструментов и коллекций паттернов, интересных кейсов и исторических рассказов. Из лент нескольких сотен тематических подписок отбирается примерно 5% стоящих публикаций, которыми интересно поделиться. Предыдущие материалы: апрель 2010-декабрь 2014.Паттерны и Best Practices Новое о принципах дизайнаСовременные подходы к рекламе
User Flow PatternsВидео-коллекция паттернов, посвященная интерфейсной анимации и мелким деталям взаимодействия.
Formstack Form Conversion ReportИсследование по конверсии в формах за 2014 от Formstack. Интересный отчет для тех, кто хочет соизмерить свои результаты со «средними по больнице». Прямая ссылка на PDF.
Showing Passwords on Log-In ScreensLuke Wroblewski о том, почему и как нужно показывать пользователям пароли в мобильных приложениях.
Using decision tables to support contextual targeting in your UIHarry Brignul предлагает методику определения мест в интерфейсе и подходящего момента для того чтобы спросить у пользователя информацию или предложить доп.услугу. В целом похоже на то, о чем говорит Dan Saffer в «Microinteractions». В продолжение темы:
The Art of alt — Writing Great Descriptive Text For ImagesСоветы по написанию альтернативных текстов к изображениям от Dudley Storey.
Timing Guidelines for Exposing Hidden ContentAurora Bedford рекомендует временные задержки при отображении контента, показываемому по наведению курсора мыши (мага-меню, каскадные меню, дополнительный контент и т.п.).
Показать визуальный фидбек 0,1 с после наведения мыши в интерактивную область. Подождать 0,3–0,5 с (чтобы избежать случайного наведения). Если курсов все-ещё находится в области взаимодействия, показать скрытый контент в течение 0,1 с. Показывать контент, пока курсор мыши не покинет интерактивную область дольше, чем на 0,5 с (чтобы избежать случайного скрытия контента). Are Mobile Websites Truly Less Usable Than Desktop Websites? Jeff Sauro исследует юзабилити мобильных и традиционных веб-сайтов и обнаружил интересное явление — мобильные версии иногда выигрывают по метрикам простоты использования.
Новое о бургерном меню
Новое о письмах рассылки
The Magnifying-Glass Icon in Search Design: Pros and ConsИсследование Kathie Sherwin о дизайне полей поиска и об использовании иконки с Лупой. Выводы: следует визуально выдеалять поле поиска; иконка с лупой достаточно различима пользователями и использовать на кнопке надпись «Поиск» уже не обязательно; сама иконка должна быть как можно более простой, крупной и контрастной. В продолжение темы:
Ode to a Microinteraction: Amazon Kindle«s «Time to Read«Dan Saffer восторгается микро-взаимодействием «Time to Read» в Amazon Kindle.
Top 3 IA Questions about Navigation MenusKathryn Whitenton кратко и емко отвечает на три частых вопроса о навигации. Сколько категорий оптимально, нужно ли сортировать их по алфавиту, отказываться ли от эффектов наведения курсора с учетом распространения тач-ноутбуков и планшетов.
Понимание пользователя Общая психология (курс лекций МГУ)Полный курс лекций по современной общей психологии. Очень качественный материал. Позволяет начать изучать психологию человекаDesigning for Different Online Personality TypesLiraz Margalit приводит свою классификацию поведенческих типов пользователей сайтов электронной коммерции. Она выделяет 5 моделей поведения: «хочу всё и сразу»; ориентированные на определенный бренд; рациональные посетители; «оптимизаторы»; satisfiers.
Phones Aren«t Flat — Designing for Real People in Diverse ContextsЕще одна статья Steven Hoober об особенностях использования мобильных — как особенности использования в различных ситуациях и людьми с ограниченными возможностями ухудшают привычные предустановки вроде минимальной зоны нажатия. Он также отмечает проблемы с жестами из-за края экрана — учитывая популярность чехлов, зачастую их невозможно выполнить.
At 90, She«s Designing Tech For Aging BoomersВ IDEO работает 90-летняя дизайнер Barbara Beskind — она помогает лучше понимать пожилую аудиторию.
Inside the Largest Virtual Psychology Lab in the WorldRiot Games использует big data и эксперименты с интерфейсом для изменения поведения миллионов игроков League of Legends. Сейчас это, наверное, одна из самых больших исследовательских площадок. Размах экспериментов не сравним с традиционными университетскими психологическими исследованиями. Просто жемчужина.
Use-Dependent Cortical Processing from Fingertips in Touchscreen Phone UsersИсследование пользователей смартфонов с сенсорным экраном от A.D. Gindrat, M.Chytiris, M.Balerna, E.M. Rouiller и Arko Ghosh, которое подтверждает, что их использование меняет наш мозг. Ситуация схожа со спортсменами и музыкантами. Ждем исследование, подтверждающее рост пальцев от больших экранов.
Evidence Based Design JournalТолковый электронный журнал на тему исследования поведения пользователей в разных контекстах. Он понимает дизайн в достаточно широком смысле, но многое применимо и к нашей работе.
Информационная архитектура, концептуальное проектирование, контент-стратегия Running a CX Journey Mapping Design SessionМетодичка по созданию customer journey map от Mike Alber, использовавшаяся для его мастер-класса в Oracle. В презентации очень и очень круто расписаны метрики эффективности дизайн-решения, которые можно отслеживать и улучшать.Designing Digital Strategies, part 2 — Connected User ExperiencesSofia Hussain пишет серию статей о цифровой стратегии и методике ecosystem map (карта экосистемы). Напоминает CJM, но без четко определенной последовательности шагов и без оси времени.
Проектирование и дизайн экранов интерфейса Skala BjangoКомпания Bjango в 2014 году занималась развитием своего современного инструмента для дизайнеров Skala (так называлась их утилита для показа макета из Photosop в телефоне). Они регулярно выкладывают отчеты об изменениях и вот один из свежих с кусочками интерфейса.UX App — Prototyping and Interaction Design for User Experience ExpertsНовый инструмент для интерактивного прототипирования интерфейсов. Совместная работа с прототипом, неплохой визуальный редактор, библиотека компонентов, мультиэкранные прототипы, анимации — стандартный набор. Ставка сделана на возможность создания сложных интерфейсных решений, с помощью визуального «программирования» — конструктора этаких процедур, условий и переходов.
GravitИ еще один современный инструмент для дизайнеров. Изначально он развивался как набор десктопных приложений, но в связи с дороговизной такого подхода переходит в браузер.
ParaИнструмент для параметрического «прототипирования» иллюстраций. Вы создаете векторные формы с помощью привычных инструментов, а потом можете добавить им интерактивное распределение и задать другие параметры. Есть вступительное видео, чтобы было понятнее.https://vimeo.com/108286111
MarklyMarkly подключается к Photoshop и Sketch для Windows и Mac и облегчает подготовку спецификаций к макетам. Обещает автоматическое обновление документов при изменении макетов.
Cinematic Continuity on UI DesignСерия статей от Claudio Guglieri, дизайн-директора Fantasy Interactive, о применении принципов кинематографии в дизайне интерфейсов. В первой части рассказывается о принципе непрерывности.
Ultimate Guide to Prototyping144 страницы кейсов, разборов и советов от UXPin по протипированию интерфейсов. Уроки для Photoshop & Sketch на сладкое.
Новое для Material Design
Новое для iOS8
Новое для Apple Watch
Новое для Sketch
Новое для Framer
Сравнения инструментов
Пользовательские исследования и тестирование, аналитика Predictive Customer Analytics 101: The Correlation2 февраля выходит новая книга Jeff Sauro «Customer Analytics for Dummies». В его блоге выложена глава, посвященная корреляции. Книга на Amazon.The Guide to Usability TestingСвежая книга от UXPin с гайдом по юзабилити-тестированию и поддержке дизайн-решений.
17 Usability Testing Myths and MisconceptionsJim Ross развенчивает 17 мифов о юзабилити-тестировании.
Why You Should Do a Dry Run Every Time You Test RemotelyХорошая статья про пользу пилотного юзабилити-тестирования — для того, кто в этом сомневается.
Native TapСервис Native Tap для тестирования приложения на разных устройствах.
Learning from Closed Card Sorts with Different InputsKevin Sheldon протестировал и сравнил три подхода к карточной сортировке — заданные категории и необходимость вспомнить элементы интерфейса; заданные категории и элементы интерфейса и необходимость распределить их; уже распределенные элементы интерфейса по категориям и возможность внести изменения. Третий вариант дал лучшие результаты, хотя почему-то не приводится еще один популярный подход — заданные элементы интерфейса и возможность определить свои категории.
How Confident Do You Need To Be In Your Research? Jeff Sauro приводит примеры доверительных интервалов для разных ситуаций и задач.
Comprehensive review of UX tools for your websiteНеплохой список инструментов для пользовательских исследований и тестирования от UI Patterns.
Stop Accosting People in Coffee ShopsLaura Klein о «партизанских» исследованиях — что можно и что нельзя узнать с их помощью, а также почему они часто используются неправильно.
Визуальное программирование и дизайн в браузере Живые гайдлайны и компонентные системыSlalom — Towards declarative touch interactionsRalph Tomas описывает Slalom, придуманную систему для быстрого и краткого описания взаимодействия элементов друг с другом. С помощью этой системы (которая, по сути, является упрощенной системой решения задач удовлетворения ограничений) просто задавать взаимодействие одного элемента с другим или множеством, то есть легко прототипировать весьма нетривиальные интерфейсные подходы. Сам Slalom вырос из другой статьи про прототипирование анимаций и взаимодействий с помощью физических моделей.
The When, Why and How of Designing in BrowserBrooke Kao на тему дизайна в браузере. В продолжение темы:
Новое для Bootstrap и Foundation
Новое о веб-шрифтах
Compositing And Blending In CSSSara Soueidan рассказывает о возможностях современных браузеров по эффектам наложения слоев. Все больше вещей можно делать без участия Фотошопа.
Новые скрипты
Новое о CSS-анимации
Работа с SVG
Новое о Form
Icon FontsШаблоны, фреймворки и инструменты для работы со шрифтовыми иконками, а также готовые наборы.
Designing For Print With CSSОтличная методичка Rachel Andrew о том, как с помощью CSS готовить печатные версии страниц. Причем возможности настолько обширные, что можно получить на выходе хорошую книжную верстку со всеми особенностями от обложки и содержания до колонтитулов и сносок. Также предлагается скрипт-генератор PDF.
Creating Well-Behaved Sites With The Page Visibility APIDudley Storey разбирает page visibility API в браузерах, который позволяет аккуратно выключать проигрывание различных медиа на сайте, если его вкладка неактивна. Отличный способ бесить пользователя меньше, хотя старые браузеры не поддерживают его.
Управление интерфейсными проектами, процессами и командами A Quick Guide to Evaluating UX Roles for Non-UX PeopleJacob Harris предлагает очень интересную модель оценки UX-специалистов, нужных для команды проекта. По двум параметрам (сложность взаимодействия и предметной области) менеджер проекта может определить набор нужных навыков и людей.UX Leadership, Part 2: What Great Leaders Must DoВторая и очень мощная часть серии Jim Nieters и Pabini Gabriel-Petit о UX-менеджерах и лидерстве.
UX Strategy — Goals and the future stateЧетвертая часть из серии статей Austin Govella о UX-cтратегии — цели и пути их достижения. Также вышли часть 5 и 6.
Designing the Hiring ProcessMichael Owens о том, как правильно нанимать дизайнеров с кучей мнений сильных специалистов отрасли.
UX Project ChecklistНе очень системный, но достаточно интересный чеклист важных этапов работы над интерфейсом. К каждому этапу дается справочная статья.
Framing a Sense of DirectionGuido Stompff о том, как команды работают над инновационными решениями.
Designing With Your ClientsPaul Boag о ко-дизайне как способе улучшить взаимоотношения дизайн-студий и клиентов.
Hold A Kickoff Meeting Before Diving Into The DesignТолковая методичка по проведению kick-off от Chris Bank из UXPin.
Pixelapse + DropboxDropbox купил Pixelapse, облегчающий проектную работу для дизайнеров и проектировщиков. Он помогает хранить версии макетов, быстро публиковать их из исходников и обсуждать с клиентами.
Новое о дизайн-спринтах
Продуктовый менеджмент и аналитика Open StrategyКурируемый сборник лучших (по мнению авторов) инструментов для открытия своего дела. Содержимое разделено на рубрики: исследование потребителей, онлайн аналитика и аудит, тренды, планирование рекламы и т.п. Можно подписаться на регулярную почтовую рассылку.The Experience Makes the Product, Not the FeaturesLee Dale о том, как работать с возражениями при запуске MVP и не перегружать интерфейс первого релиза.
Split Metrics — Increase conversion of App Store pageСервис для A/B-тестирования описания приложения в AppStore и Google Play. Создает посадочную страницу, мимикрирующую под дизайн магазина.
Кейсы Кейсы редизайнаyakostro/ux-ae8a3b12a3b7»>Особенности работы UX-дизайнера в «железном» проектеОсобенности работы над интерфейсом в «железном» проекте на примере «Симкомата». Илья Александров поделил статью на две части: об особенностях «железа» и yakostro/ux-2-b39e19def99a»>описание конкретных решений и кейсов. Будет интересно для практикующих проектировщиков.
Новое о редакционных CMS
Redesigning Museums for GoodВ прошлом году frog design провела несколько воркшопов по редизайну UX посетителей мемориальных музеев. Презентация Roberta Tassi рассказывает о воркшопах в Кингали, Руанда и в Амстердаме.
История «Human error» — Still undefined after all these yearsSteven Shorrock о понятии «человеческая ошибка» в эргономике — его истории, эволюции и сегодняшнем понимании термина.Tablet UX Research From the Pioneer DaysJakob Nielsen вспоминает свой опыт исследования планшетных интерфейсов в 1992 году для GO PenPoint.
The ATM is Dead. Long Live the ATM! История появления банкоматов, их текущие проблемы и перспективы.
The Fascinating History of the Search IconKeith Ohlfs о том, как он предложил иконку лупы для поиска в NeXT — кажется, впервые.
The Untold Story of the Invention of the Game CartridgeИстория создания игровых картриджей, которые переформатировали рынок и, возможно, повлияли на то, как распространяются приложения.
A Critical, Creative UX Community — CLUFДлинный, но очень интересный материал Gilbert Cockton об истории трансформации дисциплины UX и ее мировоззрения относительно научности методов, роли исследований и исследователей, креативного.
Краткая история становления UX от Dirk Knemeyer
Тренды The Future of Large UX Design FirmsПрокомментировал для UXMatters тренд покупок дизайн-студий продуктовыми компаниями. Все это было еще до истории с Teehan+Lax, но в русскоязычной версии для Цукерберг Позвонит это уже отразилось. В продолжение темы: Прогнозы на 2015
Microsoft HoloLensВ рамках развернутой презентации Windows 10 Microsoft показал абсолютно крышесносный концепт HoloLens. Это интерфейс дополненной реальности, который с помощью очков позволяет отображать в реальном окружении голографические объекты и дает возможность манипулировать ими. Уже есть API для Windows, которые позволяют разрабатывать для него.
В отличие от Google Glass, многие сценарии использования которого ограничивались камерой, и Oculus Rift, который предполагает достаточно узкие условия применения, этот концепт открывает очень интересные перспективы для работы проектировщика и дизайнера. Это взаимодействие с реальной средой, привязка элементов интерфейса к объектам в ней. Противопоставлять их, наверное, не очень правильно, но это мощное направление развития профессии, да еще и поддержанное одной из ведущих платформ. Зато технологические издания уже называют Эппл новым Майкрософтом двухтысячных (и The Verge).
Доступны его видео-презентация и эксклюзив от Wired. У R&D Microsoft по прежнему один из самых сильных послужных списков. Причем ведет проект Alex Kipman — один из главных инициаторов Kinect. Не факт, что оно взлетит — у Google Glass пока все не очень, да и Майкрософт любит рассказать красивую картинку будущего и выпустить только кусочек из нее. Но следить за этим направлением нужно точно.[embedded content]
The State of Responsive Web DesignKezz Bracey описывает состояние адаптивного дизайна на начало 2015 года.
The Human Side of AutomationДональд Норман об опасностях пути постепенной автоматизации машин.
7 Controversial Usability Predictions ResultsВ 2010 году Craig Tomlin сделал 7 предсказаний насчет развития юзабилити. В чем-то он угадал, в чем-то ошибся.
Для общего и профессионального развития The Need for Design History in HCICarl DiSalvo пишет о том, что дисциплине HCI не хватает внимания к истории дизайна в целом и взаимодействию в частности.Трезво мыслящие дизайнеры
We«ve Lost the Guts to ThinkРазмышления о роли и задачах дизайнера в широком смысле. Статья скорее философская, ней много полезных отсылок на не менее интересные материалы.
UX CompanionПриложение UX Companion для iPhone содержит глоссарий методов, терминов и понятий, использующихся при проектировании интерфейсов.
UX Thought of the DayКоллекция цитат о работе над интерфейсами от компании UI Engineering. Каждый день по полезной мысли.
Salary Trends for UX ProfessionalsJacob Nielsen обновил свою статью о тенденциях американских зарплат в UX от 1997 года. Последние несколько лет суммы держатся на относительно стабильном уровне, хотя есть небольшое снижение для начинающих. Средняя годовая зарплата по США для начинающего $63 000 и $90 000 для профессионала с 5 годами опыта (до налогов). Первые 10 лет карьеры прирост зарплаты составляет $5 000 в год, потом снижается до $3 000.
Design for Dasein — Understanding the Design of Experiences«Дизайн для дазайн» — новая книга Thomas Wendt о связи между феноменологией (основанной на философии Гуссерля и Хейдегера), проектированием взаимодействия и дизайн мышлением. На сайте есть видео выступлений Томаса на Interaction 2014 и LeanUX 2014 на эту тему.
Люди и компании в отрасли AMA: I«m Manoela Ilic, Co-founder of CodropsСессия с Manoela Ilic из Codrops. Правда, в основном благодарят :) Она также говорит о том, что многие скрипты делаются на основе концептов Dribbble и Behance. После этого они активно распространяются по промо-сайтам и веб-сервисам и постепенно становятся стандартами. Это в тему здравого отношения к таким соц.сетям.Материалы конференций Videos online of Service Design Global Conference 2014Видео выступлений с конференции Service Design Global Conference 2014, проходившей 7–8 октября в Стокгольме, Швеция.Свежие ссылки можно также отслеживать в одноименной Facebook-группе. Спасибо всем, кто также публикует ссылки в ней, особенно Геннадию Драгуну, Павлу Скрипкину, Дмитрию Подлужному, Антону Артемову, Денису Ефремову и Евгению Соколову. Все больше материалов в обзорах появляется благодаря им.