Volume 2 (2) 2021Professional Art Education

УДК УДК 004.92:004.73

DOI 10.34142/27091805.2021.2.02.05

РОЗРОБКА UX/UI ДИЗАЙНУ САЙТУ ФАКУЛЬТЕТУ

МИСТЕЦТВ ХНПУ ІМЕНІ Г.С.СКОВОРОДИ

доктор педагогічних наук, професор ка-

федри дизайну Харківського національ-

ного педагогічного університету імені

Г.С. Сковороди,

Харків, Україна

email: melennaznv@gmail.com

https://orcid.org/0000-0002-3083-1070

В роботі розглянуто тенденції UX/UI дизайну освітніх сайтів закладів вищої освіти в Україні.

Проаналізовано сайти факультетів мистецької освіти щодо юзабіліті та структурних елементів. Вио-

кремлено необхідні аспекти для розробки дизайну сайту факультету мистецтв Харківського національ-

ного педагогічного університету імені Г.С. Сковороди. Використовувалися такі методи дослідження, як

предметно-аналітичний для вивчення структурних та ілюстративних джерел; термінологічний прий-

ом для однозначного розуміння істотних ознак дизайну; психологічний метод вербального визначення

характеру зорового відчуття від фінальної стадії розробки дизайну сайту. Виявленні сучасних тенденцій

UX/UI дизайну у розробці сайтів мистецького спрямування. Виокремленні необхідних структурних еле-

ментів розробки сайту факультету мистецтв Харківського національного педагогічного університету

імені Г.С. Сковороди.

Результати дослідження довели, що для розробки UX/UI дизайну сайту факультету мистецтв

ХНПУ імені Г.С. Сковороди необхідно використовувати різні структурні елементи такі як: емоційний ди-

зайн (використання візуально «живих» елементів для спонукання виникнення почуттів та реакції від

користувачів); геометрична структура (використання класичних геометричних елементів для акцен-

туації); дизайн із розділеним екраном (використання умовно розділеного екрану на дві панелі контенту,

що згортається у вертикальний блок в адаптивному дизайну); збільшення змісту тексту (повернення

багаторівневих заголовків тощо); нові шрифти (уникнення класики і використання засічок, зміна розміру

від слова до слова, використання напівпрозорого шрифту із перекриттям непрозорого, додавання жирно-

го та курсивного нарису); адаптація під нові гаджети (забезпечення якісними збільшеними зображення-

ми для адаптивного дизайну); унікальна мікровзаємодія (наявність тактильних оглядів у адаптивному

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

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

певних кнопок на сайті).

Ключові слова: UX/UI дизайн, тенденції UX/UI дизайну, юзабіліті, структура сайту, айдентика,

адаптивний дизайн.

Постановка проблеми та її зв’язок з важли-

вими науковими та практичними завданнями.

Пандемія COVID-19 змусила заклади освіти пере-

йти на дистанційну та змішану форму навчання.

Багато закладів вищої освіти у всьому світі запу-

стили віртуальні університети (Кембриджський,

Оксфордський та інші університети), що значно

розширило доступ до навчання абітурієнтів з

будь-якої точки світу та стрімко підвищило кон-

куренцію серед закладів освіти. Освітні послу-

ги активно пропонуються як під час прийому

абітурієнтів так і у весь період навчання і чим

зручніше, зрозуміліше та візуально комфортно

розроблено сайт університету, факультету, ка-

федри, тим вище імідж університету на загаль-

носвітовій арені, і, відповідно, більше шансів

зацікавити потрібну цільову аудиторію. Сьогод-

ні, одним із провідних завдань університетів є

підвищення їх конкурентоспроможності на рин-

ку освітніх послуг шляхом постійної роботи над

розвитком та підтримкою іміджу та бренду, що

узгоджуються зі стратегічними цілями універси-

тету. Безумовно, безпосередню профорієнтаційну

роботу, щодо залучення абітурієнтів, здійснює

факультет та його відповідні кафедри. У межах

даної статті ми опікуємось удосконаленням сайту

Professional Art Education Volume 2 (2) 2021 Scientic Journal

факультету мистецтв. Такі аспекти зумовлюють

необхідність визначення сучасних тенденцій UX/

UI дизайну сайтів освітніх закладів у зазначено-

му напрямку та удосконалення існуючого ди-

зайну сайту факультету мистецтв Харківського

національного педагогічного університету імені

Г.С. Сковороди.

Аналіз основних досліджень і публікацій.

На даний момент питання дизайну освітніх

сайтів є цікавим але недостатньо дослідженим

напрямком. Так у науковій роботі О. Забарної та

