Every 3D Artist Needs a Better Portfolio Site. Here's How to Build One.

A Step-by-Step Guide Using Claude Code, GitHub, and Vercel for Free

I have a one-in, one-out policy in my life.

If you buy a new shirt, you donate a shirt.
New hat, you gotta donate a hat.

My partner and I lived in tiny New York apartments for years where space was at a premium, and that mentality stuck.

My Actual Tiny Apartment on Dwell

We apply it to everything including subscription services. Anytime I want a new streaming service I need to deactivate another one.

So when I started hearing about Claude Code and everything it could do, my first instinct was…okay…it’s just another subscription. What am I giving up to make room for this one?

It turns out it was my website building/template services.

The setup

For a while I had been paying around $20 a month for a template-based website builder. It worked fine. Easy to update, looked reasonably professional, did the job. But I always felt a little trapped by it. Templated layouts meant there were things I could not do, visual decisions I could not make, and a general feeling that the site looked like everyone else’s site. Which, when your website is supposed to say something about your creativity and awesome artsiness…it’s a problem.

I have some web design background from earlier in my career, but I did not want to hand-code a full site from scratch. What I wanted was something in between: full creative control without spending a week wrestling with HTML. Claude Code turned out to be exactly that.

Step 1: figure out what you actually want to say

Here is where I think a lot of people go wrong when they try this. They open Claude Code and immediately start asking it to write code.

Before I wrote a single line of anything, I spent time thinking about what I actually wanted my website to communicate. Because at this point in my career, I am not just one thing. I spent 13 years as a Lighting Artist on various animated films. Then I made a pivot, moving into Adobe, building communities, writing this newsletter, consulting on 3D workflows for companies outside of entertainment. That is a lot of different threads to pull together into one coherent story.

So I sat with Claude and just talked it through. I told it about my background, what I do now, who I am trying to reach, and what I wanted people to feel when they landed on my site. I told it like it was a story. And it reflected it back to me in a way that helped me get clear on the message before anything visual happened. That clarity made everything that came after much faster.

Step 2: build the structure before you build the design

Once I had the messaging locked in, I asked Claude Code to build out the basic structure of the site as simple blocks, no images, no styling, just the skeleton. About section. Filmography. Newsletter. Community. Work with me. Contact.

It laid those out quickly and cleanly. From there I rearranged the order until the flow felt right, the way you would move cards around on a table before committing to a layout. I always learned in my creative endeavors to work broad shapes to fine detail and that’s what I was doing here.

Step 3: bring your brand in

I had done some brand work on myself previously, so I had a color palette, some background patterns, and font choices already defined. I put those into a folder, uploaded everything to Claude, and asked it to apply them to the structure we had built.

I also fed it a bunch of my newsletter articles so it had a sense of my writing style and could mirror the tone in any copy it generated. That was a detail that paid off, the site does not feel like it was written by a different person than the newsletter.

Step 4: be the art director

This is the part that separates creative professionals from people who just use these tools to generate generic output. Once I had a rough version, I started giving it specific creative direction.

No hard edges anywhere. I wanted everything to feel soft, so rounded corners on all the images and cards. My color palette has almost no pure blacks or pure whites, everything sits in the mid-tones, and I wanted that to carry through the whole site. I asked for subtle animations on the background patterns so things felt alive without being distracting. And I wanted the wave shapes to break up the sections instead of straight horizontal dividers, which gave the whole thing a more fluid, less corporate feel.

Claude nailed most of this on the first pass. Some things took a few rounds. I asked it to round the corners on my profile photo and it told me it was done. It was not done. Still square. I told it again. Different approach, still square. Third attempt finally got it. This is just the reality of working this way: sometimes it takes three or four iterations on a small thing that should be simple. But that is not different from the normal creative process, it is just faster overall than doing it yourself.

Step 5: the thing my old template could never do

One of the most frustrating limitations of my old website builder was that I could not get it to pull in my newsletter content in a meaningful way. The best I could do was drop in a link and hope people clicked it.

With Claude Code I was able to build a live feed that pulls my five most recent Substack articles and displays them directly on the site with titles, dates, and working links. Every time I publish something new, the website updates automatically. It is a small thing technically but it was completely out of reach with templates, and it makes the site feel connected to what I am actually doing rather than just being a static brochure.

Getting it live: GitHub and Vercel

