The rich text element allows you to create and format headings, paragraphs, blockquotes, images, and video all in one place instead of having to add and format them individually. Just double-click and easily create content.
The rich text element allows you to create and format headings, paragraphs, blockquotes, images, and video all in one place instead of having to add and format them individually. Just double-click and easily create content.
Вітаємо на другому занятті з UI/UX дизайну — сьогодні починається практика!
Ми пірнемо у світ Figma — програми, яка до душі багатьом дизайнерам. Деякі фахівці настільки її люблять, що користуються нею для будь-чого: роблять у ній трекер завдань, створюють презентації, організовують власний побут, скидають туди всі цікавинки на майбутнє тощо. Якщо тобі сподобається функціонал і ти раптом вирішиш складати у Figma списки покупок, ми тебе не видамо ;)
Сьогодні ми розглянемо, чим саме Figma завдячує такою популярністю, що в ній можна робити і що варто знати для початку.
Орієнтовний час на опрацювання теорії: 60-90 хвилин.
Орієнтовний час на виконання практики: 90 хвилин.
Завдання на тиждень
Усі чотири уроки ти працюватимеш над дизайном залізничного квитка:
У першому уроці ми розберемо, хто наші користувачі та які в них потреби.
У другому уроці познайомимось із програмою Figma та її функціоналом, щоб потім створити в ній дизайн квитка.
У третьому уроці ти створиш 3 версії квитка, що найкраще підходять персоні користувача.
У четвертому уроці ти зведеш три версії квитка в одну, що задовольнить 3 різні персони користувачів (а це не найлегше завдання!)
Теорія
Вивчай теорію за допомогою статей і відео
Автори цього курсу підібрали статті та відео для базового розуміння теми та успішного виконання практичних домашніх завдань.
Відео та статті взаємодопоміжні, тож, будь ласка, переглянь і прочитай їх разом.
У відео до цього уроку ти ознайомишся з теоретичною базою та загальними поняттями. Зверни увагу, що приклади у відео є лише зразком застосування певного функціонала і не містять точних інструкцій для виконання домашніх завдань. Спершу розглянь, як працює певна технологія — і тоді буде зрозуміліше, як застосувати її до конкретного практичного завдання.
Основна ідея нашого наступного домашнього завдання — зворотна розробка. Це підхід, коли ти шляхом декомпонування аналізуєш щось, створене іншими, та розумієш, як кожна частина працює і чому вона виглядає певним чином.
Можливість простежити дизайн-процес — це найважливіша складова роботи дизайнера.
Наша мета — зрозуміти, як розроблявся чинний дизайн і як мислив його творець. Ми дивитимемось його у Figma і водночас розберемося з основами роботи у цій популярній програмі.
Практика
Завдання на сьогодні — відтворити зображення залізничного квитка у Figma.
Завдання вважається виконаним, коли всі дані квитка відтворені і розміщені так, як на зображенні-взірці.
В ньому ти знайдеш виконані домашні завдання для всіх днів цього напрямку. Щоб відкрити даний файл в фігмі, зайди на сторінку з файлами, клікни на кнопку "import file" та завантаж файл.
Проводячи тестовий запуск цього курсу минулого року, ми отримували типові запити від студентів. Відповіді на них ми зібрали в одному файлі. Можливо, запитання, на яке ти шукаєш відповідь, вже можна знайти ось тут.
Пам'ятай, що основне при виконанні домашнього завдання - це зрозуміти, наскільки тобі цікаво займатись цією спеціальністю та продовжувати розвиватись в подальшому. Щось не так з текстом/відео/посиланнями? - звернись до координатора курсу в телеграмі