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

The Cosmos

  • 8 Devlogs
  • 11 Total hours

I have always been thrilled by the mysteries of space so I thought why not make my site space themed? 🪐

Ship #2

I was asked to make changes in my website due to some reasons. I have finally completed working on those changes so I am reshipping it. I have made some changes in my home page as well as other pages. Also, I have made a 'Lame Jokes' page because why not? Hope y'all like it! 🫶🏻

  • 2 devlogs
  • 3h
  • 9.06x multiplier
  • 27 Stardust
Try project → See source code →
Open comments for this post

1h 31m 33s logged

Cosmos Devlog 8 🪐✨– Silly Stuff Page

What I worked on:

  • Added a simple Silly Stuff page to the website.
  • Filled it with a handful of basic, intentionally lame jokes to make the site feel a little more personal and less serious.
  • Kept the design minimal so it fits with the rest of the website without taking attention away from the main content.

Challenges:

Nothing major here—this page was meant to be lighthearted, so I focused on keeping it simple instead of overcomplicating it.

Progress:

  • The page is complete for now. It’s just a fun little corner of the website, and I might add more random jokes or goofy content in future updates.

Gonna reship the project soon! 🫶🏻

0
1
63
Open comments for this post

1h 29m 40s logged

Cosmos Devlog 7 🪐✨- Home Page Refresh

What I Worked On:

  • I revisited the home page to refine the overall experience instead of adding more features. 
  • I reorganized a few sections, adjusted the layout, and made small design changes that helped the page feel more balanced and intentional. 
  • I also planned out a new “Silly Stuff” section that will feature a collection of wonderfully terrible space jokes.

Challenges:

Most of the challenge came from deciding what to change rather than how to change it. Even minor layout tweaks affected spacing and alignment, so it took a fair bit of trial and error to make everything feel cohesive while leaving room for future additions.

Progress:

  • The home page now has a cleaner flow and feels much closer to the vision I had for The Cosmos. 
  • With the foundation in place, the next step is bringing the Silly Stuff page to life—because every journey through the universe deserves a few astronomically bad jokes along the way. 🫶🏻😄
0
1
51
Ship #1

🌌 Project Overview
The Cosmos is a space-inspired personal portfolio website that transforms a traditional portfolio into an interactive digital journey. Rather than simply displaying information, the website immerses visitors in a cosmic environment where each page represents a different stage of exploration—from discovering projects to reading reflections and learning about the creator behind them.
The project combines storytelling, modern web design, and subtle animations to create an engaging and memorable user experience while showcasing technical and creative skills.

🎯 Objectives
- Create a portfolio that stands out through storytelling and immersive design.
- Showcase projects, achievements, and personal interests in a visually engaging way.
- Apply front-end development concepts to build a responsive and interactive website.
- Blend aesthetics with functionality without sacrificing usability.
- Reflect my passion for astronomy, creativity, and technology.

💻 Technologies Used
- HTML
- CSS

🏗️ Project Structure
The website is organized into multiple interconnected pages:
- Home – Hero section introducing The Cosmos and welcoming visitors.
- Mission (About Me) – Personal introduction and background.
- Projects – Collection of projects with descriptions and links.
- Captain's Log – Blog-style reflections and development journey.
- Contact – Contact information and social links.

🌠 Inspiration
The project draws inspiration from:
- The beauty and mystery of outer space.
- NASA-inspired interfaces.
- Interstellar for its visual atmosphere.
- The idea that learning is a lifelong journey of exploration.

✨ Credits
Shoutout to Cursor 4 U for the custom cursor used in this project. It added the perfect finishing touch to the space-themed experience.

Try project → See source code →
Open comments for this post

2h 6m 12s logged

Cosmos Devlog 6 🪐✨ - Designing the home page

What I worked on today:

  • Enhanced the homepage by designing an immersive hero section, adding floating animations, and a featured quote section. 
  • Refined the layout and visual hierarchy to create a more engaging, cohesive, and space-inspired landing experience.

