[ { "id": 1, "label": "100%×150_Branding_desktop", "provider": "adfox", "adaptive": [ "desktop", "tablet" ], "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "ezfl" } } }, { "id": 2, "label": "1200х400", "provider": "adfox", "adaptive": [ "phone" ], "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "ezfn" } } }, { "id": 3, "label": "240х200 _ТГБ_desktop", "provider": "adfox", "adaptive": [ "desktop" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "fizc" } } }, { "id": 4, "label": "240х200_mobile", "provider": "adfox", "adaptive": [ "phone" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "flbq" } } }, { "id": 5, "label": "300x500_desktop", "provider": "adfox", "adaptive": [ "desktop" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "ezfk" } } }, { "id": 6, "label": "1180х250_Interpool_баннер над комментариями_Desktop", "provider": "adfox", "adaptive": [ "desktop", "tablet" ], "adfox": { "ownerId": 228129, "params": { "pp": "h", "ps": "bugf", "p2": "ffyh" } } }, { "id": 7, "label": "Article Footer 100%_desktop_mobile", "provider": "adfox", "adaptive": [ "desktop", "tablet", "phone" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "fjxb" } } }, { "id": 8, "label": "Fullscreen Desktop", "provider": "adfox", "adaptive": [ "desktop", "tablet" ], "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "fjoh" } } }, { "id": 9, "label": "Fullscreen Mobile", "provider": "adfox", "adaptive": [ "phone" ], "auto_reload": true, "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "fjog" } } }, { "id": 10, "disable": true, "label": "Native Partner Desktop", "provider": "adfox", "adaptive": [ "desktop", "tablet" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "clmf", "p2": "fmyb" } } }, { "id": 11, "disable": true, "label": "Native Partner Mobile", "provider": "adfox", "adaptive": [ "phone" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "clmf", "p2": "fmyc" } } }, { "id": 12, "label": "Кнопка в шапке", "provider": "adfox", "adaptive": [ "desktop", "tablet" ], "adfox": { "ownerId": 228129, "params": { "pp": "g", "ps": "bugf", "p2": "fdhx" } } }, { "id": 13, "label": "DM InPage Video PartnerCode", "provider": "adfox", "adaptive": [ "desktop", "tablet", "phone" ], "adfox_method": "create", "adfox": { "ownerId": 228129, "params": { "pp": "h", "ps": "bugf", "p2": "flvn" } } }, { "id": 14, "label": "Yandex context video banner", "provider": "yandex", "yandex": { "block_id": "VI-223676-0", "render_to": "inpage_VI-223676-0-158433683", "adfox_url": "//ads.adfox.ru/228129/getCode?p1=bxbwd&p2=fpjw&puid1=&puid2=&puid3=&puid4=&puid8=&puid9=&puid21=&puid22=&puid31=&fmt=1&pr=" } } ]
{ "author_name": "Yury Vetrov", "author_type": "self", "tags": ["\u0438\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441\u044b","\u0434\u0438\u0437\u0430\u0439\u043d"], "comments": 2, "likes": 14, "favorites": 30, "is_advertisement": false, "section_name": "default", "id": "13393" }
Yury Vetrov
5 931

Продуктовый дизайн: 20 самых важных материалов за январь

Уже пять лет руководитель портальной дизайн-команды Mail.Ru Group Юрий Ветров публикует в своем блоге регулярные обзоры свежих статей по теме интерфейсов, новых инструментов и коллекций паттернов, интересных кейсов и исторических рассказов. Из лент нескольких сотен тематических подписок он отбирает примерно 5% стоящих публикаций, которыми интересно поделиться среди экспертов.

Специально для vc.ru Ветров собрал выжимку из 20 самых интересных ссылок января.

Интервью с создателем меню «бургер»

Шикарнейшее интервью с Нормом Коксом, автором иконки «бургера» для первого коммерческого графического интерфейса в Xerox. Идеальные ответы на тему одной из самых идиотских дискуссий в сообществе за последние годы — это просто один из паттернов, который может быть к месту или не к месту на конкретном экране конкретного продукта. Кокс мастерски сводит к этому все вопросы интервьюера.

Microsoft Web Framework

Microsoft опубликовала Web Framework — визуальный язык для своих веб-сервисов. Очень неплохо подан и описан сам язык, особенно анимация — а вот описание компонентов более примитивно: чистая статика с очень небольшим набором решений. Будет интересно следить за его развитием.

