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

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

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

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

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

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

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

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

Фишка сайта

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

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

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

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

Flash и HTML

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

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

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

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

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

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

Комментарии

Оставить ответ

Имя (обязательно)

E-mail (не для публикации) (обязательно)

Еще смайлы

Введите число ниже
три − 2 =

Вставить изображение

Отменить написание комментария

Подписаться на уведомления о новых комментариях по электронной почте

Похожие статьи

• Подборка веб-дизайнов и ресурсов в стиле стимпанк
• 10 иллюстрированных флеш сайтов
• 5 портфолио выдающихся дизайнеров
• 30 сайтов с элементами бумаги
• Цветы в дизайне

Случайные статьи

• Создание подводной сцены в Photoshop
• Текст из земли и травы в Adobe Photoshop
• Рисуем фруктовую композицию в Adobe Illustrator
• Создаем пивную этикетку в Adobe Illustrator
• 20 примеров оформления блогов