Дизайн страницы Фитнес-тренера

Дизайн landing page фитнес тренер
Первый экран

При создании прототипа страницы первым делом составил текстовое наполнение.

Далее создал прототип страницы и наполнил его текстом. Для вдохновения использовал макеты ярких работ найденных на behance. Этот этап представляет собой расстановку серых блоков на белом фоне. Для того чтобы ни чего не отвлекало от наполнения. Обязательно были соблюдены моменты учитывающие гештальт-принципы в дизайне.

Прототип

Следующий этап подборка изображений. Которые бы передавали стиль страницы. Привлекали бы внимание и расставляли акценты.

Далее добавление акцентных цветов. Подборка шрифтов. Расстановка элементов на страницы с учётом отступов и колоночной сетки.

Фитнес-тренер

Для большего удобства разбил каждый экран на отдельные изображения.

Дизайн landing page фитнес тренер
Первый экран
Дизайн landing page фитнес тренер
Второй экран
Дизайн landing page фитнес тренер
Третий экран
Дизайн landing page фитнес тренер
Четвёртый экран
Дизайн landing page фитнес тренер
Пятый экран
Дизайн landing page фитнес тренер
Шестой экран
Дизайн landing page фитнес тренер
Седьмой экран
Дизайн landing page фитнес тренер
Восьмой экран

Далее создал страницу WordPress с использование Elementor. Ссылка на готовый одностраничник. Также была отдельно разработана адаптивная версия под мобильные и планшетные устройства.

Также добавил готовый макет в социальные сети:

Facebook

VK

Dribbble

Behance