Дайджест продуктового дизайна, август 2015

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

Дайджест продуктового дизайна, август 2015

Паттерны и Best Practices


How to Use Photography in Branding
Очень толковая статья Loren Baxter об использовании фотографий в интерфейсе для усиления бренда. Он приводит яркие примеры и дает инструкцию по поиску своей стилистики.

How to Use Photography in Branding

Адаптация для больших экранов

Responsive Upscaling: 11 Ideas for Large-Screen E-Commerce Design

Большие сенсорные экраны

Почтовая рассылка

Воспринимаемая скорость интерфейса

Коллекции интерфейсной анимации

Работа с уведомлениями

Гайдлайны платформ и шаблоны дизайна для них


MailChimp Content Style Guide
MailChimp собрал хорошее всеобъемлющее стилистическое руководство для работников компании. Раньше это были разрозненные гайдлайны, но теперь они сведены в один.

MailChimp Content Style Guide

HP Grommet
Grommet, UX-фреймворк для корпоративных приложений от HP.

HP Grommet

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


Designing Web Interfaces For Kids
Очень толковый обзор особенностей дизайна для детей разных возрастов от Trine Falbe. В каждом из периодов развития свои когнитивные и физические способности, что сильно влияет на оптимальный интерфейс.

Micro-Moments
Google выпустил новый сайт про микромоменты — мелкие спонтанные сценарии, которые инициируют пользователи на мобильных устройствах.

Micro-Moments

Информационная архитектура, концептуальное проектирование, контент-стратегия


Content Wireframing for Responsive Design
Новая книга UXPin про прототипирование для адаптивного дизайна на уровне контента.

Проектирование и дизайн экранов интерфейса


Russian Prototyping Club
Антон Карташов создал группу про Origami, Framer.js, Pixate и другие современные дизайн-инструменты. Практические вопросы по конкретным задачам, решение проблем, руководства для начинающих.

Russian Prototyping Club

Куда двигаются инструменты прототипирования

Principle
Инструмент вышел: стоимость несколько выше ожиданий, но доступна пробная версия. По видео-ролику выглядит довольно приятно — есть много мелочей, который отсутствуют в Pixate и плохо реализованы в Proto.io. Подробнее:

Flinto

Five app prototyping tools compared — Proto.io, Pixate, Origami, Framer & Form
Очень крутой подход к сравнению современных инструментов прототипирования. Tes Mat пытается собрать в них один и тот же интерфейс и описывает плюсы и минусы Proto.io, Pixate, Origami, Framer и Form.

InVision

Sketch

Прототипирование в Keynote

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


32 Ways To Measure The Customer Experience
Отличная классификация методов пользовательских исследований от Jeff Sauro в привязке к конкретным задачам.

32 Ways To Measure The Customer Experience

Comparing Between- and Within-Subjects Studies
Jeff Sauro о пользовательских исследованиях, где разные задания даются одним и тем же, либо совсем разным респондентам. В конце он сравнивает плюсы и минусы этих вариантов. Первый дешевле, второй дает меньше помех.

Визуальное программирование и дизайн в браузере


WebKit Visual Styles Sidebar
WebKit внедряет наглядный визуальный редактор стилей страницы. Помимо стандартной панели с кодом, добавилась вкладка в духе графических редакторов, где можно явно задать основные параметры оформления — почти как в Sketch или Photoshop. Очень круто, ждем такую же штуку в Chrome.

CSS is complicated. Web Inspector«s new Visual Styles sidebar can help you perfect a design — now in the nightly. pic.twitter.com/ucS5BUkO6Q— WebKit (@webkit) 20 августа 2015

SalesForce Lightning Design System
Дизайн-система Lightning компании Salesforce. Немного о том, как она делалась.

SalesForce Lightning Design System

Работа с Bootstrap и Foundation

Bootstrap Themes

Easee
И еще один новый инструмент для дизайнеров Easee. Он позволяет делать анимацию в браузере. Небольшой рассказ его создателя Steven Fabre о том, как и зачем он его сделал.

Easee

Framer

Webflow CMS
Webflow запускает свою CMS: пока не все ясно, но выглядит интригующе. Практически визуальное создание динамичного адаптивного сайта с кучей технически сложных элементов.

Webflow CMS

Работа с Flexbox

Веб-типографика

Новые скрипты

Режимы наложения слоев в браузере

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


Applied UX Strategy, Part 3: Platform Thinking
Моя статья о платформенном мышлении на основе недавней презентации. Как перестать плодить документацию и начать жить. Все это сжигает уйму времени на бумагомарательство — силы уходят на полировку побочных документов, а не продукта. Нужно воспринимать работу над продуктом как создание и развитие платформы, а не конкретный релиз. Русскоязычная версия.

UX-стратегия на практике. Часть 3 — Платформенное мышление

Я рассказывал об этом на Smashing Magazine (мобильный веб и контент-проекты). Но там был упор на конкретные кейсы, а в этой публикации — пошаговая инструкция по созданию такой платформы.

В конце идет длинный список всех тех, благодаря кому эта картина выстроилась в единое целое и начала внедряться на практике. Изначальная идея была простой, первый прототип платформы появился в середине 2012 года. Но по мере перевода все большего количества сервисов на нее видение корректировалось и расширялось. У нас огромное количество продуктов и вопросов по каждому из них, так что мы еще в пути. Поэтому серия будет продолжаться :)

UX-стратегия

Дизайн-культура

Building Creative Teams without Your Gut

Найм дизайнеров

Design Sprints

Getting Started With UX Design Process & Documentation
Еще одна книга UXPin, о построении дизайн-процесса и работе с документацией.

