J.AI Official (My Personal Portfolio)

Overview

This is my new personal portfolio website! Made with HTML, CSS, and JS, I tried to make it interactive (totally wasn't supposed to be an escape room) by using clues & riddles for my hobbies page. I will be refurbishing the visuals soon to make it feel more like an escape room! I’ll probably keep working on it forever because, like I said, it's my personal website! Future Feature Spoiler: The projects page will eventually include a Godot game. Check out #j-ai-official on Slack to stay updated (plus get more previews of my current and future projects)!ts)!

Why I Made This

Random story: the very first website I made was a pink portfolio back in 5th or 6th grade. I was so proud even though it was just basic HTML and CSS (no JS). That one got lost somewhere along the way, but I still remember what it looked like. It’s nice to see how my style has changed since then... the old one was pastel pink and floral, and now this one has a darker, spacey vibe with stars, haze, and little interactive details.

How It Works

The portfolio is built with HTML, CSS, and JS. Different pages have interactive features:

Hobbies page uses clues and riddles to proceed

Homepage has moving stars and haze animations and glowing text when hovered

Future projects page (spoiler above)

Challenges & Lessons Learnedrned

I struggled a bit with CSS and animations using JS... the stars weren’t moving and haze didn’t work exactly like I wanted at first, so there was a lot of debugging. I also kept forgetting colons, semicolons, and spaces in the CSS. Also wanted to add that this is the first time I used JS to make something like this (escape room). Through it all, I learned more about JavaScript, CSS, and making things interactive, and I had fun experimenting with my style.

Credits: obviously J-AI (me LOL).