Заполняем, как на экране, только имя своё вводите. И нажимаем кнопку «Create account».
Получаем такое окно.
Смысл этого текста в том, что надо зайти на свою почту, получить письмо.
Вот так оно у меня выглядит в списке.
Подтвердить свой email адрес.
Открыть его.
Надо нажать кнопку с текстом «Verify email».
Появится новое окно с запросом пароля и кнопкой входа «Log in». Переходим к следующему разделу
Подготовка к работе
Проверяем, чтобы в первой строке был ваш email, который указали при регистрации. Вводим свой пароль, который вы указали при регистрации и нажимаем кнопку «Log in».
Теперь откроется окно с приглашением назвать вашу «команду». Нажимаем по стрелке «Do this later». На самом деле «команда» нам не нужна на обучении.
Появится новое окно.
Появится новое окно. Нас интересует «Design with Figma». На этот пункт нажимаем левой кнопкой мыши. Теперь появится окно с выбором шаблона.
Необходимо выбрать «Desktop».
Откроется рабочее пространство сервиса Figma.
В правом нижнем углу в окне предлагаю пройти быстрый курс обучения по использованию Figma на английском языке. Нажимаем кнопку с отказом «No thanks». Получим окно программы.
Для обучения надо удалить окно. Для этого щёлкаем мышкой в левой части программы по названию Desktop-1 и нажимаем на клавиатуре клавишу «Delete» (или «Del»). Получим чистое окно.
Как вы видите в заголовке Team project /Untitled. То есть командная работа. Нам нужна другая работа. Персональная. Для этого мы нажимаем в правый верхний угол на значок и в выпадающем списке выбираем этот пункт «Back to files».
Получим вот такое окно.
Нажимаем левой кнопкой мыши на строку «Drafts» в левой колонке.
Эти шаблоны не трогаем. Возможно, если вы будете позже использовать Фигму, они очень пригодятся для каких-либо работ.
Эти шаблоны не трогаем. Возможно, если вы будете позже использовать Фигму, они очень пригодятся для каких-либо работ.
Основы работы. Часть 1
Теперь закроем браузер. Яндекс, Опера, Mozilla Firefox или Google Chrome. Вот в чём работали, то и закрываем. И заново открываем. Набираем https://figma.com и нажать «Enter» на клавиатуре (если вы пользуетесь печатной версией этой книги, то набирайте такой адрес https://figma.com). Получаем окно такого типа.
Ничего здесь не удаляем.
Выбираем Drafts (проекты в переводе) и нажимаем «+» возле строки. Открывается новый проект. Вот в этом проекте мы будем делать свои первые шаги в познании возможностей данного сервиса.
Выбираем строку по стрелке и нажимаем на неё левой кнопкой мыши
Некоторое время ждём и получаем вот такое окно.
Закрываем окно, нажав на крестик в правом верхнем углу (по стрелке указано).
Вот теперь в заголовке окна стоит слово «Drafts». Это основное окно, в котором мы будем всё делать.
Итак, вверху чёрная полоса со значками это основное меню, которое позволяет добавлять элементы в проект. Элементами могут быть прямоугольники, стрелки, изображение и текст и так далее. Слева вертикальная колонка здесь будут отображаться элементы списком, а по центру они будут нарисованы. Справа вертикальная колонка будет показывать свойства каждого элемента. Посередине рабочая область, где всё будем делать.
Элемент «Frame»
Представляем, что центральная часть это наш стол, на котором мы будем всё делать. Но вы же не будете рисовать на столе, вам нужен лист бумаги. Вот теперь на наш стол кладём лист бумаги. То есть добавляем Frame (в переводе рамка). Горячая клавиша для выбора фрейма <F>.
Теперь передвигаем мышку в центральное окно. Курсор будет в виде значка «+». Зажимаем левую кнопку мыши и тянем вправо и вниз. Рисуем фрейм. Вот так это будет выглядеть во время рисования. На размеры пока не обращаем внимания.