®ancora
| digital agency
CodeFit — платформа
по изучению Ruby
дизайн сайта и интерфейса для онлайн-платформы по обучению программированию на языке Ruby
заказчик
CodeFit.Bot
срок реализации
180 дней
cервис помогает изучить язык программирования Ruby, чтобы получить профессию с хорошей оплатой
CodeFit — это сервис
с онлайн-уроками, которые помогают быстро освоить полезный навык
главная задача:
создать дизайн сайта, игровые механики
и интерфейс платформы
дополнительно надо создать понятную
дизайн-систему для сторонних разработчиков
CodeFit — это платформа, которая поможет легко изучать язык программирования
даже новичкам
О компании
в начале работы надо было изучить будущих пользователей и их запросы
задачи проекта
основной задачей было создание проекта, который будет понятен и интересен для пользователей
сделали подробный анализ данных, чтобы понять все преимущества обучения, а также продумали логику и тезисы, которые надо использовать
в дизайне
начало работы
мы провели несколько интервью с заказчиком, чтобы лучше узнать образовательную методику
основные этапы
основные этапы
смотри далее
исследование потребителей
01 / 08
запросы и потребности
Провели исследование целевой аудитории, чтобы понять, как их заинтересовать в продукте.
ожидания и опасения
Узнали, что они могут ожидать от обучения и чего опасаются.
Проектирование и логика
02 / 08
создали логическую структуру, которая последовательно и мягко знакомит пользователей с новым продуктом
придумали механику вводных уроков, чтобы показать легкость в обучении
01
02
копирайтинг для проекта
03 / 08
написали простые и понятные тексты,
которые рассказывают про все преимуществах обучения
объяснили, как и где можно применять полученные навыки, чтобы получать хорошую зарплату
копирайтинг для проекта
03 / 08
написали простые и понятные тексты, которые рассказывают про все преимуществах обучения
объяснили, как и где можно применять полученные навыки, чтобы получать хорошую зарплату
дизайн сайта и графика
04 / 08
стиль и шрифт
Мы придумали основного персонажа для проекта и графические элементы стиля. Выбрали подходящий шрифт для тематики программирования
адаптивные версии
Нарисовали дизайн сайта для разных разрешения экранов, чтобы всё и везде выглядело красиво и аккуратно.
интерфейс платформы
05 / 08
придумали дизайн интерфейса
для образовательной платформы,
на которой будет проходить обучение
не только нарисовали, но и продумали удобство пользования платформой
дизайн-система
06 / 08
для того, чтобы дизайн был аккуратно перенес в код, создали понятную дизайн-систему
в ней были учтены важные элементы сайта во всех возможных состояниях
дизайн-система
06/ 08
для того, чтобы дизайн был аккуратно перенес в код, создали понятную дизайн-систему
в ней были учтены важные элементы сайта во всех возможных состояниях
моушн-ролик
07 / 08
создали анимационный ролик, в котором показали работу интерактивных элементов
от анимации разных текстовых
блоков, до работы вводных уроков
по программированию
дизайн-надзор
08 / 08
01
Во время разработки сайта, были
в постоянном контакте с разработчиками.
никуда не пропадаем
02
Помогали ребятам с переносом дизайна.
всегда готовы помочь
03
Оперативно отвечали на все вопросы по проекту.
быстрая обратная связь