Explore

ITom — Creative 3D Portfolio

PRO
Screenshot of ITom — Creative 3D Portfolio
Creative StudioPublished
  • 3D
  • Animation
  • Light
  • Minimal
  • Monochrome
  • WebGL

Palette

Typography

  • Primary

    Inter
    Weights
    400, 500, 600, 700
    Fallback
    Arial, Helvetica, sans-serif

  • Secondary

    Unknown
    Weights
    600, 700
    Fallback
    Use a condensed, hand-outlined display treatment over a sans-serif base.

About this design

An immersive monochrome developer portfolio that turns navigation into a pencil-sketched 3D journey: a house facade, a long gallery corridor, interactive doors, and a floating project-display room.

Prompts

Pro access

Six prompts, in build order. Pro unlocks all six, ready to paste into your AI tool.

  • Main build prompt
  • Build frontend
  • Generate assets
  • Add animations
  • Responsive polish
  • Final visual polish

Build Recipe

Framework

  • React
  • Vite
Agent
Claude Code
Model
Claude Fable 5.1This reconstruction depends on a carefully art-directed WebGL walkthrough, bespoke sketched 3D assets, depth fog, camera choreography, and a legible DOM overlay system.

Creative tools

  • Recraft
  • Nano Banana

Libraries

  • Three.js
  • @react-three/fiber
  • GSAP

Special requirements

WebGL scene at a wide 1.98:1 stage; hand-drawn architectural texture set; low-poly interior meshes; camera-led navigation; depth-fog tuning; irregular paper detail panels.

AI Replicability

86 / 100

The visual system and observed camera progression reproduce reliably with mature WebGL tooling; the main remaining challenge is creating a coherent, original hand-drawn texture and mesh set with convincing spatial depth.

Main remaining challenge

Making every wall, floor, prop, doorway, and monitor share one convincing hand-inked perspective language while preserving readable depth and smooth movement.

Credits

Featured for design inspiration and analysis.

Are you the designer? Claim this workRequest removal

Original website, branding and assets remain the property of their respective owners. Content policy

Design analysis

Pro analysis

Understand why the design works

The written breakdown of this design: composition, hierarchy, spacing, imagery and the decisions behind the details — the part that tells you what to keep and what to change.

Upgrade to Pro