Визуальный язык выстраивается на контрасте между темно-фиолетовыми игровыми изображениями и выровненной по центру белой типографикой в hero-секции. Такое начало закладывает динамичный, технологичный стиль, а кремовая карточка в блоке преимуществ создает более светлую журнальную поверхность для пояснений. Круглое кадрирование фотографий смягчает общую геометрию и снова встречается в разделе бесплатных игр, где наложенные друг на друга кадры и цветные круги формируют многослойную композицию, не нарушая общую палитру.
Три белые карточки преимуществ служат повторяющимся визуальным мотивом, позволяющим гармонично распределять связанную информацию по всему макету. В отличие от них, раздел лучших ПК-игр использует крупное изображение, цветные формы и текстовую карусель, придавая ключевым материалам больше динамики. Баннер игровых гаджетов возвращает внимание к темному фотофону с контурной кнопкой, а блок технологий VR сочетает белую карточку с большим изображением и вертикальными цветными панелями. Подобные переходы привносят разнообразие в рамки единой дизайн-системы.
Индивидуальность дизайна строится на гармонии элементов, а не на одном доминирующем цвете: темные фотополя задают атмосферу, кремовые и белые поверхности обеспечивают удобство чтения, круглые акценты добавляют мягкости, а выразительные заголовки расставляют смысловые акценты. Иконки социальных сетей и контактный блок логично завершают страницу в том же ключе. В итоге формируется стиль игрового медиа, сохраняющий свою узнаваемость при любых обновлениях изображений, текстов и ключевых тем.
При использовании Конструктор веб-сайтов вы сможете настраивать цвета, шрифты, верхний и нижний колонтитулы, макет, столбцы и другие элементы дизайна, а также контент и изображения.
Используйте Настройки темы, чтобы установить визуальную основу веб-сайта на всех его страницах и в разделах. Задайте глобальные цвета, шрифты и типографику, чтобы сайт следовал одному и тому же направлению дизайна, а не оформлял каждую страницу независимо.
Выберите цветовую схему и сочетание шрифтов, соответствующие характеру веб-сайта, затем точно настройте заголовки H1-H6, обычный текст, ссылки, кнопки, цитаты, списки и другие стили типографики. Последовательное использование этих настроек помогает создать четкую визуальную иерархию и обеспечивает узнаваемость повторяющихся элементов дизайна на всем веб-сайте.
Используйте Анимационные эффекты, чтобы сделать дизайн веб-сайта более динамичным и интерактивным. Элементы и контейнеры могут использовать такие эффекты, как «Запуск при отображении», «Анимация при наведении курсора» и «Анимация, синхронизированная с прокруткой», чтобы добавлять контент по мере перемещения посетителей по сайту или в ответ на действия пользователя. Предварительно настроенные анимации предоставляют готовые эффекты, которые можно адаптировать к визуальному стилю веб-сайта.
Примените единое направление дизайна к общим элементам веб-сайта, таким как заголовок, меню и нижний колонтитул. Панель настроек темы объединяет общие элементы управления стилем для всего сайта, упрощая поддержание скоординированного внешнего вида по мере расширения веб-сайта на несколько страниц.
Этот рабочий процесс делает шаблон полезной отправной точкой для создания веб-сайта с единой визуальной идентичностью, согласованными цветами и типографикой, общими правилами дизайна и интерактивными эффектами на всех его страницах.