Parallaxový efekt v astronomii, fotografování, web designu

Optické iluze - jeden z oblíbených pohybů návrhářů a umělců. Pomáhají přitahovat pozornost k návrhu místnosti, obrazu na obrázku a obsahu stránky, aby diverzifikovali rozhraní na libovolném zařízení. Dnes vám povíme o jednom takovém recepci, který se nazývá paralaxový efekt. Začínáme s jeho definicí.

Co je paralax?

Paralax (řecký. pí-alfa-rho-alfa-lambda-lambda-αxi - "střídání", "změna něčeho") - změna viditelné polohy objektu vzhledem k vzdálenému pozadí v závislosti na poloze pozorovatele.

Na tomto jevu je založeno binokulární vidění - schopnost jasně rozlišovat jeden obraz, při pohledu na něj dvěma očima. V astronomii a geodéze se paralaxový efekt používá k měření vzdáleností vzdálených objektů.

Koncepce v astronomii

Zde se rozlišují tyto odrůdy hrdiny našeho vyprávění:

• Geocentric (denní) - rozdíl v směrech na stejný astronomický objekt z určitého místa na povrchu naší planety (topocentrický vektor) a od středu jeho hmotností (geocentrický vektor).
• Roční - změny ve směru astronomického objektu spojené s rotací kolem Slunce naší Země.
• Světská je změna ve zjevné poloze astronomického objektu na nebeské sféře díky kombinaci vlastních rotací a pohybu sluneční soustavy v galaxii.

Na fotografii

Zvažte vliv paralaxy na fotografování. Zde se také vyskytuje v několika typech:

• Paralaxa hledáčku - obraz, který fotograf vidí v neoskelném optickém hledáčku, se neshoduje s tím, co se stane na fotografii samotné. Často se to projevuje při fotografování blízkých objektů.
• Paralaxou vyhledávače rozsahu je úhel, pod kterým je požadovaný objekt během zaostření viditelný (je prováděn pomocí optického zaměřovače).
• Binokulární (stereoskopická) paralaxa je úhel, při kterém je objekt fotografován stereoskopickým fotografickým zařízením. To je podobné binokulárnímu vidění.
• Paralaxa času - zkreslení tvaru objektu tímto účinkem, projevující se při natáčení kamerou s oponou. Pozoruhodně, když zachycujete něco, co se rychle pohybuje. Pokud objekt udržuje cestu směrem k štěrbině uzávěru, bude to napnuto, jinak - naopak.

Ve webovém designu

Zde je účinek paralaxy (jiným způsobem - paralaxa-rolování) - speciální technika, při níž se pozadí v budoucnu pohybuje pomaleji než hlavní plán. Poslední je text, obrázek.

Jak provést paralaxní efekt? 3D prostor je vytvořen pomocí několika pozadí, které se při rolování začnou pohybovat různými rychlostmi. Vypadá to velkolepě a působivě.

Zvažte programy a aplikace, ve kterých můžete vytvořit efekt paralaxy:

• jQuery je plugin, který váže paralaxu - rolování k rotaci uživatele kolečka myši.
• jParallax - může otočit prvky webové stránky do absolutně umístěných vrstev, které budou odpovídat umístění kurzoru.
• Scrolldeck je vhodný plug-in, který vám umožní dosáhnout tohoto efektu.

Vlastnosti webového designu

Chtěli bychom upozornit na skutečnost, že efekt paralaxy není univerzální ozdobou pro všechny weby. Prvním zdrojem, na kterém lze vidět, bylo místo Nike Corporation. A zatím je to docela dobré pro on-line obchody, což pomáhá oživit zobrazení sortimentu, pohyb po kategorii. Ale v rozumných mezích - uživatel stále chce vidět a vybrat to, co potřebuje rychleji, takže saturační efekt velmi brzy začne otravovat ho.

Sporné bude jeho použití pro obchodní, informační zdroje. Na jedné straně paralaxa umožňuje nějakým způsobem zlomit pevný text na bloky, na druhé straně vypadá trochu triviálně. Ideální bude jeho využití pro děti, zábavu, kognitivní zdroje, místa biografie, pomůže jim uznání, originalitě, přitahuje pozornost.

Nevýhody paralaxu-rolování a způsoby jejich odstranění

Parallax je docela pěkný a stylový efekt. Však je silně načte stránku kvůli použití jаvascript / jQuery: musí provést řadu složitých výpočtů, aby bylo možné ovládat pozici každého pixelu. To výrazně zpomaluje rychlost stahování webu. Mohou to být také problémy s kompatibilitou mezi platformami a cross-browser.

Výstupem bude nerespektování konkrétního místa s prvky s paralaxovým efektem, dostatečně 1-2 na jedné stránce. Další možností je použít CSS3. Pomáhá vytvářet velmi podobný efekt, který je méně náročný na zdroje. Má však své nevýhody: pouze pomocí jeho pomoci nelze dosáhnout paralaxa-rolování. Navíc CSS3 není podporován všemi moderními prohlížeči.

Příklady webového designu

Chcete-li pochopit, jaký je efekt paralaxy, pomozte seznámit se s některými jejími implementacemi v návrhu webových stránek:

• Portfolio fotografií reagující na pohyb myši.
• Účinek posuvníku - k otevření reklamy, článku, musíte vytažením šipky na obrázku.
• Když procházíte seznamem, pozadí se pohybuje pomaleji než text.
• Některé objekty (mraky, hračky, figurky, oděvy) se pohybují po stránce.
• Reakcí na vaše pohyby pomocí myši se vrstvy pozadí pohybují od sebe.
• Jedna část stránky stránky je citlivá na umístění kurzoru a druhá je nepohyblivá.
• Pohybem myši můžete spustit raketu do vesmíru, auto, malého muže atd. Efekt je dosažen skutečností, že pozadí se pohybuje pomalu a hlavní objekt - rychle.

V rozhraní různých operačních systémů je taková iluze použita. Zejména pro iOS 7 byl paralaxový efekt již charakteristický.

Objekt našeho příběhu je proto v mnoha oblastech relevantní. Nedávno se pevně usadil v designu webových stránek, který však nezaručuje jeho univerzální kouzlo pro všechny weby.