Claude Code builds your site as a Next.js project and stores it locally on your machine. When you are happy with how it looks, you push the code to GitHub, which is a free version control platform that stores your code in the cloud. From there, you connect your GitHub repository to Vercel, which is a free hosting platform that takes your code and deploys it as a live website. The whole setup costs nothing beyond your domain name.

The stack:

Claude Code (Pro plan required) — builds and edits the site

Next.js — the framework your site is built on, handles all the technical structure

GitHub — stores your code and tracks every change you make

Vercel — hosts the site and publishes it live for free

Every time I want to make a change now, I open Claude Code, say I want to update my website, describe what I want, it updates the code, I tell it to push to GitHub, and Vercel automatically redeploys. The whole process takes minutes. Compare that to logging into a website builder, navigating their interface, trying to figure out which setting controls what, and hoping the template supports what you are trying to do.

When things went wrong

Claude Code is not magic and it is not a replacement for understanding what you are doing at a basic level. It’s not some magical AI wunderkin that will do everything for you.

Errors happened. Several times during the build something would break and I would get an unfamiliar error message in the terminal. My fix every time was the same: screenshot the error, paste it into Claude, ask what went wrong. It would diagnose the problem and tell me exactly what to change. That workflow saved me a significant amount of time and frustration. But you do have to be comfortable sitting in the discomfort of something not working and knowing that it is fixable, because it usually is.

There were also moments where Claude would confidently tell me it had made a change and the change would not show up on screen. Sometimes it had made the change in the wrong place. Sometimes it had applied the wrong property. Working through those moments requires patience and the willingness to describe what you are seeing in detail so it can course correct. Treat it like a creative collaboration, not a vending machine.

What I ended up with

The site is live at michaeltanzillo.com. Is it perfect? No. Is it the best website on the internet? Definitely not. But it is mine in a way that no template-based site ever was. The color palette, the soft wave shapes between sections, the tile patterns in the background, the film poster gallery, the live newsletter feed, all of it came from decisions I made. And because it is just code sitting in a GitHub repository, I can change any of it whenever I want.

by Aaron Fernandez

That last part is the thing I keep coming back to. My career has changed a lot over the years and it is going to keep changing. I was a Lighting Artist. Then I became a Department Head. Then I moved into workflow strategy and community building. My site needs to be able to reflect whatever version of me is most current, and now it can. I am not paying a platform $20 a month for the privilege of being limited by their templates while I figure out how to do that.

Should you try this?

Yes, if you have been looking for a reason to actually get into Claude Code, this is a great first project. It is contained, the output is immediately visible, and the stakes are low enough that mistakes are just part of the process. You do not need to know how to code. You need to know what you want your site to say about you, which is a question worth sitting with anyway.

If you want me to put together a proper walkthrough of the full process, let me know in the comments. I did not document everything as I went but I am happy to do a proper breakdown if there is interest.

---

---

Who Am I?

---

3D Merch is here and we have a new hoodie!

---

3D News

Massive: The crowd system created for The Lord Of The Rings is now available for free - LinkedIn

How Black Eye 2.0 is Rethinking How Video Game Camera Systems Work - 80.lv

Houdini AI Assistant v0.1.6 - LinkedIn

Apple’s Open-Source 3D AI Generation Is Here: LiTo - Reddit

World Labs releases new Image to Studio: How Magnific Turned 3D Into a Creative Workflow - WorldLabs.ai

---

3D Job Spreadsheet

Link to Google Doc With A TON of Jobs in Animation (not operated by me)

---

Hello! Michael Tanzillo here. I am the Head of Technical Artists with the Substance 3D team at Adobe. Previously, I was a Senior Artist on animated films at Blue Sky Studios/Disney with credits including three Ice Age movies, two Rios, Peanuts, Ferdinand, Spies in Disguise, and Epic.

In addition to his work as an artist, I am the Co-Author of the book Lighting for Animation: The Visual Art of Storytelling and the Co-Founder of The Academy of Animated Art, an online school that has helped hundreds of artists around the world begin careers in Animation, Visual Effects, and Digital Imaging. I also created The 3D Artist Community on Skool and this newsletter.

www.michaeltanzillo.com
Free 3D Tutorials on the Michael Tanzillo YouTube Channel

---

Thanks for reading The 3D Artist! Subscribe for free to receive new posts and support my work. All views and opinions are my own!