←

Portfoli-oh!

Less Boring, More Exploring
Background Image 1
Background Image 2
Background Image 3
Background Image 4
Background Image 5
Background Image 6
Background Image 7
Background Image 8
Background Image 9

HTML/CSS JavaScript GSAP Three.js On-device AI, NLP

Jun 2025 - Jul 2025


Figma
VS Code
GSAP
Transformers.js
Fuse.js
Compromise.js

Vercel / GitHub Pages
QR Code for Live Project

D E S I G N

Animated GIF showing a wireframe morphing into the final high-fidelity mockup
GIF cycling through multiple pages to show consistent design language

Storytelling GIF showing the problem of a small cursor and the solution of a custom cursor with micro-interactions
Figma prototype GIF demonstrating the user flow of the highlighter feature
Initial rendering test of 3D effects
Smooth transition between dark and light mode
Mobile responsive design mockup

GIF demonstrating the full functionality of the interactive highlighter, including persistence after refresh
GSAP animation code for scroll-triggered effects

Lighthouse performance report showing a 97 score

GIF of the custom cursor moving and interacting with elements

Live demonstration of the AI chatbot feature (GIF)
GIF showing the full journey from highlighting text to generating a message draft

GIF demonstrating the instant language switch between English and Korean
Diagram of the modular front-end architecture
Screenshot of meaningful Git commit history
Accessibility contrast check passing
Diagram of deployment process to Vercel/GitHub Pages