Как я съездил на SmashingConf в Оксфорд. Доклады

Как и обещал ранее наконец-то добрался до обзора по самым интересным докладам конференции.

Дизайн

Помимо прекрасного воркшопа с Аароном Уолтером были не менее интересные доклады.

Живые дизайн-системы от Джины Болтон

На мой взгляд — самый лучший доклад конференции. Джина Болтон из Salesforce рассказывала о живых дизайн-системах. Что это такое и как они внедряли их у себя в компании.

Продуктовый дизайн и разработка может охватывать целый ряд устройств и платформ: iPhone, iPad, Android телефоны и планшеты, адаптивные веб-приложения и сайты, десктопные приложения и многое другое... И если вы работаете в очень крупной организации, вы можете иметь целый ряд продуктов и фич, в каждой платформе.
Систематизация дизайна является обязательным условием для того, чтобы оставаться продуктивным и эффективным во взаимодействии между продуктами, платформами и устройствами. UI Киты и гайдлайны являются отличным шагом на пути к поддержанию системы. Но как гайдлайн может быть актуальным, полезным ресурсом, а не помехой в работе?

Получите опыт продуктовых дизайнеров из прошлых и текущих проектов Джины. Начиная от небольших рабочих групп до крупных корпоративных команд — как она и ее команды стремились сохранить «единый источник истины» для по-настоящему актуальной спецификации дизайна используя живые гайдлайны и прототипы. Всё что только может улучшить дизайн продукта и жизненный цикл разработки.

Основные моменты доклада:

  • Дизайн-системы нужны для гибкого развития и масштабируемости дизайна в компании
  • Дизайн-системы позволяют забыть о вопросах разработчиком: где взять иконку, какой цвет у бордера, чем отличаются эти два цвета.
  • Спецификации-редлайны (картинки где подписаны все расстояния и размеры) не работают и быстро становятся неактуальными.
  • Подборка статей по стайлгайдами.
  • Дизайн-система должна быть всегда актуальной.
  • Гайдлайны — это артефакт дизайна, дизайн-система — живой фундамент продукта, формирующий экосистему.
  • Дизайн-система СейлФорса.
  • Дизайн-система содержит стандарты бренда, дизайна и фронтенда.
  • Дизайн-система должна базироваться на принципах. В принципах важно понимать иерархию (какой принцип дизайна важнее какого). В СейлФорсе это: 1) ясность, 2) эффективность, 3) консистентность 4) красота.
  • Существуют разные модели организации дизайн-команд для разработки дизайн-систем: уединеная, централизованная, распределенная.
  • В разработку дизайн системы включены: продуктовые дизайнеры, фронтендеры, эксперты по ацесабилити, визуальные дизайнеры, ux-дизайнеры.
  • Дизайн-система — это не проект, а продукт. Разрабатывайте её как продукт: проводите исследования, составляйте дорожные карты, расставляйте приоритеты.
  • С чего начать? Соберите все дизайн-элементы вместе. Затем стандартизируйте и объедините похожие. Сделайте описание для каждого компонента. Соберите команду и обсудите.
  • Компоненты хранятся в репозитории и автоматически обновляют стайлгайды и продукт.
  • Дизайнеры ссылаются на компоненты в спецификациях и говорят с разработчиками и друг с другом на одном языке.
  • Пример дизайн-токкенов.
  • Никакого хардкоинга. Создавайте свой фреймворк.
  • Поддерживайте 3 версии: прошлый релиз, текущий релиз, будущий релиз.
  • Дизайн-системы позволяют повысить точность дизайн-решений при доставке до конечного юзера (меньше искажений).

Атомы, модули и другие веселые частицы от Анны Халаматовой

Еще один крутой доклад по дизайн-системам.

Многие из нас перешли от проектирования страниц в направлении проектирования систем, но одна концепция по-прежнему важна: модульность. Модульные системы обещают быть масштабируемыми, легкими в поддержке, и простыми в работе. Но что, если «система», которую мы построим работает не так хорошо, как мы ожидаем? Что делать, если результат разочаровывает: чрезмерно упрощенный и склеенный из кусочков дизайн, не так масштабируем и адаптируем, как мы надеялись?

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