Прогнозы на 2016 год

  • Чейз Бакли сделал прогноз сразу на 2017 год. Огромное облегчение — видеть интересный ход мыслей, а не утомившие слова «анимация», «фоновое видео» и «большие картинки», которые повторяются из года в год.
  • Сайт A List Apart опросил известных дизайнеров и разработчиков по поводу их планов на 2016 год и потенциальных направлений развития профессии.
  • Эрик Флауэрс дал прогноз по перспективам проектирования услуг и направлений его роста в 2016 году.
  • Роб Таннен решил заглянуть совсем далеко, на 500 лет вперед. Он обращается к книге Кевина Келли «Чего хотят технологии», в которой автор, основываясь на внутренней логике развития техники, пытается понять, куда движется индустрия. Он рассматривает эту логику с точки зрения интерфейсов и дизайнеров, а сами интерфейсы сравнивает с языком и алфавитом: они помогли наладить общение между людьми, а UX позволяет общаться человеку и компьютеру. Очень интересный подход.
  • Дизайнеры известных студий и продуктовых компаний пофантазировали на тему дизайнерских профессий будущего. Что-то звучит здраво, но многое из описанного будут делать скорее люди из других отраслей, а не дизайнеры, которым не хватит узкоспециализированных навыков в той же биологии.

Единый язык анимации

  • Yiming предлагает 7 вопросов, которые позволяют системно подойти к интересной анимации: кто (компонент), где (окружение), когда (хореография), почему (поведение пользователя), что (свойство), с чем (взаимозависимость свойств) и каким образом (функция времени).
  • Амин Ал Харзвани и Тобиас Бернард размышляют о семантике интерфейсной анимации: как сделать ее осмысленной, целостной и предсказуемой.
  • Кит Олийник из Capital One/Adaptive Path предложил интересную категоризацию принципов интерфейсной анимации. Он совместил задачи анимации — функциональная, пространственная, эмоциональная — и 12 принципов Диснея. Получилось хорошее переложение теории на практику.
  • Вал Хед размышляет на холиварную тему — актуальны ли 12 принципов анимации Диснея для интерфейсов. Не все из них хорошо подходят для задач цифровых продуктов, но в целом это хорошая система классификации, которая нужна для системной работы.

Школа дизайна «Яндекса»

Школа дизайна «Яндекса» сформировала видеокурс лекций на основе прошлогодней программы. В канале на YouTube доступны первые записи, постепенно будут появляться остальные. Создатели школы Лола Кристаллинская и Тарас Шаров рассказали об итогах прошлогоднего набора.

Нативное приложение Creolabs

Новый инструмент для дизайнеров Creolabs попытался соединить дизайн и разработку. На выходе получилось нативное приложение для iOS, использующее реальные данные и хорошо анимированное. Правда, есть вопросы к качеству итогового кода.

Другие новости инструментов:

  • Эрик Фриберг комплексно подошел к вопросу о том, что должен уметь идеальный дизайнерский инструмент. Он очень подробно разобрал основные задачи, которые выполняет современный дизайнер, и привел примеры, как их помогают решать существующие продукты.
  • Вышел Sketch 3.5 (и следом 3.5.1). Что нового.
  • InVision покупает Macaw — судя по FAQ, во многом ради нового продукта Scarlet. Инструмент становится бесплатным, но обновляться не будет.
  • Обновился сайт Marvel. Появилась коллекция примеров прототипов.

Дизайн-решения, проверенные в Mail.Ru Group

Ксения Стернина анализирует результаты пользовательских исследований продуктов Mail.Ru Group за много лет и пытается обобщить информацию из них. В результате должна получиться библиотека паттернов, дополненная выводами об их полезности и работоспособности на практике. Это первая презентация из серии.

Другие мои коллеги, Ольга Курицына и Олег Паринов, рассказывают о необычном поведении пользователей в интерфейсах главной страницы Mail.Ru и Почты для бизнеса. Вторая часть.

Подход компании к построению UX

Одно из лучших выступлений последних лет от Лии Були, в котором она рассказывает о современном подходе к построению UX в компании. Недавно она перешла в Forrester, где стала заниматься аналитикой рынка дизайна, что само по себе важный шаг для профессии. В этом выступлении Лия рассказывает об опросах компаний разного уровня и размера, благодаря которым она сформулировала критерии успеха UX-команд. Все это доступно в виде отчета за $499.

Выступлению уже почти год, но это один из самых ценных инсайтов для тех, кто хочет двигать вперед дизайн в компании. Очень и очень круто.

Внедрение изменений с помощью «адаптивного дизайна»

Шикарнейшая статья Майи Бернштейн и Марти Лински на тему внедрения изменений в компаниях. Дизайн-мышление считается хорошей методологией для того, чтобы придумывать будущее, но дальше все зачастую оказывается печально — оно так и остается красивым визионерством. А вот в связке с современным подходом к менеджменту — адаптивные лидерством — задуманное можно реализовать.

Майя и Марти предлагают методологию «адаптивного дизайна» на стыке дизайн-мышления и адаптивного лидерства. Она позволяет внедрять в компанию смелые идеи и изменения. Название, правда, не очень удачное, потому что занято responsive и adaptive-техниками работы с вереницей устройств и экранов.

Дизайн-мышление в IBM

