My own site! - Stardance

Ship #1

I made my personal portfolio website! with a cool Minecraft-inspired style. The site uses an interactive inventory-style menu where you can explore my projects, interests, and favorites, with each section leading to its own page wooahh

The most challenging part was getting the layouts and positioning to work properly. I spent a lot of time fixing overlapping elements, aligning text, getting the navigation and interactive buttons working, and figuring out how to make everything look good across the page. I also added a swipeable gallery for my artwork and audio functionality.

I’m most proud of how much I learned while making it. The project took much longer than I originally expected, but I improved my HTML, CSS, JavaScript, GitHub, layout, positioning, and debugging skills along the way.

One thing YOU should know when testing the project is that the website is meant to be explored! Try clicking the different inventory items, scroll down the pages, and check out the interactive elements and artwork gallery. There may still be a few small things I want to improve in the future, but the main site is finished and ready to use.

4 devlogs
11h
Personal Site

Try project → See source code →

Open comments for this post

@pigeon_ on My own site! · 27 days ago

51m 26s logged

DEVLOG 4 FINISHED

YAY i’m done with the site, i think it came out pretty cool tho i will make few changes to it in the future since i feel like is quite empty on info about me idk, ANYWAY i’m going to ship it after i post this, i have a little idea of what i might make my another project but for now i’m taking a break, i will try to make more progress on my coding skills and maybe do few smaller side projects….

Fixes:

The info bar with my contact is always visible
Audio filename bug - Changed from URL-encoded format to proper filename ‘Mitski - Washing Machine Heart [1].mp3’
Audio listener leak. Added removeEventListener call in the stopAtEnd function to prevent multiple listeners from accumulating if audio plays multiple times
Better error handling. Added console error logging for audio playback failures
Made all the layouts bigger so fill more of the page

Added:

A “scroll down” text so is more clear where to find what

BYE BYE

Open comments for this post

@pigeon_ on My own site! · 28 days ago

3h 11m 15s logged

DEVLOG 3 hello hello

ladies and gentlemen im almost done

i totally didn’t get super lazy for like half a month on this but I locked in today so, also i’ve been reading others’ devlogs and i think i managed to find a nice way to write these (in google docs here i am).

heres what i did today:

Made two new layouts
I made a layout for “Interests” and “Projects”, i really wished I could make them much more interactive but oh well.
Made a cool left-right swipe showing all my fav art of mine in the Interests layout.
IT TOOK ME SO LONG TO FIGURE OUT, i don’t know why i couldn’t get the buttons to work, it was a pain but i finally did it and i think it turned out okay?

What i fixed?:

Overlapping layouts
The layouts would appear randomly and in wrong places, and it was a PAIN, i really wanted to fix these..

What im planning to do:

Go through everything to make sure there aren’t any bugs i need to fix
Add anything that can make the whole site more me or easier to understand
Make any last changes/finishing touches YAY

I thought this would take me a few more weeks to finish with my slow learning… I’m actually surprised I managed to almost finish the thing today. I don’t have anything planned for after i ship this project, and school starts soon, but i really want to make something actually cool and something i won’t want to abandon in a few weeks, my older bro makes so much cool stuff and i wanna be cool too sooooo

Open comments for this post

@pigeon_ on My own site! · about 2 months ago

2h 34m 28s logged

devlog 2
YAYAYYA still trying to find a cool style for these devlogs since I kinda sound like an NPC rn someday I’ll figure it out but today is not that day ANYWAYYAYAY
I fixed the layout and added a cool Minecraft style inventory option, where the user can click on one of 4 items to explore different parts of the site here’s how I labeled them:

pickaxe = skills
crafting table = projects
ender chest = interests
flower = favorites

when the user clicks one of them, they get teleported to a whole new page dedicated to that topic. I already sketched out all the pages in ibis pain x and I’ll start actually building them soon
ALSO can we talk about how much of a noob I clearly am. this project is supposedly a 2 hour project and I am currently sitting at almost 8 hours in, and I haven’t even finished the FIRST page yet. what is happening to me
ANWYAYWY should I add a random creeper that walks along the bottom of the main screen and explodes when you click on it?? that’s exactly the kind of sht that’s been eating my time, im too funny

Open comments for this post

@pigeon_ on My own site! · 2 months ago

4h 1m 10s logged

I’m working on my own site yay! Today I built the basic web structure, then started playing around with the layout. I want it to be in a chill Minecraft-y style with cool interactive pages, so it’s actually fun to read/explore.
It took me forever to get the text right, I swear I crashed out I don’t even know how many times lol. Either way, I worked on it until like 2am, annnd tomorrow I want to start on interactive stuff and animations! I really want to animate a little cute chicken walking at the bottom of the site lol.
That first page took me SOOOO long… I was struggling a lot with getting the site to actually work with GitHub in the first place, but I managed to figure it out after like an hour and a half of messing around 💀ANYWAYYYY I’m actually so excited to build this. I made a sketch on paper of how I want everything to look, and it’s so cool comparing it side by side with the actual design coming together yayyy