Привет друзья на связи.
Артём Исламов — это канал Glo Academy. Мы обычно разговариваем разработки сегодня начинаем говорить её в дизайне конкретно сегодня сделаю обзор программы figma которая позволяет создавать дизайн макеты для даже для больших проектов делать — это совместно при этом там можно настраивать компоненты и так далее вы знаете скорее всего, что раньше дизайнеры использовали для макетов для создания интерфейсов и Adobe Photoshop то есть программы которые изначально для этого не предназначена программа которая должна была помогать редактировать растровое изображение типа помазать прыщ на фотографии сделать цветокоррекцию и так далее так вот сейчас выпускается всё больше продуктов которые до этого больше подходит например Adobe X Design который позволяет делать интерактивные прототипы сайтов пример там тоже самый скетч или какие-то другие программы в общем от Photoshop всё больше отходят, но ты мне его продолжают использовать хотя бы работа с графикой так вот сегодня мы с вами изучаем интерфейс программы figma у неё очень много фишек от командной работы до компонентов и разных библиотек программа платная в том случае если у вас в команде несколько человек или у вас очень много проектов. А так по умолчанию на условно бесплатная.
Можно ей пользоваться все фишки и всякие и всякие разные возможности типа можно комбинировать сеску отсюда из макета доставать ввести командную разработку комментировать макеты друг друга и так далее.
Вы можете прочитать на сайте ссылку я размещу в описании так чтобы на — это не отвлекаться и для того чтобы начать пользоваться этой программой. И кстати можно пользоваться прямо в браузере есть и доступная версия. То есть вы можете скачать её на свой компьютер там возможности чуть побольше мы можем зарегистрироваться на сайте figma для этого нужно ввести свой e-mail или можно авторизоваться через Google предпочитаю вариант 2. То есть авторизоваться через Google заходим через Google аккаунт подтверждаем и даём разрешение для фирмы и попадаем в личный кабинет в личном кабинете есть не областей. Рабочая область с макетами которые у вас сейчас находится в работе или которые открывали последними собственно макеты которые находятся в папке Draft. Это все ваши макеты. У вас есть в лизинг — это последние открытые макеты которые вы открывали в удалённых файлов соответственно. Сами понимаете, что можно настраивать свой аккаунт можно создавать новый макет и настраивать точнее прослеживать уведомление. Ну — это как бы мелочи. Давайте перейдем к созданию нового файла. И я покажу. Из каких рабочих областей состоит весь наш экран повторюсь я работаю сейчас в браузере. Если вы скачаете фигу на свой компьютер там ещё появится вкладки. То есть можно будет между переключаться ты там работать в браузере так делать нельзя. Итак поехали слева направо, что здесь находится в левом верхнем углу углу находится панель инструментов, а также основной которые обычно находится вот здесь вот наверху. Если вы пользовались Photoshop то у вас всё основное меню находится наверху здесь же она спрятана в этот маленький гамбургер и собственно можно посмотреть какие команды здесь пользуется рядом пишется сочетание горячих клавиш как — это принято обычный везде панели инструментов я сейчас по ней подробно пройдусь расскажу, что за инструменты здесь в правом верхнем углу можно делиться проектом. То есть через компьютер и запускать прототип всего проекта в правой части находится панель который показывает стиле. То есть настройки цветов размеры шрифтов — это в прототипе можно соединять между собой странице чтобы показывать ваш макет контакте. То есть вы прыгаете на кнопочку она кликается переводится там макет на другую страницу и так далее, но и в разделе кот можно выгружать готовый CSS код либо SAS код для того чтобы загружать его в свой проект напрямую в левой части находится раздел со слоями готовыми пресетами компонентами и так далее. Также здесь есть раздел с открываем страницу и можем создавать новую страницу для чего — это нужно представим, что у меня есть страница один — это не страница сайта — это просто страница отдельная в проекте. Например у меня страница один я здесь создаю какой-нибудь сейчас быстренько новая при помощи инструмента допустим сюда экран iPhone X и здесь будет iPhone X на новой странице я создам другой страницы создам что-нибудь под планшет например допустим. Пускай — это будет. Айпад Мини и получается создаю новую рабочую области могу там между ними переключаться страницы используется довольно-таки редко. Поэтому будем показывать всё на примере одной страницы в этом сразу скрою. И постепенно перейду к инструментам. Что за инструменты здесь есть я уже показал 1 основной инструмент который называется Frame при помощи него создаются рабочие области на создали рабочую область в размером с iPhone X и здесь они эти пресеты сразу есть то есть можно ориентироваться на них либо можно создавать потянув зажав клавишу мыши и потянул сторону создать новый фрейм переименовать его как-то назвать например там главный экран сайта установив его размер потянув за правый нижний угол или другой угол чтобы изменить его размер и фреймы — это грубо говоря. Ну страницы.
