3D storytelling with scroll-based interactions

We hebben een experimenteel 3D-project gemaakt om een ​​kort verhaal te vertellen dat je in je eigen tempo kunt ontdekken door te scrollen. Een groot deel van onze focus en passie is interactieve verhalen vertellen in websites. In de laatste paar jaren kwamen we erachter dat het gebruik van 3D de mogelijkheden van manieren om het verhaal te vertellen vergroot. Met 2D-interacties beweeg je constant dingen, of jezelf, terwijl 3D je een meeslepende ervaring geeft waarbij je dat tegelijkertijd kunt doen terwijl je aan het verkennen bent.

Nu de interacties. Ik wilde een verhaal vertellen door het gezichtspunt van de gebruiker te verplaatsen door te scrollen. In 3D-webontwikkeling is de camera het zicht van de gebruiker. We kunnen hem positioneren door coördinaten uit de 3D-wereld te gebruiken en die op de camera toe te passen. Aangezien u de coördinaten kent van waar de camera is en waar u de eindpositie van de camera wilt hebben, kunt u het verschil tussen deze posities berekenen en het zo programmeren dat de scrollpositie bepaalt hoe dicht u bij de eindpositie bent . We gebruiken de scrollbar als tijdlijn. Vliegen door de kaart volgens een vooraf bepaald pad is best cool, maar ik wilde iets toevoegen dat de 3D-ervaring nog meer zou verbeteren. Ik wilde dat, als je je muis beweegt, de camera een beetje in die richting zou bewegen. Dit effect moet de gebruiker meer onderdompelen in de 3D-ervaring. In de beginpositie van het verhaal is dit heel aanwezig en later in het verhaal heel subtiel. Maar door deze functie te combineren met scrollen, kun je hoeken bekijken, of details beter bekijken en de 3D nog meer ervaren, vanwege het perspectief.

Ik hoop dat je genoten hebt van het experiment en deze uitleg over de functionaliteit! Ik kan je nog veel meer vertellen over dit experiment. Als je vragen hebt, meer wilt weten of feedback hebt, aarzel dan niet om een reactie achter te laten op onze socials!