Урок 10. Вирівнювання. Нові примітиви. Експорт

Модуль 2. Основи Figma.
Безкоштовний ввідний курс по UX/UI дизайну для початківця

Щоб почати навчання, проходити тести і відслідкувати прогрес, треба записать на курс. Це безкоштовно.

У черговій частині по основами Figma (уже четверта) навчимося вирівнювати об'єкти та розподіляти їх у просторі. Вивчимо нові фігури: еліпс, полігон, зірку. Вони не такі прості, як здаються на перший погляд.

Навчимось експортувати фрейми у графічні файли. Це дозволить надалі поділитися ними із замовником або розробниками. Оглянемо популярні формати зображень і зрозуміємо, у яких випадках їх використовувати.

Вирівнювання одного об'єкта відносно іншого

Вирівнювання можна виконувати й вручну, але щоб підвищити швидкість роботи Figma надає спеціальні інструменти. Щоб вирівняти об'єкти, потрібно:

  • Виділити обидва прошарки з об'єктами. Зверніть увагу, що менший об'єкт буде вирівнюватись відносно більшого у тому випадку, якщо виконується вирівнювання по краю (лівому, правому, верхньому, нижньому). Якщо робити вирівнювання по центру (горизонтально або вертикально, обидва об'єкти можуть зміститись);
  • На правій панелі клацнути по одному з типів вирівнювання. Вони знаходяться зверху панелі властивостей відразу під вкладкою Design. Розглянемо кожен вид вирівнювання та гарячі клавіші:

    • Align Left – вирівняти з лівого краю більшого об'єкта. Option + A в MacOS. Alt + A у Windows;
    • Align Horizontal Centers – вирівняти горизонтально по центру більшого об'єкта. Option + H у macOs. Alt + H у Windows;
    • Align Right – вирівняти праворуч відносно більшого об'єкта. Option + D у macOs. Alt + D у Windows;
    • Align Top – вирівняти по верхньому краю більшого об'єкта. Option + W в MacOS. Alt + W у Windows;
    • Align Vertical Centers – вирівняти по верхньому краю більшого об'єкта. Option + W в MacOS. Alt + W у Windows;
    • Align Bottom – вирівняти по нижньому краю більшого об'єкта. Option + S у macOs. Alt + S у Windows.
  • Зверніть увагу, що гарячі клавіші для вирівнювання виставлені в такому ж порядку, як і кнопки-стрілочки. Ще одна аналогія для геймерів – гарячі клавіші вирівнювання аналогічні до переміщення в будь-якому 3D-шутері, наприклад Counter-Strike (AWSD).
  • Одразу після клацання об'єкти будуть миттєво переставлені в нове місце, координати зміняться. Ви можете продовжувати натискати на інші типи вирівнювання, спостерігаючи, як оновлюэться положення.

Вирівнювання кількох об'єктів відносно іншого

Тут послідовність дій така сама, як і в попередньому випадку, але вибрати потрібно більше двох об'єктів. Вирівнювання буде відбуватися відносно найбільшого.


Зверніть увагу, що об'єкти, які вирівнюються, змінюють своє положення один відносно іншого (оскільки вони різного розміру). Щоб уникнути цього, необхідно попередньо згрупувати об'єкти, що показано в наступному розділі.

Вирівнювання групи відносно об'єкта зі збереженням позиції

Звучить суперечливо, але після перегляду інструкції нижче все стане на свої місця.


Отже, попереднє групування дозволяє зберегти відносні позиції прошарків, що вирівнюються, що іноді стає в нагоді. В іншому випадку без групування при застосуванні кількох вирівнювань усі об'єкти можуть перемішатися в купу, що і сталося на початку відео.

Вирівнювання відокремлених об'єктів

Якщо виділені об'єкти розташовані окремо (без великого об'єкта, який перекриває за розмірами інші, як у попередніх прикладах), то вирівнювання відбуватиметься щодо меж усіх виділених об'єктів. На практиці це виглядає так (після кожного вирівнювання застосовується скасування останньої дії Cmd+Z або Ctrl+Z):

Вирівнювання одного об'єкта всередині фрейму

Якщо виділити лише один об'єкт усередині кадру, він вирівнюватиметься за межами останнього:


Як бачите, залежно від контексту інструмент вирівнювання працює по-різному. Переконайтеся, що ви розумієте, як буде вирівняно об'єкти в залежності від ситуації. Привчайтесь до гарячих клавіш.

Рівномірний розподіл

Ще один дуже корисний інструмент для розміщення об'єктів. Уявіть собі ситуацію: у вас є кілька прямокутників (кнопок), але відстані між ними є різними, а вам потрібні однакові. Звичайно, можна самому все розставити, але інструмент Tidy Up зробить це за вас. Для цього вибираємо усі об'єкти та натискаємо Ctrl+Alt+T у macOs або Ctrl+Alt+Shift+T у Windows. Клацаємо по полю, що з'явилося, і кнопками-стрілками (вгору і вниз) підбираємо відповідну відстань між елементами або вписуємо значення і натискаємо Enter.


Є ще два схожі інструменти – Distribute Vertical Spacing (Ctrl+Alt+V у macOs та Ctrl+Alt+Shift+V у Windows) та Distribute Horizontal Spacing (Ctrl+Alt+H у macOs та Ctrl + Alt + Shift + H у Windows). Вони мають дві відмінності:

  1. Вони розподіляють виділені об'єкти всередині своїх кордонів, тобто після перерозподілу об'єктів, вони займатимуть той самий простір, що й до застосування операції. Інструменту Tidy Up навпаки не враховує те, скільки в результаті простору займуть об'єкти на нових позиціях;
  2. Вам потрібно вказати, у якому напрямку розподіляти об'єкти (горизонтально або вертикально). Tidy Up робить це автоматично.

На практиці це виглядає так:


Не забуваємо, що розподіл можна застосовувати разом з вирівнюванням. Це дозволяє швидко впорядкувати велику кількість неточно розставлених об'єктів.

Нові примітиви

У панелі інструментів у нас залишилося ще кілька незнайомих фігур. Давайте розберемося, як ними користуватись, якщо ви цього ще не зробили. Упевнена, ви й не підозрювали, що еліпс має стільки можливостей.

Еліпс

