Конференция уже прошла, но вы можете посмотреть все доклады участников на нашем YouTube-канале https://www.youtube.com/playlist?li...

Вы часто получаете продукт, который совершенно не похож на первоначальный замысел дизайнера? Почему происходит так что итоговый результат сильно отличается от дизайна?

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

Кому будет интересна онлайн-конференция:

Дизайнерам, фронтенд-разработчикам, руководителям веб-студий, CEO, CTO, тимлидам и всем тем, кого волнует качество верстки.

Расписание докладов

14:30-15:00

Неверстабельный дизайн, недовольный клиент и дизайнер, который не знает верстки. Как лечить боль дизайнеров и верстальщиков

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

• Почему дизайн ради дизайна не нужен ни клиентам, ни даже дизайнерам.

• Как передавать дизайн разработчикам и не плодить лишний код.

• Почему верстальщики не могут повторить дизайн и дизайнерские идеи?

• Что про это все думает заказчик?

15:00-15:30

Скорость, деньги, качество разработки. Как анимировать интерфейсы и в чем здесь подвох

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

• Зачем разработчикам, заказчикам и дизайнерам нужны анимированные макеты.

• Почему это не только про кликабельные прототипы: анимирование элементов для UI-кита и флоу пользователя с ответвлениями.

• Figma, InVision, Adobe After Effects, сервисные библиотеки и другие инструменты.

• Как окупается анимация. В цифрах.

• Кейсы, кейсы, кейсы: ДИТ Москвы, грузовые электромобили Arrival, ДелоБанк.

15:30-16:00

Тренды анимации на верстке. Как оживить дизайн и «подружить» дизайнера и фронтенд-разработчика?

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

• Как выбрать подходящую технологию для «оживления дизайна» проекта. Что лучше, видео или секвенция, сanvas или WebGL?

• Как «подружить» анимацию с версткой и сформировать общий взгляд у дизайнера и верстальщика.

• Тренды в анимации на верстке. От многолетней практики до новых инструментов: Web Animations API и Media Queries.

16:00-16:30

Как выстроить эффективное взаимодействие между дизайнером и фронтенд-разработчиком

У каждого дизайнера и фронтенд-разработчика есть свое представление об идеальной работе. Когда работаешь один, подстраиваешься под себя. Но что делать, когда в команде 15 человек? Поговорим о том, как настроить работу между такими разными и такими похожими отделами — дизайном и разработкой. Очень много слез, лайфхаки и кейсы.

• Почему верстальщик рыдает от ваших макетов и как это прекратить.
• Почему дизайнер в слезах после того как макет отверстали в продакшн.
• Как перестать орать и дуться на друг друга и начать строить классные продукты.
• Какие инструменты и приемы помогут сделать процесс стабильным и качественным.
• На реальном опыте. С победами и провалами.

16:30-17:00

Зачем дизайнерам тесно общаться с фронтенд-разработчиками и находить свой подход к каждому

Привет, я Катя, и вот уже два с половиной года работаю в крупных медиа. Расскажу, как за два года работы в Ведомостях нам удалось собрать классный digital-отдел из хаоса и общими силами выстроить процессы, которые устраивают всех.

• Классификация фронтенд-разработчиков: аккуратный, но медленный. Талантливый, но невнимательный. Идеальный, но всегда занят. 
• Как дизайнеру находить общий язык с разными типами разработчиков.
• Подойди и спроси. Приходи с референсами и проси ссылку на ревью.
• Как принимать верстку, если в команде нет тестировщика. Обязательный чек-лист на все баги.

17:00-17:30

Фронтенд-разработчик на максималках

Что будет, если совместить роль дизайнера и фронтендера? «Умный» и красивый дизайн передают «куда-то» на верстку, а там «сверстали как смогли». Смысл, заложенный дизайнером, теряется.

Увы, ни один проект в итоге не выглядит таким, каким был задуман изначально. Сверстать так, как хотел дизайнер, практически невозможно — это искусство, граничащее с гениальностью.

• Каким должен быть качественный дизайн с точки зрения верстки (спойлер: без переполнения контента и перестроения работы адаптива)

• Как frontend-разработчик представляет работу дизайнера? Чем отличается видение джунов, миддлов, синьоров, и как лучше «попасть» в их «матрицу»?

• Какие проблемы решает frontend-разработчик за дизайнера?
  Какие ошибки дизайнера приходится устранять фронтендеру и каким образом?

• Где лучше делать анимацию: CSS или JS?

• Вишенка на торте: список готовых easy-функций.

17:30 — 20:00

Круглый стол. Q&A, свободное общение

Разберем три примера слушателей в прямом эфире

Запись докладов конференции: https://www.youtube.com/playlist?li...