Говорячи про ігровий інтерфейс ми маємо на увазі не лише кнопки та стрілочки, що дозволяють гравцю керувати процесом. Адже кожна гра – це по суті маленький всесвіт, де все взаємопов’язано та керується власними законами. Вдалий дизайн інтерфейсу посилює загальне враження про гру, допомагає цілком заглибитись в неї. Невдалий – навпаки відволікатиме та відштовхуватиме, зробить процес нудним та нецікавим. Не варто й говорити, яка з ігор отримає визнання геймерів. При цьому справа зовсім не в графіці, а саме у вмінні дизайнера влити інтерфейс в ігрову механіку, зробити його максимально зручним, оригінальним і при цьому непомітним. Саме цього ми навчаємо у varto на наших онлайн-курсах.

Особливості напрямку та ключові поняття

Отже, перед нами абревіатура, що складається з двох фраз: user experience та user interface. Йдеться про користувацький досвід та інтерфейс користувача. Різні спеціалісти по-різному трактують важливість даних понять. Дехто навіть ставить UI на перше місце. Ми ж дотримуємося протилежної думки.

UX (user experience) – впровадження досвіду користувача. Тобто загального сприйняття продукту та того, наскільки зручно ним користуватися. UX-дизайнер повинен розуміти свого користувача, буквально мислити його категоріями, бути трохи психологом. Тут потрібне аналітичне мислення та розуміння своєї цільової аудиторії. Просто освоїти курси комп’ютерної графіки недостатньо.

UI (user interface) – фактично це впровадження ідей та цілей проєкту в життя. Вибір кольору та візуалізація. Для геймдизайну це також дуже важлива складова, оскільки саме UI-дизайнер відповідає за стилістику інтерфейсу та VFX. Саме його роботу бачить кінцевий споживач гри. Тут потрібні вже доволі сильні графічні навички, вміння створювати та прописувати інтерфейс, втім, все це без проблем можна освоїти на курсах CG та з успіхом застосовувати в роботі.

UX/UI. Порівняльна характеристика

Якщо схематично, то розподіл функцій відбувається так:

• UX:
  • забезпечення зручності користувача;
  • розробка інформаційної архітектури;
  • опрацювання сценаріїв поведінки;
  • копірайт та прототипування.
• UI:
  • займається розробкою візуального дизайну;
  • підбирає кольорову гаму;
  • створює графічні елементи;
  • підбирає шрифти та брендинг.

Закордоном найчастіше UX та UI це два різних спеціалісти. Для українців  ситуація протилежна: у нас за все відповідає одна людина. Це може здатися дивним, але на практиці таке поєднання досить непогано працює. Відповідно наші спеціалісти більш конкурентоздатні на ринку, а сучасні школи комп’ютерної графіки випускають дійсно кваліфікованих дизайнерів, вміння яких цінуються у світі.

Якими здібностями повинен володіти UX/UI дизайнер

Говоримо одразу – одні навички можна розвинути в собі шляхом постійних тренувань і практики, а для інших достатньо пройти хороше онлайн-навчання. Все залежить від вашого бажання та наполегливості. Отже:

1. Відкритість до новинок – галузь gamedev одна з тих, що розвивається найшвидше. Щоб залишатися в трендах потрібно постійно відстежувати новинки та бути готовим їх впроваджувати. Якщо ви допитливі та спостережливі, це додатковий плюс.
2. Адекватне відношення до критики – ми всі можемо помилятися. Навіть спеціалісти з великим досвідом, які пройшли сотні тренінгів і онлайн-курсів, в тому числі від varto. Помилятися не страшно, страшно не вміти визнати помилку і не хотіти її виправити. Кожна гра – це спроби та помилки. Часто чим тернистіший шлях, тим більш досконалим виходить кінцевий продукт.
3. Надивленість – скіл, який можна розвинути лише з досвідом. І це чудова новина: чим більший у вас ігровий досвід, тим легше розвинути надивленість. Це своєрідна інтуїція дизайнера, яка дозволяє відразу зрозуміти, де є помилка і чому інтерфейс буде незручним для користувачів. Надивленість розвивають тестуючи та граючи в різні ігри, як у сучасні, так і старі. Це той пункт, який доведеться освоювати самостійно (онлайн-навчання тут не допоможе), але отримавши відповідні знання, буде легше зрозуміти, на які аспекти звертати увагу.
4. Гнучкість мислення – ще одне вміння, що приходить з досвідом. Якісний геймдизайнер постійно працює над кількома проєктами, зазвичай різними по стилістиці. Тому потрібно вміти перемикатися і дивитися свіжим поглядом.
5. Софти – знання графічних програм обов’язкове для професії. Однак, це саме те вміння, яке можна розвинути на курсах комп’ютерної графіки та з успіхом застосовувати в подальшій роботі. 
6. Як бачите, у професії є певні вимоги, однак, доклавши зусилля, їх цілком можна осягнути. Головне мати інтерес до цієї справи, любити ігри та дизайн і хотіти втілити свої навички у життя.

