Дослідження застосування золотого перетину у web-дизайні презентация

ХМЕЛЬНИЦЬКОГО ЛІЦЕЮ №17

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

Дослідження застосування «золотого перетину» у веб-дизайні

ширина контенту і розділюється на 1.618.
створюється базисна сітка сайту, що відповідає золотій пропорції.
при ширині контенту в 1000 пікселів ширина однієї панелі складе:
1000 / 1.618 = 618 пікселів.
Тоді ширина іншої:
1000 - 618 = 382 пікселі.

поділяється на дві частини відповідно за золотою пропорцією по вертикалі та по горизонталі.
на перетині умовних прямих знаходиться точка, яка називається «зоровим центром».

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

в 960х750 пікселів поділ
здійснюється:
поділ ширини на 3 ( 320 пікселів);
поділ висоти сторінки на 3
((750+960)/2)/3≈285 пікселів.
побудова сітки з дев'яти прямокутників,
розміром 320×285 пікселів

в дизайні емблеми ліцею

в дизайні емблеми ліцею

в дизайні емблеми ліцею

в дизайні емблеми ліцею

в процесі створення веб-сторінок сайту початкової школи

ширина контенту 990 пікселів;
ширина лівої зони 606 пікселів,
а бокової - 374 пікселів;
поле між зонами відведено
10 пікселів

в процесі створення веб-сторінок сайту початкової школи

ширину екрану 990 пікселів;
ширина контенту 606 пікселів,
а бокова зона 374 пікселів;
поле між зонами відведено
10 пікселів
висоти зон складають
311 та 503 пікселів

в процесі створення веб-сторінок сайту початкової школи

ширину екрану 990 пікселів;
ширина контенту 606 пікселів,
а бокова зона 374 пікселів;
поле між зонами відведено
10 пікселів
висоти зон складають
503 та 311 пікселів

в процесі створення веб-сторінок сайту початкової школи


висоти заголовочної та
інформаційна зон мають
співвідношення 1.62,
а саме 383 до 619 пікселів

в процесі створення веб-сторінок сайту початкової школи

в процесі створення веб-сторінок сайту початкової школи
Застосування зорових центрів

в процесі створення веб-сторінок сайту початкової школи
Застосування правила третин

«золотого перетину» у веб-дизайні сайту початкової школи

Оцінка здійснена опитуванням
дітей та їх батьків
Критерії юзабіліті:
інтуїтивність
запам’ятовуваність
помилки
задоволеність

веб-сайту
Рівень інтуїтивності сайту

веб-сайту
Рівень запам’ятовуваності користувачами сайту

веб-сайту
Рівень помилок користувачів при користуванні сайтом

веб-сайту
Рівень задоволеності користувачів сайтом

веб-сайту

веб-сайту

веб-сайтів та наведено основні методи його застосування;
для доведення ефективності застосування особливостей «золотого перетину» створено дизайн веб-сайт початкової школи Хмельницького ліцею №17, який ґрунтується на принципах «золотого перетину»;
з метою оцінки ефективності та переваг застосування принципів «золотого перетину» у веб-дизайні було здійснено оцінку юзабіліті створеного сайту шляхом проведення тестування сайту школярами та їх батьками. Дана оцінка дозволяє визначити такі якісні характеристики, як зручність та легкість сприйняття користувачем елементів інтерфейсу. Результати проведеного тестування дали підставу говорити про високий рівень юзабіліті сайту, дизайн якого побудовано за принципами «золотого перерізу».
Результати дослідження демонструють якісні переваги, ефективність та можливість досягнення застосування гармонійного і збалансованого дизайну сайту при залученні принципів «золотого перетину» у веб-дизайні.