Разработка айдентики макета сайта коммуникативной площадки молодых дизайнеров

Александра Горбунова

Разработка айдентики макета сайта коммуникативной площадки молодых дизайнеров

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

Искусство. Искусствоведение

Дипломы

Вуз: Владивостокский государственный университет экономики и сервиса (ВГУЭС)

ID: 5f3e2025cd3d3e000151e6a7

UUID: 1c744f00-c4e1-0138-1d57-0242ac180006

Язык: Русский

Опубликовано: больше 3 лет назад

Просмотры: 25

10.5

Александра Горбунова

Владивостокский государственный университет экономики и сервиса (ВГУЭС)

Комментировать 0

Рецензировать 0

Скачать - 4,3 МБ

Поделиться работой

МИНОБРНАУКИ РОССИИ ВЛАДИВОСТОКСКИЙ ГОСУДАРСТВЕННЫЙ УНИВЕРСИТЕТ ЭКОНОМИКИ И СЕРВИСА ИНСТИТУТ СЕРВИСА, МОДЫ И ДИЗАЙНА КАФЕДРА ДИЗАЙНА И ТЕХНОЛОГИЙ РЕКОМЕНДОВАНА к защите Директор ИСМД канд. тех.. наук, доцент __________ И.Л. Клочко БАКАЛАВРСКАЯ РАБОТА Разработка айдентики макета сайта коммуникативной площадки молодых дизайнеров БДЗ-16-126896. 3295-с.01.100. БР Студент ____________________________________________________А.И. Горбунова Руководитель доцент ____________________________________________________Н.В. Месенева Нормоконтролер ассистент ____________________________________________________Н.В. Месенева Владивосток 2020

2 Содержание Введение…………………………………………………………………………………………3 1 Анализ современной практики мирового опыта создания сайтов………………………….5 1.1 История создания сайтов……………………………………………………………...5 1.2 Понятие сайта, его задачи и функции………………………………………………..7 1.3 Элементы сайта………………………………………………………………………12 1.4 Виды сайтов…………………………………………………………………………..15 1.5 Требования к созданию сайта……………………………………………………….19 1.6 Тренды и тенденции веб-дизайна…………………………………………………...20 1.7 Анализ дизайна сайтов (аналоги)…………………………………………………...24 1.8 Line art как стиль сайта………………………………………………………………26 2 Разработка айдентики макета сайта коммуникативной площадки молодых дизайнеров...28 2.1 Выбор и обоснование авторской концепции……………………………………….28 2.2 Разработка айдентики и цветовое решение сайта………………………………….29 2.3 Авторские разработки макета сайта………………………………………………...31 3 Экономический расчет…………………………………………………………………………33 4 Результаты опроса……………………………………………………………………………...36 Заключение……………………………………………………………………………………...37 Список использованных источников………………………………………………………….38 Приложение А. История создание сайтов…………………………………………………….42 Приложение Б. Элементы сайта……………………………………………………………….43 Приложение В. Виды сайтов…………………………………………………………………..48 Приложение Г. Тренды и тенденции веб-дизайна…………………………………………...54 Приложение Д. Анализ дизайна сайтов (аналоги)…………………………………………...59 Приложение Е. Line Art как стиль сайта……………………………………………………...60 Приложение Ж. Выбор и обоснование авторской концепции………………………………61 Приложение З. Разработка айдентики и цветовое решение сайта…………………………..62 Приложение И. Авторские разработки макета сайта………………………………………...63 Приложение Л. Результаты опроса……………………………………………………………70 Приложение М. Компоновка планшета……………………………………………………….71

3 Введение Разработка макета дизайна сайтов для компаний в настоящее время является актуальной темой. Сайт — это визитная карточка любой компании, которую должна иметь как крупная компания, так и небольшая. В мире существующей конкуренции требуются усилия, чтобы не затеряться среди большинства похожих и аналогичных компаний. Сайт – основной инструмент маркетинга, информации в современном мире, который в совокупности с правильным логотипом, будет приносить компании доход и привлекать более обширную аудиторию. Основной задачей в этом направлении является создание вебсайта и разработка айдентики для коммуникативной площадки молодых дизайнеров города Владивостока. Сложность заключается в том, что у студентов отсутствует общая коммуникативная площадка для общения, что является актуальной темой, так как во Владивостоке такой сайт отсутствует. Важную роль для успешного осуществления трудовой деятельности студентов играет правильно организованное рабочее место, так как именно на рабочем месте протекает большая часть времени работников отдела в компании. Рабочее место располагалось в отделе, за столом, и было оборудовано: (компьютером, телефоном, сканером, принтером, оргтехникой). Студентами был пройден первичный инструктаж на рабочем месте. В целях ознакомления с конкретной производственной обстановкой и особенностями безопасного выполнения каждого вида работ. Во время первичного инструктажа была представлена специфика предстоящей работы, особое внимание было обращено на возможные опасности, указано на безопасные способы выполнения работы. По окончанию первичного инструктажа была сделана запись в журнале о прохождении данного вида инструктажа. Физическая культура для обеспечения полноценной социальной и профессиональной деятельности очень важна для студента, так как за время выполняемой работы в компании студент посещал различные отделы, в том числе отдел 3D печати. Студентом были применены средства и методы оптимизации работоспособности при проведении предпроектных исследований работы, проектирования без выезда на местность для встреч с заказчиком, фотофиксации и обмеры в любых погодных условиях. Во время производственной преддипломной практики студент работал в должности графического дизайнера. Перед началом практики, студента представили работникам отдела и показали рабочее место. Основное направление деятельности практиканта составил графический дизайн. В обязанности студента входило: - разработка логотипов; - разработка полиграфической продукции.

4 За время практики, были выполнено следующее задание: создание логотипов и фирменного стиля, что явилось важной частью производственного процесса предприятия. Цель работы – разработка айдентики сайта коммуникативной площадки молодых дизайнеров города Владивостока. В целях достижения исследования вышеуказанной разработки необходимо осуществить следующее: - провести анализ мирового опыта создания сайтов отечественных и зарубежных компаний; - проанализировать основные требования, предъявляемые к веб-сайту компании; - сформировать проект логотипа компании, для использования его на сайте; -обосновать и представить авторскую концепцию сайта, логотипа и их использования в элементах фирменного стиля компании; - разработать концепцию дизайн-макета сайта, а также айдентики сайта. Для выполнения ВКР студент группы БДЗ-16-01 Горбунова Александра Игоревна была направлена на прохождение производственной преддипломной практики в рекламнопроизводственную группу «Сфера», г. Артём Компания ИП Мурсалимов А.Я. рекламно-производственная группа «Сфера» находится в городе Артем по адресу ул. Вокзальная 98 Цель деятельности компании «Сфера» создание рекламных продуктов, а также взаимосвязи художественной уникальности и коммерческой рентабельности объектов. Компанией РПГ «Сфера успешно реализовано: - в установленные сроки и с высоким качеством выполнены нестандартные и сложные задания на объектах саммита 2012 года. Форма организации данной компании (ИП), то есть частная. Главное внимание уделяется повышению квалификации специалистов, постоянной модернизации оборудования, освоению новых технологий. Компания первой запустила широкоформатную печать, начала использовать светодиодные технологии в световых вывесках на своих площадках освоила сборку светодиодных табло и экранов. Также компанией осуществляется широкоформатная рекламная печать на баннерах, создание рекламных продуктов, взаимосвязи художественной уникальности. Целевой аудиторией проекта является молодые дизайнеры города Владивостока. Разработка дизайна сайта – сложный творческий процесс, при котором изучаются все ключевые аспекты работы предприятия, его положение на рынке и возможности дальнейшего развития сайта. Именно с помощью качественно разработанного сайта можно вызвать интерес у пользователей и привлечь внимание к информации сайта.

5 1 Анализ мирового опыта создания фирменных стилей 1.1 История возникновения сайтов Не важно, что ты делаешь, важно делать это хорошо, необходимо ознакомиться с предысторией формирования сайта и узнать с чего все начиналось. Британский ученый Тимоти Бернерс-Ли, (Приложение А, рисунок А.2) [1], создавая сайт, задумывал его как некую "папку", в которой будут храниться самые основные сетевые документы, а объединять их будет личное доменное имя, оригинальное и единственное. По сути, именно такими сайты являются и на сегодняшний день, как старые, так и новые проекты хранят в себе информацию, различных страниц и документов, которые фактически принадлежат юридическому лицу, при этом находятся в свободном доступе для массы пользователей, а отыскать их можно под определенным доменным именем. Все инструменты, необходимые для работы первого сайта, Бернерс-Ли подготовил раньше в конце 1990 года появились первый гипертекстовый браузер WorldWideWeb, что на данный момент пользователи называют WWW с функционалом веб-редактора, первый сервер на базе NeXTcube и первые веб-страницы (Приложение А, рисунок А.1) [1]. WorldWideWeb или WWW - всемирная паутина. Сам интерфейс браузера был сформирован достаточно просто, и большая часть информации была в текстовом варианте и включала изображения. Но раньше WWW был создан стандартный протокол FTP, который позже заменили на протокол HTTP и который в современном мире используется чаще [2]. Всемирная паутина предоставляет доступ к документам, которые расположены на компьютерах. Веб-страницы — это как раз гипертекстовые документы. Всемирная паутина вызвала революцию в информационных технологиях и благодаря ей дала возможность развитию интернета [1]. Тим Бернерс-Ли и Роберт Кайо являются создателями всемирной паутины. Тим Бернерс-Ли считается автором HTTP , FTP и в 1980 году, когда он работал в Европейском совете по ядерным исследованиям в Женеве он собрал программу «Энквайр», что в переводе на русский значит «Дознаватель», которая была построена на основе ассоциаций для хранения данных и вошла в основу всемирной путины [2]. В 1989 БернерсЛи работал в CERN, работая над внутренней сетью Интернета, глобальный проект, который как уже известно будет называться всемирная паутина. Этот проект подразумевал публикацию документов, которые должны быть связаны гиперссылками, что в несколько раз облегчает поиск информации. Дополнительно к этому проекту были созданы индикаторы URI протокол HTTP и язык HTML [2]. Теперь без индикатора URI протокола HTTP и языка HTML невозможно представить себе интернет. Позже в 1991 по 1993 год Бернерс Ли усовершенствовал технические спецификации разработки сайта и опубликовал их.

6 Проект по созданию интернета продолжился дальше Тим Бернерс Ли написал первый веб-сервер, который назвал «httpd» и гипертекстовый веб-браузер, который называется «World Wide Web». Браузер WTSIWYG (what you see is what you get – что видишь то и получишь), стал одновременно редактором информации. Программа стала работать в среде и начала распространяться по Интернету [2]. Первый в мире сайт был размещен БернерсомЛи 6 августа 1991 на первом веб-сервере, доступном по адресу http://info.cern.ch/. На данном сайте содержались инструкции по установке созданного веб-сервера [2]. Так же этот сайт являлся первым интернет-каталогом и Бернерс-Ли разместил и поддерживал список информации на другие сайты. Внешне первый сайт был невзрачен, что совершенно неудивительно, но при этом была изображена пародийная филк-группа «Les Horribles Cernettes» [1]. Еще в 1945 году до сайта созданного Бернерсом-Ли программист Ваннавер Буш разработал «Memex» - вспомогательное средство расширения браузера с быстрой выдачей информации. В дальнейшем основную деятельность по Всемирной паутине взял на себя консорциум Всемирной паутины, под организацией Тимом Бернерсом-Ли. Консорциум Всемирной паутины – организация, которая разрабатывает технологические стандарты для Интернета [1]. W3C создает для Интернета общие рекомендации, которые внедряются производителями для создания сайтов. Совместимость программы достигается с помощью различных компаний. Все стандарты Всемирной паутины доступны и не защищены патентами и могут внедряться любым пользователем. Сайт представлял собой сплошную стартовую страницу белого цвета, на которой для посетителей размещалась основная информация об инновационной технологии того времени "World Wide Web". Здесь же, на первом во всем мире сайте, были размещены и подробные инструкции по установке браузеров, а также серверов на свои персональные компьютеры, то есть технологию "WWW", можно смело назвать началом современного интернетпространства. По типу и своей простоте, самый первый сайт был интернет-каталогом, одностраничным, невзрачным, но информационно наполненным [2]. Тим Бернерс-Ли признается, что не ожидал, что за столько короткие сроки Интернет наберёт такую популярность у пользователей мира. Но спустя несколько лет, эта затея стала невозможной, да и ненужной, ведь новые сайты стали появляться все чаще, а некоторые старые сайты менять своих владельцев и уходить в прошлое [2]. Теодор Нельсонан и Даг Энгельбарт предложили технологию гипертекста — «ветвящегося» текста, который предоставлял читателю разные варианты прочтения сайта. Позже Нельсон создал «Xanadu», которая так и оказалась незаконченной гипертекстовой системой. Нельсон мечтал связать перекрёстными ссылками все тексты, созданные

