• Август 12, 2016

Зачем нужна реалистичность в дизайне?

Аккуратный дизайн

или мелочи решают все

Добрый день, читатели нашего блога! Сегодня хотел поделиться с вами нашими наблюдениями относительно того, зачем нужны аккуратность и реалистичность в дизайне, а особенно — в продающем дизайне. Да и вообще — поразмышлять на эту тему вместе с вами.

Зачем нужна реалистичность в дизайне?

реалистичность в дизайне

Уже в течение 2016 мы в наших проектах — а именно в дизайне посадочных страниц и сайтов — как реализуем принцип реалистичной демонстрации самого продукта, так и уделяем много времени деталям элементов веб-дизайна. Я говорю о типографике, тенях, сложных оттенках, текстурах и эффектах hovera, а также смысловой анимации в тех разделах страницы, где нам необходимо дополнительно привлечь внимание пользователя.

Давайте порассуждаем на тему «какую роль играет аккуратность и реалистичность в продающем дизайне».

Когда человек хочет совершить покупку какого либо товара или услуги в интернете, то какие элементы на сайте могут и будут вызывать у него доверие и при этом интуитивно подталкивать к покупке?

Тут приходят на ум слова великого рекламщика Дэвида Огилви, который убежден, что при рекламе любого товара нужно всегда демонстрировать сам товар.

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

Мы подбираем варианты образов продукта на основе проведенного маркетингового анализа целевой аудитории (ЦА) и общей человеческой психологии.

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

Более подробно о написании текстов и заголовков читайте в нашем блоге в разделе «Копирайтинг». Мне же сегодня хочется поговорить о разных мелочах дизайна и о том, как сделать текст более легко усвояемым и удобочитаемым. Но обо всем — по порядку!

1. Текст надо любить

реалистичность в дизайне

Здесь я не буду детально вдаваться в правила типографики, потому что книг по этому вопросу и без того написано много. Я же лишь попытаюсь объяснить, в чем смысл этих правил.

Я думаю, каждый из нас попадал на страницы сайтов, где информация (а именно — текст) представлена в таком неприглядном виде, что прочитать и усвоить ее очень тяжело, даже если она и интересна сама по себе. В результате для того, чтобы прочесть, а тем более усвоить текст, от читающего требуются дополнительные усилия.

Отсюда давайте сделаем вывод, что текст нельзя просто взять и «бросить» на страницу сайта, как будто это бесполезная вещь.

Поэтому, чтобы текст, написанный копирайтером, был прочитан и понят, над ним стоит потрудиться.

Мы в Zolle при создании нашего продукта уделяем тексту особое внимание. Работаем с пропорциями шрифтов, межстрочными интервалами, заголовками и основным текстом.

Главное правило — текст должен легко читаться и при этом общее восприятие текстового блока должно быть естественным относительно основного контента страницы.

Итог — текст любит, когда его бережно «причешут» и с любовью закомпонуют в нужном месте, это поможет раскрыть его силу и смысл. Если Вам интересно, как нужно правильно относиться к тексту, то прочтите книгу «Основы стиля в типографике» Роберта Брингхерста. Текст в ней приятно читать и воспринимать. В общем, это мой образец работы с текстом.

2. Тени, текстуры, цвета

реалистичность в дизайне

В этой главе я бы хотел рассказать Вам о таких мелочах, как тени, текстуры, простые цвета и сложные оттенки. Зачем мы используем тени в нашем дизайне? Мы считаем, что правильная тень в дизайне создает там, где это нам необходимо, нужную глубину и добавляет эффект реалистичности тех или иных объектов. Ниже приведены примеры некоторых элементов, созданных по такому принципу.

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

реалистичность в дизайне

Еще один из приемов в дизайне — это использование не чистых цветов (это не касается кнопок на сайте, хотя я не исключаю экспериментов в будущем), а слабых, сложных оттенков и текстуры для основного фона или отдельных блоков страницы.

