Reimagining Web Navigation

Inspiration

I took inspiration from the 3D spaces offered in AR/VR technologies and the freedom to explore in non-predetermined way such as the adventure offered by many open-world games.

What it does

It is an exploration of new methods to navigate the web as a way of challenging the standard link-and-scroll method that has always been the go-to method, even as web technologies have advanced rapidly.

How we built it

Started with a character and a spherical platform and got the movement going. From there added more visually appealing parts, points of interaction, and then animations between "pages".

Challenges we ran into

Using Blender was more difficult than expected. I had many issues with the React Three Rapier physics library, as well. My knowledge of both of these is limited so I spent more time than expected reading documentation. I also discovered some interesting bugs throughout the process, such as the inability to use click event on React-Three-Drei's Html component, which caused a major headache and resulted in me using the less visually appealing Text component.

Accomplishments that we're proud of

I completed what I had set out as the minimum viable product and more. While I plan to continue working on this project since I consider it to still be unfinished, I am quite proud of what I have done. I have seen websites like this and thought, "Wouldn't it be cool to be able to make something like that?" Well, I just did!

What we learned

What's next for Reimagining Web Navigation

Built With

• css
• gsap
• html
• javascript
• r3f
• rapier
• react
• three.js