6 seje interaktive webside-baggrunde & hvordan man laver dem

Få dine besøgende til at forblive 25% længere på din side, reducere din afvisningsprocent og få folk til at vende tilbage til dit websted takket være en interaktiv webside-baggrund.

Dit websted er dit vigtigste udstillingsvindue, og det skal afspejle din kultur på den bedst mulige måde. Derudover er det også dit hovedmål at tiltrække besøgende opmærksomhed, inspirere dem, få dem interesseret i din virksomhed, mens du introducerer dine produkter og / eller tjenester. Flere måder at gøre det, der findes, og en af ​​dem er at give en interaktiv webside-baggrund. Faktisk har denne form for effekt flere fordele: øge 25% af den tid, der bruges på en side, reducere op til 35% af den gennemsnitlige afvisningsprocent, og dermed få folk til at vende tilbage til dit websted (+ 40% returnerende brugerfrekvens).

I denne artikel fokuserer vi på 6 eksempler, der bruger store og effektive interaktive baggrunde til websteder og bygger med forskellige metoder. Lad os opdage dem!

1. Veritystudios, lysende partikler

Oprettelse af et brandunivers er en af ​​de højeste prioriteter for både B2C- og B2B-forretning i dag, og før du bruger for meget i et agentur, kan du give dit univers et stof med bare en baggrund.

Veritystudios websted ved hjælp af Three.js

Verity sælger ikke kun indendørs drone-løsninger, men også magi. De designet en interaktiv baggrund ved hjælp af brugerdefineret kode for at få besøgende til at føle det, med partikler i bevægelse og en lys synkroniseret, hvilket giver en cool dybdeeffekt og en lille animation på baggrunden, når du bevæger musen. Brug af kodesprog som BabylonJS eller Three.js giver mulighed for at skabe din egen oplevelse, der perfekt passer til den atmosfære, du vil tilbyde, men kræver flere tekniske evner.

2. HD Rain får det til at regne ️

Normalt er baggrunde abstrakte, kunstværker og former. Men nogle gange bliver det mere reelt, og når det stemmer overens med det, virksomheden gør, skaber det en fantastisk oplevelse.

HD-Rain giver en regnfuld effekt på sin hjemmeside med Naker.Back

HD Rain er en vejrudsigt startup baseret i StationF i Paris, og ønskede at give et oplevelsesmæssigt løft til deres hjemmeside for at gøre vejret køligt igen!

Ved hjælp af Naker.Back, vores nocode & gratis værktøj til at skabe interaktive baggrunde fra bare et ikon, fik de det til at regne på mindre end 5 minutter fra oprettelse til indlejring, og som et resultat oplevede en stigning i brugt tid og tilbagevendende brugere!

3. Fabio Lamannas netværk

Hjemmeside bygget af Fabio Lamanna ved hjælp af Particle.js

Det er altid en god ide at bruge dit logo som inspiration til din baggrund. Fantastisk weboplevelse er ikke kun en sum af forskellige ting, men en sammenhængende kombination. I dette tilfælde brugte Fabio lamanna godt Particle.js, et JS-bibliotek til at skabe partikeleffekter, der er kendt for sine dejlige netværkseffekter.

Det er supereffektivt, især fordi Fabio arbejder inden for transportnetværket. Den interaktive baggrund er prikken over i'et på sin hjemmeside / portefølje!

4. Flyv i himlen!

Når du navigerer på nettet i 2020, har du undertiden brug for en pause. Alle disse lookalike websteder, alle disse marketing-pop-ups, og alt sammen ... Så du lukker øjnene, du er over skyerne og flyver i himlen!

Interaktiv himmel ved hjælp af Vanta.js

Men du kan også besøge den interaktive himmel lavet på Webflow med Vanta.js! Denne fantastiske forestilling er en poetisk pause, for at vise dig, hvor langt vi kan gå med en baggrund. Vanta.js var et projekt lavet af fyrene fra Strikingly og er en liste med skabeloner som denne, som du indlejrer med et par kodelinjer.

5. Mine bobler, mine bobler! 🧼

Hvis du nogensinde har set Finding Nemo, ved du, at nogle fisker (jeg antager, at det er det samme for mennesker) elsker bobler. Så hvorfor ikke bruge dem på dit websted?

DDNA bruger brugerdefineret kode til deres interaktive baggrund

DDNA er et smykkefirma, der besluttede at lege med former og farver for at have en meget minimalistisk, men effektiv webside-baggrund. Boblerne, der på en eller anden måde kan repræsentere ånden i fremtidige juveler, flyder rundt i ekstase (så STOP IKKE NU NOO) med dejlige farver og en cool skyggeeffekt. Virkelig ikke det typiske smykkewebsted, du er vant til at besøge, det er derfor, du vil huske dem!

6. Damians univers

Vi siger normalt, at skabelse af en oplevelse indebærer at skabe et univers. Det er måske derfor, astronomi er en ret almindelig inspirationskilde for mange designere.

Rumligt design til Damian Devos, der holder sit baggrundsbillede med Naker.Back-partikler

Men for at skille sig ud, besluttede Damian Devos at give et interaktivt løft til sine stjerner, skabe øjeblikkeligt en wow-effekt og give en dybdefølelse på sin hjemmeside. Det er også en måde på en portefølje som denne at vise designernes tekniske muligheder. Denne baggrund blev også lavet med Naker.Back, ved hjælp af et stjerneikon, give dem to forskellige retninger og tilføjet musefølsomhed, alt sammen super hurtigt og gratis.