Курт Клонингер (Curt Cloninger)
ВведениеПроблема: Большинство сайтов США очень схожи по внешнему
виду и дизайну. Все это связано с кровосмешением. Считается, если так делает
microsoft.com, значит это должно присутствовать на любом профессиональном
корпоративном сайте. Потому то все сайты и выглядят как сайт Microsft (или
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))
Графика и дизайн: общие темы
|