Створити еліпс просто, досить скористатися гарячою клавішею O (або вибрати відповідний пункт у меню інструментів) і далі все зробити так само, як з прямокутником. Далі починається найцікавіше:

  • Якщо навести курсор на щойно створене коло, то можна помітити, що праворуч з'явився білий кружечок, за який можна потягнути. Якщо це зробити, то коло перетвориться на дугу;
  • Одразу після перетворення на дугу з'явиться ще три кружечка: Start – початкова точка, Sweep – розмах, визначає довжину дуги, Ratio – співвідношення внутрішнього радіусу дуги до зовнішнього, що визначає товщину дуги.
  • Ці параметри доступні і в панелі властивостей, там можна задати точні значення з клавіатури;
  • Корисним може бути радіус заокруглення, який дозволить пом'якшити торці. Знаходиться у тому ж місці правої панелі, що й у випадку з прямокутником.

Полігон

Дозволяє створювати багатокутники від трикутника до полігону з необмеженою кількістю вершин (найчастіше до 10). Я покажу, як можна з його допомогою зробити фігуру з відносно розмитими краями. Такі штуки часто використовують для фону у дизайні. Їх ще називають blobГарячої клавіші немає, тому доведеться скористатися меню інструментів. Як і у випадку з еліпсом після створення та наведення з'явиться два кружечки, що відповідають за:

  • Count – кількість вершин;
  • Radius – радіус заокруглення вершин.

Зірка

Ця фігура також не має гарячої клавіші. Межі її застосування досить обмежені, але не тривіальні. Фігуру як на відео можна використати як фон для бейджу зі знижкою. Познайомимося з кружечками, що відповідають за параметрами:

  • Count – кількість променів зірки;
  • Ratio – співвідношення між заглибленнями та виступами променя. Чим менше значення, тим довші промені;
  • Radius – радіус заокруглення.

Експорт дизайну

У роботі вам часто потрібно перетворити дизайн всередині Figma у зображення, яке можна переслати у вигляді файлу. Існують різні формати для різних цілей. Ось кілька прикладів, коли це знадобиться:

  • Переслати кілька екранів у файлах у форматі Png без втрати якості замовнику електронною поштою або у месенджерах;
  • Передати іконки у векторному форматі Svg розробнику;
  • Надати фотографії товарів у файлах формату Jpg.

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

Як помітити прошарок для експорту та зберегти його у файл

  1. Вибираємо фрейм, групу чи прошарок для експорту;
  2. На панелі властивостей праворуч натискаємо + (плюсик) навпроти напису Export;
  3. З'являться опції для експорту;
  4. Найправіше меню, вказує, у якому форматі буде збережений файл. Переконайтеся, що вибрано PNG – це формат без втрати якості;
  5. Натискаємо кнопку Export назва вибраного прошарку, яка знаходиться під налаштуваннями. Напис на кнопці буде відповідати назві вибраного прошарку;
  6. З'явиться вікно, у якому вказуємо, де і з якою назвою зберегти графічний файл. За замовчуванням назва береться з назви вибраного прошарку, але це можна змінити. Не думайте змінювати формат файлу на цьому етапі (три символи після точки) – вже пізно. Якщо потрібно, натисніть Cancel і змініть формат за допомогою правого випадаючого списку;
  7. Натискаємо кнопку Save. Вікно вибору файлу зникне. Готово! Зображення збережено у зазначеному місці і файлі. Тепер ви можете надіслати його клієнту на затвердження або мені, як домашнє завдання

Формат Png

PNG (Portable Network Graphics) – растровий формат без втрати якості. Дозволяє точно відобразити кожен піксель вихідного зображення. Іншими словами, одержувач побачить його без спотворень. Завжди експортуйте дизайн у форматі Png для клієнта (якщо з якоїсь причини він не може подивитися його прямо у Figma) та у всіх інших випадках.

Формат Jpg

Jpg (Jpeg, Joint Photographic Experts Group) – растровий формат для фотографій із втратою якості. Непомітно спотворює вихідне зображення використовуючи особливості людського сприйняття. Дозволяє значно заощаджувати на розмірі файлу. Ніколи не використовуйте Jpg для експорту дизайну.

Формат Svg

Svg (Scalable Vector Graphics) – векторний графічний формат. Підтримує як статичні так і анімовані зображення. Figma поки що експортує лише статично, хоч і підтримує анімації. Займає дуже мало місця. Завжди використовуйте для експорту іконок та ілюстрацій з невеликою кількістю кольорів (інфографіка, схеми, таблиці з нетривіальною версткою). Зверніть увагу, що вступна картинка у кожному уроці була експортована саме у цьому форматі. Щоб переконатися у цьому, достатньо збільшити масштаб сторінки – втрати якості не відбудеться і ви не побачите піксельної драбинки.

Формат Pdf

Pdf (Portable Document Format) – формат електронних документів. Дозволяє зберігати дизайн у векторній формі, але це не його пряме призначення. Часто використовується для створення звітів та презентацій для інвесторів. На жаль, Figma генерує дуже важкі файли у цьому форматі. Ніколи не використовуйте Pdf для експорту дизайну.

У кожного формату є свої особливості та унікальні можливості. Наприклад, Png дозволяє вказувати ділянки з прозорістю, а Jpg так не вміє. Але з цим я вас познайомлю поступово в наступних уроках, поки викладеного матеріалу достатньо.

Домашнє завдання

Відтепер цей курс розрахований на самостійне вивчення та виконання домашніх завдань. Розумію, що деякі завдання можуть бути непростими для вас.

Для додаткової підтримки скористайтесь чатом у телеграмі. Тут ви зможете поставити запитання, що стосуються уроків або переглянути приклади правильного виконання від інших учнів.

Чат недоступний для громадян росії.

  1. Створіть новий файл у Figma. Для кожного завдання зробіть окрему сторінку. Ось перше завдання. Повторіть малюнок нижче, відмалювавши усі фігурки разом з текстовими назвами в окремих фреймах, використовуючи відомі вам інструменти. Далі експортуйте кожну фігуру з назвою, фрейми однакових розмірів в окремі png-файли. Потім імпортуйте назад у Figma щойно створені png-файли. Розташуйте їх в окремому фреймі. У результаті у вас має бути на сторінці три фрейми зверху вниз: 1) з зображенням самого завдання (референс); 2) із відмальованими фігурками (з назвами під кожною фігурою); 3) з відмальованими фігурками у растровому форматі, які ви імпортували. Усі три фрейми мають бути максимально схожими.

    Фігури для першого завдання з 4-ої частини уроків з основ Figma

  2. Друге завдання. Оберіть будь-який об'єкт з попереднього завдання та відмалюйте, як виглядає в цей момент панель властивостей Figma (вона знаходиться праворуч) в окремому фреймі. Потім змініть кольори так, щоб вони відповідати темній темі інтерфейсу. Приклад темної теми інтерфейсу дивіться нижче.

    Приклад темного інтерфейсу

  3. Третє завдання. Зайдіть на Behance або Awwwards (гуглим, якщо забули, що це) і знайдіть два дизайни веб-сайту. Намалюйте новий дизайн, використовуючи структуру з одного сайту, а кольори та ілюстрації – з іншого. Це дуже складне завдання, враховуючи, що ви нічого не знаєте про основи дизайну, але хоча б спробуйте.

