57
Важность типографики. Флэт дизайн призывает крайне осторожно
работать со шрифтами. То есть их характер обязан дополнять дизайн-схему, не
противореча ей. Можно даже сказать, что в плоском дизайне шрифт – это
главный навигационный элемент.
Цветовые акценты. Не только шрифт, но и цвет – существенная часть в
«плоском» дизайне. В подавляющем большинстве цветовая гамма сайта
состоит из двух или трех цветов, хотя, конечно, есть и исключения. Обычно
выбираются сильные и яркие, но при этом чистые и открытые цвета. Как было
отмечено, нет никаких градиентов и излишних переходов.
Выбор в пользу минимализма. Flat дизайн – это яркий пример такого
всемирного тренда, как минимализм. Дизайнеры отказываются от излишних
эффектов, уходят от сложных и строгих подходов и отдают предпочтение
визуализации, что дает влияние в виде пользовательской активности.
Также набрал популярность стиль Semi Flat Design. Речь идет о полу-
плоском дизайне. Это наиболее распространенное применение описанного
концепта, когда вместе с простыми и лаконичными элементами и двумерным
пространством дизайнеры применяют 1-2 приема для глубины и перспективы.
Находясь под влиянием Material Design
10
, он стал немного более
пространственным. Появляются воздушные тени, которые делают дизайн
полуплоским. Флэт-дизайн актуален и сегодня, за счет таких теней он стал
интереснее и сложнее, но основная концепция не нарушается.
В заключении следует сказать, что вышеописанный стиль отлично
подходит для молодой аудитории своим привлекающим, но при этом не сильно
загруженным интерфейсом, благодаря авторским иллюстрациям и неброских
приятных цветов.
10
Material Design — стиль графического дизайна интерфейсов программного обеспечения и
приложений, разработанный компанией Google. Впервые представлен на конференции Google I/O 25 июня 2014
года.
58
2.6 Выбор программных средств для разработки графической концепции
web-сайта
Для разработки графической концепции web-сайта данного дипломного
проекта была использована программа adobe illustrator. Данная программа
удовлетворяла мои потребности и обладала всеми необходимыми
функциональными возможностями.
Adobe Illustrator является лидером рынка в области коммерческих
средств для работы с векторными объектами. Это один из самых популярных
инструментов для векторного рисования и редактирования художественных
работ. Редактор дает возможность графические проекты во всех стандартных
форматах, а также предоставляет функции печати и размещения на веб-
ресурсах.
Рис. 2.13. Рабочая среда Adobe Illustrator.
Программа разработана специально для разработчиков в области
графического дизайна. Её можно использовать как для личного пользования,
так и в крупных компаниях для создания различных векторных материалов.
Система предоставляет инструменты для реализации эскизов, типографики,
иллюстраций, логотипов, визиток, а также графики для видеоигр, декораций и
одежды.
Предусмотрен широкий выбор фильтров и спецэффектов. Adobe
59
Illustrator работает с векторной, а также с более привычной растровой
графикой. Программа дает возможность использования разнообразных кистей и
карандашей для рисования, загрузки различных шрифтов, синхронизации
цветов, инструменты кривизны и прочие инструменты для работы с
векторными объектами. Также благодаря Adobe Creative Cloud можно
приглашать участников к совместной работе и делиться творчеством, что
делает программу удобной для групповых работ, например, в учебных
заведениях.
60
ГЛАВА 3. ЭКОНОМИЧЕСКИЙ РАСЧЕТ ПРОЕКТА
3.1 Технологическая карта
Была разработана карта в проекте производства схема технологического
процесса создания графической концепции веб-сайта (см. таблицу 5).
Таблица 5
Технологическая карта
№
Этап
Визуализация
Инструмент
ы
1
Была
построена
12-ти
колоночная
сетка
Adobe
illustrator
2
Разработан
макет
Adobe
illustrator
61
3
Была
произведена
примерная
разметка
расположени
я объектов на
бумаге
Карандаш,
бумага
4
Далее были
нарисованы
иллюстрации
Adobe
illustrator
5
Следующим
этапом была
сборка всего
контента на
страницах
сайта. Первой
была
стартовая
страница
Adobe
illustrator
6
Далее
собрана
страница
раздела «для
кого»
Adobe
illustrator
62
7
Далее
собрана
страница
раздела «что
вы получите»
Adobe
illustrator
8
Далее
собрана
страница
раздела
«тарифы»
Adobe
illustrator
9
Далее
собрана
страница
раздела
«программа»
Adobe
illustrator
63
10
Далее
собрана
страница с
часто
задаваемыми
вопросами
Adobe
illustrator
3.2 Расчет стоимости проекта
Оценка стоимости проекта представляет собой процесс определения
всех возможных затрат, которые необходимы для удачной реализации проекта
(см. таблицу 6).
Для полного представления о стоимости проекта должны быть
соблюдены всевозможные затраты, такие как:
• заработная плата работников на постоянной основе;
• разовые выплаты работникам первичного назначения;
• затраты на производство и аренду.
Таблица 6
Оценка стоимости проекта
№
Вид работы
Количество выплат
Стоимость
1
Работа графического
дизайнера
1 раз
15 000 р.
2
Работа верстальщика
1 раз
10 000 р.
3
Услуги копирайтера
1 раз
5 000 р.
4
Менеджер по продажам
Раз в месяц
20 000 р.
5
Поддержка сайта
Раз в месяц
10 000 р.
6
Размещение рекламы
и продвижение
Раз в месяц
20 000 р.
7
Аренда хостинга
Раз в месяц
5 000 р.
8
Аренда домена
Раз в год
500 р.
Итоговая стоимость сайта за первый месяц
85 500 р.
64
ЗАКЛЮЧЕНИЕ
В результате выполнения дипломной работы были закреплены знания,
полученные в период обучения, а также освоены новые практические навыки в
сфере разработки графической концепции интернет-проектов. Был проведен
анализ целевой аудитории, аналоги и конкуренты компании. Выполнена
основная задача, оформлена визуальная концепция сайта с помощью
программы Adobe Illustrator в соответствии с пожеланиями заказчика и
собранными данными о потребителе.
Цель данной дипломной работы, которой является разработка
графической концепции для сайта, который представляет курс «Грамотный
визуал» была выполнена.
Данный проект будет основным начальным этапом в последующей
разработке мобильной версии сайта, а также корпоративного web-портала
компании, представляющий все товары, с использованием технологий
электронной торговли.
Задачи, заключающиеся в анализе структуры сайтов подобного типа,
исследовании проблемы шрифтового и колористического оформления,
разработке дизайн-проекта для сайта, представляющего курс и расчете
стоимости проекта были успешно решены.
Процесс разработки оформления сайта состоял из этапов:
1. проведения анализа компании;
2. оценка портрета потребителя;
3. исследования выбора цветовой гаммы, шрифтового оформления и
стилей веб-стайтов;
4. анализ компаний-аналогов;
5. разработка макета сайта;
6. оформление шаблона сайта на основе разработанного макета;
7. оценка стоимости проекта.
По окончанию работы над проектом, было разработано визуальное
оформление сайта, основные параметры которого были основаны на
65
социальных опросах и анализе уже существующих порталов,
оптимизированное с точки зрения юзабилити, и успешно выполняющий
поставленные перед ним задачи.
66
СПИСОК ИСПОЛЬЗУЕМОЙ ЛИТЕРАТУРЫ
Основная литература:
1 Аарон У. Эмоциональный веб-дизайн. Издательство: Манн, Иванов
и Фербер, 2012г. С. 160.
2 Адамс Ш. Словарь цвета для дизайнеров. Издательство: КоЛибри,
2018г. С. 256.
3 Анатолий К. Создание сайтов 4.0. Новейшие технологии высоких
продаж. Разработчикам и заказчикам. Издательство: Издательские решения,
2012г. С. 270.
4 Аренс В.Ф. Вейголд М.Ф. Аренс К. Современная реклама.
Издательство: Эксмо, 2010г. С. 880.
5 Илья С. Дизайнер интерфейсов. Принципы работы и построения
карьеры. Издательство: Олимп-Бизнес, 2019г. С. 224.
6 Итан М. Отзывчивый веб-дизайн. Издательство: Манн, Иванов и
Фербер, 2012г. С. 170.
7 Иттен И. Искусство цвета. Издательство: Аронов, 2018г. С. 96.
8 Кара-Мурза С. Г. Манипуляция сознанием. Издательство ЭКСМО-
Пресс, 2002г. С. 832.
9 Марта Г. Гармония цвета. Издательство: АСТ, 2005г. С. 144.
10 Петроченков А., Новиков Е. Идеальный Landing Page. Создаем
продающие веб-страницы. Издательство: Питер, 2017. С. 320.
11 Робин У. Дизайн. Книга для недизайнеров. Принципы оформления
и типографики для начинающих. Издательство: Питер, 2015г. С. 240.
12 Рэнд П. Книга: Искусство дизайнера. Издательство: Студия
Артемия Лебедева, 2017г. С. 288.
13 Стив К. Не заставляйте меня думать. Веб-юзабилити и здравый
смысл. Издательство: Эксмо, 2014г. С. 252.
14 Эрик Ш. О шрифте. Издательство: ПараТайп, 2005г. С. 192.
15 Юлия С. Современный веб-дизайн. Эпоха Веб 3.0. Издательство:
Диалектика-Вильямс, 2013г. С. 363.