Софти та інструменти, які допоможуть в роботі та аналітиці

Хочемо ознайомити вас з основними робочими програмами, які потрібні UX-UI дизайнеру ігрових інтерфейсів. Більшість з них входять в наше online-навчання та детально вивчаються слухачами.

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

Wireframe.cc. – доволі простий сервіс з мінімалістичними інструментами. Дозволяє створити прості каркаси та протестувати їх роботу.

Treejack – спеціалізація: Інформаційна архітектура. Зручна платформа, що створює структуру сайту та імітує роботу користувачів. На виході дизайнер отримує якісні аналітичні дані.

Balsamiq – чудовий сервіс для тих, хто лише розпочинає online-навчання. Дозволяє створювати прості каркаси. Чудово підходить для практики новачків.

FlowMapp – крутий сервіс для справжніх професіоналів з UX. Має вузькоспеціалізований функціонал з ігрової розробки та моделювання.

Marvel – підійде дизайнеру без досвіду у створенні прототипів. Допомагає створювати каркаси та проводити їх тестування. Генерує HTML-код, що максимально спрощує роботу розробників.

Adobe XD – має зручні векторні інструменти. Робота проходить в реальному часі, можлива інтеграція сервісу з іншими інструментами.

Proto.io – підходить для створення точних макетів, має хорошу інтеграцію, а також добре налаштований для командної роботи.

Sketch – зручний плагін для дизайну, вивчається практично на всіх курсах 3D-моделювання та має багато корисних інструментів. Дозволяє значно розширити функціонал UX-UI дизайнера.

InVision Studio – допомагає у створенні анімації та ігровій розробці. Має багато корисних фішок для дизайнера ігрових інтерфейсів.

Axure – дозволяє протестувати функціонал створюваного продукту та видає якісну аналітику. Зручний сервіс для завершального етапу роботи.

Де можна пройти онлайн-навчання на UX-UI дизайнера ігрових інтерфейсів?

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

Що відрізняє нас від інших шкіл комп’ютерної графіки?

• надаємо корисні та структуровані знання та інструменти, вчимо їх практичному використанню;
• все це закріплюємо на практичних заняттях з детальним розбором домашніх завдань та фідбеком від викладача;
• ви отримаєте перші кейси для вашого портфоліо та іменний сертифікат про закінчення курсу;
• співпрацюємо з дизайнерськими студіями, тому наші студенти одразу мають доступ в CG ком’юніті для спілкування, обміном знаннями та розваг.

Якщо ви любите ігровий дизайн та готові глибоко інтегруватися в дану тему, то курси від Varto – це можливість отримати якісну онлайн-освіту саме для вас.

The post Що таке UX-UI дизайн ігрових інтерфейсів та хто ним займається? first appeared on Varto School.

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

В цій статті я хочу поговорити про концепції, які я використовую коли створюю форму: Флоу, Амплітуда, Ідентичність.

• Флоу – про контроль жесту форми в моделі;
• Амплітуда – про контроль наскільки велика певна форма до інших;
• Ідентичність – це про розуміння чому ця форма існує, побудова її з урахуванням анатомії;

Флоу та Амплітуда є двома різними аспектами, які створюють форму. Ідентичність – диктує шлях до розвитку, створенню певних форм. Флоу та амплітуда – це «Як?», а ідентичність являє собою «Чому?»

Флоу: форма, жест, зв’язок

Флоу – це про тримання руху форми в трьохвимірному просторі. Форма, жест та зв’язок є трьома характеристиками, які можуть допомогти конструювати правильний флоу в скульптурі. Пройдемось по всім пунктам по черзі.

Форма

Форми, якщо говорити про флоу, є будівельними блоками цієї взаємодії форм. Зауважу, що це не групи м’язів, а ритми, які можна побачити на формі.

Жест

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

Додаючи червоний блок (зображення 1) ми можемо бачити як жест з зеленого блоку до синього припиняється. Це створює новий жест який поєднує ліву частину зеленого блоку, з правою частиною синього блоку.

Зв’язок

Зв’язок про те як форми «змішуються» одна в одну. Кожна форма повинна мати перехід в іншу форму. Те як цей перехід зроблений – залежить від Ідентичності (наступна глава).