На перевірку надсилайте посилання на файл із правами на редагування. Як дати відповідні права читайте у попередньому уроці. Не забуваймо, що кожне завдання має бути виконане на окремій сторінці. Уважно читайте кожен пункт, там багато нюансів. Використовуйте нові прийоми з цього уроку. Не забувайте про вирівнювання, яке стане у нагоді.

Висновки

Ви продовжуєте рухатися вперед у освоєнні Figma. Ще кілька уроків і ми перейдемо до вивчення основ дизайну. Але на той момент ви вже добре володітимете одним з найкращих інструментів і це буде не просто теорія у вакуумі, а практичні завдання.

Постарайтеся виконати домашні завдання з цього уроку, це дасть вам багато досвіду. А це найголовніше у нашій справі.

Підписуйтесь на мене в Instagram @frusia.pro та будьте у курсі анонсів нових уроків, дивіться перевірки домашніх завдань у сторіс, ставте запитання, а також на вас чекає безліч корисних постів про дизайн.

Пройти тест

Щоб урок зарахувався, як пройдений, вам потрібно правильно відповісти на 80% питань з тесту. Щоб пройти тест і перевірити свої знання, вам треба увійти в систему та записатись на курс або зареєструватись, якщо ви ще цього не зробили.

Пройти тест

Залиште коментар

Поставте повзунок у фіолетову зону

Коментарі

скажена черепахаUkraine flag підтримує ЗСУ 29 лютого 2024 17:01  
привіт! Ось моя домашка.
https://www.figma.com/file/nvSYfkq63m2kn0QDaZHriK/%D0%9D%D0%B0%D0%B2%D1%87%D0%B0%D0%BD%D0%BD%D1%8F-%D1%83-Frusia.Pro?type=design&node-id=231%3A2&mode=design&t=XyXxcM683DJRWt60-1

Коментар frusia.pro:

Завдання 1. Привіт. Ви все правильно зробили, але бачу що ваші фігури сплюснуті. У першому фреймі по висоті, у другому по ширині. Можливо ви випадково порушили пропорції. Нагадую, що затиск кнопки shift дозволяє нам малювати пропорційно рівні фігури. А комбінація кнопок cmd (або ctrl) + z – повертатись на дію назад, якщо наприклад помилково щось зробили.

Завдання 2. Справились добре, але вказала на деякі неточності. Все ж таки завдання про точну перемальовку і буде класно, якщо ми досягнемо в цьому успіху. Дивіться скріншот.

Сірі кольори тексту та розділювачів мають відповідати тим, що у фігмі. Можна взяти піпеткою, ми вже вміємо це робити. Кнопка підказки не має бути сплюснутою + вона іншого візуального вигляду, перегляньте ще раз. Також відстань від кольорів до розділювача внизу має бути такою ж, як зверху .

Завдання 3. Все класно, але для повноти картинки, буде добре якщо ви покажете все ж таки якийсь візуал на головному банері та поправите на ньому ж стрілку зліва (щоб вона не була розтягнутою, а відповідала тій, що з правого боку).

ВарвараUkraine flag підтримує ЗСУ 24 грудня 2022 23:54  
Дякую за фідбек!) Ось, доповнила роботу
https://www.figma.com/file/Dy1fUf6L4DZSfVxQCFVSvm/UX%2FUI-Frusia-2?node-id=1%3A3&t=izBc4C4aFVpflnfl-1

Коментар frusia.pro:

Тепер чудово, переходьте до наступного уроку!

ВарвараUkraine flag підтримує ЗСУ 21 грудня 2022 19:25  
Добрий вечір) Дякую, за такі цікаві завдання!)
https://www.figma.com/file/Dy1fUf6L4DZSfVxQCFVSvm/UX%2FUI-Frusia-2?node-id=1%3A3&t=cACoeWYB5GyJljgs-1

Коментар frusia.pro:

Завдання 1. Перемалювати фігури. Ви все ідеально відмалювали, молодець!

Завдання 2. Світла та темна тема. Тут також все дуже добре вийшло відтворити.

Завдання 3. Комбінування кольорів. Вам гарно вдалось передати стиль іншого макету, але для гарного завершення сторінки було б непогано домалювати футер.

Чекатиму на доповнення по третьому завданню.

Ольга Пр.21 листопада 2022 14:08  
Доброго дня)

https://www.figma.com/file/gtX3SaprwcDQCYeByqjoHJ/%D1%83%D1%80%D0%BE%D0%BA-7?node-id=0%3A1&t=fY6DHw92y0N6BRls-1

Через великий наплив охочих проходити курс я роблю перевірку домашніх завдань платною. 30$ (по поточному курсу), 10% перекажу ЗСУ. За один донат перевірю домашки до усіх уроків.

За реквізитами пишіть в дірект Інстаграму @frusia.pro

Yuliya LepenkoUkraine flag підтримує ЗСУ 22 вересня 2022 22:59  
Вітаю:)
Дякую за зворотній зв'язок. Виправила.


https://www.figma.com/file/I08T3W8u2GI3NE21Xv5DTd/HW7?node-id=5%3A4

Коментар frusia.pro:

Привіт! Тепер з відступами все супер! Рухайтесь до 8-ого уроку

Yuliya LepenkoUkraine flag підтримує ЗСУ 21 вересня 2022 16:14  
Добрий день:)


https://www.figma.com/file/I08T3W8u2GI3NE21Xv5DTd/HW7?node-id=5%3A4

Коментар frusia.pro:

Добрий день!

Завдання 1. Перемалювати фігури та зробити їх експорт. Ви все зробили ідеально у цьому завданні: фігури максимально схожі, експорт та імпорт зроблено правильно.

