+7 (812) 703-02-02 info@hse.spbstu.ru

Семестр 2. Дизайн интерфейсов

C 8 класса | 12 занятий | Очно или онлайн

Длительность курса: 78 ак. часов (12 занятий по 4 ак. часа + 30 часов домашней работы)

О чём курс

Интернет стал необходимой частью жизни любого человека. Сайты учат, развлекают, информируют, помогают делать покупки. С одними сайтами «общаться» интересно и легко. Другие сайты требуют от посетителей дополнительных усилий как поиску, так и по восприятию контента. Задача веб-дизайнера – создать удобный и понятный графический интерфейс («внешний вид») сайта. Как и в любой другой области дизайна, при разработке веб-интерфейса необходимы знания и навыки применения принципов композиции, цветовой гармонии. При разработке веб-интерфейса дополнительно надо учитывать возможности технологий по размещению информации на веб-странице.

Цель курса – сформировать целостное впечатление о профессии веб-дизайнера, дать навыки практической работы в современных программных средствах и сервисах.

Чему научим

В результате обучения учащиеся получат знания и навыки в следующих областях:

  • Основные законы композиции в применении к интерактивной среде.
  • Цветовые модели, применение цвета на веб-странице.
  • Основы проектирования пользовательских интерфейсов (UI).
  • Организация взаимодействия пользователя с сайтом (UX).
  • Современные стили и принципы веб-дизайна.
  • Разработка логической структуры сайта и системы навигации.
  • Создание макета сайта адаптируемого дизайна (для разных типов устройс.тв)
  • Подготовка служебной и иллюстративной графики для веб-страниц.
  • Разработка гида по стилю.
  • Создание анимированных баннеров.

Занятие 1

Формирование концепции сайта. Графический интерфейс пользователя

  • Понятие графического интерфейса веб-сайта.
  • Профессии в области дизайна сайтов.
  • Формирование концепции сайта (бриф) .

Обзор интерфейса программы Adobe Photoshop

  • Основные инструменты.
  • Слои.

Занятие 2

Цвет, композиция в веб-дизайне. Форматы веб-графики

  • Цветовые модели. Основные характеристики цвета.
  • Принципы, законы, средства композиции.
  • Форматы веб-графики.

Занятие 3

Типографика. Иконографика

  • Основные характеристики шрифта.
  • Инструменты для работы с текстом в Adobe Photoshop.
  • Дизайн иконок для веб-страницы.

Занятие 4

Визуализация информации – инфографика

  • Алгоритм создания инфографики.
  • Паттерны инфографики.

Занятие 5

UX-дизайн – проектирование взаимодействия

  • Основы UX-дизайна.
  • Основные виды прототипов веб-интерфейсов.
  • Навигация веб-ресурса.

Занятие 6

Модульные сетки

  • Типы модульных сеток. параметры.
  • Правило третей, правило золотого сечения.

Занятие 7

Адаптируемый дизайн

  • Понятие адаптируемого дизайна, основные составляющие.
  • Модульные сетки адаптивного дизайна.
  • Навигация мобильных сайтов.

Занятие 8

UI-дизайн. Гид по стилю

  • Основы UX-дизайна.
  • Стили в веб-дизайне.
  • Состав и применение популярных дизайн-систем.

Занятие 9

Дизайн и Интернет-маркетинг

  • Баннеры: форматы, основные параметры.
  • Основные элементы интерфейса интернет-магазина.

Занятие 10

Веб-формы. Галереи изображений

  • Веб-формы: основные типы полей.
  • Галерея изображений.
  • Эффекты для изображений в интерактивной галерее.

Занятие 11

Нарезка графического макета сайта

  • Подготовка макета веб-страницы к нарезке.
  • Служебная и иллюстративная графика.

Занятие 12

Работа над курсовым проектом

Стоимость

24 500 ₽

Социальные скидки для многодетных и других категорий семей.
Скидки по акциям.
Можно оформить налоговый вычет по расходам на обучение - 13%.

Как поступить

Для тех, кто ещё не учится в АИШ:

  • Вступительное тестирование

Для уже обучающихся в АИШ:

  • Азы HTML и CSS или Основы веб-дизайна
Тест № ВКТ-556 Основы HTML и CSS (для АИШ)

Необходимые знания и навыки для успешного прохождения тестирования:

  • Понятие тега
  • Понятие селектора
  • Адрес ресурса
  • Знание основных тегов HTML:
    • разметка теста
    • списки
    • таблицы
    • структурные элементы (шапка, навигация, основное содержимое, доп. содержимое, подвал, раздел, статья)
    • формы и элементы форм
    • изображения
  • Понятие CSS-свойства и его значения
  • Знание основных CSS-свойств:
    • гарнитура шрифта
    • размер текста
    • высота строки
    • размеры блока
    • отступы и поля
    • обтекание
    • цвет текста
    • фон элемента
    • тени
    • гибкая раскладка (flexbox)
    • сетка (grid)
    • медиа-запросы
    • границы
    • единицы измерения
    • позиционирование элементов
    • анимация перехода
  • Многоколоночная верстка
  • Адаптивная верстка

В результате прохождения тестирования необходимо набрать не менее 60 баллов.

Длительность: 45 минут. Количество попыток: 2.

Как записаться на занятия

Если ребёнок уже обучается

оставьте заявку в Личном кабинете

Если ребёнок ещё не обучается

заполните форму

воскресенье 26.01.2025 - 18.05.2025 онлайн 10:00 - 13:30

Группа
111.02.03
Свободных мест: 6
Аудитория
№207
ул. Обручевых, д.1, вход с ул. Гидротехников
среда 29.01.2025 - 23.04.2025 онлайн 18:00 - 21:30

Группа
111.02.01
Свободных мест: 8
Аудитория
№211
ул. Обручевых, д.1, вход с ул. Гидротехников
пятница 31.01.2025 - 25.04.2025 онлайн 18:00 - 21:30

Группа
111.02.02
Свободных мест: 5
Аудитория
№211
ул. Обручевых, д.1, вход с ул. Гидротехников

Выберите группу

Академия информатики для школьников в цифрах

20 лет

успешной работы
в Политехническом университете Петра Великого

10

направлений обучения

83

учебные программы

2 800

школьников
проходят обучение
ежегодно

151

выпускник АИШ
в 2023 году поступил
в Политехнический университет

4

учебные площадки

36

компьютерных классов