Описание
Фриланс-проект
Даты работ
Июнь 2025 - Июль 2025
Библиотека
Material UI (MUI)
Пользователи
Опытные пользователи ПК и создатели контента, использующие ИИ-озвучку для видео, игр и проектов
Задача
С нуля проработать логику и спроектировать десктопное приложение
Моя роль
Дизайнер на все руки
У заказчика была только идея и работающий код, поэтому я занималась всем остальным
Процесс работы
Особенности
Нет команды
Только я и заказчик-разработчик
MVP
Конечно хотелось сразу сделать вау, но ресурсы и время не позволяли. Поэтому делали упор на работоспособность, а не красоту
Сбор требований
Основы
Разобралась, как устроен код и логика работы приложения. Вместе с заказчиком определили ключевые задачи продукта, изучили пользовательские роли и боли, сформировали Value Proposition Canvas
От общего к частному
Погрузилась в предметную область, выстроила карту основных кейсов и в несколько итераций декомпозировала их до конкретных сценариев
Проработали UF
На финальном этапе оформила верхнеуровневый User Flow. Он помог согласовать понимание сценариев и стал базой для перехода к проектированию интерфейса
Главные страницы и сценарии
Верхнеуровневый User Flow
Проработали логику
Варфреймы
Далее я визуализировала основные сценарии на чб макетах, чтобы быстро проверить структуру, выявить неочевидные шаги, зафиксировать особенность/ограничения и убрать лишнее
Проектирование
Выбор библиотеки
После анализа ограничений и масштабов проекта выбрали Material UI, разрботчику было проще всего работать именно с ней
UI
Все ключевые сценарии и зависимости были проработаны заранее - оставалось быстро собрать чистый, логичный интерфейс
Вайрфреймы
Вайрфреймы
Результат
Что сделано
Интерфейс и логика
Создан интерфейс десктопного приложения, который получился устойчивым к изменениям и удобным для масштабирования
Продолжение следует
После запуска я продолжу дорабатывать продукт - оптимизирую сценарии, соберу фидбек от пользователей и внесу улучшения по результатам реального использования
Страница авторизации по коду доступа
Стартовая страница. Макеты реализованы с помощью библиотеки Material UI (MUI) без кастома
Рабочая область. Выполнена в тёмной теме с привычными паттернами работы с разметкой - так удобнее работать с текстом. Решение подтверждено глубинными интервью. Интерфейс разделён на две сворачиваемые панели: слева - список спикеров с исходной и сгенерированной озвучкой, справа - настройки озвучки реплик
Список проектов пользователя
Библиотека сгенерированных голосов, которые можно переиспользовать в своем проекте
Чему научилась
Работать с ограничениями
Библиотека оказалась не очень гибкой, в плане UI, поэтому пришлось решать, как получить хорошее решение без гибких компонентов
Узнала как работает ИИ озвучка
Было очень интересно погрузиться в процесс работы приложения, понять какие есть ограничения, настройки и как в целом ML-моделька синтезирует голоса