Live

3D Creator Portfolio

Animated Personal Portfolio for a 3D Designer

React 18ViteFramer MotionTailwind CSSGoogle Fonts (Kanit)Vercel

📋 Project Overview

⏱️

Timeline

6–8 weeks

🧠

Type

Self-initiated concept

⚙️

Tech Stack

6 technologies

🔴 The Problem

Freelance 3D designers and motion artists need a portfolio that doesn't just list their work — it has to feel like their work. Static image grids fail to communicate the energy and craft of motion design.

✅ The Solution

A single-page, scroll-driven portfolio for a freelance 3D creator featuring character-by-character text reveals, a parallax motion reel gallery, sticky stacking project cards, and a magnetic hero illustration — all designed to feel as dynamic as the work it showcases.

🚀 Key Features

Full-viewport hero with magnetic cursor-following character illustration

Scroll-driven character-by-character text reveal in the About section

Dual-row parallax gallery (rows scroll in opposite directions) showcasing 20+ motion design previews

Five services with giant numbered list layout (3D Modeling, Rendering, Motion Design, Branding, Web Design)

Three sticky stacking project cards with scroll-driven scale animations

Single gradient CTA button (deep purple → magenta → orange) used consistently as the sole accent

Fully responsive with Tailwind CSS utility-first layout

🏗️ Tech Architecture

Frontend

React 18Tailwind CSS

Other

ViteFramer MotionGoogle Fonts (Kanit)

Cloud

Vercel

💼 Business Value

Communicates creative capability through the medium itself — the site IS the portfolio piece. Potential clients experience the designer's motion and interaction sensibility before viewing a single project, dramatically increasing perceived quality and conversion.

⚡ SEO & Performance

🔍

Server-Side Rendering

Built with Next.js SSR for maximum SEO. Every page is fully rendered on the server so Google indexes all content immediately.

📊

Core Web Vitals

Optimised for LCP, FID, and CLS. Images are lazy-loaded, fonts are preloaded, and JavaScript bundles are tree-shaken.

🏷️

Structured Data

JSON-LD schema markup included for rich snippets. OpenGraph and Twitter Card metadata for social sharing.

🔮What I'd Build Next

v2 feature ideas — where this product could go next

Real-time collaboration features for team-based workflows

Native mobile app with offline-first architecture

Advanced analytics dashboard with predictive insights

Dog Studio

GenieNow