После того, как у вас будет готов контент, вы можете приступить к следующему этапу — разработке дизайн-концепции. Это не менее важный и наиболее творческий и интересный этап. Для реализации данного этапа, я рекомендую использовать графический редактор
Figma.
Прежде чем что-то рисовать, нужно собрать референсы — примеры сайтов, которые вам нравятся в плане дизайна. Референсы позволят вам использовать лучшие идеи для своего сайта. Как говорил Пикассо «Хорошие художники — копируют, лучшие — воруют». В нашем случае, достаточно быть хорошим художником — откровенно воровать не надо.
После того как вы собрали подходящие референсы (не более 5, иначе глаза могут разбежаться от обилия интересных идей), можно приступать к разработке дизайн-концепции. Существует множество статей о правилах хорошего дизайна, и я не хочу их повторять. Скажу только, что придерживаюсь принципов «Лучшее — враг хорошего» и «Less is more». Я стремлюсь сделать максимально простое решение, а затем при необходимости его усложнять и «играться со шрифтами».
Лайфхак: когда вы рисуете дизайн-концепцию, вы должны понимать, как это будет реализовано в Тильде. Я часто стараюсь рисовать дизайн с учетом возможностей Тильды, проще говоря, чтобы конкретную часть макета можно было собрать на готовых блоках. Это не значит, что всегда нужно ориентироваться на готовые блоки, но если у вас нет задачи добиться wow-эффекта, лучше держать в голове, как это можно будет собрать в Тильде без лишних трудозатрат.
Другим важным правилом является преемственность. Если у вас есть логотип, используйте цвета из него, не нужно городить огород. Пусть они проходят сквозь весь сайт. Я не рекомендую использовать шаблоны Тильды, но если вы нашли там что-то очень подходящее под ваш контент, вы можете попробовать.
Первый экран — самый важный блок на любом сайте. Известно, что решение продолжить просмотр или уйти с сайта, пользователи принимают за несколько первых секунд нахождения на первом экране сайта. Постарайтесь сделать его максимально цепляющим. Используйте заголовок с УТП и подзаголовок, поясняющий ваше предложение. Используйте тематическое изображение, подкрепляющее УТП и создающее настроение.
Лайфхак: убедитесь, что тексты на первом экране читаемы. Нечитаемый или плохочитаемый текст — основная проблема многих сайтов.
В качестве визуального наполнения сайта я как правило использую фото с
Unsplash и иконки с
SVGrepo. Когда вы поймете, что дизайн-концепция готова, можно переходить к сборке сайта на Тильде.