Завдання 2. Намалювати темну тему для панелі властивостей Figma. Тут маю лише зауваження до вирівнювання по лівій стороні:
https://drive.google.com/uc?id=1XpiMUmlzDidIq_CqmAt2lMK29M5h_dvF

Завдання 3. Намалювати сайт на основі двох референсів. Ви підібрали чудові референси і результат класний вийшов, молодець! Маю кілька зауважень щодо відступів, треба щоб вони були однаковими, продемонструвала на відео:
https://drive.google.com/uc?id=1PsplbmsOWr_SUuYHPhoLBm5dvDGULWqX

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

Вікторія ГрищенкоUkraine flag підтримує ЗСУ 10 серпня 2022 12:37  
Добрий день! Виправила)
https://www.figma.com/file/GHmI5uT5HpETVpEaMb2s6k/%D0%A3%D1%80%D0%BE%D0%BA-7?node-id=5%3A76

Коментар frusia.pro:

Добрий день! Бачу менший шеврон і однакові відступи. Тепер все супер! Переходьте до наступного уроку

Вікторія ГрищенкоUkraine flag підтримує ЗСУ 9 серпня 2022 12:53  
Доброго дня!
https://www.figma.com/file/GHmI5uT5HpETVpEaMb2s6k/%D0%A3%D1%80%D0%BE%D0%BA-7?node-id=0%3A1

Коментар frusia.pro:

Добрий день!

Завдання 1. Перемалювати фігури та зробити їх експорт. Все зроблено правильно. Бачу гарно відмальовані фігури та імпортовані назад зображення, дуже добре.

Завдання 2. Намалювати темну тему для панелі властивостей Figma. Тут також все дуже добре, але маю декілька дрібних зауважень:

  • Іконка шеврона (стрілочка вниз) навпроти правої іконки вирівнювання зверху та праворуч від написів "Frame", "Left", "Top", "Pass through" має бути меншою, а товщина ліній більшою;
  • переконайтесь, що у вас відступи ліворуч та праворуч однакові. Наприклад, у вас написи "Frame", "Auto layout", "Constraints" мають відступ зліва 15, 14 та 16 пікселів відповідно. Використайте прийом «точне позиціонування» з 5-ого уроку, щоб точно виставити відстані.

Завдання 3. Намалювати сайт на основі двох референсів. Це завдання виконано ідеально, молодець!

Ви дуже добре розібрались з новим матеріалом, але буду чекати на виправлення до другого завдання

БогданаUkraine flag підтримує ЗСУ 24 липня 2022 08:06  
Привіт)

Дякую за перевірку, все виправила))
В останньому завданні скажу чесно, що контури країн я не малювала, а просто знайшла SVG зображення у Гуглі ;)

https://www.figma.com/file/R2GcgT9WcgRm1jolF5lBA9/%D0%B4%D0%B7?node-id=213%3A24

Мирного дня!

Коментар frusia.pro:

Привіт! По другому завданню тепер все супер, вийшло дуже акуратно По третьому завданню також все добре, бачу, що ви зробили ширину фрейму 1280 пікселів.

У вас чудово виходить, переходьте до наступного уроку

БогданаUkraine flag підтримує ЗСУ 20 липня 2022 07:49  
Вітаю!
Дуже цікавий і насичений урок, особливо сподобалось 3 завдання))
https://www.figma.com/file/R2GcgT9WcgRm1jolF5lBA9/%D0%B4%D0%B7?node-id=213%3A24
Старалась, щоб у домашці було все зрозуміло, приклала скріни та зображення прикладів. Та на всякий випадок трохи розпишу про останнє завдання.

Для структури взяла https://www.behance.net/gallery/81090977/Food-delivery?tracking_source=search_projects%7Cweb%20site%20design

Кольори та ілюстрації https://www.behance.net/gallery/148062829/Landing-Page-For-Donuts-Shop?tracking_source=search_projects%7Cweb%20site%20design

Буду вдячна за перевірку! Мирного дня ;)

Коментар frusia.pro:

Добрий вечір! Дуже рада, що вам сподобалось

Завдання 1. Перемалювати фігури та зробити їх експорт. Все правильно, молодець!

Завдання 2. Намалювати темну тему для панелі властивостей Figma. В цілому все супер, але є пару маленьких зауважень:

  • З іконками видимості (у вигляді ока) у темній темі щось пішло не так і тепер це просто еліпси (у світлій темі все ок);
  • позиції деяких елементів мають дрібну частину. Наприклад, напис "Design" та"Layout grid" X=18.2 пікселі. А має бути 18 пікселів (тільки ціла частина).

Завдання 3. Намалювати сайт на основі двох референсів. Тут все супер, гарно попрацювали. Уявлення не маю, як ви відмалювали контури країн, але вийшло дуже добре. В ідеалі було б підігнати ширину основного фрейму до 1280 пікселів.

Чекаю на виправлення

Yana UsachovaUkraine flag підтримує ЗСУ 14 липня 2022 14:05  
Доброго дня, дякую, вибачте, що не зрозуміла та писали купу повідомлень
https://www.figma.com/file/Duv5v3CDB7bQKfwLY0OkF4/Untitled?node-id=4%3A3
намагалась виправити усе

Коментар frusia.pro:

Добрий вечір! Не переймайтесь, нічого страшного

Тепер все супер, молодець! Переходьте до наступного уроку

Yana UsachovaUkraine flag підтримує ЗСУ 13 липня 2022 13:38  
Доброго дня, дякую за зауваження, щось не бачу свої повідомлення (
https://www.figma.com/file/Duv5v3CDB7bQKfwLY0OkF4/Untitled?node-id=4%3A3

Коментар frusia.pro:

Привіт! Відповіла у попередньому вашому коментарі Якщо не бачите свого коментаря, то це означає, що я його ще не перевірила. Нові коментарі не показуються, так як боти залишають багато спаму.

Марія СUkraine flag підтримує ЗСУ 12 липня 2022 22:28  
Доброго дня, надсилаю з правками:
1. додала підписи;
2. змінила розміщення на 16 пкс;
3. вирівняла напис, заокруглила все, що помітила))))
https://www.figma.com/file/cqMcsZ2JECIvr3s1tItb9t/7-%D1%83%D1%80%D0%BE%D0%BA?node-id=5%3A120

Коментар frusia.pro:

Привіт! Так, тепер по другому завданню також не маю зауважень. Переходьте до наступного уроку

