familiia-pr1-1

1.

ПРАКТИЧЕСКАЯ РАБОТА № 1
Электронный колледж
Электронный колледж
Выбранная тема: информационная система для студентов и преподавателей
СЛАЙД 1 · ВИЗУАЛЬНЫЙ СТИЛЬ
Цветовая палитра
Основной
Дополнительный
Нейтральный
Текст
#2563EB
#38BDF8
#E2E8F0
#0F172A
Параметры
оформления
Шрифт
Форма
Линии
Скругление
Liberation Sans
скруглённые
прямоугольники
2 pt для иконок
умеренное
Студент: ____________________________
01
1

2.

ПРАКТИЧЕСКАЯ РАБОТА № 1
Электронный колледж
Логотип системы
Графический знак собран только из редактируемых стандартных фигур
СЛАЙД 2 · ЛОГОТИП
Состав знака
Электронный
колледж
Учёба, расписание и курсы — в одном
интерфейсе
раскрытая книга — обучение
академическая шапочка —
колледж
синий цвет — надёжность
голубой акцент — цифровая
среда
Знак остаётся различимым при уменьшении.
01
2

3.

ПРАКТИЧЕСКАЯ РАБОТА № 1
Электронный колледж
Набор иконок
Пять иконок одинакового размера, цвета и толщины линий
СЛАЙД 3 · ИКОНКИ
Главная
Единый стиль
Профиль
Поиск
Настройки
Уведомления
область 3 × 3 см · линии 2 pt · один цвет · подписи · выравнивание по центру и распределение по горизонтали
01
3

4.

ПРАКТИЧЕСКАЯ РАБОТА № 1
Электронный колледж
Три вида кнопок
Основное, второстепенное и отменяющее действие
СЛАЙД 4 · КНОПКИ
Основная
Второстепенная
Отмена
Главное действие пользователя. Самая
заметная кнопка.
Дополнительное действие без конкуренции
с основным.
Безопасный выход из действия.
Нейтральный визуальный вес.
Сохранить
Подробнее
Отмена
Высота 0,64″ · одинаковое скругление
Высота 0,64″ · одинаковое скругление
Высота 0,64″ · одинаковое скругление
01
4

5.

ПРАКТИЧЕСКАЯ РАБОТА № 1
Электронный колледж
Дополнительный элемент интерфейса
Карточка учебного курса
СЛАЙД 5 · КАРТОЧКА КУРСА
Структура карточки
Основы программирования
01
условное изображение курса
02
название курса
03
фамилия преподавателя
04
процент выполнения
05
кнопка «Продолжить обучение»
Преподаватель: А. В. Петров
Выполнено 72%
Продолжить обучение
Поля, кнопки и иллюстрация собраны из редактируемых
фигур.
01
5

6.

ПРАКТИЧЕСКАЯ РАБОТА № 1
Электронный колледж
Итоговая композиция
Все элементы объединены в один экран информационной системы
СЛАЙД 6 · ИТОГ
Электронн
ый
колледж
Добрый день, студент!
Продолжите обучение с того места, где остановились.
Главная
Основы программирования
Профиль
Поиск
Быстрые действия
Преподаватель: А. В. Петров
Выполнено 72%
Настройки
Продолжить обучение
Сохранить
Подробнее
Отмена
Уведомления
01
6

7.

ПРАКТИЧЕСКАЯ РАБОТА № 1
Электронный колледж
Контрольные вопросы · 1–5
Ответы на контрольные вопросы
КОНТРОЛЬНЫЕ ВОПРОСЫ · 1–5
1
2
3
4
5
Что называют графическим элементом интерфейса?
Для чего информационной системе нужен логотип?
Визуальный объект интерфейса, с которым пользователь взаимодействует или получает
информацию: кнопка, иконка, поле, карточка и т. п.
Он идентифицирует систему, делает её узнаваемой и поддерживает единый визуальный образ.
Почему иконки должны быть выполнены в едином стиле?
Единая геометрия, размер и толщина линий ускоряют распознавание и делают интерфейс
аккуратным.
Чем основная кнопка отличается от второстепенной?
Основная выделяет главное действие цветом и контрастом; второстепенная имеет меньший
визуальный приоритет.
Для чего используется кнопка отмены?
Чтобы безопасно выйти из текущего действия, не применяя изменения или не выполняя
операцию.
01
7

8.

ПРАКТИЧЕСКАЯ РАБОТА № 1
Электронный колледж
Контрольные вопросы · 6–10
Ответы на контрольные вопросы
КОНТРОЛЬНЫЕ ВОПРОСЫ · 6–10
6
7
8
9
10
Почему не рекомендуется использовать много цветов?
Избыточная палитра создаёт визуальный шум, ухудшает иерархию и снижает целостность
интерфейса.
Как цвет помогает показать назначение элемента?
Цвет обозначает приоритет, состояние и смысл: основной цвет — действие, нейтральный — фон,
акцент — выделение.
Для чего применяется выравнивание?
Чтобы объекты образовывали понятную сетку, сохраняли одинаковые отступы и выглядели
организованно.
Что такое группировка объектов?
Объединение нескольких фигур в один управляемый объект для совместного перемещения,
масштабирования и форматирования.
Почему важно сохранять редактируемый файл?
Он позволяет преподавателю проверить построение элементов, а студенту — исправлять и
дорабатывать работу без пересоздания.
01
8