Design is Frontend. Конференция AFFINAGE

На стыке дизайна и верстки. Как решить проблему низкого качества

ИТ и интернет 16+

Конференция уже прошла, но вы можете посмотреть все доклады участников на нашем 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...

Поделиться:

1405 дней назад
20 августа 2020 14:30–21:00

Событие пройдет онлайн

Уже есть билет
Получить ссылку

Поделиться:

Связь с организатором

На этот адрес придёт ответ от организатора.

Подпишитесь на рассылку организатора

Возврат билета

Если вы хотите вернуть билеты, вы можете сделать это по ссылке из письма с билетами или оформить запрос организатору в вашем  личном кабинете.

Подробнее о возврате билетов