О. Соловйової (2013) досліджуються питання ак-

туальності розробки веб-сторінок освітніх сайтів

та сайт розглядається як інструмент комунікації.

У роботі Т. Пишкайло (2017) наголошено на важ-

ливості використання «айдентики» в сучасному

веб-дизайні. Дослідження О. Кунгурцевої (2017)

присвячені загальним вимогам до сайтів закладів

освіти. Л. Боднар (2019) зазначила методичні ре-

комендації щодо створення інтернет-сайту освіт-

нього закладу, розкрив особливості сайтів за при-

значенням, подано покрокові дії, а саме: розробка

структур, дизайну, макету, головної сторінки, ди-

наміки, тестування сайту. М. Рудний (2014) у своїй

роботі розглянув розробку програмного забезпе-

чення сайту кафедри програмного забезпечення.

Формулювання цілей та завдань статті.

Метою роботи є удосконалення існуючого дизай-

ну сайту факультету мистецтв Харківського на-

ціонального педагогічного університету імені Г.С.

Сковороди. Відповідно до мети було визначено

наступні завдання: 1. Проаналізувати освітні сай-

ти ЗВО України у напрямку мистецької освіти. 2.

Схарактеризувати сучасні тенденції UX/UI дизай-

ну у розробці сайтів мистецького спрямування. 3.

Виокремити необхідні структурні елементи сайту

факультету мистецтв Харківського національно-

го педагогічного університету імені Г.С. Сковоро-

ди.

Виклад основного матеріалу. Сьогодні сайт

є «візитною карткою» будь-якої установи та не-

обхідною умовою для ефективної взаємодії з ко-

ристувачами. Просування освітніх послуг у су-

часному світі здійснюється не тільки за рахунок

проведення різноманітних профорієнтаційних

заходів, але й у мережі Інтернет, де освітні устано-

ви демонструють віртуальну активність, розкри-

вають власні конкурентні переваги для потенцій-

ної аудиторії.

Дослідниця О. Кунгурцева (2017) зазначає,

що для всіх сайтів закладів освіти, наскільки б

вони не були специфічними у своїх напрямках, є

загальні вимоги:

- на сайті повинна дотримуватися грамотна

композиція тексту та картинок, щоб у відвідувача

не було відчуття дискомфорту;

- дизайн повинен відповідати останнім

тенденціям web-дизайну, з метою підтримки

іміджу вузу та створення довірливих відносин у

абітурієнтів;

- навігація повинна бути чіткою та інтуїтив-

но зрозумілою користувачеві, щоб він не «заблу-

кав» на сайті у пошуках інформації;

- якщо заклад має співпрацю з іноземними

вузами, а також до навчання запрошуються іно-

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

мови сайту;

- для можливості інклюзивного навчання

студентів сайт також повинен надати можли-

вості для зручного перегляду сайту;

- колірна палітра, шрифти повинні відповіда-

ти фірмовому стилю закладу

З метою виявлення спільних елементів про-

аналізуємо сайти ЗВО у напрямку мистецької

освіти. Сайт Львівської національної академії

мистецтв (2021) має простий дизайн та інтуїтив-

но зрозумілий інтерфейс (див. рис. 1). Містить

певні блоки, а саме: Головна, Загальна інформа-

ція про факультет, Навчання, Факультети, Твор-

чість. Графічні елементи гармонійно виконані,

дотримано єдиний стиль виконання, гармоній-

но підібрано кольорову палітра (червоно-сіра

палітра) та шрифти Noto Sans та Roboto Condensed,

які зараз є актуальними. Сайт є адаптивним, що

полегшує користування з мобільних пристроїв.

Сайт факультету мистецтв Національного

педагогічного університету імені М.П. Драгомано-

ва (2021) виглядає менш сучасно і спроектований

не у корпоративному стилі основного сайту (див.

рис. 2). Сайт дотримано у стандартній структурі,

інтерфейс є інтуїтивно зрозумілим з можливі-

стю переходу на будь-яку сторінку сайту із кож-

ного розділу. Сайт містить усі необхідні блоки:

Про факультет, Освітні послуги, Електронний

деканат, Освітні ресурси, Наука, Конкурси та фе-

стивалі. Використовується блакитно-біла кольо-

рова палітра. Однак, у дизайні сайту застосовано

шрифти Vernada та Arial Black, які є не актуаль-

ними і дуже схожими за загальним ознаками,

що робить їх поєднання не раціональним. Також,

до шрифтів додано тіні, що ускладнює читабель-

ність тексту. Іконки не мають загального стилю

дизайну. Сайт має адаптивний дизайн інтерфей-

су під різні пристрої.