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

Внимание! Если размещение файла нарушает Ваши авторские права, то обязательно сообщите нам
42
ГЛАВА 2. ПРОЕКТНО-ГРАФИЧЕСКАЯ
2.1 Бриф
В брифе на разработку сайта клиент рассказывает о компании,
описывает пожелания в общих чертах, а также обозначает основной
функционал и ценность будущего сайта для своего бизнеса. Бриф буквально
переводится как «инструкция», чем он, по сути и является.
Документ выполняет следующие задачи:
• дает понимание проекта обеим сторонам;
• позволяет заказчику оценить, соответствуют ли его компетенции
и ресурсы будущему проекту;
• дает возможность определить время создания сайта и его
примерную стоимость;
• помогает заказчику разобраться в специфике деятельности
заказчика.
Таблица 4
Бриф по разработке графической концепции сайта
Параметры
Запросы
1
Цель создания сайта
Продажа курса и
привлечение новых клиентов
2
Название компании
Anielio
3
Род деятельности компании
Обучение монтажу,
обработке фото и видео,
разработке дизайн-
концепции для личных и
коммерческих аккаунтов на
площадке инстаграм
4
Целевая аудитория
Девушки, реже парни,
возрастной категории от 15
до 23 лет, обладающие
доходом ниже среднего,
подавляющее большинство
еще не работает, получает
образование
5
Сайты-конкуренты
Https://mitroshina.org/#shop
Https://anastasili.ru/intensiv
Http://nioly.ru/nillionere#what
Https://diabout.ru/
6
Тип сайта
Landing page
7
Дизайн сайта
Плоский дизайн (flat)
8
Восприятие сайта
Стильный, современный,
креативный,
43
соответствующий модным
тенденциям
9
Цветовая гамма
Спокойные, мягкие
пастельные оттенки,
отсутствие ярких и пёстрых
цветов
10
Шрифты
Рубленные, отсутствие
шрифтов с засечками
11
Элементы, которые должны
присутствовать на сайте
Авторские иллюстрации,
логотип, кнопка регистрации
на курс, текстовые блоки,
окно онлайн поддержки,
часто задаваемые вопросы,
анонс курса, меню
12
Векторная графика
Обязательна
13
Растровая графика
Необязательна
14
3-d графика
Отсутствует
15
Фотографии
Отсутствуют
16
Информация на сайте
Тарифы, программа курса,
контакты
17
Меню
Горизонтальное
18
Язык наполнения
Русский
2.2 Разработка графической концепции для сайта компании
Весь процесс разработки графической концепции сайта был разделен на
несколько последовательно расставленных этапов:
произвести анализ компании;
разработать макет сайта;
проанализировать портрет потребителя;
разработать интерфейсы для клиентской части сайта;
произвести оценку стоимости проекта;
создать и опубликовать опрос в социальных сетях (см. приложение
2).
44
Рис. 2.1. Схема поэтапной разработки сайта
Далее мы более подробно рассмотрим каждый из представленных
этапов. Успешность проделанной работы зависит напрямую от этапа
проектирования, а успех в разработке зависит в первую очередь от верно
сформулированных и поставленных задач.
Проведя анализ задач, поставленных перед разработкой дизайна сайта
вместе с заказчиком были определены основные пожелания к оформлению:
Простой и лаконичный современный дизайн в пастельных оттенках,
отражающий основную идею агентства;
Представление актуальной информации о продуктах и их
стоимости;
Окно оказания поддержки клиентов;
Наличие функций интернет-магазина.
Обладатель любого веб-пространства хочет видеть на своем ресурсе как
можно большую численность гостей. В случае если web-сайт разработан для
коммерческих целей, то цифры посещаемости и конверсии становятся
обязательными. Для повышения качества сайта с точки зрения юзабилити
7
был
составлен перечень критериев, учтенных при разработке клиентской части
сайта.
1. Дизайн сайта
7
Юзабилити — это качественный показатель простоты и удобства использования сайта.
45
Минимализм и лаконичность – информация для пользователя подается в
четко организованном виде только в необходимом на данной стадии объеме.
Доступность – основная масса информации и функционала сайта
должны быть доступными и интуитивно понятными для пользователя.
Актуальность – дизайн веб-сайта обязан отвечать последним
направленностям в веб-дизайне, но в то же время не перегружать интерфейс
яркими цветами и контрастными сочетаниями, дабы не абстрагировать
пользователей от интересующей информации и продуктов веб-сайта.
Универсальность – страницы сайта должны выгодно отображаться как
на стационарных компьютерах, так и на мобильных устройствах.
2. Удобство навигации
Комфортабельность навигации по сайту это один из важнейших
приоритетов при создании проекта. Пользователь должен непринужденно и
беспрепятственно передвигаться по сайту, чтобы получить нужную
информацию или услугу.
Создавая сайт, учитывается его назначение, удобства последующего
сопровождения и развития. Сайт формируется в первую очередь для
посетителей и потому должен быть приятен для них в художественном
исполнении. Композиция и оформление элементов – то, что в основном
определяет внешний облик сайта. Графика в данной работе делается с
помощью графического редактора, Adobe Illustrator.
В качестве сайта была категория под названием «landing page». Такой
формат сайта позволяет донести пользователю информацию конкретной
компании, человеке, о каких-либо товарах, услугах и их стоимости.
Используется для усиления эффективности рекламы, увеличения аудитории за
счет краткого изложения информации. Это может быть, как персональный сайт
пользователя, так и сайт фирмы. Такой сайт ставит главной целью заявление о
старте компании в сети Интернет, дать информацию об основных направлениях
деятельности организации и сведения о том, куда можно обратиться
пользователю или партнеру фирмы за более подробной информацией.
46
В ходе разработки дизайн-проекта веб-сайта для представления
обучающего курса «Грамотный визуал», были разработаны интересные
графические элементы. Эти элементы несут декоративную функцию и
подчеркивают, уникальность и необычность сайта. Акцентной частью на
стартовой странице является портрет самой основательницы курса Анны,
нарисованный в стиле flat design. Все страницы сайта выдержаны в едином
стиле и не перегружены лишними объектами, что позволяет посетителям легко
и свободно передвигаться на сайте. Навигация на сайте реализована таким
образом, чтобы пользователь мог без затруднений перемещаться по сайту и
легко находить интересующую его информацию. На страницах сайта
используются оригинальные графические элементы, такие как авторские
иллюстрации, векторные объекты и разнообразные модули в виде простых
геометрических фигур (см. приложение 1).
В верхней части сайта располагаются логотип и горизонтальное меню
для навигации по сайту. Данное меню содержит следующие пункты: для кого
подходит данный курс, что получают участники после его прохождения,
тарифы и программа курса. В левой части страницы содержится
приветственное текстовое наполнение. В соответствии с исследованиями о
восприятии человеком текста и картинок в правой части находится
иллюстрационное наполнение, а слева располагается текстовое приветствие. В
самом низу страницы располагается кнопка регистрации на курс и контактные
данные в виде ника в инстаграм (см. рис. 2.2.).
Источник: https://baza.diplomsite.ru/previewfile/756