Веб-дизайн в стиле стимпанк: тенденции и особенности
19 августа 2011 | Опубликовано в Веб-дизайн | 8 Комментариев »
Каждый знает, что стимпанк – это жанр научной фантастики, в котором моделируется альтернативный вариант судьбы человечества при использовании паровых двигателей. Но со временем стимпанк перестал быть только направлением в научной фантастике, а стал активно использоваться в дизайне (создание интерьера или игрушек в стиле стимпанк). Не менее продуктивно используется стимпанк и в веб-дизайне.
Создание сайтов в стиле стимпанк – стилизация под эпоху викторианской Англии. Интерфейс сайта в стиле стимпанк всегда привлекает внимание пользователей. На таких сайтах ключевым становится механический элемент. Веб-дизайн в стиле стимпанк широко использует многочисленные кнопки, винты, трубы, гайки, паровые клапаны, часовые механизмы. К примеру, для Senya Studios как своеобразный логотип выбрали себе две прокручивающиеся шестеренки, а в первую очередь пользователь обращает внимание на интересный механизм в правом углу сайта. Таким образом, посетитель, задерживаясь на страничке, чтобы детальнее ее изучить. Кроме того, шестеренки, гайки, шурупы, двигатели, которые запускаются при нажатии мыши, способствуют интеграции пользователя во время работы с сайтом, проникновение (на уровне восприятия изображения) в атмосферу сайта.
Рассмотрим сайты в стиле стимпанк внимательнее
Большинство сайтов в стиле стимпанк создано с помощью Java Script. Так, на сайте TheSteamemporium представлено выпадающее меню. Это безупречно красиво и интересно для пользователя, только иногда не совсем удобно как для юзера, так и для поисковика.
Состаренные фотографии
Сайт Steampump использует состаренную фотографию и надпись «Enter», созданную с помощью Penmanship.
Сопровождение в каждом разделе
На сайте Stephanehalleux каждую рубрику сопровождает своеобразный робот в соответствующем стиле.
Фишка сайта
Большое значение в таких сайтах имеет фишка — небольшой но броский элемент, который будет ассоциироваться у пользователя с этим сайтом. Сайт Freakangels своей фишкой сделал причудливую машину на винтах с крыльями (прямая ассоциация с ангелами).
А Студия 3232 использует стилизованное под стимпанк увеличительное стекло которое сопровождает пользователя на любой странице сайта (левый верхний угол).
На Іantregillis навигация продумана таким образом, что пользователя сопровождает подзорная труба, через которую можно видеть планеты. Прокручивая настройки прибора, пользователь выбирает ту или другую дату (день и месяц) и попадает автоматически на страницу с интересующей его датой.
При наведении курсором на рубрику на сайте Mykeamend над соответствующим разделом зажигается лампочка. Подобные элементы дизайна позволяет пользователю интегрироваться в работу с сайтом, почувствовать себя соучастником действия, а значит, юзер непременно заинтересуется сайтом.
Flash и HTML
Довольно-таки большая часть сайтов в стиле стимпанк использует технологию Flash или динамику HTML.
Галерея сайтов в стиле стимпанк
Ниже представлена подборка интересных сайтов в стиле стимпанк. Каждая картинка имеет линк на сайт.
Судьба стимпанк в вебдизайне
Можно найти и другие примеры сайтов, созданных в стиле стимпанк (А, быть может, вы знаете такие сайты, и готовы поделиться с общественностью?). Сложно не согласиться с тем, что сегодня достаточно большое количество сайтов созданы в стиле стимпанк и с элементами стимпанка. Насколько это серьезно? Можно ли назвать стимпанк тенденцией в вебдизайне? И что такое стимпанк для вебдизайна – стиль, подходящий только для одной ниши, или стиль, который действительно заслуживает внимания и способен получить широкое распространение? На эти вопросы сложно ответить однозначно, поэтому ждем ваших мнений!
Автор - Дежурка
Комментарии
Оставить ответ
Похожие статьи
-
Сайты, посвященные индустрии красоты
-
Микровзаимодействия: секрет крутых приложений
-
Графический дизайн в стиле гранж
-
15 бесплатных экшенов для ретуширования кожи
-
Крутая абстракция в веб-дизайне
-
Использование множественных фоновых изображений CSS: основы
-
Красивые примеры рисунков спиртовыми чернилами
-
Рисуем иконку мышки в Adobe Illustrator
-
Бесплатная типографика в ботаническом стиле
-
Простая фотоманипуляция рыцаря в огне в Adobe Photoshop
-
Новые примеры страниц О нас
-
Создание элементов, расположенных ровно по центру, с высотой и шириной, заданными в процентах
-
Концептуальная аэрофотосъемка Тома Хегена
-
Бесплатные текстуры для эффекта состаривания
Самые комментируемые
- Текст из крови в Adobe Photoshop
549
- Насколько важно сегодня использовать Web Safe цвета?
538
- 20 наборов кистей для Фотошопа, которые вам пригодятся
530
- Текст из воды в Adobe Photoshop
518
- 45 новых удивительных наборов кистей для творчества
423
- Более 40 фотореалистичных рисунков
205
- Ретро и винтажная типографика в веб-дизайне
194
- 30 примеров фрактального искусства
191
19 августа 2011 в 19:59
очень интересно
Ответить
9 октября 2012 в 17:43
Очень крутая подборка, спасибо!
Ответить
17 октября 2012 в 9:29
Подборка добре, но сами сайты — посмотрел тройку из них — вообще расстроили
Mykeamend, Steampump, Іantregillis — меню или картинка и все, на этом сайт закончился, с массой не очень положительных моментов — большое количество текста не разбитого, либо прижатый к левому краю весь контент и дизайн, либо просто один необычный элемент в меню или бек у одного блока.
А вообще спасибо, добре утреца)
Ответить
21 ноября 2012 в 23:39
вот пример сайта в стиле стимпанк
arhangel-studio.com.ua
Ответить
4 декабря 2012 в 23:54
arhangel-studio.com.ua
Да, действительно, в стиле))
Ответить
18 апреля 2013 в 20:27
Есть что-нибудь новенькое по этой тематике?
Свежие сайты или идеи?
Буду благодарен за новую подборку.
Ответить
апреля 19, 2013 at 9:12 дп
www.dejurka.ru/web-design...punk_web_design/
Вот более новая. Может, пригодится. Если найдем что-то, опубликуем в ближайшее время.
Ответить
апреля 20, 2013 at 10:05 дп
Гуд, спс.
Ответить