Yana UsachovaUkraine flag підтримує ЗСУ 12 липня 2022 11:24  
Доброго дня, чекаю на зворотній зв'язок, сподіваюсь я вірно зрозуміла, вибачаюсь, якщо я знов не те зробила, дякую за терпіння та зауваження
https://www.figma.com/file/Duv5v3CDB7bQKfwLY0OkF4/Untitled?node-id=4%3A3

Коментар frusia.pro:

Привіт!

Ви майже уловили суть! Дивіться, тепер у нас є структура з другого сайту, а тексти з першого. Залишилось лише змінити кольори так, щоб було, як на першому сайті (школа англійської мови). Для цього змінюємо фон на білий і змінюємо колір текстів на чорний.

Чекаю на фінальні виправлення

Марія СUkraine flag підтримує ЗСУ 11 липня 2022 22:27  
Виправила координати та розміщення елементів зверху тепер по центру
https://www.figma.com/file/cqMcsZ2JECIvr3s1tItb9t/7-%D1%83%D1%80%D0%BE%D0%BA?node-id=9%3A712

Коментар frusia.pro:

Привіт! Так, тепер все супер, третє завдання зараховується, залишилось друге

Yana UsachovaUkraine flag підтримує ЗСУ 11 липня 2022 15:02  
Доброго дня, дякую за зауваження
https://www.figma.com/file/Duv5v3CDB7bQKfwLY0OkF4/Untitled?node-id=4%3A3
намашалася виконати, але зіткнулася з проблемою, що деякі шріфти платні, не змогла здобити досконале ((

Коментар frusia.pro:

Добрий день! Тепер по першому завданню все супер. Залишилось добити останнє. Ви вже додали ще один сайт, як референс. Тепер вам треба взяти структуру з цього референсу (школа гри на барабанах) і застосувати її до вашої школи англійської (перший референс). Структура означає просто, як розміщені елементи і скільки вони займають місця. Наприклад, навігація буде зліва зверху, кнопка записатись стане набагато більшою, на фото праворуч не буде обрізаний фон і так далі.

Знаю, що вам складно, але третє завдання треба добити. Якщо будуть складнощі, то я вам запишу відео. Чекаю на дороблене останнє завдання

Yana UsachovaUkraine flag підтримує ЗСУ 10 липня 2022 17:06  
Добрий день, дякую за зауваження, так сама звернула увагу, що з відступами біда прям якась
https://www.figma.com/file/Duv5v3CDB7bQKfwLY0OkF4/Untitled?node-id=4%3A3
намагалась все врахувати. Дякую за можливість навчатися у вас)

Коментар frusia.pro:

Добрий день! Будь ласка

Завдання 1. Спробуйте також повторити кольори фігур, щоб були такі самі, як на малюнку у завданні. Якщо є якісь труднощі з цим, то напишіть, будем розбиратись.

Завдання 2. Стало набагато краще, молодець! Зараховується.

Завдання 3. Ви додали один референс, все добре. Але у завданні треба було взяти два сайти та з першого сайту взяти структуру, а з іншого кольори, шрифти (візуальну частину). Подивіться у коментарях, як робили інші учні. Якщо щось незрозуміло, то задавайте питання.

Чекаю на виправлення

Марія СUkraine flag підтримує ЗСУ 9 липня 2022 23:16  
Добрий день, дякую за урок)
https://www.figma.com/file/cqMcsZ2JECIvr3s1tItb9t/7-%D1%83%D1%80%D0%BE%D0%BA?node-id=9%3A712

Коментар frusia.pro:

Добрий день!

Завдання 1. Перемалювати фігури та зробити їх експорт. Все добре, вийшло дуже схоже. Але треба ще додати написи під кожною фігурою.

Завдання 2. Намалювати темну тему властивостей Figma. Гарна робота, максимально схоже вийшло, кольори підібрані також вдало. Єдине, що помітила, це напис "Constraints" знаходиться на відстані 15.28 пікселя від лівого краю, а має бути 16. По решті все ідеально.

Завдання 3. Намалювати сайт на основі двох референсів. Ви обрали мобільний додаток для прослуховування музики. Вийшло дуже цікаво, молодець! Декілька зауважень, які можуть ще покращити макет:

  • Деякі координати елементів мають дробну частину. Наприклад, значення "Y" для тексту "04" становить 711.83 пікселі, а має бути ціле число 712;
  • деякі елементи мають різні відступи ліворуч та праворуч. Наприклад, з самого верху у вас йде іконка, щоб повернутись назад, напис "Profile" та пошук. Зліва відступ 63 пікселі, а праворуч 53. Має бути однаково.

Чекаю на виправлення

