Разработка сайта и его интеграция в образовательную среду GetCourse
задачи
•Разработка прототипа сайта •Разработка дизайна для десктопной, планшетной и мобильной версии сайта •Верстка сайта в GetCourse •Наполнение сайта
результат
•Разработали прототип в Figma на основе предоставленной информации •Опираясь на брендбук разработали дизайн десктопной, планшетной, мобильной версии •Сверстали дизайн в GetCourse
1. Сбор информации
Вначале необходимо собрать всю информацию для работы по проекту. Запросили у заказчика брендбук, тз на сайт (текстовое содержание, фотографии), примеры сайтов которые нравятся.
Скрин тз:
2. Разработка прототипа
По полученному тз сделали прототипы страниц сайта.
Скрин прототипа:
3. Разработка концепции дизайна
На основе прототипа главной страницы разработали 3 версии концепции дизайна. Были определенные ограничения, в рамках которых приходилось варьировать.
Скрин 3 макетов главной страницы:
4. Разработка дизайна страниц
Согласовав на примере главной страницы общую концепцию дизайна, приступили к дизайну остальных страниц.
Скрин дизайна всех страниц:
Все работы делали в Figma. Готовый дизайн всегда можно отправить заказчику по ссылке, где он может посмотреть, как всё выглядит на компьютере или телефоне. Очень удобно.
Пример отображения дизайна на разных устройствах через Figma:
5. Верстка сайта на GetCourse
Получив доступы к образовательной среде заказчика в GetCourse, приступили к верстке согласованного дизайна.
Грамотно выстроенная поэтапная работа помогает нам лучше понимать заказчика, а ему даёт понимание финального результата. Ожидания соответствуют реальности. В итоге заказчик доволен, и мы тоже).