# Scroll-driven 3D résumé

**URL:** <https://discourse.threejs.org/t/scroll-driven-3d-resume/93373>\
**Category:** Showcase\
**Tags:** portfolio-website, 3d-character, animation\
**Created:** [August 8, 2026, 8:45am UTC](https://discourse.threejs.org/t/scroll-driven-3d-resume/93373 "2026-08-08T08:45:46Z")\
**Posts on this page:** 2\
**Page:** 1

<div class="post-metadata">

**Author:** ![yuesheng\_zheng](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/yuesheng_zheng/32/71097_2.png) [@yuesheng\_zheng](https://discourse.threejs.org/u/yuesheng_zheng)\
**Post date:** [August 8, 2026, 8:45am UTC](https://discourse.threejs.org/t/scroll-driven-3d-resume/93373/1 "2026-08-08T08:45:46Z")

</div>

Hi all — I built my personal site as a scroll-driven 3D scene, and open-sourced the whole thing.

**Live:** [https://about.senbuzy.com/](https://about.senbuzy.com/)  
**Source:** [GitHub - dayinji/sen-3d-resume · GitHub](https://github.com/dayinji/sen-3d-resume)

 ![截屏2026-08-08 14.47.38](https://canada1.discourse-cdn.com/flex035/uploads/threejs/original/3X/f/d/fdc4f3837f229dfdf58d3fa2ba552b8f7b53de2c.jpeg)

Stack: three.js, React Three Fiber, `@react-three/postprocessing` (DOF → Bloom → SMAA), framer-motion for the HTML layer. Pure static SPA, no backend.

The repo is MIT and set up to be forked as your own résumé — the résumé entries, works list and per-work markdown are all data files, and there are step-by-step tutorials for swapping in your own character model and deploying.

Happy to answer anything about the baked-camera approach.

---

<div class="post-metadata">

**Author:** ![PavelBoytchev](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/pavelboytchev/32/38639_2.png) [@PavelBoytchev](https://discourse.threejs.org/u/PavelBoytchev)\
**Post date:** [August 9, 2026, 1:49pm UTC](https://discourse.threejs.org/t/scroll-driven-3d-resume/93373/2 "2026-08-09T13:49:44Z")

</div>

The noise looks strange on my side, but it may be an intended artistic style.

 ![image](https://canada1.discourse-cdn.com/flex035/uploads/threejs/original/3X/f/8/f87f5343577f459f7af100a1f6abb262a8fbaa4b.jpeg)

 ![image](https://canada1.discourse-cdn.com/flex035/uploads/threejs/original/3X/d/0/d0b295ec7fc717205405afbdfaf04ec5645702cf.jpeg)