7 человечеством. Начало работ по разработке устойчивой сети для передачи информации было положено американскими военными в 1957 году. Предпосылкой к этому стал запуск СССР первого искусственного спутника Земли [1]. Сейчас Бернерс-Ли – руководитель собственного Консорциума Всемирной Паутины (WWW Consortium), открытого ученым. Компания специализируется на разработке и внедрении новых интернет-стандартов [2]. 1.2 Понятие сайта, его задачи и функции Сайт – это информационная единица в интернете, ресурс из веб-страниц (документов), которые объединены общей темой и связаны друг с другом и с помощью ссылок, корпоративным стилем – это «стилевая основа» современной компании. Сайт — это набор, удачное сочетание всех составляющих – графических объектов, шрифтовых решений, позволяющих создать узнаваемый образ компании. Разработка сайта включает в себя разработку фирменного стиля. Сначала выполняется создание программных приложений, после чего разработчику представляется определённое количество информации о посещаемости его сайта. Определения функции сайта — сложная работа. Функции сайта определяют заказчики, аналитики, веб-дизайнер и веб-программист. Есть три основные функции любого сайта [5]: - информационная; - маркетинговая; - имиджевая. Информационная функция – это предоставление информации по определенной теме, области, проблеме. Эту функцию все сайты анализируют по-разному. Требования при этом высокие и разные: - скорость загрузки; - полнота и ясность контента; - обновляемость сайта. Требование скорости загрузки сайта относится к факторам ранжирования (сортировка сайта в поисковой выдаче, применяемая в системе поиска). И если время загрузки слишком большое, то оно будет негативно влиять на позицию выдачи информации. К примеру, возьмем «Яндекс» и «Google», два этих сайт находятся в предпочтении у пользователей, поскольку время загрузки информации две-три секунды [6]. Однако для высокого нагружения веб-приложений оптимальная скорость может отличаться и чаще всего система сайта может меняться, это связь различных электронных документов: файлов, изображений, видео, непосредственно самого кода. Размер файла, представленного на сайте, будь то видео

8 или изображение влияет на скорость Интернета [4]. Если сайт будет очень долго загружаться [18], то пользователи могут уйти на другой сайт. Скорость сайта можно проверить с помощью различных приложений и программ. Одни из таких программ «PageSpeed Insigts» «GTmetrix» «Pingdon Tools» – бесплатный инструмент от Google. При проверке с помощью таких приложений есть возможность понять, насколько быстро и насколько оперативно сайт реагирует на действия пользователей. При проверке можно провести быстрый анализ производительности страницы сайта, время загрузки и размер страницы. Чтобы страницы сайта быстрее загружались, необходимо использовать кэширование. Плохая загрузка страницы может зависит от расстояния между сервером и пользователем. Чем дальше от компьютера находится сервер, тем медленнее будет загружаться сайт [13]. Требование полноты и ясности контента считается важным параметром сайта. На качество контента влияют факторы, которые подходят для всех типов контента, начиная от документации и заканчивая контентом мобильных приложений. Пользователю должна быть понятна область, в которой он находится и в которой контент разрабатывается. Если контент изложен точно и четко, значит пользователю будет легко его понять. Если контент непонятен, то пользователи будут разочарованы и посещение сайта будут ниже, чем ожидает разработчик. Недостаточная ясность контента создает эффект изменения от одной области деятельности к другой. Ясность контента заключается в краткости, четкости и простоте. Каждый компонент отдельно взятого компонента должен иметь схожие черты со всем стилем сайта. Нецелостный дизайн или неудобная подача информации формирует низкую посещаемость сайта. Каждая часть представляемого контента должна включать всю информацию, которую должен прочесть пользователь [14]. Требование обновляемости или ранжирование. Если на информационном сайте была опубликована статья за 2015 год, а сейчас 2020, то эта статья будет не верной. Статью следует будет дорабатывать и обновлять. Кроме краткости, контент должен быть верным. Контент должен быть обновлен и отражать изменения информации. Разработчик должен регулярно просматривать информацию, чтобы убедиться, что контент является актуальным. Необходимо настроить процессы отслеживания и обновления, чтобы они были точными [19]. Обновление сайта [13] является ценным и качественным контентом, который очень полезен для ранжирования в поисковых системах. Стоит заметить, что допускается обновлять сайт один раз в неделю, но при этом, качественной информацией. При невозможности актуализировать информацию, нужно ее удалять. Любую поисковую систему к сайту можно определить по показателю частоты и слежению роботом за сайтом. Это значит, что не все не обновляемые ресурсы в черном списке у поисковиков, это значит, что

9 обновляемые сайты, чаще всего имеют уникальный контент и являются ценным элементом для пользователей. Оказывается, что «Википедия» обновляется в среднем на 1,5 тысячи страниц, а «Яндекс. Каталог» всего на 150 страниц в день. У «Google» есть хороший оператор, благодаря которому он может определять количество проиндексированных страниц за определенный период времени. Если размещать на сайте ссылку, то ресурс обновляется, и ссылка может быть проиндексирована в тот же день, может быть проиндексирована и на неделе, а бывает, что индексация идет 3-5 раз в месяц [13]. Маркетинговая функция — продажи или увеличение спроса на товар или услугу, проведение PR-акций. Для крупных компаний, организаций стоит открыть корпоративный сайт. Он должен иметь фирменный стиль компании, отвечать запросам компании и должен быть прост в навигации и гибок по отношению к различным изменениям [12]. Если это маркетинговый сайт, то одной из главных функций должен быть интернет-магазин. Для интернет-магазина требуется специальная функция выбора товара, откладывание его в корзину и оформление его покупки онлайн. На сайте должен присутствовать удобный интерфейс. Для того, чтобы на сайте появилось больше пользователей используются промо сайты. На них размещается различная информация, например акции, условия, которая привлекает пользователей. На таких сайта довольно часто присутствует флэш-анимация и различные формы голосования [17]. Любой владелец сайта хочет получить хорошее посещение. Функции маркетинга — это весьма осуществимо. Следует правда выполнять данную функцию аккуратно, чтобы это все не превратилось в навязывание услуг. Интернетмаркетинг – действия, направленные на продвижение товаров и услуг в интернете. Цель интернет маркетинга рост продаж, рост посещаемости сайта и увеличение прибыльности компании. Первым шагом является определение аудитории, вторым изучение конкуренции, третьем шагом определение цели и методов достижения, выбрать инструменты для создания сайтов [20]. Имиджевая функция — формирование образа физического или юридического лица, общественного или политического органа в Интернете. Когда дело касается имиджевой функции, то прежде всего он должен содержать логотип сайта, контактные данные о компании. Хорошим имиджем сайта является, когда пользователи могут найти информацию, используя поисковые запросы [7]. Если пользователи сайта не могут найти требуемый контент внутри сайта, это нарушает имидж и пользователям будет проще уйти с сайта и искать информацию через браузер, который формирует их потребности. Задача [9] – привлечь и увеличить доверие пользователей к компании. Для реализации имиджевой функции сайта могут быть созданы сайты-визитки и даже персональные сайты. Имиджевая функция отвечает за формирование образа владельца сайта. Основная цель имиджа сайта – рассказать о бренде и компаниях так,

10 чтобы привлечь пользователей. При создании качественного имиджевого сайта следует учитывать особенности формирования каждого этапа дизайн проекта. Сайт должен удерживать внимание пользователя. Чтобы достичь желанного результата необходим комплексный подход. Чаще всего для привлечения пользователей формируют лэндинг – это одностраничный сайт, который формирует интерес пользователя к тому, что может предоставить компания. Лэндинг подходит для презентации нового продукта. Лэндинг страница должна быть яркой и разработана для рекламы продукта [15]. Определение целей создания сайта, круга функций, которые он должен выполнять, необходимо для лучшего понимания истинных задач, которые собираются решать с помощью сайта его разработчики. Цели создания сайта необходимо продумать. Правильно поставленная цель позволяет сделать сайт эффективным инструментом для пользователя, минимизировать затраты на создания сайта. Цель сайта может быть [9]: - просветительской; - рекламной; - сервисной; - коммерческой. И после того, как были определены цели, можно продумывать навигацию, структуру, дизайн и контент. Основные задачи при разработке сайта [16]: - помочь компании в поддержке старых, а также установлению новых связей на рынке; - стать инструментом распространения информации о компании; - осуществить удаленную демонстрацию товара или услуги; - увеличить объем продаж, найти новых клиентов компании; - осуществить информационную и сервисную поддержку клиентов и партнеров. Просветительская цель сайта. Расмотрим сайт «Arzamas», данный сайт занимается просветительской деятельностью. Сайт посвящен истории культуры. Изначально этот сайт включает в себя курсы по истории, литературе, искусству и антропологии. На сайте есть раздел «Журнал», в котором еженедельно публикуются материалы, не связанные напрямую с темами курсов – это шпаргалки, редкие архивные документы и рекомендации. Основная цель просветительской деятельности сайта является повышение уровня общей культуры и социальной активности пользователей [14]. Текстовая информация и графическая часть сайта необходимы для подачи полной информации сайта. На сайте для рекламы должны быть точное описание продвигаемой услуги или товара. Пользователь должен попадать на сайт и понимать, что ему предлагают. Тема сайта должна совпадать с потребностями целевой аудитории. Чтобы быстро и легко

11 создать сайт нужно выбрать подходящий шаблон [14]. Серверная цель сайта. Большинство крупных веб-сайтов пользуются программированием серверной части, чтобы динамично отображать различные данные при необходимости в основном взятые из базы данных. Главная цель в программировании серверной части, это что она позволяет создавать контент для веб-сайта под конкретного пользователя. Также это помогает упростить использование сайтов за счет сохранение данных без повторного ввода или использования [12]. Сайт дает возможность взаимодействовать с пользователем посылая уведомления по почте или по другим каналам. Программирование серверной части позволяет эффективно доставлять информацию, составленную для индивидуальных пользователей [3]. Программирование серверной части позволяет хранить огромное количество информации в базе данных и динамически создавать типы различных файлов [12]. Серверы хранят и используют информацию о пользователях. Программирование серверной части разрешает разработчикам использовать сессии, позволяющие серверу хранить информацию о текущем пользователе сайта [3]. Код серверной части выполняются на веб-сервере, и его основная роль состоит в контролировании информации сайта, которую отправляют пользователю. Коммерческая цель [4]. Создание коммерческого сайта – одно из направлений в создании сайтов. Коммерческий сайт — это получение выгоды, которая может быть выражена в прямом увеличении в показателях разработчика, снижение расходов. Такой сайт позволит снизит штат работников и аренду помещений. Коммерческий сайт предоставляет возможности, которые дают глобальный обмен информации, круглосуточно информируют клиентов и производят популярными бренды [4]. Главное для пользователей сайта, чтобы можно было легко и быстро найти на сайте нужную информации и иметь удобную навигацию. Прежде чем приступить к проекту, важно пересмотреть цели и задачи, а задачи создания сайта могут быть разными: - увеличение лояльности пользователей; - увеличение продаж за счет новых клиентов; - сокращение расходов технической службы; - увеличение объема продаж; - совершенствование услуг или продукта. Задачи – это конкретные функции, которые должен выполнять сайт. Они должны быть реализованы на сайте и не видны обычному пользователю. Это может быть интеграции с 1С и подобными сервисами, с системой управления [7]. Так же сайт предназначен для

