6 skvělých interaktivních pozadí webových stránek a jak je vytvořit

Získejte návštěvníky, aby na vaší stránce zůstali o 25% déle, snížili míru okamžitého opuštění a přiměli lidi, aby se vrátili na váš web díky interaktivnímu pozadí webu.

Váš web je hlavní ukázkou a měl by nejlépe odrážet vaši kulturu. Kromě toho je také vaším hlavním cílem přilákat pozornost návštěvníků, inspirovat je, přimět je, aby se zajímali o vaši firmu a zároveň představili vaše produkty a / nebo služby. Existuje několik způsobů, jak toho dosáhnout, a jedním z nich je poskytnout interaktivní pozadí webových stránek. Ve skutečnosti má tento druh účinku řadu výhod: prodloužení času stráveného na stránce o 25%, snížení průměrné míry okamžitého opuštění až o 35%, takže se lidé vrátí na váš web (+ 40% míra návratnosti uživatelů).

V tomto článku se zaměříme na 6 příkladů, které využívají skvělé a efektivní interaktivní pozadí webových stránek a vytváříme různými metodami. Pojďme je objevit!

1. Veritystudia, světelné částice

Vytvoření vesmíru značky je v dnešní době jednou z hlavních priorit jak pro B2C, tak pro B2B, a než utratíte příliš mnoho peněz v agentuře, můžete dát svému vesmíru nějakou podstatu s pouhým pozadím.

Web Veritystudios pomocí webu Three.js

Verity neprodává pouze řešení vnitřních robotů, ale kouzla. Navrhli interaktivní pozadí pomocí vlastního kódu, aby to návštěvníci cítili, s pohybujícími se částicemi a synchronizovaným světlem, což při pohybu myši dává efekt chladné hloubky a mírnou animaci na pozadí. Používání jazyků kódu, jako je BabylonJS nebo Three.js, umožňuje vytvořit si vlastní zážitek, který dokonale vyhovuje atmosféře, kterou chcete nabídnout, ale vyžaduje více technických schopností.

2. HD Rain způsobuje déšť ️

Obvykle jsou pozadí abstraktní, umělecká díla a tvary. Ale někdy se stává realističtějším a když se shoduje s tím, co společnost dělá, vytváří úžasný zážitek.

HD-Rain poskytuje deštivý efekt na svých webových stránkách s Naker.Back

HD Rain je spuštění předpovědi počasí se sídlem v StationF v Paříži a chtělo dát zkušenostní podporu svému webu, aby se počasí opět ochladilo!

Pomocí nástroje Naker.Back, našeho nocode & free nástroje, který vytvořil interaktivní pozadí pouze z ikony, přinutili pršet za méně než 5 minut od vytvoření k vložení, a v důsledku toho došlo k prodloužení času stráveného a vracejících se uživatelů!

3. Sítě Fabio Lamanna

Web vytvořený Fabio Lamanna pomocí Particle.js

Používání loga jako inspirace pro vaše pozadí je vždy dobrý nápad. Skvělý webový zážitek není jen souhrn různých věcí, ale soudržná kombinace. V tomto případě Fabio lamanna dobře použil Particle.js, knihovnu JS k vytvoření efektů částic, známých svými pěknými síťovými efekty.

Je to super efektivní zejména proto, že Fabio pracuje v oblasti dopravních sítí. Interaktivní pozadí je třešničkou na dortu jeho webových stránek / portfolia!

4. Létejte na obloze!

Při navigaci na webu v roce 2020 budete někdy potřebovat pauzu. Všechny tyto hezké webové stránky, všechny tyto marketingové vyskakovací okna a všechno ... Takže zavřete oči, jste nad mraky, létáte na obloze!

Interaktivní obloha pomocí Vanta.js

Můžete však také navštívit interaktivní oblohu vytvořenou na Webflow s Vanta.js! Tento úžasný výkon je poetickou přestávkou, která vám ukáže, jak daleko můžeme jít s pozadím. Vanta.js byl projekt vytvořený kluky ze Strikingly a je to seznam šablon, jako je tenhle, který jste vložili několika řádky kódu.

5. Moje bubliny, bubliny! 🧼

Pokud jste někdy viděli Nalezení Nemo, víte, že některé ryby (myslím, že je to stejné pro lidské bytosti) milují bubliny. Tak proč je nepoužívat na svém webu?

DDNA používající vlastní kód pro jejich interaktivní pozadí

DDNA je klenotnická společnost, která se rozhodla hrát s tvary a barvami, aby měla velmi minimalistické, ale efektivní pozadí webových stránek. Bubliny, které mohou nějakým způsobem představovat ducha budoucích drahokamů, se vznášejí v extázi (takže nezastavujte mě) s pěknými barvami a efektem stínu. Opravdu to není typický web šperků, na který jste zvyklí navštěvovat, proto si na ně budete pamatovat!

6. Vesmír Damiana

Obvykle říkáme, že vytvoření zážitku znamená vytvoření vesmíru. To je možná důvod, proč je astronomie pro mnoho designérů zcela běžným zdrojem inspirace.

Prostorový design pro Damiana Devose, který udržuje obraz na pozadí částicemi Naker.Back

Damian Devos se ale rozhodl poskytnout svým hvězdám interaktivní podporu, okamžitě vytvořit efekt wow a na své domovské stránce vyvolat pocit hloubky. Je to také způsob, jak v portfoliu, jako je toto, ukázat technické schopnosti návrháře. Toto pozadí bylo také vytvořeno pomocí nástroje Naker.Back, pomocí hvězdné ikony, dalo jim dva různé směry a přidalo citlivost myši, to vše rychle a zdarma.