КАК ДИЗАЙН САЙТА ВЛИЯЕТ НА ВАШЕ ПОДСОЗНАНИЕ И ПОЧЕМУ ВЫ КЛИКАЕТЕ РАНЬШЕ, ЧЕМ УСПЕВАЕТЕ ПОДУМАТЬ. Основатель digital-агентства CopySpace Светлана Сушкова.
Я регулярно делюсь практическими находками, разбираю тренды и показываю, как использовать ИИ в работе и жизни без сложных инструкций.
Telegram: https://t.me/super_lumenal
TenChat: https://m.tenchat.ru/u/oydYtPQQ
MAХ: https://max.ru/id9721107290_biz
Также приглашаю на мой марафон «Говори с ИИ». Если вы слышали про нейросети, но до сих пор не понимаете, что именно им писать и как встроить ИИ в свою жизнь, приходите на первый урок, который стартует уже 11 августа.
Вступить бесплатно: http://sveta-ai.ru
Покажу, как правильно ставить задачи нейросети и использовать её так, чтобы действительно экономить своё время.
Ежедневно вы пролистываете сотни разных страниц, а открываете от силы пару-тройку. И что самое интересное, скорее всего вы даже не осознаете, почему одни закрываете моментально, а на других залипаете на полчаса. Вот в этом и вся специфика дизайна: он работает на вас, пока вы еще ничего не поняли.
Что успевает произойти за первую секунду?
Мозгу нужны доли секунды, чтобы оценить страницу целиком. Он не читает заголовок, он смотрит на общую картинку и по ней выносит вердикт. Примерно такой:
- трастовый сайт или подозрительный;
- дорого тут или дешево;
- остаться или сразу уйти.
А дальше вы будете читать текст, сравнивать цены, искать отзывы. Но по сути просто подбирать аргументы под решение, которое уже приняли. Обиднее всего, конечно, тем, кто месяц писал текст на главную.
Почему пустота на странице стоит дороже слов?
Представьте страницу дорогих часов: один товар по центру, вокруг огромные пустые поля, из текста одна строчка и цена. А теперь вспомните карточку на маркетплейсе, где и скидка, и рейтинг, и значки доставки, и «осталось мало».
Оба магазина занимаются одним и тем же, просто говорят разное:
Работает это примерно как в музее:
Одна картина на голой стене выглядит ценнее, чем та же картина в куче других на плотно завешанной галерее. Мозг рассуждает так: если вокруг ничего не отвлекает, значит вещь важная, раз ей дали столько места.
Отсюда растет мода последних лет на почти пустые лендинги у больших брендов. Многим кажется, что дизайнеры просто выпендриваются, но это чистый расчет: тишина на странице читается как уверенность.
Обратная сторона, о которой пишут реже:
Прием продолжает работать, даже когда вы про него знаете. Я сама регулярно ловлю себя: захожу на страницу, где один предмет и белое поле вокруг, цену еще не увидела, а внутри уже готовность к тому, что будет дорого.
Но пустота срабатывает только тогда, когда товар тянет на заявленный уровень. Поставьте обычную футболку за тысячу рублей на белый экран с подписью в три слова – получится не премиум, а претензия. Разрыв люди считывают моментально, обычно с раздражением.
Форма всегда обгоняет смысл
Ровная сетка, одинаковые отступы, два шрифта максимум – и вы уже доверяете, хотя еще не разобрались, что вам предлагают. Кривая верстка и пять шрифтов работают в обратную сторону, даже если внутри лежит отличный материал.
Хотите проверить на себе? Откройте два случайных сайта в соседних вкладках и засеките, за сколько секунд вы решили, какому доверяете больше.
Но скорость загрузки тоже часть дизайна
Страница, которая думает четыре секунды, воспринимается как менее надежная. Даже если потом откроется идеальная верстка, ожидание уже записалось вам в минус.
Проверяется за минуту: откройте свой сайт с телефона на мобильном интернете, а не с домашнего вайфая. Многие после такого эксперимента заметно затихают.
Вам врали – цвет не решает
Синий про доверие, красный про срочность, зеленый про экологию – эту табличку читали примерно все, а толку от нее около нуля. Я серьезно. Мозг воспринимает не цвет как таковой, а цвет на фоне всего остального.
Красная кнопка на чистом белом фоне действительно притягивает взгляд. Та же кнопка на пестрой странице с десятком ярких элементов просто растворяется. Контраст тут важнее оттенка. А еще важнее гармония визуала, ибо без нее гость закроет страницу уже спустя пару секунд.
Тренды и то, что вы не замечали
Приглушенные, слегка выцветшие палитры вместо неона и капслока. И это опять про подсознание: спокойный цвет считывается как «нам нечего доказывать», а кислотный баннер вызывает рефлекс закрыть вкладку.
Отдельная история – темная тема, которая теперь стоит по умолчанию чуть ли не везде. Тут работают сразу три вещи:
- глазам легче при долгом просмотре, особенно вечером;
- темный интерфейс ощущается приватнее, как разговор вполголоса;
- появляется оттенок статуса, примерно как в затемненном ресторане еда кажется дороже, чем при ярком свете столовой.
Показательно, что темную тему ставят не только соцсети ради экономии батареи, но и банковские приложения, где батарея вообще ни при чем. Попробуйте спросить у знакомых, почему такое приложение кажется им серьезнее. Никто толком не объяснит.
Шрифт говорит раньше, чем слова
Про шрифты обычно вспоминают в последнюю очередь, а зря. Тут та же история, что с цветом: работает не сам шрифт, а ассоциация, которую он тянет за собой.
- тонкая антиква с засечками читается как «дорого и с историей»;
- жирный рубленый гротеск – как «современно, быстро, для молодых»;
- рукописный шрифт – как «делали руками, небольшая мастерская»;
- системный шрифт по умолчанию – как «здесь не заморачивались».
Последний пункт не всегда минус, кстати. Для новостного сайта или сервиса нейтральный системный шрифт как раз работает на доверие, потому что не отвлекает от сути.
Проблемы начинаются, когда шрифт спорит с продуктом. Детский центр с холодным техническим гротеском или юридическая фирма с округлым дружелюбным шрифтом вызывают легкое ощущение подвоха, хотя человек не сможет объяснить, что именно его смутило.
Мелочи, на которые вы точно отреагируете
Тут нормальный дизайн заканчивается и начинается откровенное продавливание:
- таймер обратного отсчета и «осталось 2 места», хотя мест обычно вагон;
- галочка на подписку, проставленная заранее, в расчете что вы поленитесь ее снять;
- фото человека, который смотрит прямо на кнопку, потому что ваш взгляд пойдет туда же;
- лента без конца, чтобы не возникало момента, когда мозг скажет «все, хватит»;
- яркая кнопка «согласен» и бледная серая «отказаться» рядом с ней.
Формально никто не врет, вся информация на странице есть. Просто расставлено так, чтобы вы нажали раньше, чем начнете вчитываться в условия.
Где все-таки эта граница?
Сами по себе приемы нейтральные, половина живет в обычном добротном интерфейсе и никого не обманывает. Вопрос в том, зачем их туда поставили.
Тест простой: уберите со страницы таймер, счетчик и цветовую разницу между кнопками, дайте человеку решить без давления. Если решение изменится, значит это была не забота о пользователе.
Что с этим делать тем, кто ведет свой сайт?
Форма влияет на восприятие в любом случае, так что лучше управлять этим осознанно:
- оставьте воздух вокруг главного, не заполняйте каждый пиксель;
- выберите два шрифта и не добавляйте третий;
- уберите всё, что мигает, крутится и требует срочно решать;
- проверьте, как страница выглядит с телефона на медленном интернете.
Ни один пункт не требует бюджета на дизайнера. Зато любой из них заметит читатель в первую же секунду. Так что посмотрите на свою страницу глазами человека, который зашел случайно и никуда не торопится. Что он поймет про вас за первую секунду, пока еще ничего не прочитал?