12 решения определенных задач. Задачи должны быть продиктованы формальной или подразумеваемой стратегией сайта. Важно, чтобы за каждый этап создания сайта — от написания технического задания и разработки дизайна до программирования, верстки и наполнения сайта информации отвечал профессионал. Лишь в этом случае можно избежать серьезных ошибок и выполнять все поставленные задачи. Все пользователи сайтов потенциальные покупатели и потребители предлагаемых к продаже товаров и услуг [8]. Прежде чем создавать сайт компании, необходимо задаться вопросом «А для чего конкретно он должен быть использован?». При создании сайтов важна прежде всего, его информационная составляющая [14]. Вторым по важности шагом является разработка максимально удобного дизайна, чтобы потенциальный пользователь смог разобраться на сайте и найти что ему нужно. В задачи дизайнера входит и создание сайта компании, логотип и фирменный стиль которой он разработал [15]. Если дизайнер не владеет навыками программирования, то в работу подключают специалиста по разработке сайтов. Такое сотрудничество более эффективно, когда созданием сайта занимается один человек. Для того, чтобы придумать дизайн сайта, необходимо, прежде всего, разработать с эргономическую составляющую [9]. Эргономика играет важнейшую роль, так как сайт должен быть удобным и простым в использовании для любых пользователей. При помощи эргономического анализа создается функциональная схема, по которой определяются функции сайта и кнопки меню. Все графические наработки и эскизы разрабатываются в соответствии с функциональной частью, так называемым «скелетом» сайта, максимально упрощенным и удобным для пользователя. Веб-дизайн должен подчеркивать функционал, не перегружать визуальными элементами пользователя и помогать найти нужные элементы [10]. Чтобы создать удобный дизайн сайта, нужно представить себя на месте пользователя, который первый раз зашел на данную страницу, и задать себе следующие вопросы: «Удобно ли расположены кнопки?», «Все ли читаемо?», «Можно ли перейти с второстепенной страницы на любую другую?». Правильно разработанный сайт должен сочетать в себе эргономичный дизайн, яркость и простоту, но в то же время он должен быть функциональным и информативным. Графический дизайнер должен располагать умениями и навыками, которые позволят ему создать правильный логотип и сайт компании. Дизайнер должен владеть программами, а также представлять себя на месте пользователя/покупателя, который должен заинтересоваться компанией [11]. 1.3 Элементы сайта Элементы интерфейса [15], используются при разработке сайта и при его использовании: Кнопка (Приложение Б, рисунок Б.1) [15] переключатель, флажок, выбор,

13 аккордеон, слайдер, контент, модальное окно, блок, раздел, шапка, подвал, галерея (Приложение Б, рисунок Б.7), превью, бордер, тултип, курсор, пойнтер, пагинация, текстовое поле, вкладки, прелоардер (Приложение Б, рисунок Б.14) [15]. Кнопка - элемент при нажатии, на который происходит какое-то действие. Переключатель - позволяет пользователю выбрать одну опцию. Флажок - позволяет выбрать несколько опций. Выбрать - позволяет пользователю выбрать одну опцию из выпадающего списка. Аккордеон - элемент интерфейса, состоящий из заголовков и скрываемого и открываемого контента. Слайдер (Приложение Б, рисунок Б.1)- переключатель изображений (или другого контента) работающий автоматический или вручную. Контент - текст, изображения, видео, то есть наполнение сайта. Рpopup (Приложение Б, рисунок Б.2) - небольшое всплывающие окно в углу экрана. Модальное окно (Приложение Б, рисунок Б.3) - разновидность всплывающего окна. Оно появляется на большую часть экрана и блокирует работы с остальным сайтом. Блок - смысловой элемент, включающий в себя информацию только об одной сущности. Обычно блок начинается с заголовка и отдельно от следующего каким-либо визуальным решением, цветом, линией, тенью. Шапка (Приложение Б, рисунок Б.5) - самая верхняя часть сайта. Обычно в ней расположены логотип, меню и контактная информация. Шапка чаще всего бывает закрепленной, она перемещается вместе с перемещением пользователя по странице. Подвал (Приложение Б, рисунок Б6) - самая нижняя часть сайта. Чаще всего в ней расположена карта сайта, контактные данные, быстрые ссылки на популярные разделы, ссылка на разработчика сайта. Превью - изображение и часть другого контента, уменьшенная в размере. Бордер (Приложение Б, рисунок Б.8)- обводка элемента. Тултип - подсказка, всплывающая при наведении на элемент. Курсор (Приложение Б, рисунок Б.8). Пойнтер тип курсора в виде руки с вытянутым указательным пальцем. Обычно появляется при наведении на ссылку. Пагинация (Приложение Б, рисунок Б.9) - нумерация страниц, обычно отображенная как навигация в конце страницы. Вкладки (табы) - элемент интерфейса, так же, как и аккордеон, состоит из заголовка и скрытого контента, на который можно попасть при обращении к заголовку. Прелоардер - анимированный элемент, воспроизводящийся в процессе загрузки сайта, видео, изображений и другого контента. Дизайн сайта. Известно о важности первого впечатления. Пользователь может зайти и уйти если ему не понравится визуал сайта. Возможно, слишком много анимации могут затруднить прочтение информации, которую вы хотите донести до пользователя. У большинства компаний есть свой фирменный стиль, который включает: вид, размер шрифта и оформление текста, которое помогает клиентам мгновенно отличать компанию от конкурентов. Наиболее успешные сайты используют (X)HTML и CSS, которые способствуют определению дизайна сайта. Верстка относится к элементу дизайна. Представляет собой процесс написания

14 особого кода для браузеров. Обычно у такого файла есть расширение HTML и отображается решение в любом браузере. Веб-сервер – компьютер с установленным программным обеспечением, которое нудно для того, чтобы отвечать на запросы пользователя. Раздел сайта, в котором располагаются контакты, поиск, лозунг, поиск, девиз, верхнее меню [15]. Боковые меню или так называемые сайдбаром. Однозначно ответа, где лучше располагать сайдбард нет. Каждый разработчик имеет свои предпочтения. Цель одна сделать удобным и функциональным сайт. Центральная часть любого сайта представляет собой необходимый контент, который должен быть выгодным по размещению. Подвал - многие разработчики игнорируют эту часть, оставляя ее пустой, на ней можно разместить дополнительную информацию, которую нельзя найти в других разделах сайта [16]. Неважно каким будет сайт по своей структуре, важно всегда помнить, что это ресурс – это должна быть работающая площадка, которая приносит пользу, отвечает всем нужным техническим требованиям, визуальным [15]. Строение сайта решает его разработчик исходя из маркетинговых исследований. В последние годы количество шрифтов, которые можно использовать на веб-сайтах, значительно возросло. Дизайнеры теперь имеют более широкий выбор. Плоский дизайн. Плоская конструкция известна своим упрощенным внешним видом. Вместо того, чтобы использовать трехмерные эффекты и другие дизайнерские приемы, в плоской конструкции используются простые яркие иллюстрации. Плоская конструкция сфокусирована на контенте компании. Это позволяет пользователям четко распознать основные акценты, которые несет в себе контент. Дизайнеры сейчас стараются не перегружать сайты декоративными элементами и оставлять больше свободного пространства, чтобы пользователь обращал внимание на контент. Hover – эффекты. В разделах сайта помогают пользователю понять, в каком месте страницы находится. Когда наводишь курсор на часть сайта с нover – эффектом, она обычно меняет цвет и демонстрирует раздел, который в данный момент смотрят. Этот эффект является отличным инструментом юзабилити. Если дело касается текста, то нужно правильно располагать информацию, текст не стоит располагать поверх фона, в особенности если это фон темный, так как это будет затруднять прочтение. На всех страница должны быть одинаковые поля и по всему сайту должна быть логичность. Для каждой страницы дизайн разрабатывается отдельно в зависимости от ее функций [15]. Верстка — представляет собой процесс написания особого кода для браузеров. У такого файла расширение html, и отображается он только в браузерах. Нужно следить, чтобы сверстанный макет одинаково выглядел во всех браузерах таких как Opera, Mozilla Firefox, Google Chrome.Программирование составляет примерно 5-70% работы над сайтом [15].

15 Программная часть ресурса — довольно обширное понятие. Программирование отвечает за то, чтобы многочисленные страницы сайта отображались с одинаковым дизайном, разным содержимым. Также программный код ответственен за визуальные эффекты. Веб - сервер — это компьютер с установленным на нем программным обеспечением, которое предназначено для того, чтобы отвечать на запросы веб- клиента круглосуточно в режиме реального времени. Под веб-клиентом подразумевается браузер, который должен получить от сервера соответствующий html-код [15]. Контент сайта, то есть все содержание, тексты, картинки. Хороший контент важный и ключевой элемент создания сайта. Информация сайта должна быть качественная и грамотная. Не стоит забывать о размещении информации о компании, а также контактной информации [15]. Самое главное правило помнить, чтобы информация была полезной для пользователей и контент периодически обновлялся. Интересный контент — это ключ к увеличению посещаемости, читаемости и коммерческих показателей. Что касается текстового наполнения, то именно оно наполняет любой веб-ресурс смыслом, благодаря которому пользователи могут найти сам сайт в поисковых системах [7]. Оформление сайта отвечает на вопрос «как разместить». Доменное имя и хостинг. Доменное имя — это уникальный адрес сайта в сети. Хостинг — это услуга, которая предоставляется специальными компаниями, хранящими на своих серверах все необходимые для работы сайта данные. Без этих компонентов строение сайта было бы неполным, а сам сайт недоступен для пользователей и посетителей. Хостинг предполагает выделение свободного места на сервере для размещения и хранения какого-либо сайта. Владелец сайта должен сформировать уникальное доменное имя, а также надежный хостинг. Каким бы ни был сайт по своей структуре и особенностям, важно всегда помнить правило хороший ресурс — это ресурс, работающий и приносящий пользу своим пользователям [7]. 1.4 Виды сайта В настоящее время рынок полон различных компаний, которые быстро стали известными и прочно закрепились на своем положении уже на десятки лет. Но мало кто знает весь путь, который прошли эти компании, ведь интересные идеи товарных знаков приходят не сразу. Сайт визитка — это минимально необходимый, но достаточный набор информации, распространение которой полезно как для начинающих компаний, так и для уже состоявшихся организаций. Сайт очень удобная система объединения документов в одной структуре, которая расположена по конкретному доменному адресу. Эти ресурсы можно разделить на две категории, это коммерческие и некоммерческие. Коммерческие (Приложение В, рисунок В.1)- веб-разработки, связаны напрямую с

16 бизнесом. С точки зрения бизнеса проекта можно выделить направление на продажи «оффлайн» [16]. Интернет-визитка (Приложение В, рисунок В.2), [16]. Сайт, который состоит из небольшого числа страниц, где содержится общая информация о дизайн проекте, области деятельности компании. Реквизиты и контакты, должны присутствовать на таком сайте. Это своеобразная визитная карточка фирмы, которая содержит основную информацию о деятельности компании и ее контактные данные. По сравнению с сайтом-визиткой, корпоративный сайт является более серьезной структурной единицей. Сайты такого типа выступают в роли инструмента, помогающего привлекать новых клиентов и партнеров для сотрудничества, расширяют рынок сбыта компании, повышая рейтинг и доверие в своей сфере бизнеса. Данный сайт может служить рекламной площадкой в интернете, тут можно публиковать продукцию или услуги с возможностью оформить заказ прямо на сайте. Разработка корпоративного сайта (Приложение В, рисунок В.3) [16]- выполняется относительно быстро и недорого в отличии от интернет-магазина или портала. Сайт в виде интернет-проспекта или буклета прекрасно выступит в основе рекламной кампании и привлечет внимание многих потенциальных клиентов, которые смогут получить всю необходимую информацию о предлагаемом товаре, услуге, мероприятии. Видеосюжеты, аудиосообщения, анимированные рекламные объявления, лента новостей и отзывов - все это доступно рекламной кампании. Интернет-вариантом каталога продукции является сайтвизитка. Это логично организованный, структурированный каталог, главное назначение которого - привлечение клиентов. Размещая подробную информацию о товаре, или группе товаров на страницах сайта витрины получается отличный инструмент для рекламы и распространения информации о компании в интернете. Главные качества данного сайта удобство и функциональность. Пользователи должны иметь возможность легко найти необходимый товар, отправить его в "корзину" и оформить покупку в несколько кликов. Если нужно продать товар — то стоит заказать разработку интернет-магазина. На этих веб-ресурсах обычно нет кнопки «купить». Это сайты, которые содержат на своих страницах информацию о предоставляемых услугах — о стоимости стрижки, об аренде катамарана, о вывозе мусора. Типичный пример сайта услуг — это портал юридических услуг «Правовед». Корпоративный сайт, который может отличаться от визитки тем, что имеет более сложную структуру и большое количество станиц. Статьи, видеоматериалы, где есть все характеристики предлагаемой продукции или услуг компании. Сайт-портал (Приложение В, рисунок В.4)- [16] — это тип сайта, который имеет свою индивидуальность и определенную тематику. Структура и набор функциональных модулей сайта-портала устроены таким образом,

