Внутренние продукты Qubeek.io

Когда я пришёл в Qubeek.io, я был новичком в UX/UI-дизайне. Сначала занимался мелкими задачами и улучшениями, но позже получил возможность разработать полноценный сервис с нуля. Это был мой первый серьёзный опыт создания внутренних B2B-инструментов, которые потом внедрялись в реальные образовательные платформы и университеты.

Продолжительность: Декабрь 2021 — Июль 2022 (8 месяцев)

Продолжительность: Декабрь 2021 — Июль 2022 (8 месяцев)

Продолжительность: Декабрь 2021 — Июль 2022 (8 месяцев)

Моя роль: UX/UI-дизайнер (Junior)

Платформы: Веб

О компании

Qubeek.io занимается разработкой цифровых решений, которые можно легко развернуть в инфраструктуре заказчика. Внутренние продукты компании — это самостоятельные платформы с широким API, встроенной аналитикой и полной изолированностью. Но на момент моего прихода многие из них нуждались в редизайне и улучшении UX.

Моя роль

  • Улучшение визуальной части и юзабилити интерфейсов;

  • Проработка экранов и фич на основе сценариев, предложенных продактами;

  • Поддержка новых и существующих интерфейсов;

  • Подготовка компонентов и UI-решений для внедрения;

  • Взаимодействие с разработчиками и обсуждение фидбека.

Ключевые вызовы

  • Оптимизировать пользовательский опыт во внутренних инструментах;

  • Участвовать в разработке новых модулей и интерфейсов;

  • Улучшить визуальное восприятие и удобство работы в продуктах.

Что я спроектировал

  1. Образовательная среда

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

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

Интерфейс прохождения теста простой и понятный. Есть иллюстрации, таймер, уровень сложности и счётчик попыток. Я сосредоточился на читаемости и удобстве, чтобы ничто не отвлекало от вопросов.

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

Создание программы — это удобное рабочее пространство администратора. Контент добавляется в один клик, структура остаётся наглядной и легко редактируется.

Администратор видит, сколько участников в программе, кто онлайн и как меняется вовлечённость. Ниже — весь контент курса. Всё собрано в одном окне для управления и анализа.

Конструктор опросов позволяет настраивать вопросы — тип ответа, обязательность, порядок вариантов. Всё редактируется сразу, без лишних шагов. Интерфейс простой и удобный даже для новичков.

  1. Встраиваемые чаты

Полноценное чат-решение с адаптивными настройками, включающее все привычные функции популярных мессенджеров.

Я спроектировал чат-модуль с нуля — от логики до визуала. Интерфейс получился знакомым и понятным, с быстрым доступом к уведомлениям.

Чат поддерживает все базовые функции: сообщения, вложения, статусы и быстрые ответы. Я сделал акцент на скорости и простоте, чтобы ничего не отвлекало от задачи.

Создание чата оформлено как модальное окно с поиском и фильтрами. Добавлен предпросмотр активности, что упрощает выбор участников в больших командах.

  1. Редактор текста

Позволяет создавать полноэкранные материалы с медиафайлами и удобной вёрсткой за считанные минуты.

Редактор позволяет сосредиться на тексте без лишнего шума. Блоки, изображения и форматирование добавляются в один клик. Сетка и drag-and-drop делают его удобным для любых публикаций.

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

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

Слева находится библиотека блоков, справа — меню с настройками типографики, стилей и отступов. Такой подход объединяет визуальное и точное редактирование без перегрузки.

  1. Дополнительные инструменты

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

  • Таблицы и фильтры — управление данными;

  • Spotlight-поиск — быстрый доступ к контенту;

  • Превью ссылок — ориентирование внутри системы;

  • Блок-схемы — позволяют собирать логические конструкции с действиями, условиями и развилками. Я добавил типовые элементы, масштабирование и мини-карту. Инструмент подходит для интерфейсов и бизнес-процессов.

Что я сделал

  • Участвовал в анализе аналогов и решениях UI-задач;

  • Создавал макеты и экраны на основе требований;

  • Работал над визуальной чистотой и единообразием компонентов;

  • Поддерживал реализацию интерфейсов и проверял результат в разработке.

Результаты

  • Обновлены 3 полноценных продукта;

  • Спроектированы и внедрены новые инструменты (чаты, редактор, блок-схемы);

  • Улучшен визуальный язык и интерфейсы;

  • Решения успешно внедрены реальные в образовательные платформы.

Чему я научился

  • Перешёл от правок к более самостоятельной проектной работе;

  • Получил уверенность в UI-проектировании;

  • Понял, как адаптировать дизайн под готовую техническую базу;

  • Научился грамотно обсуждать визуальные решения;

  • Осознал важность системности даже в небольших задачах.

Завершение

Работа в Qubeek.io стала для меня важным этапом: я впервые почувствовал уверенность в себе как дизайнер. Эти внутренние продукты не становились публичными, но они помогали другим платформам работать лучше. Я горжусь, что приложил к ним руку и стал частью командной системы улучшений.

Даниил Кургузов