Разработка дизайна приложения по проведению музыкальных занятий онлайн – Mooze App

О проекте:

Mooze собрал в себе все преимущества видеочатов и самые необходимые функции музыкальных приложений, чтобы сделать онлайн-уроки музыки более удобными. Не нужно ничего скачивать или устанавливать. В окне браузера все работает! Тренируйтесь где хотите, улучшайте свои навыки и создавайте музыкальные шедевры.

Наша роль:

Команда Mooze обратилась к нам за помощью в разработке визуального стиля приложения. Нам предоставили детальные прототипы и Moodboard. Так же необходимо было уделить особое внимание при разработке таких модулей, как метроном, плеер, микшер.

Мы составили план работ, в котором разбили задачу на шаги:

1. Анализ Moodboard;

2. Проработка и выбор визуального стиля, в котором будем прорисовывать весь интерфейс приложения;

3. Прорисовка всех экранов на основе выбранного стиля;

4. Составление UI Kit для разработки.

Рассказываем обо все по порядку.

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

На основе анализа Moodboard, мы прорисовали три варианта концепции главного экрана в светлой и темной теме и показали их команде Mooze.

Клиенту понравился Concept #3, как разделяется верхняя и боковая панель от центральной области, а так же плеер и иконки. По цветовой гамме и проработке метронома больше понравился Concept #1. Мы зафиксировали все пожелания и приступили к детальной прорисовке макетов.

Фрагменты форм создания новой комнаты, авторизации и настройки устройства при входе в сессию.

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

С модулями Mooze все необходимые функции под рукой. Нет необходимости покидать приложение и искать метроном или плеер в сторонних сервисах. Не нужно искать системные настройки звука, ведь с помощью микшера можно настроить громкость метронома, плеера, партнеров. А с помощью чата можно отправлять сообщения и файлы. И все это в одном пространстве.

Позволяет рисовать, размещать и удалять объекты, добавлять заметки и ключи к хосту, устанавливать схемы, добавлять тексты и картинки. Режим документа PDF также доступен для работы.

После завершения записи файл добавляется в список видео. Вы можете посмотреть видео сразу в видеоплеере или воспроизвести демо для собеседника. В десктопной версии расширен функционал видеопроекта: акцент сделан на более широкое взаимодействие со звуковыми дорожками записей.

Mooze – преимущественно браузерное приложение, поэтому мы подготовили адаптивные версии для мобильных устройств.

Также была разработана темная версия Mooze. Каждый пользователь может выбрать и настроить удобное для себя пространство.

Наша команда создала более 100 элементов руководства по стилю, включая систему шрифтов, иконки, кнопки и другие элементы управления. Мы начали создавать UI Kit с самых первых этапов прорисовки, а затем дополняли ее по мере прорисовки всего функционала.

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

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