IBM опубликовали методичку по своей версии дизайн-мышления. В чистом виде методология полезна скорее по кусочкам, но тут из нее составлен отличный рабочий инструмент для реальных компаний. IBM рассказывают об этом последние пару лет, но теперь есть хорошее и понятное руководство. Анонс.

Четвертое издание книги «Интерфейс. Основы проектирования взаимодействия»

Издательство «Питер» выпустило перевод четвертого издания одной из главных книг для дизайнеров интерфейсов от Алана Купера, Роберта Реймана, Дэвида Кронина и Кристофера Носсела.Алексей Копылов, который был научным консультантом предыдущего перевода, в этот раз не принимал участие в подготовке издания. Кстати, Михаилу Зислису, переводчику третьего издания, принадлежат имущественные и авторские права на перевод.

Патенты в дизайне

Сара Бурштейн собирает свежие патенты, которые касаются дизайна. Физические устройства, интерфейсы, промышленный дизайн.

Ближайшие конференции по веб-дизайну

Список конференций по дизайну и веб-разработке на первое полугодие 2016 года. Еще один список конференций на 2016 год.

Как разработать эффективную кнопку CTA

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

Вдогонку — отличные советы от Кима Флаерти из NN/g: как показать пользователю, что контент есть и на следующих экранах.

Как верно определить число участников юзабилити-тестирования

Рич Макфилд и Джанет Сикс актуализируют вопрос, сколько респондентов достаточно для юзабилити-тестирования. Кто-то говорит о важности широкого набора респондентов — Якоб Нильсен утверждает, что для многих ситуаций достаточно пяти человек. В статье хорошо описаны разные ситуации и разные задачи, а также даны рекомендации по количеству респондентов для них.

Отчет Litmus о рынке почтовых клиентов

Компания Litmus выпустила подробный отчет об основных изменениях на рынке почтовых клиентов и в целом перспективах для дизайнеров и разработчиков рассылок. Авторы сайта Really Good Emails собрали на CodePen коллекцию кусков кода для писем рассылки.

Живые гайдлайны и компонентные системы

  • Карен Менезес дает рекомендации по грамотной работе с переменными в пре-процессорах. В конце статьи — толковые советы по структурированию базовых значений визуального языка.
  • Хорошие мысли Дана Молла о грамотном построении компонентов. Он говорит о том, как важно понимать разницу между паттернами представления и паттернами структуры информации.
  • Мой коллега Артем Мезин рассказывает, как технологически устроен фреймворк Почты Mail.Ru. Интерфейсная часть этой истории станет третьей публикацией в серии статей про унификацию дизайна наших продуктов.
  • Живой гайдлайн от edX.
  • Кэти Басай, недавно пришедшая в дизайн-команду Salesforce, рассказывает, как дизайн-система Lightning помогла ей легче включиться в работу и посвящать больше времени работе над продуктами, а не изобретанию велосипеда. Полезно тем, кто думает, что подобные фреймворки забирают у дизайнера работу.
  • Вышла вторая версия инструмента быстрого прототипирования в браузере от команды GOV.uk.

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

  • CSS-утилита OpenType от Kenneth Ormandy, позволяющая легко использовать менее востребованные возможности веб-типографики.
  • Отличный материал по внедрению шрифтовых сеток, основанных на идее масштабирования относительно базового текста.
  • Библиотека Typi, облегчающая внедрение адаптивной типографики. Сопроводительная статья с разбором проблематики.

Дизайн-ресурсы Facebook

Огромная коллекция шаблонов телефонов, умных часов с перспективой других устройств.

Проблема с Dribbble

Тобиас ван Шнайдер призывает всех наконец-то выдохнуть насчет Dribbble: это в первую очередь инструмент для прокачки навыков, а если кто-то видит в нем что-то еще — это его личная проблема восприятия. Похожие мысли у Теда Гоаса — он просит прекратить травлю авторов непрошеных редизайнов.

Другое мнение у Бенджамина Бергера. Как и многие из нас, он устал от потока мусора, который породили движения Daily UI и «100 макетов за 100 дней». Это оторванные от реальности работы, которые не решают внятно описанные проблемы и прокачивают ограниченную группу навыков. Было бы лучше направить эти усилия на улучшение действительно полезных сайтов некоммерческих организаций и других компаний, которые не могут себе позволить нанять дизайнера. Это позволит и навыки развить, и реальную пользу принести.

Читайте полную версию дайджеста в моем блоге. В нем, как обычно, много новых материалов по дизайну для Apple Watch, Android Wear, Material Design, расширений для Sketch, свежих скриптов и еще тонна всего. За свежими ссылками также можно следить в группе на Facebook — спасибо всем, кто помогает наполнять ее. Вы также можете получать свежие обзоры по почте.

#Интерфейсы

Популярные материалы
Показать еще
{ "is_needs_advanced_access": false }

Комментарии Комм.

Популярные

По порядку

0

Прямой эфир

Компания отказалась от email
в пользу общения при помощи мемов
Подписаться на push-уведомления