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

Содержание:

Введение

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

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

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

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

Всем вышеизложенным обусловлена актуальность темы курсовой работы

Объектом исследования являются визуальные коммуникации или интернет-каналы в визуальных коммуникациях.

Предмет исследования - графические концепции в интернете.

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

Целью курсовой работы является анализ концепции сайта конкретного объекта.

Исходя из цели курсовой работы, были сформулированы следующие задачи:

1. Раскрыть сущность графической концепции, ее роль в проектировании сайтов

2. Описать принципы создания концепции конкретного сайта

3. Проанализировать имеющиеся стилеобразующие элементы сайта.

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

Глава 1. Виды и роль графической концепции сайта

1.1. Понятие «концепция сайта»

Концепция сайта — это первый результат дизайна сайта в широком смысле этого слова (в дальнейшем я буду употреблять его именно так, понимая под ним процесс проектирования и создания сайта). И первое, что, на наш взгляд, необходимо оценивать (не в коммерческом смысле этого слова, а в смысле «получить качественную оценку»).

К задачам концепции сайта следует отнести:

1. Определить основные идеи и направления развития и согласовать их с клиентом.
2. Получить оценку этих идей от будущих пользователей.
3. Сформировать идеологическую базу, единое видение проекта у всех участников.

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

Концепция дизайна проекта в большинстве случаев разрабатывается в интересах всего рекламного продвижения. Без четкого плана продвижения продукта концепция дизайна не будет работать эффективно. Обособлено от рекламного продвижения она является не больше, чем простым описанием. В глазах потребителя, два одинаковых продукта от разных производителей отличаются дизайном, качеством и ценой. Это и есть конкурентная борьба за покупателя в прямом смысле, когда выбор конкретного товара остается только за потребителем. Дополнительный весомый фактор формируется рекламной кампанией в СМИ и интернете, рекламной полиграфией, что в совокупности и дает конечный результат – доверие покупателя и, как следствие, высокие продажи. Отдельно заслуживает внимания концепция дизайна сайта, разрабатываемая в рамках всей дизайн концепции проекта.

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

Удачный пример внедрения концепции дизайна - анонс и реклама музыкального альбома Random Access Memories (2013) популярного французского дуэта Daft Punk. Тщательно продуманные визуальные образы, воплощенные в дизайн концепции проекта, использовались на протяжении всей кампании. Костюмы роботов стали практически культовыми благодаря тому, что как нельзя лучше отражают ценности любителей электронной музыки. А при демонстрации ряда визуальных элементов, они безошибочно идентифицируются и работают на бренд.

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

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

1.2. Виды сайтов и их назначение

К основным видам относятся следующие:

• Интернет-магазин;
• Сайт-каталог;
• Корпоративный сайт;
• Сайт-визитка;
• Продающий сайт (landing page);
• Промо-сайт
• Информационный портал.

Рассмотрим каждый из них более подробно.

Интернет-магазины и сайты-каталоги

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

Рис.1. Изображение сайта интернет-магазина

Корпоративные сайты

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

Рис.2. Корпоративный сайт

Сайт-визитка

Сайт-визитка – отличный стартап для новичков и тех, кто в будущем желает заказать крупный интернет-проект. Если ваш бизнес находится на стадии организации и начальных этапах развития, то недорогой сайт-визитка станет выгодным и оптимальным выбором. Стоит заметить, что четкого определения сайта-визитки нет и. По сути, он может ничем не отличаться от корпоративного^[1].

Рис.3. Сайт-визитка

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

Лэндинги

Landing Page (продающий сайт, посадочная/целевая страница), как правило, нацелен продавать один товар или услугу. Это может быть новинка на рынке или продукт, который необходимо реализовать в короткие сроки. Это самый прибыльный вид сайта, он лишен большого количества текстовой информации и интерактивен и действует до момента достижения своей цели. (Рисунок 4)

Промо-сайты

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

Рис.4. Лэндинги

Рис.5. Промо-сайты

