Инструкция по созданию продающего сайта

Часть 10. Мой рецепт дизайна + запуск

Обобщающая 10-я финальная тема.

Мой рецепт создания дизайна продающего сайта:

  • Делаем дизайн в минималистичном стиле, чистый дизайн и много светлых тонов. Это позволяет сайту загружаться быстрее, он читабельный, быстрее делается и дешевле.
  • Использовать реальные фото (если это возможно) или реалистичные фото (если берете со стоков) и немного дать им обработки. Где то высветлить, где то придать чуть больше резкости или привести всё к одной цветовой стилистике. Все делаем чтобы вызвать доверие фотоконтентом.
  • Использовать плоские качественные иконки. Иногда можно использовать и 3d иконки, главное чтобы это не вызывало излишней работы в фотошопе и подобных программах по обработке. С простыми плоскими иконками сайт будет быстрее загружаться и их легче собрать в текстовый модуль.
  • Цвету также особое внимание, он должен создавать атмосферу. Лучше именно цветом, а не графикой. Создать атмосферу графикой это долго и придется помучиться.
  • Четкий ритм блоков, чтобы структурировать информацию
  • Небольшие текстовые модули, которые доносят смыслы
  • Много форм и кнопок. Они должны быть правильно спроектированы и оформлены. Количеством и качеством мы максимально увеличиваем конверсию
  • Легкая анимация выделяет главные смыслы.
  • Лендинг 12-20 блоков. Презентуем продукт, вызываем доверие, закрываем на действие.
С таким набором лендинг делается быстро, легко редактируется, с ним просто работать даже без специальных знаний. И главное такой дизайн не выглядит слишком пресно, с него интересно изучать смыслы и главное это дает конверсию, лидов и деньги. Не забываем про эту конечную цель.

Поиск референсов

Переходим к поиску вдохновения и референсов. У нас уже есть прототип, мы понимаем какие блоки нам понадобятся. Если мы делать будем шаблонный дизайн в Тильде или другом конструкторе, то можем не заморачиваться с поиском вдохновения, а уже приступать. Если же мы делаем уникальный дизайн, то нам нужно найти примеры тех идей которые нам нравятся и отталкиваться от них. Очень сложно придумать, что-то не видя примеры.

Поэтому я рекомендую для каждого блока из прототипа найти по 2-4 примера как сделаны подобные блоки. Нужно сделать скриншоты этих блоков и разбить по папка с названием каждого блока. Где искать идеи. Я использую следующий набор ресурсов где черпаю вдохновение. Давайте посмотрим что каждый из себя представляет.

Где сделать лендинг:

Разработка на стандартных шаблонных блоках. Самый лучший и простой способ для новичка. Рекомендую шаблонные блоки на конструкторах: Tilda, Craftum, Creatium.

Можно сделать в Тильде в Zero-Block редакторе. Он простой, есть все основное, делать в нем быстрее так как делая дизайн код делается автоматически. В этом случае я рекомендую нанять специалиста по Тильде. Это дешевле чем изучить с нуля все особенности и ограничения платформы.

Второй вариант это векторные редакторы для веб-дизайна. Моя рекомендация - Figma. В ней гораздо больше возможностей чем в тильде, но минус в том что когда вы сделали дизайн его нужно переносить в тильду или нанимать верстальщика ручную верстку.

Если вы планируете зарабатывать на создании сайтов и лендингов, то вам придется прокачивать свои навыки.

Начните копировать хорошие сайты + регулярно отсматривайте классные проекты и выделяйте в них хорошие идеи и пытайтесь их повторить. Это лучший способ отработки навыков, внимательности и получения шишек. Развивает мышечную память, скорость работы, развивает находчивость. Запоминаются первые паттерны для будущих проектов.

На эту тему я бы хотел привести отрывок из "Кради как художник"
«В мире нет ничего абсолютно оригинального. Даже великие творцы много смотрели по сторонам и интегрировали идеи в своё творчество. Не выдавайте чужое за своё, а берите идеи и улучшайте их. Не факт, что все слышали про эти идеи, поэтому повторить никогда не помешает. При этом важно следить за тем, какие идеи вы коллекционируете. Мусор на входе — мусор на выходе»
Инструкция по созданию продающего сайта
Made on
Tilda