Делаем веб-магазин

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

Спецвыпуск: Хакер, номер #050, стр. 050-078-5

Рассмотрим внимательно бланк: внизу есть нечто имитирующее мазки кисти на холсте и что-то еще (весьма спорное решение для оформления деловой и распорядительной документации). Возможно, это должно было символизировать особый творческий подход к рекламе, принятый в этом агентстве. При разработке дизайна мы будем отталкиваться именно от этого символа, так как он особо дорог заказчику. Не являясь специалистом по такой высокохудожественной анархической мазне, я вспомнил сайт дизайн-студии Juxt interactive, возглавляемой небезызвестным Тоддом Пергассоном (пользуясь случаем, выражаю глубокий respect). Дабы проникнуться их стилем, весьма близким к тому, который требуется создать, пошел на сайт студии. К своему удивлению обнаружил у Джакстов совершенно новый дизайн, а всяческих завитков, клякс и прочего не осталось и в помине. Не велика беда: несмотря на то, что я был там последний раз пару лет назад, впечатления от яркого и легко запоминающегося дизайна еще живы. Решив прекратить поиски близких по духу сайтов, заглядываю в свою коллекцию шрифтов в поисках гарнитуры с подходящим рисунком шрифта ("завитки" на самом деле не что иное, как нарезка из отдельных частей букв декоративных шрифтов, стилизованных под рукописные). Из нескольких кандидатов выбираем English Vivace - отличный шрифт, выпущенный в 1990 году фирмой Bitstream inc.

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