Що залишилось від червоного блока – форма навколо суглоба (зображення 2). Зв’язок з синім блоком майже зник, так само як й з зеленим блоком.  Навіть якщо цей зв’язок між формами ледь помітний, ми все одно можемо відчувати як червоний блок обгортує зелену та синю форми.

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

Амплітуда форми

Головні, Другорядні, Третинні

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

Текст до зображення 3

1. Фінальний рендер.
2. Блокаут головних форм містить великі м’язові групи та їх зв’язки.
3. Блокаут другорядних форм містить анатомічні позначки та додає другий шар флоу до головних форм.
4. Блокаут третинних форм містить невеличкі перебіги, розломи між формами.

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

Другорядні форми ламають головні форми не змінюючи ідентичність цих форм. Такий самий принцип застосовується для третинних форм. Контроль ієрархії форми значить контроль того, як кожний рівень форми (головний, другорядний, третинний) впливають друг на друга.

2 мільйони полігонів, 7 тисяч полігонів, 31 тисяча полігонів, 126 тисяч полігонів відповідно.

Як ви можете бачити, вже на 7 тисячах полігонів ми бачимо другорядні форми дуже чітко, та це вже дуже забагато полігонів для того, щоб робити головні форми без впливу на другорядні. На 31 тисячі полігонів форми вже повністю на своїх місцях «під шкірою» та я маю якісний блокаут третинних форм. На 126 тисячах полігонів не так багато змін. Лінії, кути гострішають, додатково я створив шар «шуму»*. З цього етапу до 2 мільйонів полігонів різниця непомітна.

*Шар «шуму» – Автор використовував Surface noise (функція ZBrush) або альфою додавав шар «шуму-шкіри», щоб зробити скульптуру більш правдоподібною.

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

Контроль сабдівіжн рівнів

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

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

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

Це допомагає створювати відносини між головними, другорядними та третинними формами, контролювати скільки кожна форма впливає на модель.

Ідентичність форми

Взаємозв’язок шкіри з формами під нею

Ідентичність форми являється “причиною” яка стоїть за всіма формами. Кожна форма має певну вагу, текстуру, твердість. Ці показники впливають на створення органічного відчуття форми. Кожний може зробити форму, але чи можете ви зробити форму, яка відчувається як шкіра.

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

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

Шкіра – як покривало яке обгортує форму (зображення 5), воно згладжує всі впадини, змиває переважну кількість деталізації м’язів. Кістки та сухожилля своєю чергою розтягують, натягують це покривало.

Шкіра має специфічну гнучкість, щільність, вагу. Розуміння цих факторів фатальне для того, щоб скульптити правдоподібні форми. Щільніша шкіра буде робити м’якіші форми, наприклад на животі. На протилежність живота, рука має тонку шкіру, та кожне сухожилля, вена, кістка буде деформувати шкіру. Пропрацьовуючи усі ділянки однаково ми вбиваємо правдоподібність  структури під шкірою.

Часто коли я скульпчу, можу симулювати покривало тим, що дуже сильно виділяю певні ділянки, та потім згладжую ці впадини. Це дає відчуття, що шкіра м’яко лягає на м’язи. Шкіра прикріплена до м’язів, тому коли м’яз скорочений, я підвищу інтенсивність гостроти м’язів, щоб симулювати ефект м’язів які тягнуть шкіру (зображення 6).

Гостри ями. Тіло відчувається без шкіри. Цей крок корисний для створення флоу між різними формами.

Після згладжування ям, флоу між формами встановлено, шкіра відчувається поверх м’язів (зображення 7).

Коли скульптите, намагайтеся відчувати шкіру на скульптурі. Чи вона натягнута? Чи зжата? Що під формою шкіри, як це вплине на структуру шкіри? Чи форма під шкірою тверда, або м’яка? Тверді структури як кістки можуть створювати гострі кути, та видні площини. Розслаблені м’язи будуть створювати м’які форми.  Сухожилля м’язів буде створювати гострі лінії коли зжате. Жир на тілі буде створювати сильні складки. Розуміння ідентичності форми може допомогти створювати форму правильно та правдоподібно.

ДЛЯ ZBrush ботанів

Нотатки про те як працюють сабдівіжн рівні. Відкрий ZBrush та спробуй сам:

Уявимо, що я скульпчу модель на трьох рівнях сабдівіжна. 1 сабД – 10к, 2 сабД – 40К, 3 сабД – 160к.

