Настольная книга веб-дизайнера. Практический курс по веб-дизайну и проектированию сайтов

Прототип – это план, схема, набросок, она создаётся именно для того, чтобы клиент мог внести все правки и корректировки до создания веб-дизайна и до разработки сайта. Поэтому две стороны (заказчик и разработчик) собираются вместе для точной проработки всех деталей, как структуры сайта, так и его функционала и внешнего вида. Поэтому бурное обсуждение и внесение большого количества правок на данном этапе разработки сайта считается вполне нормальным. Лучше исправить всё на прототипе, чем переделывать дизайн или готовый сайт.

Польза прототипа для клиента

Кроме того, утвержденный прототип поможет клиенту сформировать список по подготовке материалов. Изучив прототип, клиент будет наглядно понимать, что нужно подготовить, какой текст и фото для страниц его сайта (например, для страниц «О компании», «Новости», «Вакансии», «Контакты» и т.д.). И создать папку с товарами для каталога, разделить их по категориям, подготовить фото и технические характеристики товаров и т.д.

Интеграция сторонних сервисов

Обычно сайты дополняется функционалом, подключаемым извне. Это могут быть сервисы типа «Онлайн-консультант», калькуляторы, сервисы оплаты и доставки, рассылки, складского и бухгалтерского учета, CRM и т.д. Все это надо отразить на прототипе и проговорить с клиентом, потому как эти сервисы могут быть платными и увеличить предполагаемый бюджет на разработку сайта.

При этом рекомендуется формировать прототип с учетом масштабирования бизнеса. Если реализация некоторых интеграций выходит за рамки бюджета, либо не требуется на данный момент, – всё равно стоит заложить их в макет дизайна сайта сразу, а уже после, в процессе работы, принимать решение об их использовании и подключать по необходимости.

Сбор обратной связи о прототипе

Иногда имеет смысл перед презентацией прототипа сайта «посоветоваться с народом». Показать прототип коллегам, например, менеджерам клиента, программисту, который будет работать над сайтом, клиентам заказчика. Это поможет выявить слабые места заранее и доработать веб-ресурс, сделав его более эффективным для взаимодействия с посетителями.

Итогом работы с прототипом станет:

– четкое понимание структуры сайта,

– утверждение модулей на первой страницы,

– ясное представление внешнего вида и функциональности сайта,

– устранение лишних элементов, добавление недостающих элементов сайта,

– наполнение сайта полезными инструментами, сервисами и опциями, которые обеспечат ему стабильную работу,

– подготовка сайта к продвижению за счёт добавления нужных элементов,

– готовый план будущего сайта для разработчика,

– инструкция для клиента, какие материалы надо подготовить к сайту.

Никогда не пренебрегайте созданием и утверждением прототипа сайта, – это сэкономит массу времени, средств и нервов при разработке сайта!

Глава 12. Фирменные цвета и логотип для сайта

В этой главе:

1. Использование фирменных цветов заказчика

2. Создание логотипа для заказчика

1. Использование фирменных цветов заказчика

Как правило, заказчик обязан по договору предоставить свой фирменный стиль для разработки сайта. Потому что, опираясь именно на фирменные цвета, нужно создавать веб-дизайн сайта. Если у клиента красный логотип, не имеет смысла делать весь сайт зелёным.

Фирменный стиль – это единый набор компонентов, которые демонстрируют идентичность бренда или компании. Фирменный стиль обычно создается дизайнером и имеет законченный вид в виде логотипа, визиток, дизайна полиграфии и наружной рекламы. Веб-дизайнер берет с форменного стиля логотип и ставит его на сайт, а также используют фирменные цвета. Идеальным считается сочетание двух фирменных цветов, не более, исключая детские и китайские сайты, – в них допустима цветовая пестрота.

Как применить фирменные цвета

Клиент предоставляет фирменный стиль в исходном, векторном варианте. Например, логотип в формате pdf или cdr (векторный формат). Задача веб-дизайнера – преобразовать логотип в формат png и расположить в веб-дизайне. Фирменные цвета могут быть представлены в виде компонентов цвета, например в цветовой модели CMYK. В веб-дизайне используется только модель цвета RGB, потому что с ней работает экран монитора.

Чтобы применить в веб-дизайне цвет по модели CMYK, нужно открыть окно докеров цвета в растровом редакторе Adobe Photoshop, набрать компоненты цвета и запомнить имя вебцвета. Далее в дизайне необходимо использовать этот цвет, подставляя имя веб-цвета, или копируя цвет инструментом «Пипетка». См. рис. 90.

Рис.90. Использование фирменного цвета на сайте