My new online portfolio, with many Threejs animations

Showcase
1

Hello everyone,

I just published my new website/portfolio, made with Threejs and Reactjs.

Many thanks to this forum/community, where I could find solutions for all the problems I encountered. This is my first real website, and the first time I do such an intense use of Threejs.

This is the link: https://kesson.io

I consider it more a laboratory where I do experiments, so it changes constantly, that’s why any feedback will be highly appreciated (do your worst!).

Thanks!

2 Likes
2

You website gave chrome a blue screen of death :sweat_smile:

ss
ss701×561 14.3 KB

On the second attempt, it loaded and looks great. I had some issues with viewing it though:

  • I tried to load it twice on my mobile (Firefox android) earlier this morning, and all I got was text on a black screen, no 3D effects. While writing this I tried again, and this time on the Hades screen I finally got some swirls, but then when I scrolled up and back down again they were gone. Every other page was just text on black.
  • On my laptop, the image on the main page shows up only erratically. It took about a minute to appear (just text before that), then I scrolled down and back up and it’s gone. Loads of errors in the console too:

err
err1007×785 50.8 KB

  • I found the navigation fairly unintuitive. Where it says “Click and drag to navigate <–>”, clicking and dragging doesn’t appear to do anything. On mobile while trying to get things to work I found I was making the screen scroll up and down rather than doing what I wanted.
  • Your website is the first one I’ve ever encountered that tells me I’ve done something wrong by resizing the screen. Showing a fake Windows bsod, guaranteed to raise the heart rate of any windows user who has unsaved work, maybe it’s a bit aggressive :stuck_out_tongue:

Overall I like the design a lot but these technical issues made it hard for me to view the site.

3

Hi, thanks so much for the great feedback :slight_smile:

I didn’t get any of the errors you got, not sure what could cause it. I tested it on any browser on both Android and Windows (Chrome, Brave, Opera, Firefox, Edge, and on Android also the AOSP browser, the Xiaomi browser and the Samsung browser), without any problem. Surely on some browsers to loading of the videos in the first screen is slower than others (Firefox is slower than Chrome in that), but the website was working quite good. Also I got the test it on Safari on a Macbook Retina, no problems, and on iPhone XR as well (also here, only the videos of the main section were slow to load and sometimes Safari was even blocking them for some reason).

These errors also, they don’t appear on my console on any machine I tested. Are you using any extension that might block the content? Like extensions for blocking scripts or privacy focused. Would be good to know if there is any complication in using these with the website. Also, the combination of OS/Browser would also help, of course only if you want to say it!

Despite the bugs, thanks for the feedback. Being my first real website that I also designed, is quite a relief. I might increase the sensitivity. And also, I might consider to change the BSOD with something else :sweat_smile:

4

I think if you just made it another color it’s fine. Or keep it and surprise anyone who rotates their phone haha. Even better would be to handle resizing properly though.

Testing it again on Chome windows with extensions disabled. I still get all the same errors and I haven’t been able to get the image on the main screen to load again. The black particles on subsequent screens work well though.

5

I guess at this point could be something related to the network. I don’t have any problem on any of the machines I tested (apart of a couple of warnings that I am trying to handle), even though on 4G connection the main screen videos are slower to load (but after waiting a little bit it works).

I will investigate this issue anyway, thanks so much for the feedback!

1 Like
6

My general observations…

On firefox I got a warning saying its taking too long to load - id say this would put a lot of poeople off, not just because of the load time but because (in my mind at least) it makes the site look suspicious

Overall performance could be improved

The particles that follow the cursor are off putting and look like they are added just because you can - rather than them being functional

The landing/home image doesn’t really explain what the site is about and I missed the scroller mouse icon as it flashes in and out, so wasn’t obvious what to do.

On your doodles click and drag isn’t a natural interface for a slider (i think there should be buttons)

You’ve got to make it responsive

7

This works and loads fast on my iPhone.