Основные моменты доклада:

  • Библиотека паттернов ФьючерЛерна.
  • Система — это большее, чем собрание элементов.
  • Элементы, цель, взаимосвязи — это система.
  • Дизайн-система — набор последовательных паттернов, которые поощряют и поддерживают определенное поведение.
  • Связи в системе могут быть семантическими, структурными, визуальными, поведенческими.
  • Дизайн-система — это как язык.
  • Называйте элементы системы согласно их глобальной функции.
  • Распечатайте все элементы системы на бумаге — это поможет собрать и сгруппировать их вместе
  • Структурные связи описал Брэд Фрост.
  • Есть «субатомный» уровень дизайн-систем. Дизайн-токены, о которых говорила Джина.
  • Стройте отношения между визуальными паттернами.
  • Думайте не элементами, группами модулей, которые связанны единой целью.
  • Тестировать модули можно на юзабили-тестированиях. Проверяйте получилось ли у вас достичь желаемого поведеия пользователей.
  • Развитие системы постоянный процесс, а не результат разовой работы.

Душа и машины от Ханны Донован

Не так давно, казалось, что большие объемы данных и коллективная фильтрация собирались удовлетворить наши желания нового и дать вдохновение. В то же время, платформы, посвященные новым методам самовыражения — музыки, письма, видео и т.д. — созрели, и их новые формы контента стали столпами нашей культуры.

Сегодня контентные компании адаптируются чтобы стать цифровыми продуктами, а технологичные компании учатся как делать контент. Как дизайнер продукта должен ориентироваться в этих меняющихся условиях? Каковы ответы на вопросы: «люди или компьютеры»; «профессиональный или контент сгенерированный пользователями»; и «твердое мнение профессионала или демократия»? На эти и многие другие вопросы будет дан ответ на основе тематических исследований, экспериментов и, конечно, истории.

Понимая людей от Криса Шифлета

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

Если мы сможем узнать больше о том, как мы думаем, что мы ценим, и как мы принимаем решения, то сможем лучше понять и сопереживать людям, в частности, нашим пользователям. Это выступление — смесь науки, человеческого поведения, восприятия и смысла. Гарантирую, что это будет самый странный доклад на конференции.

  • Восприятие > Реальности.
  • Пользователи не тупые, они просто люди.
  • Эффект приманки. Добавить в выбор тарифа опцию хуже, чем опция рядом, но по той же цене, что и худшая опция.
  • Черные паттерны. «Не возражаете если мы будем собирать анонимную статистику? — Да / Нет».
  • Парадокс Монти Холла (или Иллюзия контроля).
  • Теория веселья.
  • Отвлечение. Крутой эксперимент с меняющейся частью картинки. Когда есть пауза и когда нет паузы. Вывод: как можно меньше перезагружайте страницу, не заставляйте её моргать.

Избыток рассуждений о дизайне от Джона Сэтзена

  • Убер — самая большая такси-компания без машин, Фейсбук — самый большой владелец медия без своего контента, Алибаба — самый крупный розничный продавец без своего товара, Эйрбиэндби — самый крупный мировой провайдер жилья без своей недвижимости. В мире происходит что-то интересное.
  • Дизайнеры предоставляют сервис по решению проблем.
  • Сфера сервиса — 84% американской экономики.
  • Экспириенс — 1/20 маркетинга.
  • Юзабельный, эффективный, желанный — качества хорошего сервиса.
  • Создавайте опыт взаимодействия → Согласовывайте с реальностью → Цените усилия → Понимайте эмоциональный контекст.
  • Мы замечаем сервис (услугу) только тогда, когда она плохого качества.
  • Снуп Дог материт Билла Гейтса из-за проблем в Иксбоксе
  • Убер-еда. Еда не как на картинках разочаровывает, хотя сервис удобный и эффективный.
  • У Сири были проблемы с пониманием шотландского акцента
  • Внедрение кредитных карт с чипом (ну такие без магнитной полосы) вызвало аппокалипсис в одном из Волмартов т.к. продавцы не знали как проводить платежи.
  • Плохой опыт убивает доверие. Маркетинг — часть хорошего опыта.
  • Исследуйте → Делайте концепт → Тестируйте → Повторяйте → Запускайте в продакшн → Повторяйте.
  • Если вы сделали хорошую работу, возможно её никто не заметит.

Фронтэнд

Доклады по «фронту» мне были интересны в меньшей степени, поэтому ограничимся кратким перечислением интересного.

Грязные трюки из темных уголков фронтенда от Виталия Фридмана

Крутейший доклад Виталия Фридмана про хаки фронтенда. Узнал многое из того, что считал невозможным.

DevTools: анимированное путешествия от Умара Хансы

Рассказ о современном инструменте разработки в виде наглядных анимаций. Много полезностей на сайте Умара.

Поднимаем макет на следующий уровень от Криса Райта

 



Подписка по РСС
Мой твитер

Нет комментариев

Оставить коментарий

Суперрассылка!

Введите почту и будьте в курсе