Hello, I’m Daiki Fujita, a designer primarily based in Tokyo, Japan. On this case research, I’ll stroll you thru the making of my 2025 portfolio.
Background
This mission started with two motivations: reaching my 10-year milestone as a designer, and eager to create a platform to showcase my work extra brazenly.
Once I considered my roots as a designer, I appeared again to my childhood. My household ran a small electronics store, and I used to be given a PC at an early age. I bear in mind spending hours drawing with the Paint software on Home windows 95. That sense of pleasure and pleasure—with the ability to make photos on a pc—stayed with me. For this web site, I wished to seize that feeling and join it to the idea of “Summary & Concrete.”
Overview
In as we speak’s world, the place digital know-how evolves so shortly and data is consumed instantly, I wished to deal with speaking solely the necessities. That grew to become the axis of the idea: balancing abstraction and concreteness.
To embody this visually, I saved the design minimal: solely two colours, and components primarily based on factors and planes. These grew to become the muse for 3 expressive kinds—particles, pixel artwork, and mosaic artwork—unifying the environment of the positioning and creating an immersive expertise.
For this web site, I made a decision to experiment with Framer, which I had been inquisitive about for a while. The consequences and animations have been developed as authentic code parts in React.
Design Method
Particle
To specific the thought of “seeing, touching, and feeling” every mission, I used particle-based interactions. For each work, I created a key object and remodeled it into particles.
These particle components have been constructed with an initially developed code part. Attributes comparable to particle rely, dimension, shade, place, and the diploma and vary of mouse pointer interplay can all be adjusted—and lots of different properties as effectively—by the GUI. Including or updating works is designed to be easy—simply add an SVG.
This web site is my private portfolio, and every mission featured here’s a crystallization of my very own work, expressed by the morphing of key objects. As well as, I enhanced the sense of immersion by including a background impact the place a particle-constructed house appears to warp dimensions as you scroll.
2D Graphic Results
To bolster the visible id, I included graphical results fabricated from planes. These seem throughout web page landings and transitions, giving the positioning a constant environment.
Mosaic Results
For mission content material, I used a pixel-reveal impact. By steadily visualizing the work, it sparks curiosity and invitations viewers to cease and interact extra deeply.
Subliminal Components
The weather that flash randomly for a break up second are inorganic in form. They don’t carry that means on their very own, however they’re meant to boost a query: “In an age the place data disappears instantly, are we actually greedy its essence?”
Hidden Particulars
I didn’t need the positioning to only really feel modern and trendy. So I added playful touches—like eyes that observe the cursor, or components that go to sleep if left idle. I’m at all times sleepy.
The Tech Stack
- Frontend: Framer, React
- CMS: Framer CMS
- Design: Figma, Framer
Closing
Thanks a lot for studying!
Creating this portfolio allowed me to reconnect with the identical pleasure and pleasure I felt as a child, drawing on a pc for the primary time. I poured that feeling into the positioning, and if guests can really feel even a bit of of that pleasure by this web site, I’d be really completely happy!
