Скільки часу займає перший власний макет

Коротко: перший екран у Figma дитина збирає за 2–3 заняття, повну сторінку з сіткою й адаптивом — приблизно за місяць. Але на курсі UI/UX цей момент настає не одразу: Figma в програмі стоїть на темі 21, а до неї йде верстка. На молодшому курсі перша готова робота в Photoshop з'являється вже наприкінці першого місяця.

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

Що вважати «першим макетом»

Тут ховається непорозуміння. Екран, зібраний за півтори години, — це ще не макет: це набір прямокутників з текстом. Макетом він стає, коли в ньому з'являються сітка, однакові відступи, стани кнопок і думка про те, що бачить людина першою. Різниця приблизно така сама, як між «намалював будинок» і «накреслив план будинку».

Чому на курсі 12–18 Figma не з першого дня

Програма побудована від сторінки до макета, а не навпаки. Спершу дитина верстає: HTML, CSS, блокова модель, медіазапити, Flexbox — двадцять тем. Потім приходить Figma (теми 21–22) і UX-дослідження (тема 23). Логіка проста: підліток, який руками зверстав п'ять сторінок, малює макет, який реально збирається в браузері. Дизайнер без цього досвіду проектує те, що потім не працює на телефоні.

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

А якщо дитина молодша

На курсі «Графіка та дизайн» перший показовий результат приходить швидше: обробка фото — тема 3, робота з текстом — тема 4, макети й брендинг — тема 5. Тобто вже наприкінці першого місяця в дитини є готова робота, яку можна роздрукувати. Візитка з'являється на темі 25, логотип — на 28.

Що насправді з'їдає час

Коли перший макет робиться довше, ніж очікували, справа майже ніколи не в складності програми. Заважає інше, і воно передбачуване:

• Пошук ідеального шрифту. Сорок хвилин у списку шрифтів, макет за цей час не зрушив. Лікується обмеженням: беремо два шрифти з короткого списку й повертаємося до цього питання наприкінці.
• Чистий аркуш. Порожнє полотно паралізує сильніше, ніж складне завдання. Тому на курсі перші роботи починаються не з нуля, а з чужого екрана, який треба розібрати й повторити.
• Переробка початку. Дитина п'ять разів переставляє шапку й не доходить до кінця сторінки. Домовленість проста: спочатку весь екран начорно, красиво — другим заходом.
• Очікування «як у дорослих». Підліток порівнює свій третій макет із роботою студії, засмучується й зупиняється. Порівнювати треба з власним макетом минулого місяця — це єдине чесне порівняння.

Три вправи, які пришвидшують руку

Швидкість у дизайні береться не з поспіху, а з повторюваних дій, доведених до автоматизму:

• Копія чужого екрана за 30 хвилин. Береться реальна сторінка, і завдання — повторити її якомога ближче. Тут вчаться бачити відступи й розміри, а не вигадувати.
• Один екран — три палітри. Той самий макет у трьох кольорових рішеннях. Виходить швидко, бо структура вже готова, і добре показує, як колір змінює враження.
• Таймер на 15 хвилин. Завдання — закінчити хоч щось за чверть години. Результат навмисно недосконалий; сенс у тому, щоб зняти звичку доводити перший блок до ідеалу, поки решта екрана порожня.

Скільки практикуватися між заняттями

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

Молодшим — менше: двадцять-тридцять хвилин за раз, і бажано з конкретною задачею на цей раз, а не «потренуйся».

Як батькам побачити прогрес, коли картинки ще немає

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

• З'явилися слова «відступ», «вирівнювання», «ієрархія» — і вживаються до місця.
• Дитина почала помічати чужі інтерфейси: критикує застосунок банку, сайт піцерії, меню в грі.
• Питає не «як зробити красиво», а «як зробити, щоб не з'їхало».
• Показує сторінку, яка відкривається за посиланням, — навіть якщо виглядає вона скромно.

Якщо за півтора місяця не з'явилося нічого з цього списку — варто поговорити з викладачем, і це нормальна розмова, а не скарга.

Якщо дитина застрягла

Затримка на одному місці довше двох тижнів зазвичай означає не брак здібностей, а пропущений крок раніше. Найчастіше це базова робота з шарами й групами: без неї будь-який складний макет перетворюється на кашу, і дитина інтуїтивно уникає складних робіт. Друга поширена причина — надто велике завдання, яке підліток вибрав сам: «зроблю застосунок для школи» звучить чудово й не закінчується ніколи. Рятує розрізання на частини: спершу один екран, потім другий.

І третє, про що згадують рідко: інколи дитина просто втомилася. Тиждень без макетів не відкидає назад, а повертає інтерес — на відміну від місяця примусу.

Перший місяць на молодшому курсі — по тижнях

У «Графіці та дизайні» строки коротші, і батькам зручніше бачити їх по тижнях. Перший тиждень — знайомство з полотном, шарами й збереженням файлів; показати ще нема чого, зате дитина перестає боятися інтерфейсу. Другий — виділення: саме тут з'являється перша робота, яка справляє враження, бо об'єкт переїжджає з однієї фотографії в іншу. Третій — шари й ретуш, і фотографія родича без зайвого перехожого на задньому плані зазвичай стає першою роботою, яку роздруковують. Четвертий — текст: напис на листівці, ефекти, перша власна композиція від початку до кінця. Далі темп рівний: приблизно одна завершена робота кожні два-три заняття.

Три питання про строки

Чи можна прискорити результат додатковими заняттями? Трохи — так, але не вдвічі. Навичка впирається не в кількість годин, а в кількість завершених робіт; п'ять доведених до кінця макетів дають більше, ніж двадцять початих.

Дитина зробила перший екран за півтори години. Це добре? Це нормально й нічого не означає. Значення має другий екран: якщо на нього пішло менше часу й він охайніший — рух є.

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

Що входить у портфоліо після курсу, розібрано окремо: «Що входить у портфоліо після курсу UI/UX дизайну в Figma». Загальні строки курсу — у статті «Курс веб дизайну для школярів: скільки часу займає».