Challenges:

  • Resolved layout issues caused by fixed navigation and page scrolling.
  • Fixed CSS syntax errors affecting animations and shadows.

Progress:

  • Designed the homepage hero section.
  • Added some animation.
  • Integrated a quote card to reinforce the site’s theme.
  • Improved overall layout, spacing, and visual consistency.

Also, I feel so glad to let y’all know that my project is now complete and ready to be shipped. I feel so excited! And thank you all for supporting me! 🫶🏻😄

0
1
51
Open comments for this post

1h 3m 9s logged

Cosmos Devlog 5 🪐✨ - Building the Planetary projects page

What I worked on:

  • Created a dedicated Planetary Projects page.
  • Added project titles, descriptions, and mission status indicators for each project.
  • Included links to live demos and repositories, allowing visitors to explore the projects directly.

Challenges:

  • Deciding how to present projects in a way that was both visually engaging and easy to navigate.
  • Keeping the page responsive and visually balanced as the number of showcased projects increases.

Progress:

  • Planetary Projects page completed. 🫶🏻
0
1
17
Open comments for this post

1h 36m 53s logged

Cosmos Devlog 4 🪐✨- Building the Mission Dossier

What I worked on:

  • Created a dedicated Mission Dossier page instead of a generic About Me section.
  • Designed a glassmorphism-inspired interface to complement the space theme.
  • Organized personal information into a structured dossier format with labels such as Explorer, Mission Objective, and Current Status.
  • Added visual hierarchy through custom typography, spacing, and glowing accents to reinforce the sci-fi aesthetic.

Challenges:

  • Finding the right balance between visual style and readability. While the goal was to create an immersive interface, it was equally important to ensure the information remained clear and easy to navigate.
  • Iterated through several layout concepts before settling on a design that felt more like a spacecraft database than a traditional profile page.

Progress:

  • Mission Dossier page completed.

  • Consistent design language established for future pages across the portfolio.

0
1
19
Open comments for this post

1h 41m 15s logged

Cosmos Devlog 3 🪐✨ - Custom Cursor

Today’s focus was adding a custom cursor to the website.

What I worked on:

  • Implemented a custom cursor to better match the space theme.
  • Fixed issues where the cursor reverted to the default pointer when hovering over links.
  • Learned how CSS cursor properties behave across different elements and how to override them consistently.

Challenges:

  • The implementation took longer than expected due to multiple styling conflicts.
  • As I’m still new to web development, debugging the issue required a lot of trial and error and reading documentation.

Progress:

  • Custom cursor is fully functional.
  • No major visual updates today, but I built a stronger understanding of CSS and debugging.

Credits:

  • Cursor asset sourced from Cursors-4U and integrated into the project to fit the space-themed aesthetic.

Next steps:

  • Design and implement the landing sequence.
  • Continue building the homepage and navigation.
    Stay tuned! 🫶🏻
0
1
17
Open comments for this post

25m 27s logged

Cosmos Devlog 2 🪐✨ - What I would be doing today:

  • Make the site more creative.

  • Add some space facts.

  • Try to finish the first page of the website.

  • Maybe add some images.

Note: I am so sorry but I have been staying a little busy lately because of school work so I will try my best to complete making the site as fast as I can! 🫶🏻

2
2
215
Open comments for this post

39m 1s logged

Cosmos Devlog 1 🪐✨- What I worked on today:

  • Designed a simple landing page.

  • Added a space-themed background.

  • Styled the page with HTML & CSS.

  • Deployed the project using GitHub Pages.

Challenges:

Getting the website live wasn’t easy. I ran into issues with GitHub Pages showing my README instead of my website, but after troubleshooting file names and deployment settings, everything finally worked.

Next Steps:

  • Improve the design and animations.

  • Add more content about space.

  • Make the site more interactive.

2
1
40

Delete project?

Are you sure you want to permanently delete this project? This action cannot be undone.

All devlogs, followers, and associated data will be removed.

Followers

Loading…