Foliofarer is an interactive 3D developer portfolio built with Next.js, React Three Fiber, Three.js and TypeScript, featuring an accessible career Atlas, local Passport progress and adaptive WebGL rendering.
Foliofarer is a web application created to make a real workflow clearer, faster, and easier to trust. It turns a focused product idea into something people can use, evaluate, and understand without needing to inspect the source code.
Why Foliofarer exists
A memorable 3D portfolio can hide the information recruiters need and exclude visitors whose devices, preferences, or assistive technology do not suit WebGL exploration.
The goal is not simply to add another tool. Foliofarer is designed to reduce the friction around that problem and give people a more dependable way to complete the work.
What it delivers
- Visitors can explore a 3D career world.
- Read the same professional history through an accessible document surface.
- Track local visit progress.
- Use the experience across a broader range of capabilities and preferences.
The experience
Foliofarer is an interactive 3D developer portfolio built with Next.js, React Three Fiber, Three.js and TypeScript, featuring an accessible career Atlas, local Passport progress and adaptive WebGL rendering.
The project brings the important parts of the workflow into one coherent experience. Its interface and behavior are shaped around the people using it, while the implementation stays focused on predictable results and honest feedback.
What to know
Every product has boundaries. These are the most important considerations for Foliofarer:
- Generated worlds must be deterministic enough for navigation and tests.
- Content must remain fully reachable without relying on 3D interaction.
- Rendering must adapt to reduced motion/data, viewport, connection, and device capability.
These limitations are presented openly so visitors can understand where the project works well, what it depends on, and what may change in future versions.
Current status
Publicly deployed. The current release demonstrates the core value of the project and the main end-to-end experience.
My role was product design and full-stack engineering, covering product workflows, data boundaries, and delivery. The related case study explains the decisions and delivery process in greater depth for visitors who want the engineering story behind the product.