Разработка прогресс-бара с маскотом для онлайн-школы
Задача
К нам обратились за разработкой прогресс-бара с маскотом для онлайн-школы.
Нужно было сделать персонажа Шерлока Холмса, который растет вместе с пользователем.
Пользователь получает больше знаний — Шерлок растет и становится мудрее.
У каждого этапа должны быть свои мотивирующие пользователя фразы. Словно Шерлок обращается к нам.
Дизайн
Сначала поискал другие прогресс-бары, которые были бы связаны с персонажем.
Схематически примерил, как прогресс-бар будет смотреться в боковой панели.
Далее сделал несколько первых вариантов
Попробовал другую композицию и сгенерировал несколько изображений.
Фон показался скучным, поэтому добавил туда фон с элементами из мира Шерлока
Дальше пошел процесс поиска места для фразы
Итоговый вариант
Чтобы эти 7 стадий персонажа появились, пришлось генерировать варианты в Midjourney. Много вариантов. Важно было добиться не просто нужного возраста, а ещё и схожесть лиц.
И помимо генерации новых изображений, нужно было корректировать эмоции на некоторых из них
Редактор
This browser does not support the video element.
Хотите такого же в свою школу? Его уже можно приобрести в магазине. Настраивается за один день и прокачивает мотивацию учеников.