1. Коли я скульпчу на першому сабД, то одразу як я перемикаюсь на вищій рівень сабдівіжна я (автоматично) застосовую алгоритм згладжування (geometry tab -> divide в Zbrush).
2. Якщо я скульпчу на другому сабД рівні та потім перемикаюсь на перший та повертаюсь знов на другий, то я застосовую алгоритм згладжування для всіх сабД зверху. Результат буде виглядати гладкішим ніж ви скульптили, навіть якщо ви повертаєтесь до такого ж сабД.
3. Якщо я скульпчу на другому сабД рівні, коли перемикаюсь на перший сабД рівень, то це запікає заскульпчену інформацію на всі інші сабД рівні, та коли ви перемикаєтесь на вищий сабД можете помітити артефакти скульпта.

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

СабД3 Гострі clayBuildup створюють лінійний шум з дуже гострими лініями. СабД6 коли згладжено, залишає контрольований шум на поверхні.

Наприклад, з квадратним ClayBuildup ви можете створити шум на нижньому сабД рівні, який коли згладиться буде мати цікавий вигляд. Таку ж саму форму було б важко створити на сабД6 та вище (плюс довше).

Автор роботи: https://www.artstation.com/johart

Статтю переклав: https://www.artstation.com/hovorov

The post Як покращити навик скульптинга. Поради та концепції first appeared on Varto School.

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

Від скетчів до розробки ігор. Хто ми та чому варті?

VARTO SCHOOL – школа комп’ютерної графіки, що працює в Україні для українців. Ми намагаємося повноцінно охопити креативну індустрію. Тож з нами ти розберешся, з яким інструментом хочеш працювати у майбутньому, та зможеш вивчити специфіку навіть з нуля.

Серед напрямків, які ми наразі охоплюємо:

Схема online-навчання на кожному напряму приблизно однакова: курси поділені на кілька великих блоків, до яких входить теорія і практика для закріплення. Фінальним акордом стане велика дипломна робота, за результатами якої школа видає сертифікат.

Наші викладачі – розробники та художники з немалим професійним досвідом. Який би напрям ти не обрав, чи то курси 3D-моделювання, чи ігрової розробки, будь упевнений: у ментора за плечима десятки, а то й сотні крутих проєктів у цій сфері.

Наші цілі та місія

Головне, що мають на меті наші онлайн-курси – об’єднати тих, хто горить своєю справою, і дати їм поштовх у яскраве професійне майбутнє. У нас є багато хороших друзів в індустрії, які готові прийняти в обійми компанії вмотивованого джуна. Ще ми навчаємо софт скілам, щоб учні школи успішно проходили співбесіди, шукаючи роботу мрії.

І трохи про реалії сьогодення. Ми розуміємо, що зараз Україна вимагає підтримки з усіх можливих фронтів. Тож 10% від кожної оплати донатимо ЗСУ. Словом, робимо все можливе, щоб онлайн-навчання на наших курсах приносило користь державі в усіх аспектах: і армію підтримуємо, і випускаємо спеціалістів, які піднімуть економіку після перемоги. 

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

Курси комп’ютерної графіки online: чи воно того варте?

Навчання в VARTO SCHOOL відбувається виключно в онлайн-форматі. Власне, у чому ж його переваги? 

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

Можна скільки завгодно перераховувати переваги online-формату. Впевнені, що за останні кілька років більшість українців зрозуміли їхні плюси. Фактично це ті самі класичні курси комп’ютерної графіки, але в зручному режимі. 

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

Концентрована користь, практика та перспективи. Найголовніше про нашу школу

Найперше, онлайн-курси VARTO SCHOOL включають лише авторську інформацію з перших вуст. Жодного інфоциганства і сухої теорії – таке ти знайдеш у безкоштовних джерелах. Наші ж ментори мають великий практичний досвід і залюбки його шерять для майбутніх колег. 

Окрім того, всі навчальні програми включають повну і структуровану картину. Вчишся створювати ігри на Unity з повного нуля? Ми покажемо повний шлях, від розробки ідеї до публікації в маркетах. Обрав курси 3D-моделювання? З нами повністю освоїш пайплайн і будеш створювати моделі, як то кажуть, від ескізу до релізу. А все нове, що з’являється в індустрії, одразу потрапляє в програму лекцій.

І не думай, що онлайн-навчання – це просто подивитися лекції, виконати пару-трійку завдань і піти працювати за п’ятизначну суму. Нашим учням доводиться довго та прискіпливо сидіти над моделюванням, рендерами й іншими невід’ємними штуками. Уникнути цього неможливо, та й не треба: все побачене ти маєш неодмінно зробити своїми руками. Ментори натомість дадуть конструктивний фідбек, щоб наступного разу вийшло ще краще.

Тож ми чекаємо на учнів з дійсно високим рівнем мотивацій, які бажають:

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

The post Varto School. Нова CG школа в Україні first appeared on Varto School.