17 чтобы посетители сайта могли максимально в полном объеме получать информацию. Как правило, на сайте-портале всегда есть ленты новостей и событий, форумы, где можно обсудить интересую тему, высказать свое мнение. Нередко сайты порталы имеют свойства и функциональность всех вышеперечисленных типов сайтов. HTML-сайты, или, как их еще называют, статические — это самый старый вид. Их делали, когда еще не было этих CMS, верстальщики верстали каждую страницу вручную. Вносить изменения и создавать страницы на таких сайтах проблематично — нужно разбираться в верстке либо нанимать верстальщика. Зато они создают минимальную нагрузку на сервер и очень быстрые. Сайты на CMS, или, как их еще называют, динамические сайты, сделаны на движке (WordPress, Drupal, Joomla). Основной источник дохода для дизайнеров, верстальщиков, сеошников — владельцы бизнеса. (Приложение В, рисунок В.5) [16]- На них обычно есть кнопки «купить» и «добавить в корзину». Информация о доставке, номера телефонов и все остальные факторы коммерческого ранжирования обычно тоже имеются. Основное обращение денег в интернете обеспечивают именно эти порталы. Лендинг (Приложение В, рисунок В.6), [16]- — это веб-страница, цель которой — максимально эффективно продать товар или услугу. Landing Page обычно оформляется красиво, чтобы привлечь внимание и заставить пользователя, на таких страницах обычно приобретают особую важность такие метрики, как показатель отказов или глубина прокрутки. Промо-сайт имеет подробное описание технических характеристик и преимуществ товара, содержит информацию об акциях, скидках, призах и бонусах [16]. Электронные торговые площадки (Приложение В, рисунок В.7)- – это такие ресурсы объединяют в едином информационном пространстве поставщиков и потребителей товаров. Существуют достаточно большое количество онлайн-площадок, с помощью которых любой пользователь может продать или приобрести нужную вещь [16]. Информационный портал или новостники (Приложение В, рисунок В.8) [16]- — это сайты, состоящие по большей части из страниц с короткими, актуальными недолгое время текстами, также известными как «новости». Такие сайты могут принадлежать компаниям с широким кругом деятельности. Информационный портал содержит очень большое количество веб-страниц. Отличительной чертой является наличие большое количества и широкого диапазона различных сервисов для пользователей. Они собирают в основном событийный трафик, и требуют постоянной, ежедневной работы над собой. Трафика в новостях много. Обычно это городские порталы (типа 36on), или региональные SakhaLife. Пример полезного сайта, которому реально доверяют люди — Лента.ру. Но многие вебмастера делают общие новостники, копируя новости с других сайтов (настроив парсинг), либо переписывая их. Это могут быть инструкции к лекарствам, тексты

18 законов или еще что-нибудь. Основная ценность сервисов не в их контенте, а в их техническом функционале. Одно время неплохой доход приносили сайты о погоде, пока не появился Яндекс. Или сайты-переводчики, пока их не атаковал Гугл. Или почтовые сервисы. Поисковик (поисковая система) — это сайт, выдающий в ответ на запрос пользователя список релевантных этому запросу веб-страниц [16]. Некоммерческий сайт (Приложение В, рисунок В.8) [16]- – это виды интернет ресурсов, которые принадлежат научным объединениям, различным организациям, в том числе и благотворительным, предоставляют пользователям интернет-ресурсы. Некоммерческий сайт может предоставить различную и бесплатную информацию. Такие проекты не извлекают прибыли, развиваются сами по себе. Персональный сайт (Приложение В, рисунок В.10) - личная страница или же домашняя страница, на которой пользователь размещает личную информацию. Пользователь может разметить фотографию или заявить о себе. Абсолютно понятно, что в последние десятилетие социальные сети приобрели невероятную популярность. Социальные сети (Приложение В, рисунок В.11)- базируются на социологических теориях. Функция социальных сетей помогает удобно регистрироваться пользователям на сайте, аккаунты взаимосвязаны с регистрацией сайтов. Поисковые системы (Приложение В, рисунок В.12) [16]- – специальный веб-узел сайт, предназначенный для поиска текстовой и графической информации во всемирной паутине, и предоставляет пользователям запросы на страницы. Большая часть поисковых систем превратилась в полноценные интернет-порталы с огромным набором пользовательский модулей. Почтовые сервисы - стали большими порталами и частью других порталов. Тематический сайт — это ресурсы, которые могут быть посвящены какой-либо определенной возможности, достаточной тематике. Видео-хостинги (Приложение В, рисунок В.13) [14]- – сервисы хранения и воспроизведения видео, подобные сайты дают возможность пользователям загружать свои видеозаписи, которые смогут просматривать все желающие посетители сайта. Доски объявлений аналог обычным бытовым доскам объявлений при рекламных газетах, где каждый желающий может вывесить свое обновление, а все посетители могут прочитать его. Каталоги сайтов – это ресурсы, которые структурированы списками на интернет-сайты и снабжённые краткими описания о сайтах. Онлайн энциклопедии. Такие сайты базируются на вики-принципе, который заключается в том, что пользователь не может самостоятельно добавлять новые статьи и вносить изменения. Сегодня сайты содержат сотни тысяч страниц, которые нужно оптимизировать под пользовательские предпочтения. Важным фактором является то, что должна быть техническая поддержка сайта и возможность результативного продвижения в

19 поисковых системах [14]. 1.5 Требования к созданию сайта Сайт выражает индивидуальность предприятия, которое его использует. Учитывая тот факт, что сайт является главным звеном, между компанией и клиентом требования к нему особенно строги. От успешной разработки логотипа, товарного знака и самого сайта во многом зависит эффективность всего фирменного стиля [14]. Гармоничный и грамотный сайт работает на компанию и привлекает клиентов или покупателей. Требования к созданию сайта определяют направление организации и контингент пользователей. Нормативные документы: - ГОСТ 19.001-77 Единая система программной документации: Общие положения; - ГОСТ 19.002-80 Единая система программной документации: Схемы алгоритмов и программ. Правила выполнения; - ГОСТ 19.003-80 Единая система программной документации: Схемы алгоритмов и программ. Обозначения условные графические. ГОСТ 19.001-77 устанавливает целевое назначение, область распространения, классификации и правил обозначения стандартов программой документации. Это означает, что унификация программных изделий для взаимного обмена программами и применяемые ранее разработанных программ в новых разработках. Так же снижение трудоемкости и повышение эффективности в разработанных программах [14]. Создание сайта включает в себя анализ функционирования, развитие и совершенствование программы, а также внесение изменений в нее с целью устранения ошибок. ГОСТ 19.002-80., распространяется на алгоритмы и программы системы программного обеспечения вычислительных машин, комплексов и систем независимо от их назначения и области применения и устанавливает их правила выполнения схем алгоритмов и программ, выполняемых автоматическим способом или от руки. При выполнении схем или программ отдельные функции алгоритмов программ, учетом степени их детализации, отображаются в виде условных графических обозначений или символов. ГОСТ 19.003-80. Настоящий стандарт распространяется на условные графические обозначения, в схемах алгоритмов и программ, отображающие основные операции процесса обработки данных программирования для систем независимо от их назначения и области применения. Стандарт не распространяется на записи и обозначение, посещаемые внутри символа или рядом с ним, служащие для уточнения выполненных функций [14].

20 1.6 Тренды и тенденции веб-дизайна Всемирная путина со времен написания самого первого кода Тимом Бернерс — Ли отражает изменения общества, в котором мы живем. 3D Depth, новая тенденция в вебдизайне основанная на 2D графике, которая переходит в 3D графику. В данном тренде могут быть и моушн эффекты. Например, на одной стороне находится брошюра с текстом, а на другой половине вставленная 3D модель. Монохром (Приложение Г, рисунок Г.1) – очень интересный и одновременно обычный вид дизайна, когда все может быть розового цвета, но на несколько оттенков светлее или темнее. Плюс такого тренда, то, что все смотрится органично в одном цвете [24]. «Сияющий метал», (Приложение Г, рисунок Г.2), [24]- тренд, который делает акцент с помощью естественного блеска, на некоторых сайтов присутствуют модели метала, так же заменяют реальными вставками из цепочек или металлических колец. «Типографическая мания» (Приложение Г, рисунок Г.3), [24]- Тренд, который сопровождает в себе огромное количество больших букв на всем пространстве, чаще всего перед этими буквами находятся надписи шрифтом меньше. Картинка, вставленная в текст (Приложение Г, рисунок Г.4), [24]. Этот тренд представляет собой текст, в котором заключено изображение. В нем могут быть абсолютно разные картинки, от реалистичных фотографий до ассоциативных изображений, но только при вставке в текст, они приобретают полноценную картину стиля. Line Art -(Приложение Г, рисунок Г.13), [24] - достаточно неясный тренд, так как за основу взяты простые линии. На данный момент. Line Art является превалирующим трендом в вебе и в графическом дизайне, так как он достаточно прост в создании. Коллаж из рисунков и фотографий - новый тренд, который соединяет в себе искусство и фотографию. Чаще всего изображение делиться на две половины, и одна часть достается искусству, которая остается фотографией. Многие считаю такой тренд, очень веселым, так как он прост в исполнении и напоминает детские разукрашенные изображения. «Простые иллюстрации» (Приложение Г, рисунок Г.5), [24] - название говорит само за себя. На данный момент в 2020 году, это часть графики, которая находится в топе по использованию. Он не требует особой детализации, но при этом должен иметь четкий и понятный интерфейс. «Изометрическая иллюстрация» - в 2020 году изометрия, получает хороший спрос если дело касается, жизнедеятельности человека. Это просто замечательный визуал и чаще всего из него создают небольшие 3D ролики. «Земные цвета» (Приложение Г, рисунок Г.6) [24]- не совсем популярный тренд 2020. Этот тренд помогает создать интересную композицию, которая напоминает о пятидесятых. Паттерны и текстуры (Приложение Г, рисунок Г.7) [24] – обычно создается квадрат или какая-либо другая фигура и на нее накладываются определённые текстуры и паттерны

21 Геометрический дизайн (Приложение Г, рисунок Г.8)- дизайн, который держится на формах, изначально зародился в 2016 году и продолжил набирать обороты в 2020. Микс из геометрических форм может создать целостную и привлекательную композицию, которую могут оценить пользователи. Кроме 2D форм постепенно внедряют 3D, которые освежают концепцию сайта. Имитация жидкости. (Приложение Г, рисунок Г.9), [24]. Очень красивый и интересный дизайн, чаще используется в косметической сфере или сфере питания, напоминает развод краски. (Приложение Г, рисунок Г.12) [24]. Минималистичный дизайн сайта привлекателен для посетителей, потому что из него исключается все избыточное, а используются действительно необходимые элементы взаимодействия с пользователем. Это помогает улучшить доступность и читабельность контента на различных устройствах. Уникальные возможности HTML5 впечатляют: новые элементы для размещения на странице аудио и видео, оффлайн средства, анимация. Новые типы полей в веб-формах и прочие возможности, а в сочетании с CSS3 разработчик может добиться потрясающих результатов. Благодаря новым правилам появившимся в CSS3 стало возможным создание множества интересных визуальных эффектов, таких как закругленные углы у блоков, тени, градиент в качестве фона, полупрозрачные элементы, использование веб-шрифтов и многое другое. Для реализации перечисленных характеристик больше не нужно использовать графические изображения javaScrip Подобные решения позволяют использовать пространство страницы по-другому. С их помощью есть возможности разместить все нужные пункты подменю на одном экране. В каком-то смысле это делает навигацию по сайту более детальной и полезной для пользователей. Важно только, чтобы пользователи сумели разобраться с нестандартным решением. Карточки в дизайне — далеко не новый тренд в дизайне сайтов, однако в 2020 он является актуальным. Данное решение эффективно представляет информацию на разных платформах: начиная с мобильных приложений и заканчивая просмотром на больших ТВ экранах. Подобный формат организации данных позволят максимально удобно для пользователей сфокусировать всю информацию по объектам. Этот подход используют многие популярные проекты в сети: Facebook, Pinterest, Netflix. Последний вариант — пример успешной реализации карточек в дизайне, который сочетает в себе минимализм, возможности навигации и эффективность. Большая и оригинальная типографика. В далеком 2009 году применение огромных шрифтов было одним из перспективных трендов дизайна сайта. В 2017 вероятно происходит то же самое (по крайней мере большинство дизайнеров об этом упоминают) [24]. Градиенты и яркие цвета. Еще одна тенденция веб-дизайна 2020 — использование

