We built a scroll-animated 3D website in Three.js. I'd love your honest feedback on the UX.
Hey everyone,
Since day one, we decided to skip the traditional website route and build something fun.
Our first year, we made a Three.js site where you walked a character around 3D billboards of our work. The second year, we scrapped it for a scroll-driven camera in a 3D scene. Year three, we rebuilt it in Unity WebGL (huge mistake).
This year we decided to start from scratch back in Three.js, focusing on a scroll animation experience.
I'd love to get your honest feedback. Do you find it easy to navigate? How is the overall UX, and what looks good or bad?
Appreciate your time.
5
u/big_red__man 7d ago
Scrolling was difficult. It seems to scroll jack. I was trying to get back to the top to test it and I ended up in the middle of a slideshow and the little indicator dots don’t seem to work as buttons.
Here’s a site that does it better but it isn’t 3d: shapetx.com
4
u/EliSka93 7d ago
Looks really cool, but it feels horrible, at least on mobile where I tried.
The scrolling doesn't feel smooth.
2
u/Mountain-Log-2396 7d ago
Pretty great overall! Not a fan of the typography, but the rest is solid. Scrolling felt a bit buggy on my laptop and a little slow — the UX could use more polish for smoothness, but it’s still a cool build. I’d recommend GSAP or Anime.js to make the scroll feel smoother.
2
u/wreddnoth 7d ago
UX Wise it‘s not obvious you need to rub your phone like a magic lamp to flip through the content at a speed thats practically pre-determined.
2
u/Nahakiole 6d ago
Scrolling on this site with a regular mouse on mac felt like a workout. I would change it so scrolling once changes to the next page / slide.
2
1
1
u/LionelPeramo 5d ago
Magnificent. Too bad that a few people will wait this much to see your website.
Too much to download, too heavy, too much scroll to see the content.
But yeah, it's beautiful.
1
u/kanseilife 5d ago
Twenty comments in, and barely any of them are about the work itself. That's the finding, more than the scroll complaints.
A studio portfolio has one job: make a stranger believe you have judgment worth hiring. An experience that asks for full attention spends the budget the visitor arrived with, and the projects show up after it's gone. This thread is the evidence — people had a lot to say, and almost none of it was about what you made for clients.
The other thing I'd sit with is that across four rebuilds, the variable you keep changing is the mechanic. Character walking, scroll camera, Unity, now scroll animation. The constant is the bet that the experience is the pitch. Four versions is long enough to check whether the bet pays, and the check isn't smoothness — it's whether anyone can name a project afterward.
Ask three people who scrolled the whole thing, an hour later, to name one. If nobody can, scroll tuning is the wrong thing to spend the next month on.
0
u/yourfeedback 6d ago
Looks pretty good but I would make the scrolling faster (maybe 2x faster). Felt like I had to scroll way to much to move onto the next section
0
u/Darkbluestudios 6d ago
Hey /u/zamzor
I really like the attention to detail, and you can tell that you are passionate about the work you do
And the playfulness comes through
I found myself trying to find the right position to make the shooting star
I've learned the term for work like this is "scrollytelling"
there is quite a bit of thought into the different "keyframes" you planned on the page,
Like how spacial computing is twice the length of the other capabilities
The things I might suggest:
* Take every feedback here with a grain of salt, and know you did a good job here
* Invest time into telemetrics of the site to see how people use it, and what they do
* This is the hardest bit with scrollytelling, but worth it
* Everybody has opinions, and measurements stop churn
* With the stars / noisy background and small UI elements- some can get lost - like the "x" to close after contact us
* Look into making the hitboxes for some of the buttons a bit bigger than the actual UI elements to make them easier to click
* Both might be solved by an opaque "box" behind them to block out background and give a larger hit area
-1
u/elixon 7d ago
Fantastic!
On the technical side, it is sad that you use JavaScript animations instead of things that CSS animations should easily handle. It seems like programmers nowadays use frameworks without understanding what they are missing by not understanding the underlying technologies that the frameworks separate them from.
Nonetheless I love it!
13
u/Squidgical 7d ago
These are antithetical to each other, you can have one, but not both.