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

Она служит для информирования пользователя и для удобства навигации по материалам платформы.

Обычно в сайдбаре отображаются:

• Меню навигации (курсы, модули, уроки, задания, тесты и т. д.);
• Профиль пользователя (фото, имя, статус, баланс монет и бонусных рублей и др.);
• Быстрые ссылки на важные разделы;
• Уведомления или счетчики активности;
• Статистика обучения (например, прогресс прохождения курсов);
• Календарь событий;
• Рекламные баннеры, upsale, cross-sale;
• Темы оформления или языковые настройки.

Ширина сайдбара, как правило, меньше, чем ширина основного контентного блока, что позволяет сосредоточить внимание пользователя на текущих задачах, сохраняя при этом доступность навигации и ключевой информации.

Как правило, над созданием сайдбара работают сразу несколько специалистов: 

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

Важно: привлекайте технического специалиста на этапе проектирования сайдбара совместно с методологом и дизайнером, чтобы учесть технические ограничения платформы, и не столкнуться с ними уже на этапе верстки.

Ниже приведены варианты оформления сайдбаров не только от специалистов malkova.group, чтобы показать вам максимум вариантов для наглядности, поскольку чаще всего сайдбар — это, во-первых, творческая задача для методолога и дизайнера, а технически мы можем реализовать практически любой вариант.

Прогресс-барам посвящен отдельный раздел на нашем сайте — какие показатели можно вывести на шкалу, какие бывают варианты дизайна.

Рекламная и прочая важная информация может размещаться не только на боковой панели в сайдбаре, но и в любой другой части экрана, а также в виде временного всплывающего блока при открытии личного кабинета.

Прогресс-бар: рейтинги, шкалы достижений >>>

Другие кейсы по оформлению личного кабинета пользователя на Геткурс >>>