Диплом: Графическая концепция веб-сайт

Внимание! Если размещение файла нарушает Ваши авторские права, то обязательно сообщите нам
Выводы по первой главе
П
р
о
д
у
м
а
н
н
ы
й
д
и
з
а
й
н
п
о
з
в
о
л
и
т
о
б
С приростом экологических проблем, появляются неравнодушные к ним
люди. Их волнует здоровье их детей и близких. В связи с этим они с
ответственностью подходят к поиску места для проживания, где их семья сможет
комфортно передвигаться по местности, где дети смогут безопасно посещать
учебное заведение и жить, не заботясь о том, чем дышат и что едят.
Основные аналоги данного проекта – это сайты, основанные на продаже
различной продукции для эко-стиля жизни, и различная информация, как это стиль
жизни сделать своим смыслом жизни. Исходя из проведенного анализа аналогов,
сделан вывод, что большинство экологических сайтов, не относящихся к каким-то
организациям не проработаны в оформлении и подаче информации.
Экология перестает быть "посторонним делом" и экологические практики
распространяются в различную работу людей: от высококлассной до электробытовой.
Исследуемые профессии – это профессии будущего, в нашей стране они мало кому
известны, ведь тема экологии открылась для нас не так давно.
Задача создать интересный дизайн для привлечения людей заинтересованных
в экологической жизни.
Методы решения задачи состоят в создании графического концепта веб-сайта.
Меню будет верхним (горизонтальным), так оно визуально занимает меньше места
и дает ощущение пространства, а в сочетании с иллюстрациями это предаст эффект
целостности, нежели меню было бы боковое (вертикальное), ведь так свободное
пространство для информации как будто бы смещается в правую часть. Сейчас
большинство сайтов предпочитают использовать основное горизонтальное меню,
сочетая его с небольшими вертикальными меню, имеющими второстепенное
значение. Так делают, например, Facebook или Google и другие большие порталы.
ГЛАВА 2. ПРОЕКТНО-ГРАФИЧЕСКАЯ
2.1. Описание проекта
Графическая концепция стиля жизни «eco-friendly» представляет из себя
иллюстративную визуализацию, контент связанный со стилем жизни и выполнено
все в органическом стиле.
Концепция проекта состоит в том, чтобы помочь пользователю узнать о
экологическом образе жизни, не потратив на поиски информации много времени.
При исследовании отечественных и иностранных сайтов выяснилось, что нет такого
сайта, чтобы он полностью посвящался себя стилю жизни «eco-friendly». Имеется
множество сайтов, связанных с экологией, экологической продукцией, компаниями
на подобии Гринпис.
Также нет стилистического решения у отечественных сайтов, чтобы сайт
запомнился, был достаточно информативным, удобночитаемым, с качественно
подобранными фотографиями. Поэтому целью проекта было заменить фото на
иллюстрации для создания органичной и единой концепции.
Поскольку тема экологии довольно информативная и обширная, было решено
оставить минимум информации, главное и по факту с небольшими примерами. Для
того, чтобы выделить значимую информацию, чтобы пользователь меньше
потратил времени на ее поиск, были применены решения, где был изменен цвет
текста, его кегль и расположение по отношению к сетке.
Значимость темы диплома «графическая концепция веб-сайта для стиля
жизни «eco-friendly» для дизайнерской практики заключается в том, чтобы
научиться передавать основную концепцию сайта в виде иллюстративного
материала и текста. Это тренирует навыки работы с графикой и версткой,
креативности, создания эргономичной визуализации.
Таблица 8. Ментальная карта разветвления проблем
Как жить экологично?
Благоустройство
Осознанное
потребление
Зелёное мышление
Экогород
Биопродукты
Зелёный дизайн
Экотуризм
Zero waste
Зелёная работа
Биоупаковка
В ходе выполнения дипломного проекта были использованы следующие
методы:
- метод синтеза и обобщений: используется в теоретической части работы при
сопоставлении и интеграции принципов, идей и результатов отечественных и
зарубежных исследований;
- метод классификации, метод сравнений, системный и типологический
методы: используются для анализа объектов графического дизайна;
- метод стилистического анализа: используется для определения визуальных
особенностей анализируемых объектов;
- метод дедукции: если сначала изучалась теория вопроса, а потом она
рассматривалась в применении к конкретным случаям;
С помощью метода «стилистического анализа» было решено сделать
подборку референсов за с помощью сайтов «Behance» и «Pinterest». Подборка нужна
для того, чтобы изучить существующие элементы для привлечения пользователя, дабы
перенять некоторые идеи. Благодаря этой подборке у заказчика графической концепции
веб-сайта может сложиться примерное представление готовой работы, в течении
разработки концепции сайта можно будет избежать ненужных правок в дальнейшем.
Использование различных методов обусловлено необходимостью решения
различных задач в процессе работы над дипломным проектом.
2.2. Взаимодействие пользователя и интерфейса
Прежде всего пользователь решит, что лозунг проекта — это вопрос «Как
жить экологично?», одна фраза моментально определяет тему и концепцию сайта,
которую еще лучше можно понять с помощью используемого цветового и
шрифтового решения и иллюстрации выполненной в органичном стиле, где цвета
соответствуют цветам природы – небо, зелень. Для того, чтобы познакомиться с
вводной частью в мир «eco-friendly» имеется выбор в нижней части страницы по
центру, в качестве полупрозрачной кнопки со словом «узнать» нажав на которую
пользователь перейдет на следующую страницу, заголовок которой будет являться
вторым лозунгом концепции сайта и стиля жизни «eco-friendly»: «Все начинается с
каждого». Эта фраза и есть основная концепция стиля жизни «eco-friendly», пока
люди ждут чьего-то решения, то упускают возможность начать здесь и сейчас с
себя, со своего дома, своего образа жизни. Маленькие шаги к изменению мира
начнутся с того момента, как человек пересмотрит свой образ жизни, передумает
избавиться от сломавшейся мебели и зашарканной одежды и найдет ей вторую
жизнь.
Дабы выделить «5 принципов» на обычном фоне были созданы графические
элементы на подобии кустиков с разными оттенками зеленого цвета и на них
нанесены элементы «5 принципов» белым цветом, т.к., это привлекает внимание
(рис. 2.11).
Для фразы «5 принципов» был выбран черный цвет обводки, дабы выделить
текст.
У страниц «благоустройство», «экодом», «зеленое мышление» на
иллюстрациях расположен главный элемент с титульной иллюстрации – девушка на
велике. Она присутствует на иллюстрациях, дабы показать взаимодействие
человека с заданными темами, показать, как человек живет с этом. Велик означает
– движение по жизни, с легкостью и без вреда для окружающего мира, также с
физическими нагрузками для тела, чего не добьешься при простой прогулке пешком
или управляя машиной (рис. 2.12, 2.13, 2.14).
Рисунок 2.11. Скриншот страницы
Рисунок 2.12. Скриншот страницы
Рисунок 2.13. Скриншот страницы
Рисунок 2.14. Скриншот страницы
2.3. Цветовая концепция
Цветовая концепция сайта была выбрана в связи с выбранной темой касаемо
экологии. Экология – это природа, соответственно, ее цвета, это цвет неба, зелени,
солнца и их различных оттенков.
Цветом линии меню выбран белый цвет, чтобы отделять линию меню от
страницы. Этот выбор был сделан на основе анализа аналогов. Была разработана
иллюстрация для титульной страницы, на которой показан мегаполис и большие
парки. Цвета домов выбраны из синей палитры для контрастности с зелёным цветом
изображенной природы. Для цвета информативных страниц был выбран цвет неба
(рис. 2.15).
Рисунок 2.15. Цветовая гамма иллюстрации
Для иконок меню был выбран основной цвет концепции web 6CCF0D для
того, чтобы иконки выглядели основой концепта с фирменным блоком. Для
поясняющих фигур с названием страниц был выбран черный цвет с
непрозрачностью 70% (рис. 2.16).
Для гиперссылок был выбран цвет, как у одного из домов на титульной
иллюстрации, дабы создать единую композицию (рис. 2.17).
Рисунок 2.16. Иконки меню
Рисунок 2.17. Иллюстрация титульной страницы
2.4. Шрифт
Основным шрифтом для концепции сайта был выбран «Century Gothic».
более округлой формы с мелкими отличиями в написании. Шрифт достаточно
универсальный, его используют для написания статей в газетах, журналах,
заполнения документации, презентаций, сайтов.
На иллюстрации был размещен лозунг сайта, благодаря которому можно
понять, о чем идет речь на сайте: «Как жить экологично?». Дабы разнообразить
концепцию титульной страницы вторичным шрифтом для лозунга сайта был
выбран шрифт «eurofurence light», было проведено сравнение между двумя
шрифтами, чтобы понять, какой шрифт будет смотреться лаконично, как единая
стилистика с иллюстрацией (рис. 2.18). Для лозунга на иллюстрации шрифт
выглядит грамоздко и не выглядит единым целым с иллюстрацией. Первоначально
для заголовков страниц также был выбран шрифт «eurofurence light», но из-за
отсутствия у шрифта стиля жирности, чтобы он выделялся на странице, было
(рис. 2.19).
Рисунок 2.18. Поиск лозунга

Смотрите также:

"Автоматизация обработки заявок ООО "Проектно-Строительная Компания"
"Автоматизация процесса аттестации персонала для ООО "Нэт Бай Нэт Холдинг"
"Анализ интернет-активности конкурентов ( на примере конкурентов "Газпром нефть")
"Бухгалтерский учёт и аудит расчётов с подотчётними лицами в организации на примере ООО "ЛОЦ 10""
«Психологическое сопровождение персонала в организации на примере ООО «Крокус»
Agile-методология в управлении проектами на примере ООО «Ресурсный центр «Академия КлассИнфо»
Aвтoмaтизaция пpoцecca вeдeния инфopмaциoннoй бaзы o дoлжнocтяx и вaкaнcияx c укaзaниeм тpeбoвaний к уpoвню знaний и нaвыкoв кaндидaтoв для гpуппы кaдpoв вoйcкoвoй чacти 3474»
Cовершенствование деловой оценки персонала в организации (на примере ООО "Даймонд кейтеринг развитие")
Cовершенствование управления рентабельности предприятия (на примере гуипп «бендерская типография «полиграфист»)
Event - менеджмент: реализация проекта (на примере ООО "АГРОПАК")