The Designer«s Guide to Collaborating With Developers
И еще одна — о взаимодействии дизайнеров и разработчиков.

Presumptive Design — Design Research Through the Looking Glass
Leo Frishberg и Charles Lambdin предлагают свою вариацию на тему lean UX. Не особо осмысленное отпочковывание с основным мотивом создания «нас не понимают», но в копилку терминологии полезно.

Продуктовый менеджмент и аналитика


Техника пикапа — Как создать продукт и покорить пользователей
На летней программе института Стрелка и Rambler & Co выступил Rahul Sen из Spotify, занимающийся вопросами роста пользовательской базы и прибыли. У него достаточно интересная концепция выстраивания работы с пользователем как личных взаимоотношений. В этой статье, правда, совсем общий обзор, чуть больше деталей было в англоязычной версии. Хотя самое интересное осталось в самой презентации и, видимо, тренинге. В том числе об их модели метрик AACR (Acquisition, Activation, Conversion, Retention) и ее провязке в интерфейсе.

Техника пикапа — Как создать продукт и покорить пользователей

Design x Data
IDEO запустили блог на Medium, посвященный использованию данных и аналитики в дизайне. Пока, правда, всего пара публикаций.

Кейсы


From Russia With Love — Behind The Responsive Redesign Of Kremlin.ru
Артем Геллер отвечает на вопросы Smashing Magazine о работе над новым сайтом Kremlin.ru. Насыщенная статья, в которой много интересных технических деталей. Это первый российский государственный проект «на страницах» подобного издания.
Версия на русском.

From Russia With Love — Behind The Responsive Redesign Of Kremlin.ru

Alcatel Watch UX
Шикарнейший кейс Дениса Невожая про работу над интерфейсом умных часов One Touch Watch от Alcatel. Во всех деталях показаны итерации дизайна, рассказано о первоначальных задумках и конечной реализации. Это собственная платформа Alcatel, так что поиск решений особенно интересен.

Alcatel Watch UX

Хосейн Рахман: Как в Jawbone проектируют hardware-продукты
Очень мощный кейс от команды Jawbone, охватывающий все нюансы продуктовой работы. Вторая часть.

Хосейн Рахман: Как в Jawbone проектируют hardware-продукты

Blurring Is the Auto-Tune of UI Design, and Other Things We Thought About While Designing Wildcard 2.0
Khoi Vinh рассказывает о работе над новостным приложением Wildcard, для которого он делал достаточно глубокое исследование о карточных интерфейсах. Правда, изначально они планировали запускать мобильный браузер, но он не взлетел и наработки отдали для более простой недели. Приложение вышло недавно и это одна из самых эффектных штук на iOS в этом году.

Кейсы редизайна

Дизайн в Samsung

История


50 years ago today the word «hypertext» was introduced
Интервью с Ted Nelson, автором идеи гипертекста. Он в деталях рассказывает о том, как пришел к этой идее, как 50 лет назад проходила ее легендарная презентация и что из всего этого получилось.

50 years ago today the word «hypertext» was introduced

Веб »90х

'Space Jam' Forever — The Website That Wouldn't Die

Тренды


The Post-Mac Interface
Очень длинный, но очень интересный текст об истории развитии GUI от Adam Baker. Он вспоминает концепцию интерфейса Anti-Mac от Jakob Nielsen и D. Gentner 1996 года, в которой они пытались переосмыслить классический интерфейс Mac с учетом появления интернета. Что-то из их предсказаний сбылось, что-то нет и Адам предлагает свое видение Post-Mac.

The Post-Mac Interface

Trends in Newsrooms — Gaming the news
В последнее время СМИ все чаще готовят спец.проекты и альтернативные варианты подачи материалов, представленные в игровой манере. Сайт ассоциации WAN IFRA разбирает наиболее яркие примеры.

Web Design Book of Trends 2015–2016
Книга UXPin про тренды в вебе 2015–2016.

Носимые устройства

Автомобильные интерфейсы


Для общего и профессионального развития


How to design award-winning websites
Lasse Kristensen является членом жюри FWA. Он рассказывает о том, по каким критериям судит работы.

How to design award-winning websites

Продуктовый дизайнер

Подборки книг

I Have No Idea What The Hell I Am Doing
Перевод статьи на основе свежего выступления Brad Frost об особенностях и философии дизайна в современном вебе. Много ключевых идей собраны вместе.

Люди и компании в отрасли


Designer Bios
Забавная коллекция мини-биографий дизайнеров из их личных сайтов и сайтов студий. Кто и как себя подает.

Интересные назначения дизайнеров

Покупки дизайн-студий крупными компаниями

Закрытие LayerVault

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


Uideo — 374 около-дизайн-видео
Андрей Якушев запустил агрегатор видео с отечественных дизайнерских конференций. В базе уже под четыре сотни выступлений.

Uideo — 374 около-дизайн-видео

UX Strategies Summit 2015 Review, Part 1 — Overview and Workshops
Отчет Pabini Gabriel-Petit о конференции UX Strategies Summit 2015, проходившей 10–11 июня в Сан-Франциско, США. Очень подробный конспект ключевых выступлений. День 2.

Свежие ссылки можно также отслеживать в одноименной Facebook-группе. Спасибо всем, кто также публикует ссылки в ней, особенно Геннадию Драгуну, Павлу Скрипкину, Дмитрию Подлужному, Антону Артемову, Денису Ефремову, Алексею Копылову и Евгению Соколову. Все больше материалов в обзорах появляется благодаря им.

© Habrahabr.ru