Яндекс.Метрика

Дизайн-журнал №1. Актуальная информация для дизайнеров, веб дизайнеров, программистов и разработчиков сайтов.

Веб-дизайн в стиле стимпанк: тенденции и особенности

19 августа 2011 | Опубликовано в Веб-дизайн | 8 Комментариев »

Каждый знает, что стимпанк – это жанр научной фантастики, в котором моделируется альтернативный вариант судьбы человечества при использовании паровых двигателей. Но со временем стимпанк перестал быть только направлением в научной фантастике, а стал активно использоваться в дизайне (создание интерьера или игрушек в стиле стимпанк). Не менее продуктивно используется стимпанк и в веб-дизайне.

Создание сайтов в стиле стимпанк – стилизация под эпоху викторианской Англии. Интерфейс сайта в стиле стимпанк всегда привлекает внимание пользователей. На таких сайтах ключевым становится механический элемент. Веб-дизайн в стиле стимпанк широко использует многочисленные кнопки, винты, трубы, гайки, паровые клапаны, часовые механизмы. К примеру, для Senya Studios как своеобразный логотип выбрали себе две прокручивающиеся шестеренки, а в первую очередь пользователь обращает внимание на интересный механизм в правом углу сайта. Таким образом, посетитель, задерживаясь на страничке, чтобы детальнее ее изучить. Кроме того, шестеренки, гайки, шурупы, двигатели, которые запускаются при нажатии мыши, способствуют интеграции пользователя во время работы с сайтом, проникновение (на уровне восприятия изображения) в атмосферу сайта.

Рассмотрим сайты в стиле стимпанк внимательнее

Большинство сайтов в стиле стимпанк создано с помощью Java Script. Так, на сайте TheSteamemporium представлено выпадающее меню. Это безупречно красиво и интересно для пользователя, только иногда не совсем удобно как для юзера, так и для поисковика.

Состаренные фотографии

Сайт Steampump  использует состаренную фотографию и надпись «Enter», созданную с помощью Penmanship.

Сопровождение в каждом разделе

На сайте Stephanehalleux  каждую рубрику сопровождает своеобразный робот в соответствующем стиле.

 

Фишка сайта

Большое значение в таких сайтах имеет фишка — небольшой но броский элемент, который будет ассоциироваться у пользователя с этим сайтом. Сайт Freakangels  своей фишкой сделал  причудливую машину на винтах с крыльями (прямая ассоциация с ангелами).

А Студия 3232  использует стилизованное под стимпанк увеличительное стекло которое сопровождает пользователя на любой странице сайта (левый верхний угол).

На Іantregillis навигация продумана таким образом, что пользователя сопровождает подзорная труба, через которую можно видеть планеты. Прокручивая настройки прибора, пользователь выбирает ту или другую дату (день и месяц) и попадает автоматически на страницу с интересующей его датой.

При наведении курсором на рубрику на сайте Mykeamend над соответствующим разделом зажигается лампочка. Подобные элементы дизайна позволяет пользователю интегрироваться в работу с сайтом, почувствовать себя соучастником действия, а значит, юзер непременно заинтересуется сайтом.

Flash и HTML

Довольно-таки большая часть сайтов в стиле стимпанк использует технологию Flash или динамику HTML.

Галерея сайтов в стиле стимпанк

Ниже представлена подборка интересных сайтов в стиле стимпанк. Каждая картинка имеет линк на сайт.

 

 

Судьба стимпанк в вебдизайне

Можно найти и другие примеры сайтов, созданных в стиле стимпанк (А, быть может, вы знаете такие сайты, и готовы поделиться с общественностью?). Сложно не согласиться с тем, что сегодня достаточно большое количество сайтов созданы в стиле стимпанк и с элементами стимпанка. Насколько это серьезно? Можно ли назвать стимпанк тенденцией в вебдизайне? И что такое стимпанк для вебдизайна – стиль, подходящий только для одной ниши, или стиль, который действительно заслуживает внимания и способен получить широкое распространение? На эти вопросы сложно ответить однозначно, поэтому ждем ваших мнений!

Автор  - Дежурка




Комментарии

  1. DukAlex
    Thumb up Thumb down +3

    очень интересно

  2. iGoogle
    Thumb up Thumb down 0

    Очень крутая подборка, спасибо!

  3. Денис
    Thumb up Thumb down 0

    Подборка добре, но сами сайты — посмотрел тройку из них — вообще расстроили

    Mykeamend, Steampump, Іantregillis — меню или картинка и все, на этом сайт закончился, с массой не очень положительных моментов — большое количество текста не разбитого, либо прижатый к левому краю весь контент и дизайн, либо просто один необычный элемент в меню или бек у одного блока.

    А вообще спасибо, добре утреца)

  4. Кирилл
    Thumb up Thumb down 0

    вот пример сайта в стиле стимпанк

    arhangel-studio.com.ua

  5. Антон
    Thumb up Thumb down 0

    arhangel-studio.com.ua

    Да, действительно, в стиле))

  6. Ant
    Thumb up Thumb down 0

    Есть что-нибудь новенькое по этой тематике?

    Свежие сайты или идеи?

    Буду благодарен за новую подборку.

    marina Ответ:

    Thumb up Thumb down 0

    www.dejurka.ru/web-design...punk_web_design/

    Вот более новая. Может, пригодится. Если найдем что-то, опубликуем в ближайшее время.

    Ant Ответ:

    Thumb up Thumb down 0

    Гуд, спс.