Топ-10 сайтів з паралакс-ефектом - блог indigo

Добрий день, дорогі Новомосковсктелі! Наш сьогоднішній рейтинг, що складається з 10-ти місць, присвячений не звичайним сайтам. Сайти в цьому списку ТОП-10 мають одну загальну особливість - ефект паралакса.

Спеціально для тих, хто ще не в курсі, що це таке, ми коротко розповімо про цей ефект, який вже почав інтенсивно набирати обертів і стає все більш популярним в сфері веб-дизайну.

Отже, паралакс-ефектом, або паралакс-скроллингом називається спеціальна техніка, при якій об'єкти на задньому плані в перспективі рухаються повільніше, ніж об'єкти на передньому плані. За рахунок цього створюється ефект 3D, з'являється відчуття тривимірного простору. Паралакс-скролінг - відмінний спосіб додати родзинку в утворять єдиний сайт, оживити інфографіку, розповісти історію або продемонструвати портфоліо. А деякі роботи сучасних дизайнерів можна з повною впевненістю назвати творами мистецтва ... Втім, краще один раз побачити, ніж сто разів почути - ознайомтеся з нашим ТОП-10 сайтів і погляньте самі!

Зверніть увагу: деякі сайти з parallax scrolling бувають ресурсовитратності через безліч ефектів, тому не виключається «пригальмовування» на певних комп'ютерах і портативних пристроях.

Grab # 038; Go

Десяте місце в нашому рейтингу займає сайт Grab # 038; Go, де паралакс-ефект використовується в якості прикраси і пожвавлення картинки. При русі курсору можна спостерігати, як одночасно переміщаються будинки і дерева на задньому тлі. Погодьтеся, за рахунок цієї родзинки є шанс, що сайт краще запам'ятається відвідувачеві.

DigitalHands

На сайті DigitalHands, що займає 9-е місце, ефект паралакса також використовується для того, щоб красиво виділитися і запам'ятатися відвідувачам. Рухайте курсором миші і насолоджуйтеся спецефектом.

Нью-йоркське креативне агентство Madwell демонструє своє портфоліо на головній сторінці сайту, вміло використовуючи паралакс-ефект. Відчуття 3D не покидає користувача протягом усього часу прокрутки.

Будь-який товар потребує правильного поданні. На сайті магазина Oakley паралакс-скролінг використовується для демонстрації переваг захисних окулярів Airbrake MX. Вийшло досить вражаюче і пізнавально, оскільки продукцію можна розглянути і вивчити з усіх боків, просто користуючись скролл.

Make Your Money Matter

Мало кого з людей не хвилює тема особистих фінансів. Сайт Make Your Money Matter, який посів 6-е місце нашого рейтингу, в доступній формі розкриває глядачам переваги кредитної спілки та розповідає про мінуси банків. Тут можна скористатися калькулятором, який покаже, який прибуток отримують банки завдяки вкладенням клієнтів, а також знайти відділення кредитних кооперативів за поштовим індексом.

Space Needle

Хотіли б ви вивчити Сіетл з висоти 184 метри? Сайт Space Needle відправить вас у віртуальну прогулянку по найбільш пізнаваною пам'ятки міста - вежі Спейс-Нідл (Space Needle), що в перекладі з англійської означає «космічна голка». Ця вежа висотою 184 м, шириною 42 м і вагою 9 550 тонн витримує урагани зі швидкістю вітру до 320 км / год і землетрусу до 9,1 бала. До того ж, у вежі є 25 громовідводів. Відмінною особливістю Спейс-Нідл є оглядовий майданчик на висоті 159 метрів, ресторан SkyCity і магазин подарунків. З її вершини можна побачити центр Сіетла, вулкан Рейнір, Каскадні гори, заливши Еліот і навколишні острови.

Peugeot Hybrid4 - Graphic Novel

Найбільший французький автовиробник Peugeot досить неординарним чином презентував систему гібридного приводу Hybrid4. Перед нашими очима відкривається захоплюючий комікс (який, між іншим, можна поставити на Автовідтворення), де завдання головної героїні - роздобути секретні дані і піти, не потрапивши в неприємності. Для успішного виконання операції вона змушена перемикатися між чотирма різними режимами руху, які імітують технологію Peugeot Hybrid4 - максимальна продуктивність і динамічність (Sport), режим повного приводу і максимальної тяги (4WD), баланс між продуктивністю і економією (Auto), тиха робота (ZEV ).

The Walking Dead

Sony - Be Moved

Унікальний і неповторний проект, частина агітаційної кампанії Sony «Be Moved» вражає своєю об'ємністю, динамікою і продуманістю до найдрібніших деталей. Кращою презентації продукції, ніж у Sony, напевно, не знайти. Слова зайві - просто Скролл вниз і насолоджуйтеся!

Flat vs. Realism

Примітка: на жаль, з часом деякі сайти можуть змінити свій дизайн.