Что это нам дает? Ведь мы можем взять простой белый, серый или любой другой подходящий цвет и разметить на его фоне элементы дизайна. А можно добавить к этому цвету, например, текстуру бумаги или любой другой подходящий вариант и сделать это блок более «уютным».

Наличие текстуры на фоне помогает глазу «цепляться» за нее и легче отделять текстовое содержание от фона. Но это тоже ситуативный прием.

реалистичность в дизайне

Иногда могут быть использованы и чистые цвета. Все зависит от многих факторов структуры и концепции дизайна. Мы при создании дизайна всегда сравниваем оба варианта (с текстурой и без) для оценки восприятия информации и дизайна в целом.

реалистичность в дизайне

Также мы пробуем экспериментировать с цветовыми оттенками, ищем чуть более сложные сочетания, которые могут дополнить ощущение от продукта или услуги, но это достаточно трудоемко по времени.

реалистичность в дизайне

Хотя я понимаю, что восприятие цветов — это достаточно субъективный процесс и порой очень трудно подобрать подходящую гамму, которая смогла бы усилить ваш дизайн и восприятие продукта в целом. Но, если у Вас это получается это сделать, то общая атмосфера продающего дизайна будет интересной.

Конечно, как и в любом деле, тут очень много «если», которые могут повлиять на подбор цветов и оттенков.

Подытожу. Я хотел донести мысль о том, что использование сложных и непривычных цветов и оттенков в дизайне продающих страниц может создать дополнительную «глубину» Вашему продукту.

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

3. Анимация в продающем дизайне и не только

реалистичность в дизайне

Использование анимации в дизайне, безусловно, может вызвать дополнительный интерес к продукту. Она поможет сделать акцент на необходимом элементе, но здесь главным правилом, как и в медицине, должно быть «не навреди».

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

  1. Первый вариант — анимации нет совсем (или почти нет). Бывают ситуации, когда анимация отсутствует. Такая страница воспринимается достаточно сухо, как будто смотришь одну большую безжизненную картинку. Эффекты «ховера» (наведение на кнопку, элемент страницы и т.д) либо отсутствуют, либо сделаны непродуманно (или, другими словами, «на отвали»).

  2. Второй вариант (наиболее эффективный, на мой взгляд) — это наличие смысловой анимации там, где нам необходимо сфокусировать внимание пользователя. Пример такой анимации можно посмотреть на одном из наших последних проектов по продаже франшизы «Мозгобойня».

    реалистичность в дизайне

  3. Анимация сделана для акцента внимания на определенном блоке, чтобы дополнить и усилить внимание к содержащейся в нем информации.

  4. Третий вариант — это огромное количество всевозможной анимации. Безбожное использование анимации чуть ли не в каждом блоке, paralax-эффекты, мигающие кнопки телефона, всплывающие поп-апы… Все это очень сильно ослабляют восприятие ключевой информации и человек, глядя на все это, вообще может забыть, зачем он пришел на эту страницу.

    реалистичность в дизайне

  5. Поэтому использование анимации и прочих эффектов, на которые реагирует глаз человека, должно быть строго сбалансировано. Такие эффекты должны быть добавлены лишь там, где это может иметь определенный и понятный любому смысл. «Лекарство надо принимать по рецепту, а то оно может и навредить», — это относится и к анимации в целом. Помните об этом, и тогда Ваш дизайн станет более полноценным и эффективным.

Конечно, я рассматриваю в этой статье моменты, которые должны быть в идеальном дизайне. Но жизнь не идеальна и в ней находится место ошибкам, промахам и неудачам.


Все гениальное просто, соблюдайте аккуратность и простоту во всем. Но если к этому добавить те мелочи, о которых мы сегодня с Вами говорили, то у Вас получится создать настоящий (и при этом — эффективный) шедевр в виде продающей страницы или сайта!

Если у Вас есть свои мысли по этому поводу, Вы можете написать нам в комментариях и мы их обязательно с Вами обсудим.

Всем добра!



Статьи в тему