Yana UsachovaUkraine flag підтримує ЗСУ 8 липня 2022 10:58  
Добрий день, не перестаю пишатися вами. Велике дякую за можливість вчитися у вас. Намагалася зробити з першого разу звичайно, але чекаю на зауваження бо думаю помилки є ((
https://www.figma.com/file/Duv5v3CDB7bQKfwLY0OkF4/Untitled?node-id=4%3A3

Коментар frusia.pro:

Добрий вечір! Будь ласка Помилки дійсно є, але нічого страшного, ви ж навчаєтесь, давайте спробуємо їх виправити.

Завдання 1. Перемалювати фігури й зробити експорт зображень. За формою дуже схоже, крім зірки та полігона у верхньому правому кутку. Схоже, що вам дуже не вистачає оригінального зображення з фігурами, щоб більш точно їх повторити. Щоб вставити у Figma зображення фігур, натисніть правою кнопкою мишки на зображенні і виберіть пункт «Копіювати зображення» (в залежності від вашого браузера і мови цей пункт може писатись по різному, наприклад, "Copy image"). Далі перейдіть у Figma, натисніть правою кнопкою миші на холсті і виберіть пункт "Paste here". Тепер зможете точно підібрати форму і кольори за допомогою інструменту піпетка. Можете також переглянути 5-й урок, щоб подивитись, як імпортувати зображення і зчитувати кольори. Щоб більш точно повторити форму зірки передивіться відео у цьому уроці.

Завдання 2. Намалювати темну тему властивостей панелі Figma. В цілому дуже добре, але є пару деталей, які треба виправити:

  • Праворуч від іконок вирівнювання зверху зовсім немає відступу, а має бути такий самий, як ліворуч;
  • відступи зліва у різних елементів відрізняються, десь 12 пікселів, десь 15. Має бути однаково;
  • галочка на чекбоксі навпроти напису "Fix position when scrolling" повернута не в ту сторону;
  • є орфографічні помилки, наприклад, у "Fix position when scrolling". У вас у слові "position" пропущена літера "i";
  • в самому низу є зайві лінії над написами "Stroke", "Effects", "Export".

Завдання 3. Намалювати сайт на основі двох референсів. Сайт бачу, але хотілося б побачити й референси, які ви використовували, як основу.

Чекаю на виправлення і референси до останнього завдання

АннаUkraine flag підтримує ЗСУ 30 червня 2022 23:39  
https://www.figma.com/file/nOtIazGmJrTAalJFU1GlFf/%D0%A3%D1%80%D0%BE%D0%BA-7?node-id=18%3A497

Дуже дякую за ваші відповіді, вони дійсно допомогають у подальшому.

Я зіткнулась з такими проблемами як (постараюсь донести):
1. Вирівнювання
Option дозволяє подивитись відстань до об’єкта, аде якщо цей об’єкт в рамці умовній, то OPTION показує відстань до цієї прихованої рамки.

З вирівнюванням в мене щось не дуже вийшло. Я не розумію від чого відштовхуватись.

2. Frame

Також, чи необхідно фрейм робити тільки на початку, як червоний холст. Чи в подальшому також від може накладатись один на одного?

Бачила у дівчат, що Frame це навіть іконка. (Теж не зрозуміла досконало де застосовувати цей інструмент)

3. Лінійка

Якщо вставити зображення і поруч на Frame почати копіювати цю роботу, то лінійка не дозволяє визначити відстань, так щоб повністю відтворити рівно роботу.

І на останок хочу сказати, що дивлячись на роботи інших дівчат, це дозволяло мені в роботі прискоритись.
Дякую всім!
маленькими кроками до перемоги

Коментар frusia.pro:

Привіт! Будь ласка

Завдання 1. Перемалювати фігури. Все правильно.

Завдання 2. Намалювати темну тему для панелі властивостей Figma. Дуже добре, вдалі кольори підібрали. Тільки не розумію, чому ви вибрали рожевий замість синього (можливо ви інвертували кольори, але не впевнена).

Завдання 3. Намалювати сайт на основі двох референсів. Цікава комбінація вийшла. Маю декілька порад, як можна ще покращити макет (не обов'язково робити ці правки):

  • Додайте скруглення кутів для білих блоків як на першому референсі;
  • іконка Pet Care трохи вибивається так як вона залита, а решта іконок намальована контурами (оутлайнами);
  • зверніть увагу, що контурні іконки мають різну товщину ліній. Намагайтесь підбирати з однаковою товщиною.

В цілому все добре, рухайтесь до наступного уроку

З приводу проблем, з якими ви зіштовхнулись:

Вирівнювання. Спробуйте разом з клавішею Option також затиснути Command, це дозволить показати відстань до об'єкта, який знаходиться всередині фрейму. Також можна клавішами перемістити об'єкт впритул до іншого об'єкта, відносно якого ви хочете виставити потрібну відстань. А далі за допомогою клавіш з стрілочками і зажатого Shift перемістити об'єкт на бажану відстань.

Робота з фреймами. Так, фрейм обов'язково треба використовувати для початкового холста, а також інших елементів (іконок, кнопок, полів і так далі). Фрейми — це такі самі групи, але в них є додаткові можливості по налаштуванню поведінки при зміні розміру (обмежувачі). В повсякденній роботі я особисто частіше використовую фрейми ніж групи.

Робота з лінійкою. Можете пояснити на прикладі? Тому що я не зрозуміла цей момент.

Ірина С.Ukraine flag підтримує ЗСУ 29 червня 2022 00:39  
Добрий вечір! Спробуйте цей файл відкрити)
https://www.figma.com/file/HveLtfl3GS5fFO8YK9OpZj/Homework-7?fuid=1117441173023309032

Коментар frusia.pro:

Привіт! Так, тепер доступ є.

Завдання 1. Перемалювати фігури і зробити експорт зображень. Все дуже добре, але в завданні було вказано експортувати разом з назвами Можете не перейматись, тому що це не так важливо. Але пам'ятайте, що деякі замовники можуть бути дуже прискіпливими до технічних завдань, які вони надають.

Завдання 2. Намалювати темну тему для панелі властивостей Figma. Все дуже добре, панель максимально схожа і ви підібрали хороші кольори для темної теми. Щоб ще покращити макети у майбутньому зверніть увагу на такі деталі:

  • Перевіряйте розміри й координати прошарків, щоб там не було значень з дробною частиною. Наприклад, x = 21.64 треба округлити до 22;
  • переконайтесь, що відступи ліворуч і праворуч однакові. Помітила, що відступи ліворуч трохи плавають від 21 до 23 пікселів;
  • це ж стосується і вертикальних відступів, вони трохи відрізняються.

Завдання 3. Намалювати сайт на основі двох референсів. Чудова робота, дуже сподобалось, як ви об'єднали два сайти в один. Помітила декілька моментів, які можна покращити (дотримуйтесь цих порад у наступних макетах):

  • Зверніть увагу на розміри і відступи (дивіться коментарі до попереднього завдання);
  • у хедері логотип чомусь трохи зтиснутий, а футері все ок;
  • намагайтесь дотримуватись 8-ми піксельної сітки, тобто усі розміри мають бути кратні 8-ми пікселям, наприклад: 8, 16, 24, 32, 40 пікселі й так далі. У крайніх випадках допускається 4 пікселі.

Все дуже добре, можете приступати до 8-ого уроку

АннаUkraine flag підтримує ЗСУ 28 червня 2022 23:02  
https://www.figma.com/file/TCjqOcRMlzbumDDwZsl0fM/Untitled?node-id=7%3A134
Дякую!

Коментар frusia.pro:

Привіт! Відкривається файл з домашкою до попереднього (6-ого) уроку. Перевірте будь ласка

Ірина С.Ukraine flag підтримує ЗСУ 28 червня 2022 18:09  
Добрий день! Надсилаю дз до 7 уроку.
https://www.figma.com/file/HveLtfl3GS5fFO8YK9OpZj/Homework-7?node-id=0%3A1
До 3 завдання структуру брала з: https://www.andersenbeauty.com/
Кольори та ілюстрації: https://shen-beauty.com/

Коментар frusia.pro:

Добрий вечір! Коли відкриваю файл, то бачу помилку, що немає доступу. Перевірте будь ласка

Анна СмірноваUkraine flag підтримує ЗСУ 14 червня 2022 21:54  
Доброго вечора!
Надсилаю своє дз (зробила у тому ж файлі, що і минуле, але на нових сторінках)

Сторінка з першим завданням: https://www.figma.com/file/XvJv4GfKTam2WuwAKxGlHm/UI%2FUX-course-hw's?node-id=7%3A8
Сторінка з другим завданням: https://www.figma.com/file/XvJv4GfKTam2WuwAKxGlHm/UI%2FUX-course-hw's?node-id=74%3A190
Сторінка з третім завданням: https://www.figma.com/file/XvJv4GfKTam2WuwAKxGlHm/UI%2FUX-course-hw's?node-id=97%3A697

Коментар frusia.pro:

Добрий вечір! Робіть і надалі усі домашки в одному файлі, мені так зручніше перевіряти

Завдання 1. Перемалювати фігури і зробити експорт зображень. Все правильно, молодець! Зробили навіть трапецію один в один.

Завдання 2. Намалювати темну тему для панелі властивостей Figma. Дуже добре спрацьовано, виглядає максимально схоже. Кольори для темної теми також добре підібрані.

Завдання 3. Намалювати сайт на основі двох референсів. Ви вибрали мобільний додаток, а це навіть ще більш складно ніж веб-сайт, адже там багато нюансів. Але справились ви добре. Мені дуже сподобалось, як ви переробили квадратні карточки з статистикою на горизонтальні. Маленьке зауваження: відстані між прогресбаром і написами $60, $120, $96, $100 треба збільшити, бо вони розташовані занадто близько.

Чудово попрацювали, переходьте до наступного уроку

КатеринаUkraine flag підтримує ЗСУ 13 червня 2022 00:18  
Доброй ночи)

задание 1
https://www.figma.com/file/r1faw1qKIosOlIaxbw9np0/Untitled?node-id=137%3A815

задание 2
https://www.figma.com/file/r1faw1qKIosOlIaxbw9np0/Untitled?node-id=160%3A51

задание 3
https://www.figma.com/file/r1faw1qKIosOlIaxbw9np0/Untitled?node-id=291%3A2

Коментар frusia.pro:

Добрий вечір!

Завдання 1. Перемалювати фігури. Все правильно. Можу порадити використовувати для фігури Hope прямокутник і еліпс. Не знаю, що ви використали, але верхній лівий кут не дуже схожий

Завдання 2. Намалювати темну тему для Figma. Дуже деталізовано і добре відмальовано, темні кольори гарно підібрані. Ви навіть відмалювали панель інструментів і решту елементів інтерфейсу програми. Але докопатись завжди можна, якщо є бажанні :

  • Обводка у деяких елементів встановлена у значення 1.5, тобто з дробною частиною, що не буде коректно відображено у верстці, завжди дотримуйтесь цілих чисел;
  • шеврон з двох елементів навпроти напису Inside (Stroke) має напівпрозорість, тому у місці перетину маємо світліший колір, а має бути однаковий.

Завдання 3. Намалювати сайт на основі двох референсів. Чудова робота, добре попрацювали з відстанями і розмірами. Фотографії і шрифти гарно вписались. Маленьке зауваження: деякі елементи мають розмір з дрібною частиною (після коми), наприклад, висота фотографій посередині перед блоком як зробити замовлення.

Чудово попрактикувались, переходьте до наступного уроку

ІннаUkraine flag підтримує ЗСУ 10 червня 2022 13:59  
Добрий день, надсилаю готове домашнє завдання https://www.figma.com/file/c2SKlv6wukn4Mz1Oj5SULv/Lesson-7?node-id=3%3A2
Цікавий урок, дякую!

Коментар frusia.pro:

Добрий день!

Завдання 1. Відмалювати фігури й експортувати їх. Все зроблено правильно, молодець!

Завдання 2. Перемалювати панель Figma для темної теми інтерфейсу. Гарно справились, мені дуже сподобались підібрані кольори для темної схеми. А саме вони не чорно-білі, а трохи прохолодного відтінку, приємно сприймається оком. Також ви самостійно розібрались, як налаштувати індивідуальну обводку для сторін фрейму, цей функціонал з'явився у останньому оновленні Figma.

Завдання 3. Намалювати сайт на основі двох інших. Нові фото добре вписались в нову кольорову схему. Декілька рекомендацій:

  • Спробуйте змінити шрифти хоча б для заголовків і підібрати варіант з засічками, як на референсі з кольорами;
  • такі елементи, як стрілочки можна групувати і підписувати;
  • слідкуйте за відстанями і розмірами елементів, пробуйте дотримуватись кратності до 8 пікселів (або до 4 у крайніх випадках). Тобто відстані і розміри елементів у вас будуть 8, 16, 24, 32, 40 ... 128 пікселів і так далі.

У вас дуже добре виходить, продовжуйте далі

Андрей Дьяченко18 квітня 2022 19:32  
Большое спасибо за отличный урок! Вы лучшая!!!
Ірина10 квітня 2022 16:22  
2 завдання:
https://www.figma.com/file/IVRsRHvjP4eCbvPGx85oXN/%D0%B7%D0%B0%D0%B4%D0%B0%D0%BD%D0%B8%D0%B5-2?node-id=0%3A1

3 завдання:
https://www.figma.com/file/FqfAiu2iuI78lQ8HfrXict/%D0%B7%D0%B0%D0%B4%D0%B0%D0%BD%D0%B8%D0%B5-3?node-id=0%3A1

Комментарий frusia.pro:

Завдання 2. Молодець! Дуже сподобалось, що ви намалювали спочатку білу тему, а потім перефарбували її. Хороший підхід.

Завдання 3. Тут також хочу вас похвалити. Дуже класно адаптували макет під нові кольори та шрифти. Вийшло дуже стильно, враховуючи, що ми ще не вивчали дизайн. Так тримати!

Ірина10 квітня 2022 16:18  
Добрий день! Перевірте, будь-ласка:
https://www.figma.com/file/C8SLp3zpznqFKkJipdRbqa/%D1%84%D0%B8%D0%B3%D1%83%D1%80%D1%8B?node-id=2%3A6

Комментарий frusia.pro:

Завдання 1. Намалювали все класно. Є одна неточність у виконанні: ви мали б експортувати кожну фігуру окремо в форматі png, а потім завантажити їх усі назад у Figma. А ви просто експортували фігури загальною картинкою.

Ybkaiv5 грудня 2021 14:44  
Спасибо, ваш сайт очень полезный!
Полина19 листопада 2021 19:29  
Добрый вечер!
Спасибо большое за интересный урок, узнала много нового для работы! Отдельная благодарность за 3 задание, пришлось попотеть над ним, перепробовала разные дизайны, узнала много нового дня себя:) Прикладываю ссылку на домашнее задание
https://www.figma.com/file/OBfNvQpwoeJylYSsOcli3V/Your-Sweets-(Copy)?node-id=1%3A3

