Коктейль винтажа и инноваций: ретро стиль в веб-дизайне
Однажды в блоге я уже писал о ретро стиле для интернет, точнее просто опубликовал весьма интересную подборку ретро дизайнов сайтов. Теперь же добавим немного «теории», если можно так выразиться — ретро дизайн ведь тоже имеет свои истоки, критерии и направления, созданные под влиянием целых эпох и периодов.
RETRO c лат.: «назад», «обращённый к прошлому»
По утверждению американского писателя Джона Стейнбека, большинство людей на девяносто процентов живет в прошлом, на семь в настоящем, а для будущего остается только три процента. Что ж, подсчеты нобелевского лауреата по литературе слишком сложно проверить, однако оспаривать факт притягательности событий прошлого не приходится. Если щемящее чувство ценности уходящего времени и притягательности старинных вещей вам знакомо не понаслышке, возможно, стиль ретро в веб-дизайне окажется вашим коньком. Остается лишь подумать, удовлетворит ли ретро-концепция целевую аудиторию ресурса. Кто придет в восторг от контента, виртуозно припудренного под старину? Люди, ностальгически всматривающиеся в символизм ушедшей эпохи с ее модой, людьми, машинами и прочими историями, покрытыми пыльным налетом отгоревших страстей.
В одежде, автомобилестроении или дизайне интерьеров к ретро-стилю достаточно уверенно привязывают временные рамки с 20-х до 80-х годов прошлого века. Дать четкие временные признаки ретро-стиля в веб-дизайне не так легко, ведь что в обычной жизни может считаться прошлым днем, в стремительно меняющейся IT-сфере смело можно назвать днем позавчерашним. И то, что тридцатилетний художник еще сочтет актуальным и современным, молодежь уже давно списала в утиль. Взять, к примеру, неутешительные для продюсеров итоги проката фильма «Чужая»: бандитская романтика лихих 90-х не взволнует душу тинэйджера, ведь ретро – оно у каждого свое.
Однако тем интереснее и сложнее будет задача, стоящая перед дизайнером, решившим отработать стилистику своего сайта именно в ретро-стиле. Лишь знание характерных черт и особенностей ретро-стиля, помноженное на немалое чувство меры, позволит не скатиться в банальный кич.
Большинство временных отрезков, которыми может смело оперировать дизайнер, решивший использовать стиль ретро, привязаны к моде 20 века.
Хотите воссоздать у посетителя сайта ощущения агрессивного шика 20-30-х годов – помогите ему вспомнить музу Владимира Маяковского Лилю Брик, хороша будет и Эллочка-людоедка из «Двенадцати стульев». Это были тревожные годы внезапной и массовой дамской эмансипации: женщины надели брючные костюмы, укоротили юбки и закурили длинные папиросы. Все эти чулки в сетку, трикотажные шапочки и котелки а-ля Чарли Чаплин, обнаженные руки и плечи в меховых горжетках в годы НЭПа знатно будоражили кровь обывателю. Берите оливковый, черный и пурпурные цвета за основу, добавьте драйв джазовой импровизации, сказку синематографа и аэропланов – и Вы легко уловите суть ретро 20-30-х годов!
Если же вам больше по вкусу сдержанность и скромная элегантность – оглянитесь в послевоенные 40-е — 50-е годы. На смену показной вычурности и вульгарности пришел new look стиль, изобретенный Кристианом Диором. Стиль чувственный, декадентский, безоглядно романтичный, стилизованный под «кринолиновый» XIX век. Это высокомерно поднятые подбородки женщин в платьях из шелка, атласа, крепдешина. Это тонкие талии, волнительные декольте, перчатки до локтя, широкополые шляпы и лакированные ремни, что форсируют женственность до пределов полупристойного пин-апа. Пересмотрите «Дневник памяти» Ника Кассаветиса и «Крестного отца» Френсиса Ф. Копполы, включите записи оркестра Гленна Миллера и поскорее беритесь за планшет. Настроение Вы уже уловили.
Желаете сделать ставку сексуальность и чувственность — перелистайте страницы журналов 60-х и 70-х гг. В то время тон задавали соблазнительные кинодивы Бриджит Бардо, Мэрилин Монро, Софи Лорен. Цветовая палитра соответствует настроению – это доминирующий красный, розовый, синий в ассортименте: цветы, горошек, клетка. Автомобильные прогулки на шикарном «Бентли» под головокружительные мотивы крамольного Элвиса. Битлз у «них», ВИА «Самоцветы» – у «нас». Джинсовые 70-е, обувь на платформе, танцы под музыку диско и море синтетики в одежде: нейлон, капрон, кримплен диких расцветок. Легкость, яркость, непринужденность – вот как можно будет описать сайт в ретро-стиле 60-х — 70-х гг.
Очень необычным может оказаться опыт работы в стиле советской культуры 80-х годов XX века – времени, когда культпросветовская идеология правящей партии зашаталась под хаотичными, но мощными ударами протестной подвальной субкультуры. Вышедшие из подполья русский советский рок и панк вперемешку с ломаными плясовыми мелодиями дискотеки 80-х стали лейтмотивом Перестройки. Этот период еще не так глубоко переработан веб-дизайнерами, поэтому решение использовать стилистику 80-х может принести немалый успех.
Подведем итоги. Ретро-стиль по сути вполне стабильный и востребованный тренд в веб-дизайне, со своим очарованием и уникальной цветовой палитрой. Что бы Вы не выбрали: трагичные нэпманские 20-е, карамельные 50-е, цветочные 60-е, дискотечные 70-е или номенклатурное ретро 80-х, отталкиваясь от прошлого, дополнив его своими ощущениями и активно используя богатые возможности графических редакторов, Вы способны создать маленький шедевр.
Дополнительно цветовыми палитрами ретро-стиля можно вдохновиться в небольшой подборке ретро дизайнов (для особо интересных экземпляров можно пройтись по ссылочкам на оригинальные сайты и посмотреть как там все сделано).
Dallas Advertising Agency — весьма оригинальная навигация, музыка на заднем плане и вообще такой себе военный ретро стиль.
Lana Landis — реализация на flash, обязательно загляните в раздел фото:) красивые винтажные фото + замечательная музыка
ThunderFuel — насколько я понял компания занимается всем от дизайна, анимации и до игр. Просмотрев их флеш сайт в ретро стиле я бы точно заказал что-то, классная реализация и задумка.
Сайт-портфолио Michela Chiucini веб дизайнера — кстати, прошлая работа именно ее, видим, что она явно не безразлична к ретро стилю
Kultika — мне не совсем понятно назначение и тематика этого сайта, но реализация просто выше всяческих похвал!
Diseño Grafico — прикольный сайт в стиле ретро для веб-студии или фрилансера разработчика, он как бы вытянут в линию и при клике картинка сдвигается вправо.
Tennessee Vacation — для всех любителей штата Tennessee и отпуска в тех краях, очень классная реализация в ретро стиле, где внимание уделено практически каждой мелочи, один из лучших сайтов в подобном стиле, что я видел
Вот такая вот подборка веб-дизайнов в ретро стиле получилась. По-моему, весьма хорошие работы здесь представлены, хотя, конечно, ретро сайтов существует на порядок больше. А это значит, что я обязательно их отыщу и опубликую уже в следующий раз.
Источник
Классический И Современный Ретро-Стиль В Веб-Дизайне
Загадочный, ностальгический, необычный стиль Ретро имеет свою нишу в веб-дизайне. Его используют в классическом варианте и современном. Мы рассмотрим вопросы о том, как веб-мастера мира создают ретро-дизайн, какие используются элементы и в чем недостатки данного стиля.
Все мы знаем аксиому: «все новое – хорошо забытое старое». То же самое можно сказать и о конструкциях, тенденциях веб-дизайна и дизайнерского направления в целом. Одновременно с тем, как меняется окружающая нас жизнь, социум, взгляды, положение дел в политике и экономике (ух, и даже они), мода тоже меняется. И многие старые стили возвращаются. Но возвращаются не в своем оригинальном виде, а претерпевая изменения под влиянием времени, в котором они приходят.
Одним из примеров такого явления в веб-дизайне является стиль ретро. И сегодня мы посмотрим на то, как используется современный ретро-стиль в веб-дизайне, и как его можете использовать вы в большинстве своих дизайнерских проектов. Современный стиль ретро удобен и уникален тем, что работает он как ассистент. Дизайны сайтов разнообразны, но ретро способен добавить интересные штрихи буквально к каждому элементу и этим преобразить проект в целом. Более того, современный ретро очень удобен и занятен для применения в полиграфии (приглашения, логотипы, визитные карточки, плакаты). А поскольку, зачастую, дизайны промо-страниц, сайтов, лэндингов связываются с полиграфией, то современный ретро находит себе применение буквально в каждом направлении веб-дизайна.
Впрочем, не останется без внимания и классический стиль ретро.
Влияние стиля ретро на интернет
Современный стиль ретро произошел от стилей 1950 – 1980-х годов XX века. Зачастую можно увидеть намеки на них в тех или иных проектах. Некоторые веб-мастера называют такое веяние «слиянием ботаники и технологии» и образованием своеобразной новой культуры.
Но что действительно хорошо в ретро стиле или даже в отдельных элементах его проявления – это ностальгия, чувственность, воспоминания. И они способны создавать очень устойчивую связь между дизайном сайта и посетителями, влиять на восприятие контента, на подачу материала, рекламу, побуждать нажимать кнопки, смотреть на товары и прочее, и прочее. Посетителям же подсознательно приходит мысль: «я помню это», «я помню, нечто похожее было, когда я…» и так далее.
Между тем ретро-стиль используется преимущественно в конструкциях дизайна страниц, которые, в первую очередь, развлекают пользователей. Да, на них есть информация, важная и серьезная. Но преподносят её в несколько фривольной манере, что позволяет посетителям почувствовать себя подростком, вспомнить беззаботный период своей жизни и при этом получить ту информацию, что для него важна.
Стиль ретро выходит за пределы времени, моды, вкуса и возраста. Веб-дизайн в стиле ретро хорошо принимаются пользователями из разных стран, как минимум от того, что обычно тематика фокусируется на определенных эпохах или поп-культуре, что имеют лояльную группу последователей в разных странах. Обратим внимание, что цветовые схемы и изображения создаются не слишком тусклые и не слишком красочные, а потому приятны глазу.
Ретро-проектирование привносит нотку романтизма в веб-дизайн. Большинство из нас часто думают о том: «как хорошо когда-то было, и трава была зеленее, и солнце ярче светлило».. Мы чувствуем, что жизнь была гораздо проще, менее напряженной и расслабленной, когда ходили в школу и колледжи/ВУЗы. Это, вероятно, тот момент, когда ретро-дизайн оказывает на нас сильное влияние. Он вновь возвращает нас к этим сладким и памятным дням, когда наша жизнь была более спокойной.
Особенности современного ретро
Популярность современного ретро-стиля растет и зависит от большого количества деталей, которые берутся из других ретро и винтанжных стилей. Веб-дизайнеры используют некоторые моменты ушедшей эпохи и представляют нам сейчас в наши дни, но окружают при этом современным антуражем. Именно поэтому, когда вы смотрите на проект, можно с некоторой определенностью сказать, в каком стиле он сделан, использовался ли современный ретро или нет. Но чтобы такое определение сделать, стоит обращать внимание вот на что:
- Технологические темы с использованием образов компьютеров старой школы. Это сейчас они плоские, тонкие и изящные. Вспомните, какими большими и громоздкими они были раньше. Об этом и речь.
- Музыкальные темы с ленточными проигрывателями или с вертушками под пластинки. Помните такие?
- Чистые абстрактные иллюстрации с изображением людей, но не лиц в отдельности.
- Яркие цветные линии, завитки, ленты и прочие элементы.
- Геометрические формы с толстыми штрихами.
- Плоские элементы от форм до линейных иконок. Современный ретро не использует много дополнительных украшательств, он, скорее, напоминает плоский дизайн и минимализм.
- Пиксельные иллюстрации, которые отражают графику ранних видеоигр.
- Неоновый стиль в элементах, что имитируют собой свет и подсветку.
- Линейный стиль для элементов пользовательского интерфейса. Без украшений и многообразия цветовой палитры.
- Простые анимации, без слишком быстрого движения. Такие анимации даже порой кажутся «в лагах», словно бы кусочки плавности движений были вырезаны.
- Разнообразие шрифтов: с засечками, угловатые, крупных размеров, сочетания жирности и наклонности. Иными словами все те стили, что использовались в кино, видеоиграх, телевидении тех лет.
- Богатые цветовые палитры с большим количеством «счастливых» оттенков. Это желтые, апельсиновые, красные, салатовые, зеленые. Не яркие, слегка приглушенные.
Детализация ретро-стилей для веб-дизайна
Ретро стиль в веб-дизайне имеет несколько деталей, которые можно увидеть буквально на каждом проекте. Это рукописные шрифты, старые автомобили, ретро модели продуктов, старомодные фотографии, ранние электронные устройства и другие старые изображения, что именно всем своим видом и создают стилизацию древности. На некоторых веб-страницах размещаются фотографии празднования начала космических путешествий, в то время как другие дизайнеры предпочитают использовать послевоенную тематику (легендарные 50-е годы в Америке), первые фабрики\заводы. Если немного задержаться на военной тематике, то преимущественно дизайнеры обращают внимание на изображения старых военных самолетов и значков. И, разумеется, не обходится дело без образов очаровательных девушек той эпохи.
Но как мы сказали выше, существуют ключевые элементы, которые используются в классическом ретро стиле и современном ретро. Обратим на них особое внимание.
Формы. Простые и разного размера, но обладающие яркими цветными фонами. Такие элементы привлекают внимание и позволяют адаптировать пространство страницы для разделения и создания акцентов на контенте.
Цветовые схемы. Ограниченная коллекция палитры, не яркая. Дело в том, что полноцветная печать в период 50-х годов и до 90-х была дорогой, поэтому цвета использовались не слишком насыщенные. Дизайнеры, соответственно, тоже ограничились этими условиями. Два тона окраски обычно достаточно для веб-дизайна. Иногда же, наоборот, выбирается фокусный цвет, который смешивается с небольшим количеством выбранных цветов. Тогда получается уникальная и незаурядная тема.
Типографика. Работа со шрифтами занимает важную роль в веб-дизайне. И особенно при работе с ретро-стилями. Особенностью в данном случае являются простота, репозиционирование шрифтов, дублирование и пиксельные штрихи для добавления уникальности и отражения вкуса мастера.
Разделители. Границы, рамки, линии – увлекательная часть и обязательная при работе с ретро. Они могут использоваться для кадрирования изображения, выделения содержания, создания областей и секций. Могут быть созданы сплошным цветом или иметь декоративную конструкцию. Допускается свобода выбора.
Текстуры. Легкие структуры текстур, шумы, едва заметные узоры в фонах страницы помогают визуально создать привлекательный ретро-стиль, который в современности не будет выглядеть чем-то устаревшим, унылым и забытым. Некоторые мастера используют текстуру холста, другие – однотонные с тонкими линиями и штрихами. Такие текстуры быстро создаются в Photoshop (мы уже рассматривали подобное) и не стоит использовать обилие теней.
Логотипы и значки . Наверное, на эти элементы ложится большая ответственность в создании духа ретро. Как правило, у них круглая форма и развивающиеся элементы рядом или над/под ними. Уточненные, контрастные цвета – важная деталь. Они хорошо видны, читаемы и понятны сразу и всем.
За и против
Является ли ретро-стиль, будь то классический или современный, подходящим для вашего конкретного проекта? Чтобы ответить на этот вопрос, давайте посмотрим на преимущества и недостатки его.
Плюсы ретро стилей
- Визуально легкий и воздушный.
- Яркие цвета в элементах и формах привлекают внимание.
- Черно-белые фотографии, пиксельные изображения позволяют посетителям отправиться в мир их детства или время детства их родителей.
- Ретро – отличный повод попробовать что-то новое для себя, потренировать свои творческие навыки, взгляды.
- Современный ретро-стиль представляет собой эволюцию некоторых методов и подходов, ставших популярными вследствие появления плоского дизайна, а потому его использование не будет расценено как незнание веб-дизайнером тенденций и стиля в целом.
Минусы стиля ретро
- Ретро как стиль, неважно где он используется, в веб-дизайне, кино или телевидении – стиль «не для всех». Некоторые пользователи интернета попросту не поймут его.
- Он также и очень автономный стиль, поэтому смешивать его с элементами иных направлений не всегда хорошо. Выглядит такое неказисто.
- При неумелом использовании или малой фантазии сочетания цвета, форм, конструкций со шрифтами может сыграть плохую шутку, и вы только «убьете» время на работу, но хорошего дизайна так и не получится. Иными словами: стиль легкий визуально, но сложный при работе.
- Многие современные ретро стили не используют такие элементы, как видео и фотографии в большом объеме. Да, на примерах выше такие вариации найдутся, но их мало. Да, и если образы используются, то в единичном числе. Попросту потому, что для ретро-стиля такое несвойственно.
- Сочетания цветов могут вызывать проблемы удобочитаемости. То есть, если в полиграфии сочетания могут хорошо выглядеть, то на сайте при таком же сочетании вкупе с цветом шрифта может получиться настоящая аляповатость.
Выводы
Прикосновение современного ретро-стиля чувствуется в наши дни почти везде: от супергеройских кинолент до видеоигр, вплоть до продуктов Atari. Веселость той эпохи, энергия и активность может сделать из вашего проекта настоящую «звезду», если вы чувствуете, как это можно все обыграть и использовать.
Использование ретро-элементов в веб-дизайне – попытка вернуть воспоминания о прошлом. Когда веб-мастер намеренно создает «старинный» дизайн и смешивает его с новыми и современными услугами, технологиями – получается истинное ретро. Занятно, но старые методы проектирования технологически совместимы с современным проектированием. Хотя есть элементы, которые стоит обходить стороной. Повсеместное Flash, большие радужные шрифты, счетчики посетителей – устарело, и использование этого не придаст ретро-атмосферности. В то же время стоит обращать внимание на детали, что популярны и сейчас, но представлять их в ретро варианте. Фотографии переводить в черно-белые, сочетать шрифты и фон, аналогично плакатам и картинам тех лет и многое иное.
Ретро-стили – необычны визуально, сложны в создании, легки в восприятии, но и очень обособленны. С одной стороны, они и современные тенденции используют, а с другой – смешивания не допускают. И да, в классическом ретро-стиле увидеть веб-дизайн сейчас уже сложно, тем более в европейской части интернета. По сути, ретро-стиль вообще ассоциируется именно со временем 50-х годов в США, а потому использование современного ретро в данное время более актуально и востребовано.
Источник