Файл: Визуальная концепция сайта.pdf

Также не малозначительную роль контент играет в SEO-продвижении. Решив раскрутить сайт этим способом, контент должен быть оптимизирован, а статьи написаны по продающей структуре с использованием семантического ядра. Рекомендуем не экономить на контенте и обратиться в веб-студию или, на крайний случай, к фрилансеру.

2.2. Психологические аспекты при создании интерфейса

Юзабильный веб-дизайн — концепция, ставшая незаменимой в течение последнего десятилетия. Сайты или лендинги, отвечающие новейшим требованиям дизайна и юзабилити, необходимы любому бизнесу. Но насколько в действительности успех ресурса зависит от качества дизайна?

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

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

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

Приведем несколько примеров того, как визуальная привлекательность способствует успеху бизнеса в целом.

1. Привлечение внимания

Людям нравится смотреть на красивые вещи, и если есть выбор, они всегда предпочтут красивый, симпатичный объект уродливому или даже нейтральному.

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

Рис.10. Пример целевой страницы

Целевая страница Angry Birds Space — прекрасный пример работы по привлечению внимания. Сразу после загрузки взгляд посетителя падает на большую желтую луну, оттуда переводится на заголовок «Angry Birds Space», а затем сразу на изображения персонажей игры. После чего пользователи видят простую инструкцию по навигации и стрелку с призывом к действию.

Рис.11. Пример целевой страницы

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

2. Первое впечатление

Наше первое впечатление от встречи с человеком может повлиять на отношения с ним в долгосрочной перспективе. В течение нескольких минут (если не секунд) мы принимаем решение о том, нравится ли нам человек, и стоит ли общаться с ним дальше.

В интернет-среде происходит то же самое — если ресурс оказал негативное впечатление, то вряд ли посетитель вернется туда. А изменить первое впечатление очень непросто, потому что люди упрямы и не любят признавать свои ошибки.

Рис.12. Пример портфолио-лендинга

У актрисы Анна Сафрончик (Anna Safroncik) очень красивый лендинг-портфолио. Сила дизайна выражается в удачной фотографии, используемой для демонстрации таланта и различных аспектов характера Анны. Фото очень профессиональны, элегантны и утонченны.

Рис.13. Пример лендинга

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

3. Построение отношений

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

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

Рис.14. Пример лендинга мероприятия

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

4. Повышение лояльности

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

Рис.15. Пример сайта Wired.co.uk (версия 1)

Сайт Wired.co.uk выполнен в двух версиях. Первая — довольно формальная, официальная версия со стандартным дизайном. Вторая — альтернативная и творческая, с весьма абстрактным макетом. Этот вариант описывается как «еще один способ просмотра контента Wired.co.uk» — он не так понятен, как официальная версия, и менее структурирован.

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

Рис.16. Пример сайта Wired.co.uk (версия 2)

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

5. Влияние на эмоции

Хорошее изображение стоит тысячи слов — это особенно верно при общении на эмоциональном уровне. Через фото и прочие визуальные элементы можно передать чувства: радость, восторг, печаль, и даже жалость. Кроме того, можно разбудить воспоминания и эмоции, такие как доверие, комфорт, надежду и уверенность в себе — сильные, позитивные чувства, способные привлечь посетителей, и подсадить их на «эмоциональный крючок».

Рис.17. Пример сайта Paypal

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

Выводы по второй главе

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

В параграфе 2.2. представлен анализ психологической привлекательности веб-проекта для клиентов. Обозначены основные аспекты, на которые необходимо обратить особое внимание.

Заключение

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

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

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

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

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

В ходе проведенного исследования, с чего начинается создания сайта, раскрыли основные блоки и необходимые этапы разработки веб-проекта.

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

Список литературы

1. Мандругин В.В. Психологические аспекты интерфейса в проектировании дизайна веб-ГИС // Интерэкспо Гео-Сибирь. 2012. №. URL: https://cyberleninka.ru/article/n/psihologicheskie-aspekty-interfeysa-v-proektirovanii-dizayna-veb-gis (дата обращения: 23.12.2019).
2. 5 принципов визуальной привлекательности современного веб-дизайна [Электронный ресурс] Режим доступа URL https://lpgenerator.ru/blog/2014/05/16/5-principov-vizualnoj-privlekatelnosti-sovremennogo-veb-dizajna/
3. Анализ по количеству запросов [Электронный ресурс] Режим доступа https://trends.google.ru/trend
4. В чем заключается актуальность сегодня современного сайта [Электронный ресурс] Режим доступа URL https://nischenko.ru/polezno-pochitat/v-chem-zaklyuchaetsya-aktualnost-sozdaniya-sovremennogo-sajta.html