You are browsing as a guest. Sign up (or log in) to start making projects!

sp09

@sp09

Joined June 4th, 2026

  • 7Devlogs
  • 2Projects
  • 1Ships
  • 3Votes
Ship

I built a personal portfolio website to showcase some of my technical experience and projects with who I am as a person and hobbies. It was made using HTML, CSS, and JavaScript and has a video montage giving glimpses into some important things in my life, animated navigation bar, an experience timeline, projects, my tech stack, and a contacts section.
I don't usually make very nice frontend UI so the biggest challenge for me while making this was to make the site dynamic using static HTML, CSS, and JavaScript. There was a lot of coordinating where the user was in terms of scrolling and making sections pop up. I'm most proud of the project gallery since it's interactive so anyone viewing it can get more information about projects that interest them while still staying on the website and not being overwhelmed with just pure code.
Since this is a static website, to test, you can open index.html directly in your browser or run a local server.

  • 7 devlogs
  • 10h
Try project → See source code →
Open comments for this post

2h 23m 59s logged

I added popup cards for each of my projects. They’re all arranged in a grid, but I wanted a way to get more information about each project quickly. It basically adds a popup card when you click on each project that lets you scroll through each image, read a short description, figure out what tools were used, and go to the GitHub repo for even more information.

0
0
2
Open comments for this post

1h 50m 26s logged

I did a bunch of little changes in color and theme that I won’t bore you with here but I did have one major update. I finally created a tools/technologies stack that continuously scrolls in two rows. I was actually inspired by how Hack Club has scrolling displays for their prizes on an event homepage.

0
0
1
Open comments for this post

1h 35m 25s logged

I finished the about me section of my website! This honestly should’ve been done earlier but I was too lazy. Anyways, it features some personal info about me along with a picture and that’s basically it. I’m thinking of removing my email from there since I have a dedicated contacts section at the very bottom of my page now as well with my email, LinkedIn, and Github. The next and probably final section to add will be tools and technologies.

0
0
3
Open comments for this post

1h 38m 22s logged

I know you can’t really see it in the picture but I added transitions to my website. Nothing crazy, just small animations to things pop up sequentially as you scroll down but it really ties the website together. Other than that, I basically just spent a lot of time making very small edits to make the website look just how I want it. There’s also a vignette on the main intro video now so that there isn’t a hard cutoff between the video and the rest of the page. Again, just a transition!

0
0
4
Open comments for this post

2h 0m 49s logged

I’m really happy with how my experience section looks. I have to add in the actual content but in terms of the design I was going for, this fits the rest of my website really well and is super easy to follow. The next part will be adding a small about me section near the top of the website but I got the main “hard” parts out of the way!

0
0
4
Open comments for this post

26m 7s logged

I’m basically done with my intro screen! Sure, there will be some small changes here and there as I make the rest of my website but for the landing screen, I’m really happy with how it looks. The intro text has a little typewriter-like animation to it which doesn’t come across in one screenshot but it’s there! The background also has a video montage playing just showing some of my hobbies. I’m not sure about the color theme just yet but the next part is to add in my about me section and projects.

0
0
2
Open comments for this post

21m 54s logged

I began working on my porfolio website! Right now, I have just made the navbar with all the main sections that I want to include later. You can’t see it right now because there isn’t anything else on the page, but I added some random content to make it longer that my window height since I wanted to have a scroll transition. Instead of being a pill shape in the middle, the navbar will transition and spread itself out over the entire window width when it disappears after a scroll. Also, for hovering it just disappears right now because I put arbitrary color variables since I haven’t actually finalized a color theme yet but that will come soon. My next step is going to be to add my home screen with hopefully some cool functionality!

0
0
2

Followers

Loading…