22 ярких цветовых палитр для градиентов (и не только). Старт эры плоского дизайна принес в онлайн интересные фишки, но работать в этом стиле нужно весьма аккуратно, он может способствовать обезличиванию сайта. Чтобы решить данную проблему, некоторые специалисты начали экспериментировать с яркими цветами и градиентными решениями. В текущем году тенденция продолжит развиваться, причем не только в Web`е [24]. Данный тренд можно использовать не только для фона. Один из популярных приемов — создание перехода между двумя цветами и наложение их на картинку. Это позволяет сделать фото более интересным. Яркие цвета добавляют в дизайн глубину, динамизм и энергетику. Сама по себе анимация на сайте не нова, однако дизайнеры с каждым годом учатся реализовывать ее все красивее и эффективнее. Незначительные визуальные эффекты для изображений / объектов / контента могут не только оживить ваш проект, но и добавят дополнительный инструмент обратной связи с пользователем [24]. В современных UI/UX интерфейсах разные микровзаимодействия превращают рутинные процессы в более веселые способы получения информации и также позволяют пользователю видеть и понимать, как работает тот или иной элемент страницы [24]. Параллакс эффект. (Приложение Г, рисунок Г.11)- Еще один знакомый ранее тренд веб-дизайна сайтов в 2020 открылся с новой стороны. Сам по себе Parallax реализуется за счет разной скорости движения фона и переднего плана при прокрутке, что создает впечатление глубины и динамичности картинки. Почти виртуальная реальность. VR — одна из наиболее актуальных тем несмотря на то, что реальная ситуация в данной сфере менее оптимистична многих прогнозов. В некоторых макетах можно встретить разные приемы, которые бы создавали для пользователя «эффект присутствия»: 360 градусные видео и панорамы, видеовставки «как в кино». Тактильный, естественный дизайн. Данный тренд объединяет сразу два направления — натуральная цветовая гамма и тактильный дизайн [24]. Чрезмерная увлеченность плоскими Flat решениями превратила многие веб-проекты в однообразные безликие Bootstrap макеты. Некоторые дизайнеры пытаются отходить в сторону более естественных решений, например, они размещают фото и реалистичные модели на сайте, чтобы было ощущение возможности прикоснуться и потрогать объекты на сайте. Также дизайнеры используют природные материалы в качестве текстур, иллюстраций и фонов и натуральные оттенки (зеленые, коричневые, серые, нейтральные металлические). В процессе изучения основных трендов дизайна сайтов 2020 года нам встречались разные мнения. Фоновые видео и изображения. Тренд с большим изображением для бэкраунда, вероятно, будет оставаться актуальной еще долго, она идеальным образом привлекает внимание пользователей. Прием отлично работает для сайтов разных типов — от электронной коммерции до путешествий и портфолио. Можно сделать фон еще более

23 эффектным за счет добавления анимации или видео [24]. Благодаря YouTube и подобным проектам видеоконтент сейчас весьма популярен. Геометрические формы. Если внимательно посмотреть на скриншоты веб-проектов выше, то во многих из них есть использование разных геометрических форм. Зачастую это квадратные прямоугольные фигуры, но также встречаются кривые, треугольники и круги. Подобные блоки могут содержать контент или применяться для выделения фона [24]. Уникальные иллюстрации. В подборке красивых рисованных сайтов было найдено не так много оригинальных работ, но данный тренд веб-дизайна в 2020 будет все еще актуален. Во-первых, иллюстрации добавляют проекту персонализированный вид (что в эпоху Flat макетов большой плюс). Во-вторых, метод отлично сочетается с нестандартной типографикой, позволяя создать еще более уникальные макеты [24]. Можно включить тенденцию использования реальных фото в дизайне вместо картинок. Важно следить за трендами и понимать какие инструменты можно для этого использовать. Тренды меняются, совершенствуются, модернизируются. Дизайнеру необходимо знать о новых трендах, чтобы сайт привлекал новых пользователей и создавал правильно впечатление. Первое чего касается тенденции в дизайне, это мобильные гаджеты. Некоторые исследования показывают, что в год использование сайтов помощью телефонов, превышает использование компьютеров [24]. Сегодня же, когда смартфоны и стали высокоинтеллектуальными, проявилось больше возможностей создавать удобный и красивый дизайн и именно мобильные свойства повлияли на тренды в веб-дизайне в 2020 году [24]. Больше пространства – это тренд, который делает пространство экрана больше за счет белого цвета. И именно белый, это тот цвет, который сочетается со всеми остальными цветами, ведь можно выбирать совершенно любые оттенки. Отзывчивые логотипы – один из самых сложных трендов, суть заключается в том, что они сокращаются или увеличиваются за счет девайся. Такой тренд, должен выполнять две функции, это сохранить бренд независимо от устройства и оценить повседневный фактор. Студийные минималистические фото – это яркие и многоэлементные фотографии на сайте, которые так же является высококачественными и чаще всего на фотографии изображен всего лишь один элемент, который отображает концепцию сайта [24]. Нестандартное строение блоков – классический способ, который устарел, но не теряет своей эффективности. Сейчас структурируют блоки по ломанной сетке и хаотично размещают по странице [24]. Фоновые видео делают дизайн сайта необычным и современным, что увеличивает увлечённость пользователя и приводит проект к большей эффективности. Тренд

24 с полноэкранным видео уже успел побывать и на вершине и уйти вниз как ненужный элемент. Со временем появились новые технологии, которые позволили вернуть этот фон в строй и значит могут занять лидирующие позиции в 2020 году. Синемаграфы – это не гифки, это статичные иллюстрации с частичной анимацией. Это самое новое и свежее решение в 2020 году в веб-дизайне, но также и гиф-изображения являются трендом 2020 года, они дают понять пользователю на каком сайте он находится. Графика и изображения – замена привычным фотографиям. Это не простая графика, а ультрояркая и пестрая и делающие акцент на себе [24]. 1.7 Анализ дизайна сайтов (аналоги) При создании сайта необходимо понимать, что фирменный стиль компании занимает важное место в дизайне сайта. Логотип и фирменные цвета должны быть так или иначе отображены, чтобы сайт визуально ассоциировался с компанией. К сожалению, далеко не все дизайнеры и создатели сайтов это понимают. Рассмотрим неудачные примеры использования логотипа фирменного стиля при разработке сайтов. Расположения блоков сайта «12wave.com» (Приложение Д, рисунок Д1)- нет, так как основная информация находится в конце сайта. При этом на сайте есть очень интересная заставка, показывающая, что страница загружается. Из себя она представляет не яркий фон, на котором изображен знак бесконечности в стиле Line art и по этому знаку катается велосипедист. После того как сайт загрузился перед нами представляется главная страница, оформлена она не совсем удобно так как стрелочка, которая расположена внизу страницы, полупрозрачная и для перехода на другие страницы ее не видно. Стоит заметить, что эту ситуацию спасает динамичное передвижение объектов на странице, именно тогда, когда нажимаешь стрелочку, распложённую внизу ракеты. Метеориты, звезды. Это достаточно удачное решение для сайта. Дизайн сайта «12wave.com» можно разделить на три составляющие, а именно: подвижная часть с 3d эффектами, неподвижная часть в 2d графике и 3d детали, завершающие фон этого сайта. Шрифт, выбранный для кнопок, не сочетается со шрифтом логотипа, он слишком светлый и сжатый. Переход страницы «12wave.com» резкий и изображения, появляющиеся на странице достаточно хаотичные. Интересный и спокойный переход в низ страницы. Визуализация - сайт «12wave.com». Русский сайт, который хорошо оформлен в плане визуализации, но в плане динамике достаточно непривычен. Сайт сделан на тематику космоса и из-за того, что присутствуют синий белый, серый, дает понять, что на этом сайте достаточно удобно находится. Дополнительными деталями служат интересные рисунки, которые разработаны для

25 каждой станицы этого сайта. Все формы присутствующие сайте плавные, полукруглые, такие формы внушают доверие пользователю. Очень интересное решение с задним фоном страницы. Разработчики сайта решили сделать как интересный сценарий и поэтому, когда пользователь видит барашков и нажимает на них, появляются диалоги и это вызывает интерес у пользователя и желание изучить этот сайт и продлить свое время на нем. Сайт полон динамики и при движении мышки на поле, он начинает двигаться влево или вправо. Сайт «awdee.ru», (Приложение Д, рисунок Д.2)- хоть и специализируется на графическом дизайне, у него есть такие части блока, где находятся различные направления в дизайне. Каждый день заходя на главную страницу можно увидеть, новости, которые обновляются каждый день. Все блоки четко видно. На главной странице «awdee.ru» присутствует достаточно большое количество информации, которая регулярно обновляется, в левом верхнем углу видны блоки, которые четко расположены. Точно так же, как и в первом аналоге, разработчики решили использовать белый, синий и добавить жёлтый цвет. Сайт смотрится достаточно сложным, интересным. На шапке сайта присутствует полупрозрачное изображение, а выше него ссылки на другие социальные сети этого сайта. Присутствует кнопка поиска, которая не очень удачно вписывается образ сайта. Кнопку поиска можно было бы заменить на изображение, ту же самую лупу, чтобы шапка смотрелась органично и законченно. Шрифт, выбранный для кнопок, не сочетается со шрифтом логотипа, он слишком светлый и сжатый. Сайт «awdee.ru» является русским сайтом, специализирующимся на графическом дизайне. На данном сайте стоит поменять приглушенный синий цвет, который находится в шапке сайта. Шрифт, предположительно Times New Roman стоит поменять, так как, этот шрифт с засечками и плохо читается в информационном поле. Сайт «awdee.ru» имеет различные, интересный визуальные картинки с разными размерами, в которых находятся статьи. Если пользователь откроет одну из страниц сайта, то увидит множество полезных статей, которые могут его заинтересовать. Навигация по сайту достаточно удобная. Так как чаще всего при создании сайта, разработки ориентируются на инстинкты, которые позволяют находить информацию на поверхности. Есть такой минус, как нет кнопки возврата на предыдущую страницу или на главную страницу. Когда пользователь нажимает на какой-либо раздел, у него нет возможности вернуться. Было бы очень удобно, если на сайте появилась такая кнопка. Так как эта кнопка является одной из главных вещей айдентики сайта. Сайт «ucreative.com» (Приложение Д, рисунок Д.3) – имеет фотографию, плавно сменяющуюся другой. Фотографии здесь являются централизующим элементом. Кнопки работают, меню расставлено удобно. Расположение блоков на сайте «ucreative.com» удобное

26 и находится в правом верхнем углу. Главная страница сайта «ucreative.com» довольно простая, которая сопровождается большой четкой фотографией на белом фоне. Сайт «ucreative.com» Американский сайт, имеющий интересное сочетание цветов и шрифтов. Создатели сайта решили поэкспериментировать с размерами шрифта. Шрифт на сайте имеет пять размеров, начиная от заголовка и заканчивая подписями просмотров. Очень удобное расположение разделов. На сайте, на главной станице присутствуют новости, которые расположены на правой стороне и ее середине. Есть достаточно удобная копка поиска, правда лупа, которая обозначает поиск, ее плохо видно так как она полупрозрачна, и пользователь просто не сможет ее заметить. Сайт позиционирует себя как для работы графическим дизайнерам, вдохновляющий сайт с различной информацией и ресурс бесплатной информации. Основные цвета задают именно фотографии, размещенные на главной странице. Благодаря полупрозрачным окошкам подписей, можно видеть и фотографию, и подпись одновременно. На главной странице имеются статьи, которые подписаны, что это дизайн. На самом деле это удобно и упрощает пользователю поиск какой-либо информации. Если спуститься ниже, то можно заметить, что имеется кнопка Show more pots, что означает, что на других страницах тоже присутствуют старые статьи, которые возможно будут нужны определённым пользователям сайта. Визуализация «ucreative.com» совершенно простая, несмотря на то что она является русским аналогом «awdee.ru». Следует отметить, что наиболее удобные и визуально приятные страницы можно наблюдать у иностранных компаний. Это связано с тем, что изначально развитие технологий IT и интернета начиналось с США, именно поэтому дизайн сайтов за рубежом наиболее развитый и современный 1.8 Line art как стиль сайта Для поставленных задач, наиболее подходит стиль, основанный на теме эскизов, рисунков, карандаша и бумаги или так называемый Line art. В этом стиле все просто и понятно, предметы не пытаются быть тем, чем они быть не должны. Вся композиция формируется с помощью конструкции, это ориентировано на отображение принятой концепции. Line art является одним из трендов 2020 года, графические элементы этого тренда указывают на то с чего начинается каждый проект, рисунок. На сайте, выполненном в данном стиле, используются смелые цвета, линии карандаша, кисти и графические формы. Применение таких графических элементов дает возможность наполнить сайт чистыми естественными элементами. Это – любое изображение состоящие из разных линий, это может быть гармоничная композиция прямолинейных, симметричных, четких форм, и строгость изображения, непримечательный, но не интересный рисунок – таким будет

27 изображение в стиле Line art. Line art требует единения пространства, четкости, его плавного «перетекания» из линии в линию. Есть множество достойных работ, которые могут послужить аналогом данного стиля. Авторский сайт по концепции Line art, (Приложение Е, рисунок Е.1)- должен будет повысить интерес у дизайнеров к своей будущей профессии. Line art позволяет создать эксклюзивный сайт, передающий ощущение творчества и дающий вдохновение. Линия является самым базовым инструментом любого дизайнера или художник, с чего начинается творчество, будь это эскиз и рисунок. Этот ресурс обладает большим потенциалом. Но чаще его делают в качестве обводки или дополнения к какомулибо рисунку, который состоит из форм. Контуры и очертания можно оставить без всего, без заливки, без формы и именно в этом заключается смысл лайн-арта. Поэтому с чаще всего Line art путают с минимализмом (Приложение Е, рисунок Е.2). Линейные изображения – любое направление в графике, где основным элементом, не является форма. Обычно используется линия контрастного цвета, либо нейтральный белый, либо черный. Так как линия является универсальным средством, с ее помощью можно передать любое изображение. В тоже время Line art подходит разработки логотипов компаний далеко не всех индустрий. В этой направленности, требуется передать силу четкости изображением, Line art. Может передать уникальность, изящность или престижность компании, привлечь внимание к деталям, свобода иллюстративного стиля (Приложение Е, рисунок Е.3). Характер линии сам по себе может быть прямой ломаной или кривой. Как и любого стиля есть плюсы и минусы. Из плюсов это снижение стоимости печати картинки и простой передачи изображения в черно-белом вариантной полиграфии. С Line art нужно быть осторожнее, любой мелкий недочет может выглядеть непрофессионально. Важно передать все черты компании или организации сделать фирменный знак уникальным. Дизайнеры воспринимают Line art как просто набор основных элементов на сайте без добавления деталей. В основном Line art в дизайне — это акцент на контенте, а не его оформление. Line art это простота, ведь не нужные детали отвлекают и создавая макет разработчики часто увлекаются и добавляют лишние элементы которые мешают увидеть полную картину сайта. Line art, решает эту проблему и дает возможность пользователю быстро наладить нужную информацию и легко составляет представление о продукте или об услуге.

28 2 Разработка айдентики макета площадки молодых дизайнеров сайта коммуникативной 2.1 Выбор обоснования авторской концепции Были рассмотрены различные аналоги сайтов и коммуникативных площадок, которые помогли обоснованию и разработке собственной авторской концепции макета сайта. Прежде всего, за основу концепции был взят чистый, белый лист. Белый цвет привлекает внимание ровно настолько же, как и черный (Приложение З, рисунок.1) [19], [36]. Сайты с белым или очень светлым фоном почти всегда смотрятся стильно, если правильно наполнены. В аналогах, которые были просмотрены, такими были в основном, зарубежные сайты различных дизайнеров, а также общественных организаций [19], [36]. После тщательного анализа дизайна сайтов, фирменных цветов компаний, а также взаимодействия этих логотипов в таком элементе фирменного стиля, как сайт, была предложена одна из основных идей – концепция «карандаш и бумага». Невозможно сказать, что главным элементом является только наполнение, визуальные элементы и эффекты играют важную роль. Именно фотографии должны быть главным элементом всех страниц. Следующим шагом был поиск цвета и цветовых пятен, которые будут ассоциироваться с сайтом и коммуникативной площадкой, а также будут композиционным связующим. Вторым цветом, кроме белого, был выбран фиолетовый, а как тандем к этому цвету и поддержка был выбран серый. Далее, следующим шагом был выбор второстепенного цвета [19], [36. Соответственно, всю концепцию можно описать тремя словами: «белый», «бумага», «фиолетовый». Также, помимо этого, в процессе разработки был сформирован главный девиз концепции – «твой мир дизайна». Мало создать красивый сайт, нужно было сделать его удобным и приятным для пользователя, потенциального покупателя. Также, необходимо было продумать структуру блоков и меню. Многие из них, первоначально, казались интересными, однако после эскизирования данные варианты утратили свою привлекательность [23], [36]. Среди них была концепция внезапно выплывающих блоков. Данный вариант достаточно сложен для проектирования и именно поэтому он часто смотрится не так, как было задумано. Поэтому было решено придумать некий модуль, которому будет подчиняться вся система сайта. Так как человек за монитором чаще всего смотрит на его середину, основной блок должен располагаться в середине экрана [26]. Наиболее рациональным вариантом было выбрать в качестве модуля квадрат и прямоугольник, так как в него удобно вписать и вертикальное изображение, и горизонтальное. Для удобного просмотра большого количества изображений, в галерее должно быть три модульных квадрата подряд [28].

29 Столбцов может быть только три, а строк – бесконечное множество. Таким образом, концепцию можно описать несколькими словами: «просторно, ярко, удобно». Задачей было создать сайт для дизайнеров всех направлений [28]. Кроме того, не стоит забывать, что излишняя перегруженность смыслами может навредить проекту, идея останется не прочитанной. Изменение концептуальных оснований наиболее радикальное из всех, которые может испытывать человек, так как оно ведет к отказу от обоснованных ранее убеждений и стандартов мышления и действия, к смене исходных концептов-понятий, обеспечивающих целостное восприятие мира [23]. В иллюстрированном словаре-справочнике по дизайну понятие «концепция» рассматривается как «основная идея будущего объекта, формулировка его смыслового содержания как идейно-тематической базы проектного замысла, выражающая художественно-проектное суждение дизайнера о явлениях более масштабных, чем данный объект. Дизайн-концепция - целостная идеальная модель будущего проекта, описывающая его основные характеристики. 2.3 Разработка айдентики и цветовое решение сайта Были созданы несколько вариантов цветового решения, логотипа, расстановки блоков и слогана. После утверждения одного из вариантов необходимо было оформить и конкретно распределить блоки, в которых будет располагаться информация специальная для этих блоков. Работа над концепцией должна была быть представлена в эскизной технике [34], [35]. На данном этапе необходимо было продумать цветовое решение будущего сайта, а также его айдентику и иконки. Айдентика — это совокупность элементов дизайна, относящиеся к компании. Брендинг – маркетинговые приемы, которые направляют на формирование уникальности бренда. Для диплома была выбрана тема «Разработка айдентики макета сайта коммуникативной площадки молодых дизайнеров» [34], [35], [33]. Кроме цветов и шрифтов в айдентике важны формы. Форма способна усилить впечатление, которое нужно произвести на пользователей. Например, иконка с плавными контурами повлияет на восприятие совершенно по-другому, чем квадратная. Создавая айдентику, необходимо учитывать так же эмоциональную составляющую фигур. Например, геометрические формы, такие как круг, создают более теплые ощущения. Такие формы несут идею заботы и теплоты. Фигуры с прямыми и острыми углами несут мысли о силе и стабильности. Для разработанного сайта была выбрана форма овала и прямоугольника. Важно помнить, что любой вид айдентики прежде всего анализ полученного опыта. Если это динамическая айдентика, то чаще всего это кажется крутой, разнообразной, но важно помнить, что не каждой компании или пользователю она понравится. Динамическая

30 айдентика нужна компаниям, у которых разные ветви бренда и достаточное большое количества продукции или носителей. Важно ориентироваться на аудиторию, если подразумевается на молодежь, то она обратит свое внимание на креатив, если аудитория возрастная, то лучшим решением будет взять, что ни будь классическое. Состав айдентики можно разделить на несколько частей [34], [35]. Создание айдентики и сайта состоит в том, чтобы продумать, что должно быть на этом сайте, расположение блоков, цветовая палитра и разработка дополнительных элементов, а в элементы входят: дизайн, верстка, контент доменное имя. Именно с этого началось обсуждение проекта с научным руководителем [33], [34], [35]. Шрифты, цветовая палитра, логотип — это составляющие айдентики. Количество шрифтов были использованы три, один из них это «Gilium» используется для кнопок меню, а также шапок сайта. Второй шрифт был «Century Gothic» этот шрифт используется для надписи основного текста. Третий шрифт «Mistral» этот шрифт используется только для надписи логотипа. Важно продумать то, как будут выглядеть электронные письма. Прежде всего, электронные письма являются необходимыми в визуальном мире бизнеса и общения. Важно сделать так, чтобы они не затерялись среди других писем. Письма должны быть лаконичными, текст простым в восприятии, так же можно добавить несколько фотографий. Следующая часть айдентики это цветовая палитра. Каждый цвет неосознанно формирует определенные ассоциации. Умение совмещать оттенки может глобально повлиять на то, как будут видеть сайт пользователи. Цвет играет большую роль в жизни человека. Правильные подобранные цвета являются важнейшим фактором влияющем на развитие сайта. Каждый веб-дизайнер должен правильно совмещать различные цвета. В системе создания сайта важно задать нужную цветовую гамму. Главной задачей цветового оформления сайта является подчеркивание значимости сайта. Дизайн сайта не должен отвлекать пользователя от главного информации, представленной на сайте. Не стоит забывать, что есть цвета, которые привлекают людей. Красный цвет - отвечает за эмоции. Если компания, площадка для общения и какой-либо сайт позиционирует себя как смелый и активный, то абсолютно точно может брать этот цвет. Оранжевый, тоже яркий цвет. Как правильно оранжевый создает дружественную атмосферу, но его используют гораздо реже, чем красный [17], [31], [36]. Желтый, цвет солнца. Если компания инклюзивная, то обязательно он должен присутствовать на сайте и, как правило, жёлтый цвет, это цвет продажи, привлечение внимания. Самый универсальный цвет в радужной палитре это зеленый. Если деятельность связана с природой или миром финансов, то он просто необходим для айдентики. Синий цвет – этот то цвет, который нравится практически всем, чаще всего позволяет

31 выставить компанию в выгодном свете и создать ощущение надёжности и стабильности. Фиолетовый вызывает ассоциацию с роскошью и чаще всего компании, которые работают в дорогом сегменте, используют именно этот цвет. Розовый цвет ассоциируется с женственностью. Если услуги и продукты нацелены на женщин, то, как правило, компании включают розовый цвет в цветовой ключ [17], [31, [36]. Коричневый и черный цвета встречаются в компаниях не так уж и часто, так как-то достаточно сложные цвета. Цвет – то, что первым делом выделили заказчики. Создание гармоничной цветосветовой среды для любого проекта - многоуровневая задача, требующая от профессионала помимо креативного подхода к проектированию, учета множества факторов: функционального назначения пространства и его эмоционально-образного строя, индивидуальных предпочтений студентов, а также предложений рынка по созданию уже самого сайта. В различных блоках цветовая палитра отражает соответствующий эмоциональный и образный строй. Блоки, которые присутствуют на сайте, выполняют различные функции - кабинета или форума, содержат атмосферу самоуглубления, сосредоточенности. Графические задачи разного уровня предполагают различные варианты колористического решения. В значительной степени на цветовое решение сайта оказывают влияние индивидуальные предпочтения пользователей, их запросы, а также постоянно меняющиеся модные тенденции в дизайне. Самые важные вопросы при работе с аналогами и поиском концепции: выполнить сайт в необычных цветах, сделать стильным, соответствующим молодым дизайнерам. Молодые дизайнеры – это современные, амбициозные, самоуверенные, творческие люди. По канонам брендов сегодняшнего дня, прямые и «чистые» понятные глазу линии должны быть на первом месте. Результатом обсуждения явились следующие моменты, в будущем они станут основой всей концепции проекта: В 2020 году стали использовать яркие цвета, они могут сделать дороже разрабатываемые сайты при плоском дизайне [17], [31], [36]. - белый и фиолетовый – основные цвета; - черный; - много плавных линий и штрихов. 2.4 Авторские разработки макета сайта На основе вышесказанного можно сделать вывод, молодым дизайнерам подойдет молодежный стиль. Понятие современного стиля в веб-дизайне довольно объёмное. Оно включает в себя ряд характерных признаков, которые, в первую очередь, отличают его от классических направлений в веб-дизайне. Сайт должен быть функциональным и комфортным. Основой дизайна сайтов является свободное поле.

32 В современном направлении дизайна важны простые формы и чёткие линии. Сайты стремятся к открытым пространствам и отвергают обилие сложных деталей и сложных, замысловатых конструкций. Цветовые решения сайтов, которые создаются последние 3 года стали более монохромными, «выбеленными» - все оттенки белого. В авторские разработки макета сайта входят собственные разработки рисунка, которые дают определённые ассоциации на сайте, так же авторскими разработками является разработанные логотип, формы, иконки, которые будут на сайте и сопровождаться на каждой страницы. Линии – еще один «инструмент» дизайнера, с помощью которого можно оживить самую простую графическую работу. Студенты на данный элемент оформления согласились. Главное правило – чувство меры. Нельзя перенасыщать сайт декором, каким бы «правильным» и подходящим к случаю он не казался. Иначе можно получить результат обратный ожидаемому. Таким образом, был решен вопрос стиля будущего сайта. Штриховой рисунок – это изображение, которое может состоять из отдельных прямых, изогнутых линий. Должна быть эстетика, прежде всего, это чувственное восприятие прекрасного в окружающем нас мире во всевозможных его проявлениях. Будь то музыка, живопись, литература или закат солнца. Все что нас окружает в нашем личном пространстве, очень разное, в том числе и прекрасное. Главное при разработке дизайн проекта учитывать интересы и пожелания заказчика. Штриховые рисунки могут быть использованы в разных цветах или просто быть однотонными. Они подчеркивают форму и контур, создают текстуру и привлекают внимание. Долгое время штриховой рисунок был стандартным форматом для всего, что требовало иллюстраций, печати, рекламы. И фундаментом штрихового искусства является линия. Форма может быть обозначена контуром или контурными линиями. Так же к штриховому искусству относится: - скринтон; - зернистость; - штриховка; - оттенки серого. Важно предоставить пользователю сайта целостную и понятную картину. И учитывая смысл сайта, сделать его удобным, функциональным и таким, что можно было достаточно большое количество времени пользоваться сайтом. По утверждению концепции, выполненной в эскизной технике на основе обсуждений с научным руководителем, было решено переходить к этапу разработки уже полноценной графической части в графической программе Corel Draw. Компоновка блоков сайта подразделяется на логотип, название, телефон, картинку, меню, основную часть и подвал. Как правило, это все может меняться в зависимости от цели сайта. Вот именно поэтому все начинается с разработки айдентики.

33 3 Экономический расчет Основная цель экономического расчёта заключается в том, что очень важно все досконально рассчитать для того, предотвратить всевозможные риски и подготовить сумму, на которую рассчитывает заказчик. В экономическом расчёте подсчитывается реальный экономический эффект. В данном экономическом расчете будет подчитана стоимость разработки айдентики и стоимость разработки (программирования) дизайна сайта. Все подсчёты ведутся в течении разработки сайта и айдентики. Не стоит забывать, что стоимость разработки айдентики и стоимость разработки сайта разные. При разработке сайта и айдентики заказчик должен быть готов заплатить хорошую сумму за хорошую работу и в последствии все должно быть заключено договором [38], [39]. Дизайн-проект является одним из основных видов профессиональной деятельности дизайнера, в котором он в графической и объемной форме выражает свой художественный и инженерно-технический замысел. Дизайн-проект служит средством демонстрации дизайнерского решения заказчику, а также является основой для дальнейшей работы над проектируемым объектом смежных специалистов на стадии рабочей документации [38], [39]. Дизайн-проект может быть выполнен дизайнером инициативно на свой риск и стать его интеллектуальной собственностью. Его дальнейшая передача в производство может быть осуществлена на основе договоров купли-продажи интеллектуальной собственности в соответствии с действующим законодательством. Дизайн-проект может быть выполнен на основе заказа в рамках договора между Исполнителем и Заказчиком. Договор на выполнение дизайн-проекта определяет назначение объекта проектирования, конкретный состав проекта, график выполнения проектных работ, наименование этапов и их содержание, и стоимость, стоимость дизайн- проекта, а также порядок выплаты вознаграждения за проделанную дизайнером работу. Неотъемлемой частью договора является техническое задание на проектирование, устанавливающее требования, предъявляемые к проектируемому объекту (функциональные, конструктивные, технологические, художественно-стилистические, стоимостные) [38], [39]. Таким образом общая стоимость проекта разработки айдентики равна: 8000.00+3000.00+3000.00+3000.00+3 000.00+3 000.00 = 23 000.00 рублей. Стоимость разработки сайта таким образом равна: 5000.00+3000.00+10000.00+4000.00+15000.00+5000.00+4000.00+5000.00+2.500.00+7000.00+8 000.00+900.00 = 69400.00 рублей. Для того, чтобы заказчик получил полную стоимости разработки айдентики и сайт, то стоимость разработки будет равна: 23000+69400 = 92 400 рублей. Разработки айдентики. Под разработкой айдентики подразумевается разработка

34 логотипа и чаще всего используют в двух вариантах, чтобы у заказчика был выбор. Затем стоимость визиток, которые будут распечатаны в масштабе. Стоит так же рассмотреть разработку, цвета, слогана и шрифта. Цвет должен привлекать внимание пользователя и задерживать внимание и оставаться дольше на сайте. Слоган должен ассоциироваться сайтом и вызывать ассоциативной ряд с сайтом [38], [39]. Одним из немаловажных аспектов работы над разработкой проекта является экономический подсчет стоимости проекта. В данную работу входит подсчёт стоимости работы дизайнера, электрооборудования и мебели. Разработка сайта. По сути, это огромная и сложная работа. По разработке сайт считается прототипированым и эксклюзивным. Это значит, что подбираются внутренние страницы. Цену сайта составляет доработка шаблонного дизайна сайта, анимация (гифы, flesh и java) в дизайне. Html верстки дизайна презентационной страницы. Выпадающие меню, являются главной частью разработки. Управление контентом разделом является так же важным составляющим, потому что модератору важно управлять всем сайтом. Новостные порталы приносят достаточное большое количество пользователей. Колонка поиска очень нужна пользователю для быстрого принятия информации пользователя. Опросы, анкетирование нужны сайту для того, чтобы пользователи могли общаться между собой. И разработка копирайтинга, собственно, для того чтобы модератор и пользователи могли писать тексты на сайте. В зависимости, что за сайт из этого уже исходит разработка [38], [39]. Таблица 1 – Расчет стоимости разработки айдентики сайта Услуги Стоимость/ руб. Разработка логотипа 8000.00 Разработка визиток Разработка палитры цвета Разработка слогана Разработка шрифта Разработка вариантов ИТОГО: 3000.00 3000.00 3000.00 3000.00 3000.00 Примечания Два варианта концепции Один вариант Один вариант Один вариант Один вариант Один вариант 23000.00 Таблица 2 – Расчет стоимости проектирования сайта Разработка концепции Стоимость/ руб. 5000.00 Натурное обследование 3000.00 Изучение отечественного и зарубежного опыта в проектируемой области 10000.00 Услуги Примечания

35 Услуги Разработка авторских решений Разработка проектной документации Создание визуализации разработанных решений Новости Поиск по сайту Услуги Регистрация на сайте Опросы Форум Копирайтинг ИТОГО: Стоимость Примечания 4000.00 15000.00 15000.00 5000.00 4000.00 Стоимость/ руб. 5000.00 7000.00 8000.00 900 Примечания 81902.5 Вывод. Ведение подсчета должно вестись непосредственно во время разработки проекта. Очень важно разрабатывать айдентику сайта, потому что айдентика привлекает пользователя и на сайте он может остаться гораздо дольше. Общая стоимость должна устраивать заказчика и отвечать всем нуждам проекта. Платежеспособность заказчика определяет многие аспекты в составлении дизайн-проекта и должна быть закреплена в договоре, подписанным обеими сторонами. Очень важно тщательно проработать сайт так как, чем лучше проработан сайт, тем дольше пользователи им будут пользоваться. Хорошая проработка сайта, прежде всего должна быть удобной, функциональной. Хорошая проработка сайта гарантирует хорошую рентабельность, а значит хороший показатель экономической эффективности [38], [39].

36 4 Результаты опроса Проучившись четыре года во Владивостокском государственном университете экономики и сервиса, стало понятно, что студентам – дизайнерам всех курсов не хватает некой площадки для сотрудничества между студентами [37]. Студентам не хватает обмена опыта между студентами всех курсов, им не хватает информации о дальнейшей их судьбе в профессии дизайна. Целевая аудитория - молодые дизайнеры, желающие работать в сфере дизайна, которые хотят знать все о своей профессии. При опросе двух групп выпускного курса БДЗ16-01 и БДЗ-16-02, было выяснено насколько важно создание такого сайта. Задачей разрабатываемого сайта является создание адаптированной уютной среды, которая будет отвечать всем требованиям молодых дизайнеров, которые и являются пользователями сайта. Основная цель – создать сайт, с нестандартным цветовым решением и грамотным применением блоков, учитывая при этом общие правила восприятия и законы композиции. Исследования показали достаточно хорошую динамику прохождения опроса. На вопросах можно видеть 100% положительный результат. Студенты согласны со списком разделов, которые будут на сайте. Студенты не знают, как может выглядеть сайт, другая часть показала, что сайт должен быть оригинальным. При вопросе ассоциаций, вопрос показал, что у сайта должен быть определенный стиль и при этом он должен быть не сильно ярким. Так как половина проголосовала за то, чтобы у сайта был логотип, 25%, что логотип не нужен и 25% не смогли определиться. В опросе присутствовало два раздела, второй раздел касался социальной части создания опроса и вот, что было предоставлено. Выяснилось, что студенты не знали об специально созданных сайтах для дизайнеров 50% ответивших слышали. Во втором вопросе 75% студентов знакомы с некоторыми дизайнерами Владивостока, это весьма положительный ответ и 25% абсолютно не знакомы. Из этого был поставлен вопрос знают ли студенты о сайтах с форумом для общения 100% результат, показывает, что студенты не знают, о таких форумах. Предпоследний вопрос показала 100% результат, что создание такого сайта достаточно нужная вещь. Последний вопрос разделился на 75% показывающий, что такой сайт может помочь студентам 25% студентов не знают, может ли сайт помочь. Студенты совершенно не знают, что помимо того, чему они обучается в университете, существуют различные творческие организации в городе Владивосток. Благодаря полученному опыту в процессе учебы в университете, накопленным вопросам и созданному опросу, коммуникативную площадку молодых дизайнеров. встала необходимость создать

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

38 Список использованных источников 1 Развитие веб сайтов. – Текст: электронный //preal.ru: [сайт]. - URL: – http://preal.ru/webhist/istoriya-razvitiya-veb-saytov-web-razrabotki/ (да обращения: 01.03.2020). 2 История создания веб-сайтов. – Текст: электронный adminu.ru: [сайт]. - URL: http://adminu.ru/2011/11/istoriya-sozdaniya-razvitiya-veb-sajtov/ (дата обращения: 26.03.2020). 3 Как сделать дизайн сайта. – Текст: электронный //skillbox.: [сайт]. - URL: https://skillbox.ru/media/design/kak_sdelat_dizayn_sayta_esli_vy_novichok/ (дата обращения: 26.06.2020). 4 Как создать свой сайт. – Текст: электронный //technologies.ru: [сайт]. - URL: https://www.internet-technologies.ru/how-to-create-a-website.html (дата обращения: 26.03.2020). 5 Понятие сайта, его задачи и функции. – Текст: электронный //mir-fin.ru: [сайт]. URL: – https://mir-fin.ru/sait.html (дата обращения: 27.04. 2020). 6 Как разработать дизайн сайта. – Текст: электронный //www.internet-technologies.ru: [сайт]. - URL: https://www.internet-technologies.ru/articles/kak-razrabotat-dizayn-sayta.html (дата обращения: 26.23.2020). 7 Этапы создания сайта. – Текст: электронный //www.connectdesign.ru: [сайт]. - URL: http://www.connectdesign.ru/web-design/index.shtml (дата обращения: 26.03.2020). 8 Техническое задание на разработку сайта. – Текст: электронный //www.swrit.ru: [сайт]. - URL: https://www.swrit.ru/tz-na-sait.html (дата обращения: 26.03.2020). 9 Цели и разработки веб-сайта. – Текст: электронный //www.inetsys.ru: [сайт]. - URL: https://www.inetsys.ru/articles/tselirazrabotki/ дата обращения (26.03.2020). 10 Капустина О.Г. Основы информационных технологий в рекламе / О.Г. Капустина, Т.В. Макарова, О.Н. Ткаченко. - Москва: Юнити - Дана, 2009. – 300 с. 11 Что такое графический дизайн. – Текст: электронный //www.topauthor: [сайт]. URL: http://www.topauthor.ru/chto_takoe_graficheskiy_dizayn_e77b.htt/ (дата обращения: 12.08.2014). 12 Создание макетов. – Текст: электронный //webgroupco.com: [сайт]. - URL: https://webgroupco.com/internet-news/pinegrow-web-designer (дата обращения: 26.03.2020). 13 Серверная часть. – Текст: электронный //developer.mozilla.org: [сайт]. - URL: https://developer.mozilla.org/ru/docs/Learn/Server-side/First_steps/Introduction (дата обращения: 26.03.2020). 14 Контент сайта. – Текст: электронный ://a-site.by: [сайт]. - URL: https://asite.by/stati/klyuchevyie-elementyi-xoroshego-sajta (дата обращения: 26.03.2020). 15 Строение сайта. – Текст: электронный //a-site.by: [сайт]. - URL: https://asite.by/stati/stroenie-sajta-iz-chego-sostoit-sajt (дата обращения: 26.03.2020).

39 16 Какие бывают сайты. – Текст: электронный //www.divier.ru: [сайт]. - URL: https://www.divier.ru/stati/vidy_veb_saytov/ (дата обращения: 26.03.2020). 17 Из чего состоит интернет маркетинг. – Текст: электронный //tilda.education: [сайт]. URL: https://tilda.education/courses/marketing/internet-marketing-beginning/ (дата обращения: 26.03.2020). 18 Скорость загрузки сайта. – Текст: электронный //www.owox.ru: [сайт]. - URL: https://www.owox.ru/blog/use-cases/page-speed/ (дата обращения: 26.03.2020). 19 Цветовое оформление сайта. – Текст: электронный /allforjoomla.ru: [сайт]. - URL: https://allforjoomla.ru/info/76-cvetovoe-oformlenie-sajjta (дата обращения: 26.03.2020). 20 Определение частоты обновления сайта. – Текст: электронный //devaka.ru: [сайт]. URL: https://devaka.ru/articles/google-daterange-operator (дата обращения: 26.03.2020). Основные 21 тренды веб-дизайна 2020: [сайт]. - URL: https://impulse- design.com.ua/osnovnye-trendy-veb-dizajna-2018.html (дата обращения: 26.03.2020). Хороший 22 дизайн сайта: [сайт]. - URL: https://skillbox.ru/media/design/zachem_saytu_nuzhen_dizayn/ (дата сайта: 26.03.2020). 23 Как сделать стильный web-дизайн: [сайт]. - URL: http://www.jeo.ru/kak-sdelatstilnyiy-web-dizayn.html (дата обращения: 07.12.2019). 24 Тенденции и тренды веб-дизайна сайтов: [сайт]. - URL: http://design-mania.ru/webdesign/trends2017 (дата обращения: 22.03.2020). 25 COMnet - Как сделать стильный web-дизайн 2017г: [сайт]. - URL: http://www.jeo.ru/kak-sdelat-stilnyiy-web-dizayn.html (дата обращения: 23.05.2020). 26 Что такое графический дизайн: [сайт]. - URL: http://www.topauthor.ru/chto_takoe_graficheskiy_dizayn_e77b.htt/ (дата обращения: 12.08.2014). 27 Ребрендинг - смена фирменного знака и риски связанные с ним: [сайт]. - URL: – http://creativeperson.ru/p3/rebrand (да обращения: 01.03.2020). 28 Фирменный стиль: его функции и основные элементы: Сhttp://www.elitarium.ru/ (дата обращения: 27.04. 20. 30 История мировых брендов и эволюция их логотипов: [сайт]. - URL: – http://www.vbizsoft.kg/raznoe/history-of-global-brands-and-the-evolution-of-their-logos.html (дата обращения: 20.02. 2020). 31 Бренд и психология цвета: Записки маркетолога: [сайт]. - URL: http://www.marketch.ru/ (дата обращения: 17.06.2020). 32 Персонаж талисман: [сайт]. - URL: https://ru.wikipedia.org/wiki/ (дата обращения: 20.05.2020). 33 Айдентика: [сайт]. - URL: https://mediaaid.ru/blog/aydentika/ (дата обращения:

40 07.04.2020). 34 Какая бывает айдентика: [сайт]. - URL: https://vc.ru/design/50312-kakaya-byvaetaydentika (дата обращения: 20.04.2020). 35 Что такое айдентика: [сайт]. - URL: https://say-hi.me/design/chto-takoe-ajdentika-10osnovnyx-pravil-po-sozdaniyu-firmennogo-stilya.htm (дата обращения: 06.04.2020). 36 Бренд и психология цвета Записки маркетолога: [cайт]. - URL: http://||www|marketch|ru|- 26.03.2015 (дата обращения: 02.03.2020). 37 Цели просветительской деятельности: http://base.garant.ru/2569505/31de5683116b8d79b08fa2d768e33df6/ [сайт]. (дата - URL: обращения: 26.03.2020). 38 Цена разработки сайта: [сайт]. - URL: https://vc.ru/dev/16058-site-price (дата обращения: 26.03.2020). 39 Цена на разработки фирменного сайта: [сайт]. - URL: https://www.dsnovik.ru/price.htm (дата обращения: 26.03.2020). 40 СК-СТО-ТР-04-1.005-2014 Требования к оформлению текстовой части выпускных квалификационных работ, курсовых работ (проектов), рефератов, контрольных работ, отчетов по практикам, лабораторным работам». – Текст: электронный //www.vvsu.ru: [сайт]. URL: https://www.vvsu.ru/education/vpo/spec/disciplines/distribution/idr/13192/to_1005_2007 41 Стандарт ВГУЭС СТО 1.005 – 2007 «Система вузовской учебной документации. Общие требования к оформлению текстовой части выпускных квалификационных работ, курсовых работ (проектов), рефератов, контрольных работ, отчетов по практикам, лабораторным работам. Структура и правила оформления». – Текст: электронный //izdo.vvsu.ru: [сайт]. - URL: http://izdo.vvsu.ru/education/written-works/ (дата обращения: 08.07.2020). 42 Устин В.Б. Композиция в дизайне: Методические основы композиционнохудожественного формообразования в дизайнерском творчестве: учебное пособие / В.Б. Устин. – Москва: АСТ: Астрель, 2007. – 239 с. 43 Гольдман И.А. Рекламная деятельность / И.А. Гольдман. – Москва: Гелла-принт, 2003.-250 с. 44 Кейплз Д. Проверенные методы в рекламе / Д. Кейплз. – Москва: МИФ, 2007.-200 с. 45 Смирнов С.И. Шрифт и шрифтовой плакат / С.И. Смирнов – Петербург: Плакат, 1981. – 144 с. 46 Иттен И. Искусство цвета / И. Иттен. – Москва: М.: Д. Аронов, 2008. – 96 с. 47 Арнхейм Р. Искусство и визуальное восприятие / Р. Анхейм. – Москва: Прогресс,

41 1974. – 144 с. 48 Добробабенко Н.С. Фирменный стиль: принципы разработки / Н.С. Добробабенко. - Москва: М., 2010.-205 с. 49 Уильям Ф. П. Цвет и как его использовать / Ф.П. Уильям. - Москва: АСТ., 2008. 205 с. 50 Ульрих Б. Что означают цвета / Б. Ульрих. - Москва: Феникс.: Д. Аронов, 2005. 205 с. 51 Эрик Ш. О шрифте / Ш. Эрик. – Москва: М., 2007. - 207 с. 52 Эйри, Д. Логотип и фирменный стиль: Руководство дизайнера / Д. Эйри. - СанктПитербург: Питер., 2013. - 208 с. 53 Музыкант В.Л. Реклама в действии: стратегии продвижения / В.Л. Музыкант – Новгород: М.: Эксмо, 2009.- 405 с. 54 Савенкова И. В. Фирменный стиль — залог конкурентоспособности туристской организации / И.В. Савенкова - Санкт-Петербург: Заневская площадь, 2014. -212 с. 55 Перция В.М. Анатомия бренда / В.М. Перция – Москва: М.: Вершина, 2007. – 288 с. 56 Манн И. Маркетинг на 100% / И. Манн, – Москва: М.: Манн, Иванов и Фербер, 2010.- 236 с. 57 Ковешникова Н.А. Дизайн: история и теория / Н.А. Ковешникова, Иванов и Фербер – Москва: Омега-Л, 2010.- 236 с. 58 Розенсон И.А. Основы теории дизайна / И.А Розенсон – Санкт-Петербург: Питер, 2009.- 350 с. 59 Эвами М. LOGO. Создание логотипов. Самые современные разработки. / Москва: М. Эвами - 2015г. - 230 с. 60 Веркман К. Товарные знаки: создание, психология, восприятие. / К. Веркман Москва: Прогресс, 2013г. - 523 с. 61 Ньюман М. 22 непреложных закона рекламы/ М. Ньюман – Москва: М.: АСТ, 2008. – 318 с. 62 Мелихов Ю.Е. Дизайн в рекламе / Ю.Е. Мелихов, П.А. Малуев; под общ. ред. Ю.Е. Мелихов. - Москва: АСТ, 2006. - 120 с. 63 Основы маркетинга / Ф. Котлер, Г. Армстронг, Дж. Сондерс, В. Вонг – 4-е европейское изд. – Москва: Диалектика, Вильямс, 2009. – 1200 с. 64 Решетько Н. И. Брендинг как элемент повышения конкурентоспособности организации / Н. И. Решетько, Н. Ю. Вольфсон // Москва. - 2014. — №6.2. — С. 32-34

42 Приложение А (обязательное) История создания сайтов Рисунок А.1 – Создание первого сайта Рисунок А.2 – Тип Бренерс-Ли, создатель первого сайта

43 Приложение Б (обязательное) Элементы сайта Рисунок Б.1 – Переключатель изображений Рисунок Б.2 –Рopup всплывающую окно Рисунок Б.3 – Модальное окно сайта

44 Рисунок Б.4 – Раздел сайта Рисунок Б.5 – Шапка сайта Рисунок Б.6– Подвал сайта

45 Рисунок Б.7– Галерея сайта Рисунок Б.8 – Бордер сайта

46 Рисунок Б.8 – Курсор сайта Рисунок Б.9 – Пагинация сайта Рисунок Б.10 – Текстовое поле сайта

47 Рисунок Б.11– Поле пароля сайта Рисунок Б.12– Поле загрузки сайта Рисунок Б.13– Алерт окно сайта Рисунок Б.14– Преолайдер сайта

48 Приложение В (обязательное) Виды сайтов Рисунок В.1– Коммерческий сайт Рисунок В.2– Сайт визитка Рисунок В.3– Корпоративный сайт

49 Рисунок В.4– Сайт портал Рисунок В.5– Интернет-магазин

50 Рисунок В.6– Лэндинг сайт Рисунок В.7– Сайт торговой площадки

51 Рисунок В.8– Новостной сайт Рисунок В.9– Некоммерческий сайт

52 Рисунок В.10– Персональный сайт Рисунок В.11– Один из вариантов сайта социальных сетей

53 Рисунок В.12– Сайт поисковых систем Рисунок В.13– Сайт видео-хостинг

54 Приложение Г (обязательное) Тренды и тенденции в веб-дизайне Рисунок Г.1– Монохром в веб-дизайне Рисунок Г.2– Тренд «Сияющий метал»

55 Рисунок Г.3– Тренд «Сумасшедшая типография» Рисунок Г.4– Тренд «Текст в картинке» Рисунок Г.5– Тренд «Простые иллюстрации»

56 Рисунок Г.6– Тренд «Земные цвета» Рисунок Г.7– Тренд паттерны и текстуры Рисунок Г.8– Геометрический дизайн

57 Рисунок Г.9– Тренд «Жидкость» Рисунок Г.10– Тренд минимализм Рисунок Г.11– «Папалакс»

58 Рисунок Г.11– Тренд «Минималистичное фото» Рисунок Г.12– «Line art»

59 Приложение Д (обязательное) Анализ дизайна сайтов (аналоги) Рисунок Д.1 – www.12wave.com – сайт со стилем line art Рисунок Д.2 – www.adwee.com Рисунок Д.3 – www.uncreative.com

60 Приложение Е (обязательное) Line Art как стиль сайта Рисунок Е.1 – Один из видов Line Art Рисунок Е.2 – Минималистичный вариант сайта Line Art Рисунок Е.3 – Цветной вариант сайта Line Art

61 Приложение Ж (обязательное) Выбор обоснования авторской концепции Рисунок Ж.1 – Выбор и обоснование авторской концепции

62 Приложение З (обязательное) Разработка айдентики и цветовой палитры Рисунок З.1 – Разработка цветовой палитры Рисунок З.2 – Разработка айдентики Рисунок З.3 – Разработка айдентики

63 Приложение И (обязательное) Авторские разработки макета сайта Рисунок И.1 – Разработка логотипа Рисунок И.2 – Разработка слогана Рисунок И.3 – Разработка форм

64 Рисунок И.4 – Разработка шрифта Рисунок И.5 – Разработка патерна

65 Рисунок И.6 – Разработка полиграфической продукции Рисунок И.7 – Разработка главной страницы сайта

66 Рисунок И.8 – Разработка личной страницы сайта Рисунок И.9 – Разработка страницы одной из организации

67 Рисунок И.10 – Разработка страницы главного меню Рисунок И.11 – Разработка страницы расширенного главного меню

68 Рисунок И.12 – Просмотр сообщений страницы Рисунок И.13 – Разработка страницы новостей

69 Рисунок И.14 – Просмотр списка страницы организаций Рисунок И.15 – Просмотр страницы одной из организаций Рисунок И.16 – Разработка страниц мобильной версии

70 Приложение Л (обязательное) Результаты опроса Рисунок Л.1– Результаты опроса Рисунок Л.2– Результаты опроса Рисунок Л.3– Результаты опроса Рисунок Л.4– Результаты опроса

71 Приложение М (обязательное) Компоновка планшета Рисунок М.1 – Компоновка планшета

Рецензии:

Авторизуйтесь, чтобы добавить рецензию

- у работы пока нет рецензий -

Отзывы:

Авторизуйтесь, чтобы оставить отзыв