Порталы

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

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

Рис.6. Портал

Выводы к 1 главе

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

Проведенное исследование теоретических составляющих позволило окончательно сформировать понимание о том, как необходимо реализовывать проект по созданию сайта.

Глава 2 . Реализация проекта по созданию сайта

2.1. Этапы проектирования сайта и их характеристика

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

В различных источниках существует множество классификаций, но остановим свой выбор на 7 ступенчатой классификации по созданию сайтов, представленных в обучающих лекциях на платформе Tilda, которая является одним из передовых инструментов по созданию (проектированию) сайтов^[2].

Данная классификация включает в себя:

1. Идея и структура: разработка UX стратегии и поиск креативной концепции

2. Исследование: анализ конкурентов, трендов, исследование стилей

3.Прототип: проработка пользовательских сценариев

4. Контент: поиск и аккумулирование информации

5. Дизайн: проработка деталей, создание визуального образа

6. Реализация: выбор инструментария и контроль

7.Запуск: тестирование и запуск проекта

Рассмотрим более подробно каждый из элементов.

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

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

Например, возьмем проект по разработке лэндинга для школы дизайна.

Цель: объяснить потенциальным потребителям, кто такой дизайнер.

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

Задача: помочь будущим студентам разобраться в специализациях и понять, какая именно им подходит.

Рис.7. Страница сайта школы дизайна^[3]

Обозначить целевую аудиторию. Этом можно сделать при помощи создания так называемого аватара клиента. Аватар клиента можно составить, ответив на ряд вопросов:

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

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

Далее – определитесь с популярностью ниши в областном регионе или стране. Для этого проанализируйте количество запросов потенциальных клиентов в поисковых системах. Чем больше запросов, тем актуальнее предложение и возможность получить большую прибыль, но и тем выше конкуренция и сложность раскрутки сайта в Интернете. Можно использовать разные сервисы. Одним из наиболее простых является google trends. Ниже на графике мы видим график популярности по запросу «современная школа дизайна»

Рис.8. График запросов в поисковике Google^[4]

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

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

После проведенного анализа и сбора информации, следующим шагом будет определение вида сайта. 

Последний организационный момент – поиск поставщика. От этого зависит качество ваших продаж, наличие полного ассортимента товаров и цены. Найти поставщика можно 4 способами:

• Воспользоваться поисковой системой;
• Посетить тематические выставки, конференции или ярмарки;
• Обратиться к местному производителю;
• Обратиться к поставщикам конкурентов.

От ответственности и репутации поставщика частично зависит ваш бизнес, поэтому отнеситесь к выбору серьезно: оцените его ценообразование, условия оплаты, сроки поставки и только после займитесь проектированием бизнеса.

Выбор имени компании и домена сайта

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

Уделите внимание выбору доменной зоны. Она влияет на регион продвижения сайта. Не скупитесь и арендуйте домен из основных зон (ru, net, com, org, ua и т.д.), так как они лучше ранжируются поисковиками. После того, как вы выбрали и определились с доменным именем и зоной, обязательно проверьте его на занятость на сайтах, так как большая часть красивых имен уже занята. Если доменное имя уже занято, придется потрудиться и придумать новое, уникальное и запоминающееся.

Необходимо также проверить историю сайта и посмотреть количество ссылочной массы, что можно сделать на сайте www.ahrefs.com или через веб-архив. Также перед арендой доменного имени нужно проверить не попал ли он под фильтр. Это очень важно, так как можно потратить деньги и время на заполнение сайта, а в результате попасть под фильтр поисковика.

Сбор семантического ядра для сайта

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

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

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

Проработка концепции и структуры сайта

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

Например, блоки мобильных телефонов, компьютеров и аксессуаров. Блок мобильных телефонов должен делиться на смартфоны и телефоны, компьютеры на ноутбуки и стационарники, аксессуары на каждую отдельную группу товаров.

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

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

Дизайн сайта

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

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

1. Подбирайте нейтральный фон и правильно сочетайте цвета.

