КЕЙСИ
Better Me, Design Battle та інші проєкти на курсі
UI/UX Animation
Чим займалися студенти на першому наборі UI/UX Animation під кураторством Антона Пінкевича.
За два місяці студенти занурилися в анімацію інтерфейсів і з точки зору юзабіліті, і з повагою до естетики. Вони також спробували свої сили в Cinema 4D, навчилися виставляти світло, моделювати і створювати матеріали, попрацювали з програмним кодом, фізикою в анімації та експрешенами.

Студенти працювали над проєктами для реальних замовників: зробили анімацію для трьох додатків (FreeTour, FASTOGO, Better Me) та занімували лендінг-пейдж для київського Design Battle від студії Vintage.

Ми поспілкувалися зі студентами про роботу на курсі та враження від роботи. А також спільно з куратором відібрали найкращі роботи для презентації.

Курсова #1. Анімація в мобільних додатках
Під час роботи над цією курсовою студенти поділилися на команди, розділи між собою задачі та розробили рішення для трьох мобільних додатків.

1. Додаток для бронювання подорожей FreeTour

Мета роботи: покращити естетичне сприйняття процесу бронювання туру. Студентам потрібно було розробити рішення для шляху користувача під час бронювання туру, для екрана з відгуками та чайовими, розробити splash screen та розробити анімацію для окремих ілюстрацій.

Splash screen
Авторка: Анастасія Скалозуб
Map navigation
Автор: Євген Педорич

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

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

Євген Педорич
UI/UX Designer в iDeals Solutions: Virtual Data Rooms
2. Фітнес-додаток BetterMe

Мета роботи: збільшити показники повернення користувачів, затримати користувачів в секції workout. Студенти анімували workout flow, tapbar, іконки, переходи між досягненнями та процес роботи з меню.

Achievement
Авторка: Анастасія Скалозуб
Workout overview
Автор: Едуард Новохатський

Tapbar
Автор: Євген Педорич

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

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

Анастасія Скалозуб
3. Ecommerce-додаток FASTOGO

Мета роботи: покращити естетичне сприйняття додатку. Студенти розробляли onboarding додатку, анімації-підказки для свайпів, splash screen, виникнення.зникання кошика, перехід між календарем та списком продуктів.

Opening cart overview
Автор: Олександр Князюк

Onboarding
Автор: Євген Педорич
Splash screen
Автор: Андрій Константін

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

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


Олександр Князюк
Курсова #2. Анімація для Design Battle від студії Vintage
Студенти презентували концепт анімації для лендінгу. Основна задача: вдихнути в статичний макет Figma життя, передавши емоцію й ідею події.
Концепція Інги Сумської
Практично все, що я робила на курсі, було новим для мене. Попередній досвід в анімації був невеликий, і найважчим завдання стало зрозуміти та відчути таймінги.

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


Інга Сумська
Product Designer в Amazing Apps
Концепція Євгена Педорича
Найскладнішим було не зайти на оригінальний сайт і не «заразитися» первинною ідеєю і настроєм, адже це б вплинуло на весь концепт. На друге місце я би поставив етап креативу і створення того самого концепту, адже не хочеться просто проявляти текст по «opacity», а навпаки — пронизати весь сайт однією ідеєю і зберегти її крізь всі екрани.

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

Євген Педорич
UI/UX Designer в iDeals Solutions: Virtual Data Rooms
Концепція Тетяни Яремчук
Особисто собі я ставила мету зробити анімацію максимально легкою і не нав'язливою, щоб лише підкреслити основний контент. Коли робота була закінчена, я перебувала в суцільному шоці та захваті, наскільки швидко вдалося впоратися. На всю роботу в мене пішло біля 5-6 годин.

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

Тетяна Яремчук
Концепція Каріни Лобань
Авторка: Юлія Клебан
Courses
Сподобалась стаття?