Представление цветового решения
ОТДЕЛЕНИЕ АРХИТЕКТУРА И ДИЗАЙН
Допущен к защите
Руководитель отделения
________________ Л.Е. Желамская
«___» ________________ 2021 г.
ВЫПУСКНАЯ КВАЛИФИКАЦИОННАЯ РАБОТА
| Тема ВКР ______________________________________ |
| Специальность 54.02.01 Дизайн (графический) |
| ДП.54.02.01.1.43.15.ПЗ |
(шифр работы)
| Студент: | Никитенко Максим Александрович | ||||
| (подпись) | (дата) | (Ф.И.О.) | |||
| Руководитель: | Миронова Лариса Игоревна | ||||
| (подпись) | (дата) | (Ф.И.О.) |
Москва 2021
Задание на ДП от колледжа- 1 лист (С ПОДПИСЬЮ ТАМБОВЦЕВА)
Задание на ДП от колледжа- 2 лист
СОДЕРЖАНИЕ
Введение………………………………………………………………………………
1.ТЕОРЕТИЧЕСКИЕ ОСНОВЫ ПРОЕКТИРОВАНИЯ ОБЪЕКТА
1.1.Анализ и описание используемых источников
1.2.Понятие, типы и виды сайта
1.3.Описание сайта
1.3.1.Описание целевой аудитории
1.3.2.Представление цветового решения
1.3.3.Организация композиционного решения
1.4. Факторы, учитываемые при организации предпринимательской деятельности
1.4.1.Анализ конкурентов
1.4.2.Обзор сайтов
2. РАЗРАБОТКА ДИЗАЙН-КОНЦЕПЦИИ ПРОЕКТА
2.1.Разработка технического задания
2.2.Выбор программного обеспечения
2.3.Разработка визуального стиля сайта
2.3.1.Разработка фирменных блоков сайта
2.4.Оформление презентационного щита
3.Технико-экономическое обоснование объекта
Заключение…………………………………………………………………………...
Список используемых источников…………………………………………………..
|
|
|
Введение
На сегодняшний день сложно представить свою жизнь без использования интернета и как следствие посещения сайтов. Сайты есть почти у любого проходящего мероприятия, магазина, начинающего бизнеса или огромной корпорации.
Основная часть удобства использования сайта зависит от удобства и простоты визуальной стилистики. Каждая компания желает создать удобный и функциональный сайт, который повысит продажи и выделит их среди конкурентов.
Поэтому развивающиеся тенденции веб-дизайна направлены на упрощение и адаптацию интерфейса под всех пользователей. Так же данные тенденции сохраняют лучшие решения прошлых лет, для сохранения интуитивности в использовании, за счет чего все сайты имеют общую базу, которую не стоит нарушать.
Целью выпускной квалификационной работы является разработка дизайн концепции сайта для дизайнерского бюро.
Для достижения поставленной цели нам требуется решить следующие задачи:
1. Изучить и проанализировать литературу по теме выпускной квалификационной работы;
2. Провести анализ сайтов конкурентов, для конкретизации основного стиля и интерфейса;
|
|
|
3. Разработать техническое задание для разработки дизайн концепции сайта;
4. Разработать фирменные блоки, из которых будут состоять страницы сайта.
5. Расположить контент по данным блокам, сверстать текстовую составляющую.
ТЕОРЕТИЧЕСКИЕ ОСНОВЫ ПРОЕКТИРОВАНИЯ ОБЪЕКТА
Анализ и описание используемых источников
1. Сайт mir-fin.ru. [Электронный ресурс]. Режим доступа: свободный. https://mir-fin.ru/sait.html.
2. Сайт www.insales.ru. [Электронный ресурс]. Режим доступа: свободный. https://www.insales.ru/blogs/university/celevaja-auditorija
3. Курушин В.Д. Графический дизайн и реклама. Издательство: ДМК Пресс, 272 стр., 2016.
4. Ян В. Сборник графических идей. Издательство: Омега-Л Уайт, 170с., 2017.
5. Николай Большаков. blog.calltouch.ru. [Электронный ресурс] Режим доступа: свободный. https://blog.calltouch.ru/chto-takoe-tselevaya-auditoriya-i-kak-pravilno-ee-opredelit/
6. Чумиков А.Н. Связи с общественностью. Издательство: Москва, 232 с., 2015.
7. Сайт skillbox.ru. [Электронный ресурс]. Режим доступа: свободный. https://skillbox.ru/media/design/razbiraemsya_v_zakonakh_kompozitsii_za_10_minut/
8. Иоханнес И. Искусство цвета. Издательство: Дмитрий Аронов., 2013
Понятие, типы и виды сайта
Сайт – это совокупность электронных документов (файлов) в компьютерной сети, объединенных под одним адресом (доменным именем или IP-адресом).
|
|
|
Совокупность сайтов образуют всемирную паутину (интернет), а паутина в свою очередь объединяет сегменты информации мирового сообщества в единое целое. Специально для прямого доступа пользователей к сайту, был разработан протокол HTTP.
1. Сегодня во всемирной паутине содержится огромное количество самых разных сайтов. Все они отличаются по большому числу параметров. В настоящее время не существует общепринятой системы их классификации. Рассмотрим основные типы сайтов, выделяющиеся по определенным признакам:
2. По цели создания: коммерческие, некоммерческие.
3. По размеру аудитории:
а) простые (сайты-визитки, домашние страницы);
а) тематические, узконаправленные;
б) многофункциональные, интернет - порталы.
4. По доступности:
а) открытые (доступны для любых посетителей);
б) полуоткрытые (необходима регистрация);
в) закрытые (доступны для узкого круга людей).
5. По особенностям представления информации и категориям решаемых задач:
а) интернет - представительства организаций;
б) информационные ресурсы;
в) веб - сервисы (сайты, на которых предоставляются услуги для выполнения определенных задач);
г) социальные сети (комбинированные веб-сервисы).
|
|
|
6. По стилю оформления и функциональности: статические, динамические и флэш-сайты.
а) статические сайты и веб-страницы - это сайты, сделанные по классической технологии html. Статическими они называются потому, что, набирая определённый адрес (URL), соответствующий сайту или его определённой странице, пользователь всегда будет видеть одно и то же содержание. Их плюсы - это простота создания и нетребовательность к аппаратным ресурсам. Они не требуют поддержки скриптов и баз данных и могут быть размещены на абсолютно любом хостинге, при этом они не будут создавать почти никакой нагрузки на сервер;
б) динамические сайты не существуют в неизменном виде на сервере, а формируются при помощи скриптов. Содержание и вид динамической страницы с одним и тем же адресом может быть совершенно различным в зависимости от разных условий - например, в зависимости от времени, от конкретного пользователя, от введённого пользователем запроса и т. п.;
в) flash сайты - это один из самых популярных видов сайтов на сегодня. Вместе с текстом, они позволяют размещать видео. Flash-сайты развиты в графике и представляют собой отличный способ Интернет маркетинга, так как люди воспринимают видео лучше, чем текстовую рекламу. Некоторые типы сайтов в свою очередь подразделяются на различные виды.
Виды сайтов - представительств организаций:
1. Сайт - визитка самый простой из всех видов. Он обычно состоит из нескольких страниц и имеет уникальный, но простой и функциональный дизайн. На нем содержится основная информация о компании, её контактах, деятельности и об основных предоставляемых услугах. Крупные компании редко прибегают к сайтам-визиткам, их заказывают в основном фирмы с не очень большим оборотом и частные лица.
2. Корпоративные сайты характерны для компаний среднего и большого бизнеса. Он представляет полную информацию о компании. Основной его задачей является продвижение бизнеса компании и автоматизация её деятельности. Он включает в себя элементы интернет - магазина, сайта-визитки и информационного ресурса. Такой сайт обладает достаточно сложной системой навигации. Его обновление производится по мере надобности. Корпоративный сайт также автоматизирует деятельность компании и помогает вести бухгалтерский учёт, включена поддержка пользователей в режиме онлайн.
3. Каталог продукции (сайт - каталог с подробным описанием товаров или услуг). На нём нельзя совершить покупку, можно лишь ознакомиться с описаниями предоставляемых услуг и товаров.
4. Интернет-магазин - сайт, с помощью которого клиент может заказать нужные ему товары. Сайт такого вида обязательно должен содержать каталог с иллюстрациями и подробными описаниями, прайс-лист и систему, позволяющую пользователям совершать покупки прямо на сайте. Должна присутствовать функция корзины, которая даёт возможность совершать несколько покупок за раз и функция калькулятора, позволяющая вычислить стоимость всего заказа. Используются различные системы расчётов: от пересылки товаров наложенным платежом или автоматической пересылки счета по факсу до расчётов с помощью пластиковых карт.
5. Промо-сайт создается специально для продвижения какого-либо товара либо услуги или основного сайта компании.
Виды информационных сайтов:
1. Тематический сайт ( представляющий информацию по определенной теме). Сайты этого вида могут быть довольно большими и подробно освещать какой-либо вопрос, предоставляя пользователям интернета, интересующимся определённой темой, возможность получить по ней хорошую и детальную информацию. Они являются одними из самых полезных в интернете, когда дело доходит до получения информации по самым разнообразным темам.
2. Тематический портал (крупный сайт, объединяющий в себе несколько универсальных сервисов). Порталом называется ресурс, содержащий большое количество информации самых различных направлений. Он совмещает в себе сразу
Описание сайта
Сайт для дизайнерского бюро «exclusion» представляет из себя простой «Сайт-визитку».
Сайт направлен на продвижение и продажу услуг потенциальным клиентам, с их описанием и фиксированным начальным ценником, а так же ознакомления с портфолио и описанием работ. Стоимость услуг компании рассчитывается индивидуально исходя из требований и стилистики.
На странице с портфолио можно ознакомиться с концепцией выполненной работы и ее особенностями, а так же описанием рода деятельности компании клиента и требованиями заказчика к выполнению.
Главная страница сайта представляет собранную информацию для ознакомления клиентом, о стаже работы и предлагаемых услугах в разделе «товары и услуги».
1.3.1. Описание целевой аудитории
Целевая аудитория (ЦА) — это аудитория потенциальных потребителей товаров или услуг. Это тот круг потребителей, физических лиц или компаний, на который этот продукт или услуга рассчитан и которым он может быть интересен.
Умение находить и выделять различные характеристики целевой аудитории,
позволяет:
1. Составить портрет своей аудитории, лучше узнать её. К базовым характеристикам относится демография: пол, возраст, образование, уровень доходов, образ жизни, ценности.
2. Лучшим образом донести информацию о продукте, а также его преимуществах относительно конкурентов.
3. Повысить узнаваемость бренда среди аудитории, наиболее расположенной к покупке.
4. Составить персонифицированные коммерческие предложения, которые будут отвечать запросам конкретной группы или конкретного человека. Они могут оказаться решающим фактором при принятии решения о покупке.
5. Разработать эффективную рекламную кампанию, в которой задействованы наиболее качественные каналы, обеспечивающие рентабельность.
6. Снизить издержки на рекламу.
7. Повысить конверсию продаж, возврат инвестиций — ROI.
8. Повысить лояльность к бренду и увеличить вероятность повторной покупки — в том числе, возможно, вырастить постоянного клиента.
Аудитория данного сайта – это люди обеих полов в возрасте от 16 до 60 лет имеющие собственный продукт или бизнес, которому требуется дизайн оформление различного вида сложности. Тип заработка ЦА: средний или высокий.
Расчёт ведётся на платежеспособную аудиторию, которая может приобретать любую интересующую услугу.
Представление цветового решения
Подбор цвета в дизайне позволяет повысить лояльность ЦА и пользователей, а так же во многом повысить продажи услуги или товара. Так же цвет позволяет повысить удобство использования сайта. Самый простой способ повысить удобство - это грамотно подобрать цвет элементов навигации. Соответственно наиболее важные элементы интерфейса будут ярче, чем второстепенные.
Выбор цветовой палитры напрямую зависит от сферы предоставления услуг компании.
У каждого сайта есть своя фирменная цветовая палитра. Фирменная цветовая палитра (Рис. 1) – это фиксированный набор цветов, который используется на всех элементах сайта, не считая медиа контента. Подбор цветовой палитры выполняется дизайнерами с учетом множества важных факторов, от единой концепции визуализации фирменного стиля, до принципов и правил сочетания цветов.
На этапе подбора цветов важно придерживаться основных положений:
1. Цвет должен сочетаться, подчеркивать или выделяться на фоне другого.
2. Цвет текста должен быть максимально читабельным, отделяясь контрастом.
3. Цвет не должен конфликтовать с очертаниями интерактивного элемента и сферой деятельности компании.
4. Палитра подбирается исходя из фирменного стиля компании, для вызова ассоциации с ней.
Рисунок 1. Фирменная палитра цветов, пример.
Каждый сайт требует выбора основного цвета, который будет чаще всего встречаться пользователю в процессе использования. Выбор пал на белый цвет, HEX номер которого «F5F5F5», он является цветом фона, а его яркость разбавляется использованием фирменного паттерна и примесью черного в палитре.(Рис. 2)
Рисунок 2. Фирменный паттерн.
Соответственно, помимо основного цвета существует понятие вторичных цветов, как правило, их несколько. Использование вторичных цветов практически невозможно избежать без существенного ущерба для целостности и удобства интерфейса.
Вторичными цветами был выбран темно-синий и красный цвета. Синий цвет является показателем надежности, безопасности, стабильности, умиротворенности и спокойствия. Часто применяется банками и крупным компаниями. Синий цвет наиболее приятен как мужчинам, так и женщинам. HEX номер выбранного синего цвета «1B1B28». Данный цвет был выбран из соображений сочетаемости с основным белым цветом. В процессе анализа основного и вторичного цветов в разработке визуального стиля, можно прийти к выводу, что это оптимальное цветовое сочетание для разделения фона от верхнего бара сайта, за счет высокого уровня цветовой контрастности. Красный цвет часто ассоциируется с опасностью, страстью, огнем, красотой, счастьем, гневом. В конкретном случае красный цвет используется для выделения интерактивного элемента «Меню» в верхнем баре сайта. Он имеет HEX номер «EF4747», отлично сочетается с темно-синим и белым, формируя контраст для выделения значимости интерактивного элемента «меню».
Цветовой контраст — это разновидность оптического контраста, связанная с разницей цветовых оттенков. Данную разницу между синим и белым можно наглядно увидеть на рисунке 3, а между красным и синим на рисунке 4.
Рисунок 3. Цветовой контраст синего и белого.
Рисунок 4. Цветовой контраст между красным и синим.
Выбранное цветовое решение играет огромную роль в интуитивности сайта. Более важные элементы навигации выделяются красным цветом. Основной контент ограничен приглушенным белым, для повышения читабельности и уменьшения нагрузки на глаза. Также, белый цвет формирует большое количество «воздуха» в композиции, акцентируя внимание на контентном наполнении сайта. Синий же цвет поддерживает данную композицию, выделяя верхний бар от фона.
Дата добавления: 2021-07-19; просмотров: 83; Мы поможем в написании вашей работы! |
Мы поможем в написании ваших работ!