Разработка дизайна образовательной онлайн-платформы

Требуется создать целостный, современный и удобный пользовательский интерфейс для образовательной платформы. Дизайн должен быть адаптивным и включать версии для веб-сайта и мобильных устройств.

Основные цели проекта

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

Ключевые разделы и функционал для дизайна

1. Личные кабинеты

  • Кабинет ученика: Панель управления с доступом к курсам, прогрессом, заданиями и статистикой.
  • Кабинет преподавателя: Панель для управления курсами, создания уроков и заданий, отслеживания успеваемости студентов.

2. Учебные модули

  • Каталог курсов: Страница с доступными курсами, фильтрами и поиском.
  • Страница курса: Структура курса, список уроков, описание.
  • Страница урока: Интерфейс для просмотра учебных материалов (видео, текст, интерактивные элементы).
  • Задания: Страница с заданиями для выполнения, формой загрузки ответов и обратной связью.

3. Система мотивации и аналитики

  • Рейтинг: Визуализация рейтинга учеников (таблицы, графики).
  • Статистика и прогресс: Наглядное отображение прогресса по курсам, графики успеваемости, отчеты.

Требования к дизайну

  • Чистый, современный и минималистичный стиль.
  • Удобная типографика для чтения больших объемов текста.
  • Продуманная система визуальных компонентов (кнопки, формы, карточки).
  • Единая цветовая палитра и стиль для всех разделов.
  • Прототипы ключевых страниц и пользовательских сценариев.

Ожидаемые результаты

  • Макеты основных страниц в формате Figma, Adobe XD или аналоги.
  • Адаптивные макеты для мобильной версии.
  • Интерактивный прототип для демонстрации ключевых переходов.
  • Гайд по стилю (UI Kit) с компонентами, цветами и шрифтами.

Разработка презентации на основе прототипов Figma

Требуется адаптировать готовый прототип из Figma в полноценную презентацию, строго следуя корпоративному стилю. Необходимо сохранить структуру и содержание исходного макета, используя предоставленный референс по оформлению.