Приветствую Вас на моем Я.Дзен канале посвященному Веб-дизайну.
Сегодня я хочу рассказать о процессе создания лендинга – для линейки туалетной воды для мужчин Feromon 47.
Надеюсь этой статьей закрыть все вопросы связанные с этапами создания лендинга.
Заполнение брифа с заказчиком.
Начнем с того момента, когда у вас уже есть заказчик, вы даже созвонились и обсудили некоторые моменты относительно будущего проекта.
Именно бриф поможет Вам получить базовое представление о будущем сайте. Составляйте такие вопросы, что бы понять заказчика как можно лучше. Ниже представлен пример заполненного брила.
У заказчика сайта был запрос — должна обязательно присутствовать тема мощи воды или водопада. Собственно поэтому, одним из главных цветов сайта стал бирюзовый цвет.
При этом сайт должен иметь нестандарнтые решения и красивые фоны.
Более того, лендинг не должен быть сложным и длинным.
Я думаю мне удалось выполнить все указаные пункты.
Я часами вдохновлялась идеями о будущем сайте на биханс и наконец пришла к итоговому решению. Чуть ниже вы можете посмотреть фотографии которые послужили моему вдохновению.
Анализ конкурентов.
Как оказалось: ниша туалетной воды, причем не важно для кого: для мужчин или для женщин, достаточно конкурентная сфера. При этом, конкуренты достаточно сильны и отстроится от них достаточно сложно.
Я потратила достаточно долгое время, чтобы найти то что отстроит заказчика от конкурентов, при этом будет соответствовать всем выдвинутым требованиям в рифе.
Персоны
Для начала поясню, кто это такие и почему вдруг они появились на данном этапе нашего проектирования. В веб-дизайне персоной называют описание вымышленного человека, основанное на целевой аудитории продукта. Дизайн персону, можно называть «образцовым пользователем». Его создание помогает погрузиться в продукт и понять поведение реальных людей, которое можно использовать в процессе создания дизайна.
На основе анализа целевой аудитории конкуренов и представленной информации заказчиком, было создано две персоны.
Благодаря их созданию, было определено, в каком порядке презентовать продукт на сайте и какая информация будет более актуальна для реальных посетителей сайта.
Создание прототипа
На черно белом эскизе сайта, лучше всего рассматривать так называемый «скелет» сайта.
На эскизе нас ничего не должно отвлекать от главной цели. Никакого дизайна, крутых шрифтов и классных фотографий. Только расположение элементов, текста и заголовков.
Так мы быстро разберемся, нравится нам такое наполнение сайта или нет.
Создание дизайна сайта. Типографика и цветовая палитра.
Цвета
Почему был использован бирюзовый цвет – я пояснила выше. Именно этот цвет – дает нужную отсылку к водопадам и мощи, которую попросил передать на сайте заказчик.
Ацентный Золотой, придает сайту эффект дороговизны и статустности. Все-таки продукт оценивается по стоимости выше среднего, и нам надо привлечь нужную целевую аудиторию, которая заинтересуется продуктом, будет покупать и останется довольна в результате.
Шрифты
Шрифт Russo One относится к категориям гротески, для заголовков. Не имеет засечек. Достаточно объёмный, хорошо акцентирует внимание на заголовках. Стильный и современный.
Шрифт Manrope является вариативным шрифтом и относится к категориям гротески. не имеет засечек. Лёгок в чтении больших объёмов текста.
Стандартные цвета , не привлекающие внимания, и не мешающие воспринимать информацию на сайте.
Именно эта шрифтовая пара поддерживает визуальное оформление сайта.
Ну а завершает это оформление стильно подобраные видео и фотографии. Именно они делают сайт живым и отличают его от конкурентов.
Итоговый вариант кейса вы можете посмотреть по ссылке: https://www.behance.net/gallery/148717821/koncept-lendinga-Feromon47
Ну а я хочу дополнить, что бывает что все идет более чем идеально: муза не покидает Вас и подкидывает Вам крутые идеи, а заказчик – идеальный понимающий человек. И бывает наоборот. В такие моменты главное не отчаиваться, и приложить больше усилий для достижения необходимого результата.
Буду рада конструктивной критике, мнениям, впечатлениям.
Спасибо за внимание ;)
#веб-дизайн #лендинг #прототип #этапы #крутой сайт