Júlia
Lab Projects
← All Lab projects

Portfolio v1

Live prototype

This is my first digital portfolio.

Initially, I was supposed to open Framer and do my best at cropping and chopping, but fate had other plans: a 1-month free Pro offer from ChatGPT.

Tool Stack Codex (ChatGPT), GitHub, Cloudflare, GoDaddy, Pinterest

Timeframe 2 weeks (because I was very picky)

Happy about the result Yes, pretty much

The Idea

My first thought was that this couldn’t be like other portfolios, it needed to be wow, fantastic, animations, colourful, explosions. I soon realised that I needed to take my horsey out of the rain (if you’re portuguese you’ll know what i mean).

Looking back, I should have taken more screenshots and saved reports while I still had company access, this would have helped with the visual part of projects. To start, I did some research for inspiration and came to the following conclusions about what I wanted:

  • Scrapbook/journal vibes with lots of stickers and cool things
  • Dark and mysterious because that matches my personality (noooot but there were great examples that had a dark setup)
  • An insane amount of animations and transitions between content
  • Colourful images and resources that pop (here the non-existing screenshots would come into play)
  • A section for the AI projects and a digital garden to post random articles so I can showcase my copywriting skills without doing it on LinkedIn
  • A DJ

I really looked at this list and said there’s nothing contradictory here. And then Ctrl+V it into ChatGPT.

Building Portfolios 101

It took 2:47 minutes to have the first version.

To say that I was impressed was the least, I’ve seen other projects being built but most were very recognisably AI-made (the typography, the eyebrow titles, the lines). This actually took my requests into account and mashed them into something visual.

First version, it kept the folder idea pretty clearly

It was technically a scrapbook, but more like one that had been through a tornado and then flattened out. Was it usable? Debatable.

I spent a while going back and forth with prompts like “make it just a bit less chaotic,” followed by “it’s too flat and boring make it pop.”

Some experimentation with sections on the sidebar

Now, I’m no designer. But I think they also get the feeling that after some time looking at the same thing, you wake up one day and decide you hate it. So I decided to scrap everything and start fresh.

No vertical scrolling, no side sections, the whole thing should feel like a place, not a page.

Portfolio experiment with flying cats against a blue sky
I thought the cats might fit the vibe
Portfolio experiment set in an underwater aquarium
An interactive aquarium, you could feed the fish

For the final and current design, it ended up adding the “make yourself at home” line I had before, next to the chair, and that was the this works moment. I even like it more in the mobile version since the chair stays in the middle.

The final portfolio homepage with green hills and a chair
Mobile version of the current version

Although the more I look at it, the more Bad Bunny and Windows vibes I get… welp.

Extra things I ended up adding:

  • The DJ i wanted, more like a music player really, the song pick isn’t exactly there yet
  • Closing tabs animations, genie effect
  • A dark mode where the background setting goes from day to night
  • On the Say Hello, the “No ฅ^•ﻌ•^ฅ” button runs away from you if you try to click it
  • 3 (three, wow so many) moving clouds

Replacing the Lorem Ipsums

After setting the placeholders, it was time to fill them out. All while pushing the thought that I’ll probably be the only one to ever read it (good thing that the goal of having a portfolio is to have a place to keep things).

The actual content took more time than I planned. I wrote it from scratch, so it keeps my tone and vibe. Not to mention that there were always some last-minute details that popped up.

My compromise was doing the main important content first (about me, full CV, marketing work with 2 featured projects) and then working on the rest. I knew that if I wanted to launch the website until I had everything written, the timeline would jump to a month.

Putting it live was the easy peasy part: just paste the text into the chat, check the preview, make any adjustments and ask the GitHub plugin to do the updates.

I thought about having a CMS for this part but I’m not in THAT content flux, so this workflow works.

About the Domain juliacoded.com

I did some search on what I wanted, ideally just “julia”, “juliaa”, “juliaaa” would be golden but cool domains don’t work like that.

Not to mention that any more “a” and you go from ahah cute to hmmm that’s enough slices.

Other options included: itsmejulia, juliaworks, juliamarketing, juliavibes and many I don’t remember searching.

In the end, juliacoded served the two purposes I wanted, showcasing things i built into existence and things that make me, me.