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 desirous to create a platform to showcase my work extra overtly.
After 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 keep in mind spending hours drawing with the Paint software on Home windows 95. That sense of pleasure and pleasure—with the ability to make footage on a pc—stayed with me. For this website, I needed to seize that feeling and join it to the idea of “Summary & Concrete.”
Overview
In right this moment’s world, the place digital expertise evolves so shortly and data is consumed straight away, I needed to give attention to 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 inspiration for 3 expressive types—particles, pixel artwork, and mosaic artwork—unifying the ambiance of the positioning and creating an immersive expertise.
For this website, I made a decision to experiment with Framer, which I had been inquisitive about for a while. The results and animations have been developed as unique code elements 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 reworked it into particles.
These particle components have been constructed with an initially developed code element. Attributes equivalent 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 website 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 ambiance.
Mosaic Results
For mission content material, I used a pixel-reveal impact. By regularly visualizing the work, it sparks curiosity and invitations viewers to cease and have interaction extra deeply.
Subliminal Components
The weather that flash randomly for a cut up second are inorganic in form. They don’t carry which means on their very own, however they’re meant to lift a query: “In an age the place data disappears straight away, are we actually greedy its essence?”
Hidden Particulars
I didn’t need the positioning to only really feel smooth and trendy. So I added playful touches—like eyes that observe the cursor, or components that go to sleep if left idle. I’m all the time 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 might be really pleased!
