Веб-дизайн: курсы для детей 5-11 классов
создание макетов сайтов
- Введение
- для чего нужен веб-дизайн (ui / ux)
- виды сайтов:
- -- лендинг
- -- интернет-магазин / каталог
- -- корпоративный сайт
- -- визитка
- универсальные знания в веб-дизайне
- Композиция
- базовые понятия композиции: учимся делать акценты (цвет / размер / вертикальный, горизонтальный ритм / динамика)
- сетки в web дизайне
- -- бутстрап
- -- базовая сетка 8px
- -- золотое сечение
- Цвет
- влияние цвета на восприятие
- варианты цветовых схем
- ресурсы для подбора схем
- Типографика в веб
- основные принципы
- что такое кернинг, трекинг, интерлиньяж, длина строки
- работа с заголовками
- работа с текстовыми блоками
- Работа с изображениями
- разрешения макетов
- виды графики на сайте
- текст и фотографии
- Основные элементы и разделы сайта
- header: составляющие элементы и варианты их размещения
- меню: варианты реализации
- footer
- первый экран
- карточка товара
- превью новостей/статей/продукта
- pop-up окно
- Популярные разрешения экранов и как с ними работать
- DPI, PPI, частота, ретина, 4K, множители и тд.
- Принципы вовлекающего дизайна
- закрываем основную потребность
- работаем на любопытстве
- создаем эмпатию
- работа с контрастами
- персонализация
- основные ошибки
- UX
- для чего нужен UX
- составляем портрет пользователя
- паттерны поведения
- поиск проблемы и постановка задачи (не забываем про заказчика)
- Разработка концепций
- поиск идей для сайта
- подбор референсов
- создание мудбордов
- Разработка прототипа главной страницы в программе Axure
- основные требования к макетам в web
- знакомство интерфейсом программы
- отрисовка прототипа на основе концепта
- работа с различными разрешениями экрана
- добавление интерактива
- Внутренние страницы
- карточка товара
- список каталога
- контакты
- о нас
- UI
- 10 правил хорошего пользовательского интерфейса
- создание и использование ui kit
- Иконки в интерфейсе
- как правильно использовать?
- стили иконок
- разработка собственных иконок
- Инфографика
- преимущества использования
- виды и типы инфографики
- -- числовая
- -- список
- -- процесс
- применение
- Мобильная версия: особенности дизайна
- mobile first
- шапка и меню в мобильной версии
- особенности кнопок, шрифтов и элементов навигации
- работа с таблицами
- Подготовка к верстке
- форматы
- подготовка медиа
- масштабирование шрифтов, иконок и кнопок
- Портфолио
- ресурсы
- как наработать
- определяем работы для портфолио
- Шаблоны
- особенности и преимущества
- недостатки
- популярные сервисы
- Соцсети
- разработка общего стиля групп, пабликов и публикаций в разных соцсетях
- разработка баннеров для соцсетей
- технические требования
