Beyond Games
Selina — Art Portfolio
A portfolio for a painter, with a walkable 3D museum next to a classic gallery.
- Role
- Solo · Design & Development
- Year
- 2026
- Built with
- Next.js · TypeScript
- Next.js 16
- React 19
- TypeScript
- Three.js
- React Three Fiber
- Tailwind CSS 4
- Vercel
- Claude Code
Highlights
- Built a walkable 3D museum — entrance, main hall and a works-on-paper room — where the paintings hang
- Paired it with a classic gallery and one shareable page per artwork, both read from the same data
- Wrote an image pipeline that turns a photo of each work into web, texture and thumbnail versions
A portfolio website for Selina, an artist who paints and draws by hand on canvas and paper. I designed and built it.
The brief. The work should be seen the way it is meant to be seen — on a wall, in a quiet room — but a portfolio also has to be quick to browse and easy to share. One site had to do both.
The design decision. The site has two ways in that share one source of data. The exhibition is a walkable 3D museum: you move from the entrance into the main hall and on to a room for works on paper, and each painting hangs at its real proportions under gallery lighting. The portfolio is the classic version: a grid with category filters, featured works and an indexable page for every artwork. Nothing about a painting is written inside a component, so adding a work updates both at once.
How it is built. Next.js with React, TypeScript and Tailwind CSS; the museum is Three.js through React Three Fiber. Selina adds a work by dropping a photo into a folder and running one script, which crops it and creates the web, texture and thumbnail images. There is no backend or paid service — it deploys to Vercel as a static site.
What carried over from games. The museum is level design on a small scale: sightlines, room order and lighting decide what the visitor looks at first, which is the same thinking I use when laying out a game space.