Комментарий frusia.pro:

Задание 1. Заметила совсем небольшие различия в фигурах, но в целом выполнено хорошо.

Задание 2. Темная тема – супер!

Задание 3. Вы постарались на славу. Действительно получилось замечательно смешать стиль одного сайта и структуру другого. Я бы сказала, что ваш вариант превзошел тот, что опубликован на Behance.

Виктория11 листопада 2021 12:21  
Добрый день, проверьте пожалуйста:
1) https://www.figma.com/file/nW4MnHqOn6ZeJksdVjSorV/%D0%A4%D0%B8%D0%B3%D1%83%D1%80%D1%8B?node-id=2%3A99
2) https://www.figma.com/file/B2K6Pwm7PyR03Io42iHB2k/%D0%9F%D0%B0%D0%BD%D0%B5%D0%BB%D1%8C-%D1%81%D0%B2%D0%BE%D0%B9%D1%81%D1%82%D0%B2-Figma?node-id=0%3A1
3) https://www.figma.com/file/hZlG7F6pHgYBTwKuMocELx/%D0%94%D0%B8%D0%B7%D0%B0%D0%B9%D0%BD-%D0%B8%D0%B7-%D0%B4%D0%B2%D1%83%D1%85-%D1%81%D0%B0%D0%B9%D1%82%D0%BE%D0%B2

