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/
|