mltartstudio.com
Side project completed
Designer & Developer · 2023
Mobile-friendly portfolio site I built and deployed to showcase a relative's art. Features filtering, optimized image loading, and an image carousel viewer.
#React#TypeScript#Next.js#Tailwind#Cloudinary#Vercel
What I built
- Filtering by medium — paintings, drawings, mixed media, etc. A simple set of chips at the top of the gallery; URL-synced state so a filter view can be bookmarked or shared.
- Optimized image loading — Next.js
<Image>for automatic responsive sizes and lazy-loading. 100+ pieces stay fast on slow connections. - Carousel viewer — tap any piece to open a focused viewer with keyboard navigation, swipe on mobile, and metadata (title, year, medium) inline.
- Mobile first — the layout, navigation, and viewer are designed for a phone before scaling up.
- Image delivery via Cloudinary — original artwork photos are hosted on Cloudinary, which serves resized, format-optimized (AVIF/WebP) variants on demand. Combined with Next.js
<Image>, this keeps 100+ high-res pieces fast to load without storing multiple manual copies of each image.
Stack & deployment
React + TypeScript on Next.js, styled with Tailwind. Images are hosted and transformed on Cloudinary rather than bundled with the app, so uploading a new piece doesn’t require a redeploy. Deployed on Vercel with automatic preview URLs for changes.