Комментарий frusia.pro:

Задание 1. Все супер!

Задание 2. Получилась хорошая темная тема, молодец.

Задание 3. У вас очень хорошо получилось совместить структуру и цветовую гамму из двух разных источников. Понравилось что в макете использованы правильные величини объектов и текста. Если бы такой макет нужно было бы передавать в верстку, то готовый результат получился бы хорошим.

Нина31 серпня 2021 10:15  
Вот ссылки, которые я использовала
https://www.primark.com/de
https://www.behance.net/gallery/123463491/Fleur-Du-Mal-website-redesign?tracking_source=for_you_feed_activity

Комментарий frusia.pro:

В целом как для новичка вышло довольно хорошо, молодец. Единственное что я заметила, вы сделали не совсем так, как сказано в задании. У вас структура и стиль получились смешаными с двух сайтов по чуть чуть.

Нина23 серпня 2021 22:07  
Здравствуйте, вот ссылка на задания
https://www.figma.com/file/oBRO7AcMCIq4r8PaA3N9C7/%D0%94%D0%B7-7?node-id=0%3A1

Комментарий frusia.pro:

Проверила вашу домашку.

Отрисовка картинки по примеру – все правильно.

Темная тема – выполнили очень хорошо, молодец!

Совмещение структуры и стиля из двух сайтов – чтобы проверить это задание мне нужны ссылки на эти проекты. Потому что сейчас непонятно, удалось ли вам передать структуру и стиль из двух разных макетов. Жду от вас ссылки.

Дмитрий2 червня 2021 16:16  
Больше информации по Figma публиковаться не будет?

Комментарий frusia.pro:

Здравствуйте, будет публиковаться, просто сейчас нет возможности выделить достаточно времени на новые уроки.

slow9 квітня 2021 12:56  
" Обратите внимание, что меньший объект всегда будет выравниваться относительно большего (что логично);"

Не совсем так. На примере горизонтального выравнивания по центру. Если один объект перекрывает по ширине другой, то он он останется неподвижным, а меньший будет отцентрирован относительно него. Но только если меньший находится в габаритах большего, если же он больше смещен в сторону (выходит за границы большего), то в результате выравнивания сдвинутся оба.

Комментарий frusia.pro:

Большое спасибо за уточнение, поправила текст в уроке

Люба Фурсеева18 березня 2021 11:09  
Oksana, спасибо за отзыв!
Oksana18 березня 2021 10:39  
Спасибо! Все благодаря Вашим урокам. Информация изложена легко и доступно, интересно заниматься. С нетерпением жду следующих.
Oksana18 лютого 2021 19:30  
Добрый день, Люба,
Проверьте, пожалуйста:
https://www.figma.com/file/CEWa9AVlSjdY8nJl8V745X/Untitled?node-id=0%3A1
https://www.figma.com/file/CEWa9AVlSjdY8nJl8V745X/Untitled?node-id=1%3A77
https://www.figma.com/file/CEWa9AVlSjdY8nJl8V745X/Untitled?node-id=3%3A24

Комментарий frusia.pro:

Все три задания выполнены очень хорошо! Вы большая молодец. Особенно хочу похвалить вас за реализацию второго и третьего задания. Отлично отобразили нужную цветовую гамму во втором задании. В третьем задании получился классный микс из двух сайтов!

Даша17 січня 2021 20:12  
Люба, добрый вечер!
я правда не понимаю почему в первом задании итогом должно получиться 3 фрейма. ведь первый фрейм с отрисованными мною фигурками, а второй с импортируемыми мною этими же фигурками (которые я сначала экспортировала, а потом вставила как изображение), а где тогда третий фрейм? Я явно что-то не поняла. Объясните, пожалуйста :)

Комментарий frusia.pro:

Добрый вечер , наверное не очень понятно выразилась. На самом деле все очень просто: в первом фрейме будет исходная картинка, которая прикреплена к заданию. А в следующих будет то, что вы описали

В итоге:

Первый фрейм – исходное растровое изображение с фигурами (из задания);

Второй фрейм – отрисованные c нуля фигуры (векторные), которые экспортируются;

Третий фрейм – вновь импортированные по отдельности фигуры (растровые).

Люба Фурсеева3 грудня 2020 14:55  
Alex, большое спасибо!
Alex3 грудня 2020 12:24  
Спасибо большое за Ваш труд! Очень классно всё расписано! Открывайте онлайн-школу, у Вас талант к преподаванию)
Люба Фурсеева8 листопада 2020 13:01  
Дизайнер, спасибо за отзыв
Дизайнер7 листопада 2020 20:43  
Хочу выразить Вам большую благодарность за эту прекрасную, четко сформулированную информацию.

Щоб почати навчання, проходити тести і відслідкувати прогрес, треба записать на курс. Це безкоштовно.