Коротко
Пошаговые гайды по работе в Morfa: перенос файлов из Figma, горячие клавиши, автолейаут, компоненты и варианты, прототипы, переменные и тёмная тема, экспорт и передача макета разработчику.
Гайды: все страницы
- Гайд
Перенос из Figma
Как перенести макеты из Figma в Morfa: ссылка на файл, токен доступа, выбор страниц и отчёт о переносе. Что переносится как есть, а что иначе.
Читать - Гайд
Горячие клавиши
Все горячие клавиши Morfa по группам, для Mac и для Windows: инструменты, правка, вид, автолейаут, компоненты, текст и доска. Работают на русской раскладке.
Читать - Гайд
Файл .fig
Файл .fig открывают Figma, Lunacy и Pixso. Morfa его напрямую не читает, но переносит макет из Figma по ссылке и токену. Все способы по шагам.
Читать - Гайд
Тёмная тема
Тёмная тема макета в Morfa по шагам: коллекция «Тема» с режимами «Светлая» и «Тёмная», привязка цветов и режим на фрейме. Что получит код.
Читать - Гайд
Кнопка с вариантами
Кнопка с состояниями в Morfa по шагам: автолейаут, компонент (⌥⌘K), свойства «Состояние» и «Вид», hover в прототипе через «Изменить на» и код на React.
Читать - Гайд
Сетки макета
Как добавить сетку на фрейм: колонки, строки и модульная сетка, поля и промежутки, стиль сетки для всех экранов, пиксельная сетка и клавиша ⌃G.
Читать - Гайд
Размеры экранов
Размеры экранов для дизайна в пикселях: iPhone и Android, iPad, макет сайта 1440 px, соцсети, слайды и A4. Все 27 готовых фреймов Morfa и экспорт в 2× и 3×.
Читать - Гайд
Макет сайта
Как сделать макет сайта: фрейм 1440 px, сетка из 12 колонок, блоки на автолейауте, стили, мобильная версия и прототип. Пошагово в Morfa и на шаблоне «Сайт».
Читать - Гайд
Передача разработчику
Как подготовить макет для вёрстки и передать его разработчику в Morfa: автолейаут и стили, нарезка, аннотации, версия и бесплатная роль «Разработчик».
Читать
Для кого эти гайды
Для дизайнеров, которые переходят с Figma, и для тех, кто только начинает. Каждый гайд показывает работу в Morfa, но приёмы те же, что в Figma: автолейаут, компоненты, переменные и прототипы устроены похоже.