Напрями та інструменти вебдизайну 11-А

Уроки 5, 6

20.09.2024

Відомі вебдизайнери. Інструменти вебдизайну

Урок у Meet о 10.55 за посиланням

Вітаю! Сьогодні говоримо про відомих вебдизайнерів та навчимось основним критеріям оцінки сайтів

Крок 1: Відомі вебдизайнери

👉 Марк Віллер

Арт-директор Microsoft, можна сказати, ікона веб-дизайну, роботи якої відомі практично кожній людині. Спеціалізація – користувальницький досвід, інтеракції і зручні інтерфейси. Один з кращих веб-дизайнерів – Марк Віллер – радує своїх шанувальників авторськими малюнками, а також футуристичним стилем оформлення робіт в Інтернеті.

👉 Критика Кушваха

Дизайнер та ілюстратор з Сан-Франциско, Критика Кушваха, вміє створювати чисті і легкі інтерфейси, максимально приємні для взаємодії з користувачем. Її портфоліо – приклад для всіх, хто хоче створювати одночасно стильні і зручні сайти абсолютно в будь-якій ніші.

Креативний директор київської компанії Vintage. Продуктовий дизайнер, проектувальник інтерфейсів і користувацького досвіду. Роботи Ольги відрізняються своєю різноплановістю. Вона використовує всі доступні дизайнерові інструменти для досягнення потрібного результату: велику типографіку, великі фотографії, анімацію, незвичайні поєднання кольорів, ілюстрації, діагональні форми і лінії. Її роботи виглядають дорого, сучасно, мінімалістично і легко.

Талановитий арт-директор, ілюстратор і дизайнер з Лос-Анджелесу. Володар безлічі нагород. Один з апологетів мінімалізму в веб-дизайні. Він так само, як і Марк Віллер, отримав популярність в якості творця робіт в ніші іміджевого Інтернету. Його девіз – спочатку брендинг, потім дизайн.

👉Анна Дью
UX-дизайнер з Нью-Йорка, який створював проекти для Microsoft, SAP, BarterSugar. Анна вміло поєднує у своїй діяльності мінімалізм і абстракціонізм. Дью також активно використовує флетовую інфографіку, лінії, геометричні фігури, домагаючись максимальної архітектурності своїх творінь.


Крок 2: Приклади сайтів з поганим дизайном

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

Крок 3: Приклади найкращих сайтів


👉Крок 4:Практична робота
Проаналізувати інтерфейс сайту, яким ти найчастіше користуєшся, за такими категоріями (від 0 до 10 балів):
  • Креативність
  • Шрифт та колір
  • Ілюстрації
  • Навігація
  • Зручність

____________________________________

Уроки 3, 4

13.09.2024

Інформаційна структура сайтів

Урок у Meet о 10.55 за посиланням

Вітаю! Сьогодні розглянемо, як гарно організувати сайт. Від якісної структури залежить дуже багато: якою буде аудиторія, як довго вони затримаються на сторінці...

Крок 1: Типи сайтів

 Опрацюй презентацію за посиланням

👉Крок 2:Практична робота

Створи структуру інформаційного сайту або інтернет-магазину

💪Крок 3: Приклади сайтів

Карпати

PetHelp

Освітній хаб Києва

__________________________________________________

Уроки 1, 2

06.09.2024

Види та типи сайтів. Основні тренди у вебдизайні

Урок у Meet о 10.55 за посиланням

Вітаю! Сьогодні розглянемо типи сайтів, подивимось приклади гарної верстки сайтів та почнемо планувати власний проєкт

Крок 1: Типи сайтів

Шаблони для інтернет-магазинів

Шаблон лендінг сайту

XTiles








Крок 2: Які популярні стилі?

 - необруталізм

Сайти в стилі необруталізму підійдуть для брендів або продуктів, націлених на креативний прошарок аудиторії. Такі великі компанії, як Figma та Gumroad, вже підлаштували дизайни сайтів під цей напрямок.

 - ретро

 - мінімалізм

Мінімалізм у контексті вебдизайну має безліч плюсів:

  • - Швидке завантаження сайту
  • - Проста навігація
  • - Легше зробити адаптивний вебдизайн
  • - Більше можливостей для SEO-просування
  • - Менше лагів 
  • - Дизайн протягом багатьох років виглядає актуальним

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


👉Крок 3: Які технології популярні?
💫Доповнена реальність (Virtual Try-OnVirtual Try-On ikea)
💫Інтерактивність
💫 Використання ШІ

👉Крок 4: Практична робота

Створюємо проєкт у середовищі XTiles

На цьому тижні ти маєш обрати тему для створення проєкту. 

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

Опис ідеї (тема; який контент буде розміщено; чи будуть сторінки-вкладки, якщо так, то які)  надсилай на електронну скриньку teacheritschool1@gmail.com

Немає коментарів:

Дописати коментар