| Copyright 2000 Курт
Клонингер (Curt Cloninger) и http://www.lab404.com/
Введение
Проблема: Большинство
сайтов США очень схожи по внешнему виду и дизайну. Все это связано с кровосмешением.
Считается, если так делает microsoft.com, значит это должно присутствовать
на любом профессиональном корпоративном сайте. Потому то все сайты и выглядят
как сайт Microsoft (или Adobe, или Ebay, или …)
Решение: Хватит спасть
со своей двоюродной сестрой. Осмотритесь вокруг. Найдите там источник вдохновения.
Добавьте в свой репертуар несколько новых дизайнерских идей. Свежая кровь,
новая плоть - вот что нужно, чтобы разбавить ваши дизайнерские гены.
Где НЕ СЛЕДУЕТ черпать
новые дизайнерские идеи:
В
печатных журналах. Печатные журналы - давнишний источник идей для
корпоративных сайтов, так как большинство корпоративных сайтов было разработано
фирмами, ранее работавшими в издательском деле. Не трогай эти идеи. Это
твои тети, дружок, т.е. сестры твоей мамы.
Где же поднабраться свежих
дизайнерских идей?
Экспериментальные
домашние страницы и сайты фирм, никогда не работавших в издательском
деле. Для них Web - не новая информационная среда, для них Web - ЕДИНСТВЕННАЯ
среда. Они не рассматривают журналы в поисках идей. Они любуются медицинскими
картами, интерфейсами программ 80-х годов, корзинками для грибов, мультфильмами
и собственно самим окном броузера. Их экспериментальные стили уже наполняют
Web. По мере того, как путешественники по Web-у привыкнут к нему, ирония,
юмор и насмешка над собой станут ценными
маркетинговыми идеями. Многие телевизионные рекламные клипы уже
сейчас подшучивают над тем, что они являются рекламой.
Большинство экспериментальных
сайтов поступает также. Они смиряются с ограничениями Web-а, и вместо того,
чтобы пытаться их скрыть, эти сайты во всю их эксплуатируют. Давайте бросим
взгляд в ближайшее будущее…
Десять свежих стилей для вашего
сайта
A. Готическая органическая школа
-
источник вдохновения: человеческое
тело/арабский алфавит
-
приемы: неправильные органические
формы, коллажи из реальных предметов, абстрактные анимированные гифы низкого
разрешения в качестве фона, прозрачные анимированные гифы в качестве текстурного
фона, верстка подразумевает и использует вертикальную прокрутку страницы
-
домашние страницы/дизайнерские
фирмы: Entropy8, Greyscale,
SmokeymonkeyS
-
примеры коммерческих сайтов:
Conscience Records, Janet
Jackson
B. Школа проволочного стиля
-
Источник вдохновения: интерфейсы
старого программного обеспечения и видеоигр.
-
Приемы: графики, таблицы, мусор
из графиков в качестве абстрактных дизайнерских элементов, использование
сообщений об ошибках в качестве юмора, неработающие функции-обманки, использование
несглаженных шрифтов в виде гифов для оттенения низкокачественных HTML-шрифтов.
-
домашние страницы/дизайнерские
фирмы: Test
Pilot Collective (pre-5/00), mike
cina, hoggorm, Hel13,
zx26, Prototype
19
-
примеры коммерческих сайтов:
levi's europe, adidas,
Fusion
banner ads, Wired logo
С. "Низкопробный" мусорный дизайн
-
Источник вдохновения: грязные
пятна, кляксы, наложения, пиктограммы старой школы
-
Приемы: имитация линий развертки
старых телевизоров, точки и тире, силуэты изображений неправильной формы,
парные фоновые гифы с такими же гифами на первом плане, использование для
наложения друг на друга.
-
домашние страницы/дизайнерские
фирмы: sueellen, jump
into the light, smallprint
-
примеры коммерческих сайтов:
Nokian Tyres, Skate'n
Fun
D. "Упаковочная" школа
-
Источник вдохновения: комиксы
середины столетья, бумажные пакеты
-
Приемы: полутоновые и двухтоновые
изображения, ручные шрифты, неровности, нарочитое подчеркивание швов, использование
цветов для выделения (если все серое, одна деталь, выделенная цветом, непременно
привлечет все внимание), утонченные анимации в качестве фонового изображения
или просто для развлечения, иногда намеренно неверное расположение навигационной
панели
-
домашние страницы/дизайнерские
фирмы: Funny Garbage, p2,
stereomedia
-
примеры коммерческих сайтов:
levi's vintage, Ka-Ching
E. Стиль a la Пит Мондриан
-
Источник вдохновения: Пит
Мондриан, Роберт
Лонго. Постеры, выполненные в их технике.
-
Приемы: Нарочито большие элементы
меню, вкрапленные в общий дизайн, частое использование отрицательных смещений,
все чисто, без суматохи. Все окно броузера рассматривается как единое пространство
для дизайна.
-
домашние страницы/дизайнерские
фирмы: 617,
Once Upon
a Forest
-
примеры коммерческих сайтов:
Lundstrom Architecture
F. Пиксельный панковский дизайн
-
Источник вдохновения: хаос,
необычное поведение машин, программный код, Жорж Серо (George Seraut),
дадаизм.
-
Приемы: сильно увеличенные
и искаженные джипеги и гифы, случайным образом сгенерированные изображения,
постоянное движение, html-код и элементы форм в качестве абстрактных деталей
дизайна, сияющие неоновые цвета, режущие слух звуки, навороченный dhtml,
намеренно испорченная навигация.
-
домашние страницы/дизайнерские
фирмы: Day-Dream, Titler,
soulbath's requiem for a dream,
e13, dream7,
ShaG, pixeljam
-
примеры коммерческих сайтов:
???
G. Стиль "Hello Kitty" 1950-х годов
-
Источник вдохновения: комиксы
для девчонок, рождественские сувениры, атрибуты домов-прицепов 50-ых годов.
-
Приемы: 3-хмерные объекты/текст,
скругленные правильные края, яркие цвета на светлом фоне, курсивный шрифт,
подростковый юмор
-
домашние страницы/дизайнерские
фирмы: Future Farmers, Atlas
Magazine, Post Tool, Milky
Elephant, You Grow Girl
-
примеры коммерческих сайтов:
California College of Arts and Crafts,
Avant Card
H. HTMинимаLизм
-
Источник вдохновения: HTML-код,
мозг Якоба Нильсена (Jakob Neilsen)
-
Приемы: игры со шрифтом с помощью
CSS, упор на цвет для выделения смысла, быстро загружаемые логотипы в виде
гифов, html и текст - элементы дизайна
-
домашние страницы/дизайнерские
фирмы: 37signals, jovino,
test pilot collective
(post-5/00), dreamless, a
list apart, suffocate, endquote,
mesa.beta.font
-
примеры коммерческих сайтов:
gettyone
I. Стиль чертежной доски, инструкций и руководств
-
Источник вдохновения: Архитектурные
кальки Захи Хадид (Zaha Hadid), технические руководства, игрушки роботы-трансформеры,
шрих-код, миллиметровка, тексты мелким шрифтом
-
Приемы: ПО 3-хмерного моделирования,
мелкие плохо читаемые нео-технологические шрифты, отрицательное смещение,
крупные элементы, запутанные элементы навигации
-
домашние страницы/дизайнерские
фирмы: DFORM1, Vir2L,
chapter3, mr.
eel
-
примеры коммерческих сайтов:
mtv2
J. Сверхтонкий дизайн в стиле SimCity
-
Источник вдохновения: игра
SimCity, игры для Commodore 64, обертки японских конфет
-
Приемы: тонкие сглаженные шрифты,
излишнее дробление и детализация, мелкие пиксельные изображения людей/строений/объектов
-
домашние страницы/дизайнерские
фирмы: kaliber 10000, the
icon factory, flipflopflyin,
hi-res
-
примеры коммерческих сайтов:
iTurf
3. FAQ
Какой стиль мне следует
использовать?: Зависит от проекта.
Насколько далеко я могу
зайти?: Зависит от вашего
вкуса и вкуса заказчика. Примечание: контекст сайта создаете вы. Если
ваш сайт работает, не важно как он выглядит на фоне других сайтов. Нет
такого требования, чтобы он обязательно был похож на другие корпоративные
сайты, в первую очередь он должен быть похож на себя.
Что делать, если я не
желаю вообще имитировать чей-либо стиль?: Отыщите свой собственный
источник вдохновения и примените его в своем дизайне. Им могут послужить,
например, плакаты коммунистической пропаганды, шведское
граффити, татуировки, оборудование цехов, приборы
ПВО времен холодной войны и даже каталог MacMall.
Что делать, если мне
хочется быть похожим на остальных?: Если это сработает для вас и для
вашего клиента, почему бы нет? Но то, что является традицией сейчас, завтра
станет анахронизмом. Так что в своих решениях не забывайте о будущем.
В чем главная идея?:
Избегайте стерильности. Цифровой компьютер просто предназначен для того,
чтобы избавляться от застоя и порядка. Если вы хотите, чтобы ваши сайты
выделялись на общем фоне, выделите его. Будьте таким как Джон Колтрейн
(John Coltrane), а не как Kenny G. Люди постепенно станут это воспринимать
как должное. И хватит спать со своей двоюродной сестрой… Если только у
вас хватает сил от нее отказаться.
Приложение
Я переделываю этот сайт в книгу
Fresh Styles for Designers: Eye Candy from the Underground, которая
будет опубликована издательством Macmillan/Que в марте 2001 года. С ума
сойти.
Также, я буду обсуждать
эту тему на конференции builder.com,
что пройдет в Нью-Орлеане 6-10 декабря 2000 года. Почему бы не приехать
и не послушать? Сейчас я создаю сайт, который будет состоять из 10 страниц,
и каждая страница будет оформлена в том стиле, который будет обсуждаться
на этой странице.
Также, как вы заметили,
у меня отсутствует пример коммерческого сайта для стиля " F. Пиксельный
панковский дизайн" (сомневаюсь, что таковой можно найти, по известным причинам).
Но все же, если вы знаете какой-либо сайт, который подпадает под один из
описанных стилей, пришлите мне ссылку. (Спасибо Andrew за пример Avant
Card. Спасибо Peter за пример сайта в стиле Хадида (Hadid))
Курт Клонингер (Curt Cloninger)
Источник: http://mascon.hypermart.net/
|