Цвета имеют сильный психологический фактор, поэтому подбирайте оформление в 90% нейтральных цветов и 10% ярких и броских. Красный и другие "ядовитые" цвета могут служить акцентом на какое-либо предложение, не берите их за основу, так как им свойственно вызывать неоднозначные, чаще негативные, эмоции у человека. Фон должен быть нейтральным и не слишком привлекать к себе внимание. Используйте правильное сочетание цветов для сайта. Это может быть градация оттенков, принадлежащих к одной группе, или цвета, которые хорошо сочетаются друг с другом. Поверьте, сочетание красного и зеленого цвета в фоне оттолкнут ваших клиентов и оставят неприятный осадок после посещения сайта.

Рис.9. Сочетания цветов

2. Выбирайте шрифты оптимального цвета и размера.

Слишком крупный шрифт смотрится нелепо, слишком мелкий неразборчиво. Цвет шрифта должен максимально выделяться на фоне. Оптимальный цвет шрифта – черный. Можно выбрать белый, если фон страницы планируется исполнить в темных тонах. Шрифт должен быть разборчивым и читабельным. Воспользуйтесь классическими типами шрифта, не изощряйтесь, если хотите серьезного отношения к сайту и компании.

3. Основывайтесь на факторах UX.

UX (user experience) – термин, который характеризует уровень удовлетворенности посетителя от посещения сайта. Если человеку удобно, и интересно пользоваться и находиться на сайте, то он вернется, если нет, пользователь не вернется и вы потеряете клиента. После того, как дизайн закончен, необходимо самостоятельно проверить, нравится ли визуально он вам или нет.

4. Соответствие выбранному фирменному стилю.

Каждая уважающая себя компания имеет фирменный стиль, который надежно оседает у человека в подсознании. Зайдите на сайт оператора связи МТС или Макдональдс и посмотрите, сайты выполнены в фирменном стиле, без лишних цветов. Продумайте свой фирменный стиль и придерживайтесь его от начала и до конца.

Верстка сайта

Верстка – это создание макета в графических редакторах и преобразование в HTML и CSS-код для просматривания сайта в браузерах. Без верстки сайт останется "картинкой" - нефункциональной и бессмысленной. Ключевой проблемой неправильной верстки может стать некачественное или неудобное отображение сайтов в разных браузерах. Сверстав сайт для Opera, он может по-другому отображаться в Firefox и полностью исказиться в Internet Explorer. Каждый браузер разрабатывается с учетом собственных технологий и правил, поэтому очень важно сверстать сайт кроссбраузерным, чтобы он правильно отображался в любом браузере.

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

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

Наполнение сайта контентом

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

Также не малозначительную роль контент играет в 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

ТОП 9 лучших примеров сайтов-визиток для малого бизнеса 2020 [Электронный ресурс] Режим доступа URL https://impulse-design.com.ua/9-primerov-luchshikh-sajtov-vizitok-dlya-malogo-biznesa.html

Основные этапы работы над веб-проектом [Электронный ресурс] Режим доступа URL http://tilda.education/courses/web-design/basicsteps/

Официальный сайт школы дизайна [Электронный ресурс] Режим доступа URL https://www.designstudy.ru/blog/

1. Анализ по количеству запросов [Электронный ресурс] Режим доступа https://trends.google.ru/trend

Проверка на анти-плагиат

1. ТОП 9 лучших примеров сайтов-визиток для малого бизнеса 2020https://impulse-design.com.ua/9-primerov-luchshikh-sajtov-vizitok-dlya-malogo-biznesa.html ↑

2. Основные этапы работы над веб-проектом [Электронный ресурс] Режим доступа URL http://tilda.education/courses/web-design/basicsteps/ ↑

3. Официальный сайт школы дизайна [Электронный ресурс] Режим доступа URL https://www.designstudy.ru/blog/ ↑

4. Анализ по количеству запросов [Электронный ресурс] Режим доступа https://trends.google.ru/trend ↑