Главная страница / Макеты для верстки

Макеты для верстки

Как просматривать макеты в Figma

В этом видео рассказывается о том:

  • 2:17 Как пользоваться Figma в режиме View only
  • 2:54 Как просматривать свойства (размер, цвет и т.д.) выбранных элементов в панели Inspect
  • 3:26 Как экспортировать картинки и прочие ресурсы

Видео ниже начнется с 2:17, язык — Английский, но можно включить субтитры. Стоит заметить, что сейчас панель Inspect не отображает CSS правила, так как теперь этот функционал платный. Тем не менее свойства по прежнему можно посмотреть в той же панели, также можно воспользоваться плагином Inspect Styles от стороннего разработчика, который призван вернуть утерянный функционал.

Инструкция по использованию Figma для новичков

Каждый макет содержит несколько страниц

Не забывайте переключаться между страницами, как было сказано в видео. На разных страницах вы можете найти различные версии дизайна, а также адаптированные под разные устройства варианты макета.
derevo stranits v dokumente Figma

Дизайн от юзера @shawon3 (Shawon Farabi)

Что внутри

Макет e-commerce площадки. Множество повторяющихся элементов и популярный дизайн. Приобретенный навыки в процессе верстки таких страничек точно пригодятся в будущем.

Дизайн от юзера @sejal_ui_ux (Seju)

Что внутри

Макет административной панели сайта. Графики на канвасе верстать не нужно =), а вот сверстать всевозможные виджеты и экраны будет очень полезно.

Russian
Прокрутить вверх