Figma - жизнь до и после

Содержание

Слайд 2

Кто я

Кунаев Сергей

Directum

Кто я Кунаев Сергей Directum

Слайд 3

Будет про дизайн,

я правильно понимаю?

Что за инструмент и почему на него перешли
Какие

Будет про дизайн, я правильно понимаю? Что за инструмент и почему на
правила внутри команды
За что отвечает дизайнер при передаче макета

Слайд 4

Figma. WTF

Figma — кросс-платформенный онлайн-сервис для дизайнеров интерфейсов и веб-разработчиков.

Figma. WTF Figma — кросс-платформенный онлайн-сервис для дизайнеров интерфейсов и веб-разработчиков.

Слайд 5

Что использовали до

Макеты в psd, jpeg
Документация по проекту (кошмар для дизайнера)
Неразбериха в

Что использовали до Макеты в psd, jpeg Документация по проекту (кошмар для дизайнера) Неразбериха в макетах
макетах

Слайд 6

Почему надо было что-то делать

Конфликт «дизайнер-разработчик»

Почему надо было что-то делать Конфликт «дизайнер-разработчик»

Слайд 7

Почему надо было что-то делать

Конфликт «дизайнер-разработчик»

Война за пиксели

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

Логика переходов/навигации

Слабое понимание

Почему надо было что-то делать Конфликт «дизайнер-разработчик» Война за пиксели Поддержание актуальных
работы друг-друга в ходе проекта

Не те цвета/шрифты/состояния

Слайд 8

Почему надо было что-то делать

Много времени на взаимодействия

Почему надо было что-то делать Много времени на взаимодействия

Слайд 9

Почему надо было что-то делать

Технические ресурсы

Гигабайты, гигагерцы, общий доступ…

Почему надо было что-то делать Технические ресурсы Гигабайты, гигагерцы, общий доступ…

Слайд 10

Что еще рассматривали

Что еще рассматривали

Слайд 11

Что еще рассматривали

Еще плюсы

Режим просмотра
Режим презентации
Панель Сode
Интеграция с Zeplin, Avocode
Библиотека компонентов
Условная бесплатность
Google

Что еще рассматривали Еще плюсы Режим просмотра Режим презентации Панель Сode Интеграция
Fonts
Плагины

Слайд 12

Как работаем мы,

все ли делаем правильно?

Как работаем мы, все ли делаем правильно?

Слайд 13

С чем столкнулись при переходе

Привычка работать в Ps и Ai

Фреймы, группы,

С чем столкнулись при переходе Привычка работать в Ps и Ai Фреймы,
компоненты

UI kit как неотъемлемая часть интерфейса

Перевод всех макетов в Figma

Дифференциация инструментов по видам работ – Ai, Ps, Figma

Обучение

Слайд 14

С чем столкнулись при переходе

С чем столкнулись при переходе

Слайд 15

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

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

Слайд 16

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

8. Думать об использовании эффектов
9. Аккуратное использование прозрачности

Правила внутри команды 8. Думать об использовании эффектов 9. Аккуратное использование прозрачности

1. Используй сетку
2. Осознанные размеры для текстовых блоков + grow vertically
3. Боковые отступы
4. Целые значения
5. Использовать компоненты
6. Названия групп и фреймов
7. Растр с запасами по размеру
8. Аккуратное использование прозрачности
9. Думать об использовании эффектов
10. Использование стилей и страница для исходных компонентов всех иконок частей интерфейса

Про эффекты

Слайд 17

Дизайнер виновен

или за что его можно попинать

Дизайнер виновен или за что его можно попинать

Слайд 18

За что можно пинать дизайнера

Ничего непонятно по организации

Названия слоев

За что можно пинать дизайнера Ничего непонятно по организации Названия слоев

Слайд 19

За что можно пинать дизайнера

Ничего непонятно по организации

Что, куда, как

За что можно пинать дизайнера Ничего непонятно по организации Что, куда, как

Слайд 20

За что можно пинать дизайнера

Нет стилей, UI kit Нет разных состояний –

За что можно пинать дизайнера Нет стилей, UI kit Нет разных состояний – hover, press, disable
hover, press, disable

Слайд 21

За что можно пинать дизайнера

Разные отступы

За что можно пинать дизайнера Разные отступы

Слайд 22

За что можно пинать дизайнера

Обрезанные растры

За что можно пинать дизайнера Обрезанные растры

Слайд 23

За что можно пинать дизайнера

Слишком много эффектов

За что можно пинать дизайнера Слишком много эффектов

Слайд 24

За что можно пинать дизайнера

За что можно пинать дизайнера

Слайд 25

Продолжать

или стоит что-то менять?

Продолжать или стоит что-то менять?

Слайд 26

Планы

1. Выстроить свою дизайн-систему 2. Распробовать плагины

Планы 1. Выстроить свою дизайн-систему 2. Распробовать плагины
Имя файла: Figma---жизнь-до-и-после.pptx
Количество просмотров: 52
Количество скачиваний: 0