Бесплатный открытый урок «Основы Figma для верстальщика»

Figma — это графический онлайн-редактор для дизайнеров интерфейсов и веб-разработчиков. Но как работать с ним и сложно ли это? Разобрались на бесплатном открытом уроке!

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

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

Спикеры:
- Рома Ивойлов — ведущий мероприятия.
- Артур Трифонов — UX дизайнер в CloudTech, наставник в HTML Academy и практикующий фронтенд-разработчик.

Изучайте веб-разработку с помощью профессий:

Тайм-коды:
0:00 Наливаем чай, готовимся к трансляции
3:13 Приветствие, знакомство
6:34 Программа лайва
8:21 Что должен уметь фронтенд-разработчик
11:50 Какие графические редакторы бывают
16:44 Как устроен интерфейс Фигмы
41:10 Как работать с инструментами Фигмы
44:20 Что такое фреймы и группы
47:30 Как экспортировать файлы
52:57 Форматы изображений для веба
59:20 Как экспортировать несколько файлов сразу
1:06:46 Как узнать параметры элементов
1:12:20 Что такое компоненты и лейауты
1:16:24 Прочие инструменты Фигмы
1:20:08 Ответы на вопросы зрителей
1:27:45 Как работать с сетками
1:36:23 Pixel Perfect
1:52:08 Бонусы от Академии
1:54:43 Прощаемся

[jgkdmdevienjjgg]

1:41:52 Для нахождения всех шрифтов на странице можно поставить плагин Font Fascia (ставится через community - plugins). Чтобы оно работало нужно также скопировать страницу себе в drafts

[anzhelikashtylkina]

отличный спикер, очень интересно слушать и много полезного. спасибо!

[yullluy]

Почему десктопная версия, а не браузерная: на больших макетах браузерная съедает неограниченное кол-во памяти компьютера (пока тот не зависнет), а десктопная ограничена в этом.

[sergeyfalkov]

посмотреть все шрифты в текущем макете - плагин Font Fascia. Кто знает, каким плагином можно стянуть все используемые цвета в макете?

[rinatatnashev]

Всем привет. Не успел на лайв. А можно в комментариях или в описании скинуть ссылку на роадмап фронтенд разработчика? Спасибо.

[m_mariya_mari]

паттерны в фотошопе для заполнения фона блока. как сделать заполнение блока таким паттерном?

[ViKiNG_]

Спикер крутой, очень хороший звук у него и хорошо обясняет но, организатор или как правильно назвать, не знаю но вот у него ужастный звук из за чего просто не смог смотреть и выключил!