I created this project to showcase my work and also some of the technologies/techniques I have learnt in the past years.
I wrote more about the challenges of the development in a behance project
Thank you!
18 Likes
First of all:
Super pretty and atmospheric.
Second of all - after running the page on Chrome on a 2015 MBP, at quite a smooth framerate (40fps) and no unnecessary fan noise - I’m still getting this warning at the beginning 
3 Likes
Thank you mjurczyk!
It is very helpful feedback and also somewhat of a relief, because I have seen about 15% of visitors getting the slow browser notice in the analytics and couldn’t really pinpoint why it is performing so poorly. But now I guess some of it was just similar false alarms. I need to refine my performance detection logic. Thanks!
1 Like
That’s absolutely amazing! Really responsive on mobile!! How did you manage to get the dof to work with the animated cat? Are they rendered to different scenes? Was it problematic? Really cool site dude!!
1 Like
Hi forerunrun!
For postprocessing I used vanruesc’s library. The cat is a gltf model with animations. I had no issues getting the dof and the animated model working together in a single scene, no special logic needed, it just worked. Thank you!
2 Likes
Hey logartis!
Thanks for the reply, I was having this problem when implementing the standard three library dof
I’ll give vanruesc’s library a try and let you know how it works 
thanks for the tip!
Very nice and complete demo,
Like the choice of ambiance, sometimes was wondering if birds were coming from outside or my PC 
Seems like you live in nice place ^^
@Lawrence3DPK
Let me know if you run into problems and I will show you my setup!
@Etienne
Thank you
@mrdoob
Really appreciate the tweet! I was already incredibly grateful for you and the contributors for making webgl accessible for us regular folks, but now you even got me some pretty good job offers:) I’m really humbled!
1 Like
I have just started to learn Three.js , And you my friend made me amaze !!! This project is really good, I dont know if you like sharing step by step explanation of your projects, People even can pay for this kind of tutorial… Good job !!!
1 Like
Hi logartis,
nice demo. Indeed when using the Intel integrated graphics it is slow, however, with NVidia 960M (XPS 9550) is running fine (small noise in some cases). Have you tried the render-on-demand of three.js?
I am researching what actually artists would like from web 3D technologies. The following link (https://forms.gle/hHcMxr5C8rP3jaEZ7) is a questionnaire towards this goal targeting for artists, designers, journalists or any other professional, semi-pro, or amateur creator of media art. It is performed in order to find requirements to be developed and implemented in a new system (namely a WordPress plugin that incorporates three.js). Also there is a competition, one person will earn 3 images or vectors or illustration graphics from Shutterstock as long as it fills-in his/her email.
Questionnaire full link: https://forms.gle/hHcMxr5C8rP3jaEZ7
Powered by Google Forms
An beta version of the plugin can be found in https://vrodos.iti.gr
Best,
Dimitrios Ververidis (jimver04)
That’s great! 
1 Like
Wow, that was a awesome webgl experience.
May i know how the camera movement is synchronized with scrolling ?
In my recent project, i had the camera position controlled with Gsap Scrolltrigger. it worked good but required lots of work to position the camera for each sections. Another approach i came across was update camera position smoothly along CatmullRomCurve3 which can be defined within your model in blender. That approach didnt work as expcted in certain situation.
Just curious if there is differenct approach to handle camera movement on scroll ?
Thanks!
Thanks Sameer,
No magic in my setup either, I actually do have predefined states for the camera that are controlled by gsap’s ScrollTrigger, so very similar to your first try.
1 Like
Nice one,
Camera setup is quiet tiring but the end result is worth it.