|
25850
|
Python Platformer Maker by @Playbounce35 | Stardan Python Platformer Maker by @Playbounce35 | Stardance...
|
Playbounce35
|
0
|
0.0
|
0
|
[]
|
[]
|
Title: Python Platformer Maker by @Playbounce35 | Title: Python Platformer Maker by @Playbounce35 | Stardance...
|
1793141585.124108
|
1793746385.124108
|
|
12361
|
NULL
|
NULL
|
0
|
0.0
|
0
|
[]
|
[]
|
|
1792882383.5873258
|
1793746383.5873258
|
|
33583
|
WarioWare Game by @paolalm | Stardance
|
paolalm
|
0
|
0.0
|
0
|
[]
|
[]
|
Title: WarioWare Game by @paolalm | Stardance
|
1792882382.7850518
|
1793746382.7850518
|
|
55133
|
INTAKE by @absltx09 | Stardance
|
absltx09
|
0
|
0.0
|
0
|
[]
|
[]
|
Title: INTAKE by @absltx09 | Stardance
|
1792882381.961033
|
1793746381.961033
|
|
8401
|
less go by @janishab1704 | Stardance
|
janishab1704
|
0
|
0.0
|
0
|
[]
|
[]
|
Title: less go by @janishab1704 | Stardance
|
1793141581.7047927
|
1793746381.7047927
|
|
55117
|
520 by @lacorte | Stardance
|
lacorte
|
0
|
0.0
|
0
|
[]
|
[]
|
Title: 520 by @lacorte | Stardance
|
1792882381.134693
|
1793746381.134693
|
|
41796
|
Ghostbuster by @hoshik | Stardance
|
hoshik
|
0
|
0.0
|
0
|
[]
|
[]
|
Title: Ghostbuster by @hoshik | Stardance
|
1792882380.302614
|
1793746380.302614
|
|
30047
|
Untitled by @Ke | Stardance
|
Ke
|
0
|
0.0
|
0
|
[]
|
[]
|
Title: Untitled by @Ke | Stardance
|
1793141579.9056377
|
1793746379.9056377
|
|
41789
|
DietPad by @SebthePenguin | Stardance
|
SebthePenguin
|
0
|
0.0
|
0
|
[]
|
[]
|
Title: DietPad by @SebthePenguin | Stardance
|
1792882379.4826145
|
1793746379.4826145
|
|
47846
|
NULL
|
NULL
|
0
|
0.0
|
0
|
[]
|
[]
|
|
1792882378.6564136
|
1793746378.6564136
|
|
13900
|
My awesome macropad! by @1valaki_a | Stardance
|
1valaki_a
|
0
|
0.0
|
0
|
[]
|
[]
|
Title: My awesome macropad! by @1valaki_a | Starda Title: My awesome macropad! by @1valaki_a | Stardance...
|
1793141578.1231546
|
1793746378.1231546
|
|
47845
|
NULL
|
NULL
|
0
|
0.0
|
0
|
[]
|
[]
|
|
1792882377.8352616
|
1793746377.8352616
|
|
40355
|
Cyberdeck by @TheCocoX | Stardance
|
TheCocoX
|
0
|
0.0
|
0
|
[]
|
[]
|
Title: Cyberdeck by @TheCocoX | Stardance
|
1793141577.2385426
|
1793746377.2385426
|
|
47844
|
NULL
|
NULL
|
0
|
0.0
|
0
|
[]
|
[]
|
|
1792882376.9970396
|
1793746376.9970396
|
|
32848
|
Untitled by @KalebCodes | Stardance
|
KalebCodes
|
0
|
0.0
|
0
|
[]
|
[]
|
Title: Untitled by @KalebCodes | Stardance
|
1793141575.1036808
|
1793746375.1036808
|
|
48178
|
Domestic Violence Advocacy by @Sushmita | Stardanc Domestic Violence Advocacy by @Sushmita | Stardance...
|
Sushmita
|
1
|
2.0
|
5
|
[{"ship_num": 1, "ts": "2026-0 [{"ship_num": 1, "ts": "2026-08-19T01:14:34Z", "hours": 2.0, "multiplier": 2.12, "payout": 5, "blessing": "neutral", "text": "I made an advocacy website on domestic violence using HTML, CSS, and JS. Since I’ve made a few websites before, it was for the most part not challenging, but I had to look up some small problems I had. I used my previous projects’ repos for inspriation/help as well. I’m proud that I’m able to combine everything that I’ve learned into this project!", "repo": "https://github.com/Sushmita-Jacob/dv-advocacy", "demo": "https://sushmita-jacob.github.io/dv-advocacy/"}]...
|
[{"post_id": 50003, "ts": "202 [{"post_id": 50003, "ts": "2026-08-19T01:07:27Z", "hours": 1.1264, "text": "Devlog #2: Styling I added/changed the following features: Made the nav bar cleaner Added a border around the DV definition and facts Changed the font to something that fits the topic better Fixed image styling (made them the same size and added a border) Added better coloring (ex. the nav bar button is darker when hovered over)"}, {"post_id": 47853, "ts": "2026-08-16T02:35:00Z", "hours": 1.2939, "text": "Devlog #1: Basic website I decided to create a website for a domestic violence instiute capstone project and Girls Who Code’s Pathways program (Web Development). The website currently features 3 pages: a home page with the definition of domestic violence, a fact generator that circles through different DV facts, and resources by My Sister’s Place on types/signs of DV compared to healthy relationships. I plan to add better styling, animations, and fix the navigation bar."}]...
|
Title: Domestic Violence Advocacy by @Sushmita | S Title: Domestic Violence Advocacy by @Sushmita | Stardance
Devlogs:
Devlog #1: Basic website I decided to create a website for a domestic violence instiute capstone project and Girls Who Code’s Pathways program (Web Development). The website currently features 3 pages: a home page with the definition of domestic violence, a fact generator that circles through different DV facts, and resources by My Sister’s Place on types/signs of DV compared to healthy relationships. I plan to add better styling, animations, and fix the navigation bar.
Devlog #2: Styling I added/changed the following features: Made the nav bar cleaner Added a border around the DV definition and facts Changed the font to something that fits the topic better Fixed image styling (made them the same size and added a border) Added better coloring (ex. the nav bar button is darker when hovered over)
Ships:
I made an advocacy website on domestic violence using HTML, CSS, and JS. Since I’ve made a few websites before, it was for the most part not challenging, but I had to look up some small problems I had. I used my previous projects’ repos for inspriation/help as well. I’m proud that I’m able to combine everything that I’ve learned into this project!...
|
1793659974.1402183
|
1793746374.1402183
|
|
40282
|
Professional Portfolio by @Im_aware | Stardance
|
Im_aware
|
0
|
1.28
|
0
|
[]
|
[{"post_id": 35471, "ts": "202 [{"post_id": 35471, "ts": "2026-07-26T22:39:55Z", "hours": 0.7258, "text": "Finished formatting the home page and added the next page of the document. I’m 170 lines into the first page and 160 into the second although most of the second was just copy and paste."}, {"post_id": 35428, "ts": "2026-07-26T20:38:52Z", "hours": 0.5556, "text": "Started coding. I fear I’m going to be making multiple webpages… so this is the beginning of the home page! May take a bit longer than anticipated. Wish me luck."}]...
|
Title: Professional Portfolio by @Im_aware | Stard Title: Professional Portfolio by @Im_aware | Stardance
Devlogs:
Started coding. I fear I’m going to be making multiple webpages… so this is the beginning of the home page! May take a bit longer than anticipated. Wish me luck.
Finished formatting the home page and added the next page of the document. I’m 170 lines into the first page and 160 into the second although most of the second was just copy and paste....
|
1793141573.2935834
|
1793746373.2935834
|
|
20649
|
My first slack bot! by @ian044730 | Stardance
|
ian044730
|
0
|
0.0
|
0
|
[]
|
[]
|
Title: My first slack bot! by @ian044730 | Stardan Title: My first slack bot! by @ian044730 | Stardance...
|
1793141572.4008636
|
1793746372.4008636
|
|
7588
|
Yo-Yo Fu by @benMakesStuff | Stardance
|
benMakesStuff
|
0
|
10.23
|
0
|
[]
|
[{"post_id": 14095, "ts": "202 [{"post_id": 14095, "ts": "2026-06-23T02:31:05Z", "hours": 1.1878, "text": "Got the main menu working (the quit and start button) and it now has nice text/logo thing, and a bg for the main menu (made with AI). And also worked on getting more charcters."}, {"post_id": 11076, "ts": "2026-06-18T03:34:21Z", "hours": 0.9653, "text": "Made and organized the README.md, to be more professional and document all of the project better."}, {"post_id": 10929, "ts": "2026-06-17T22:13:40Z", "hours": 1.7839, "text": "I worked on getting the yo-yo to show up in the player’s hand and launch properly, but it was pretty confusing and I ended up with a lot of errors and a non-working yo-yo. I also worked on the file structure; my files were scattered all over the place, so I asked an AI how to organize them using Boomerang Fu as a reference, and I did what I could with that. Finally, I started working on the main menu UI to make it look a bit more finished, even though it’s still far from it!"}, {"post_id": 7338, "ts": "2026-06-12T07:31:06Z", "hours": 1.0008, "text": "Big update for the main character! The cactus finally got a glow-up with a cute head flower, eyes, a mouth, and proper spikes. Even better, basic movement is officially live. You can now move and dash, and the character smoothly turns toward your movement direction (just like the best game in history: Boomerang fu)."}, {"post_id": 6704, "ts": "2026-06-11T07:22:58Z", "hours": 0.8689, "text": "Made the chcarter move in godot, and it looks kinda amazing. But its is still really plain and i dont know a lot of stuff so its basically nothing."}, {"post_id": 5971, "ts": "2026-06-10T00:31:00Z", "hours": 0.9847, "text": "I have started using Godot tp get the game into an actual game engine. Its my first time using it so its not going relly well, its really slow and stuff, but i am getting better. I have also started using Blockbench for 3d modelling my characters and i have been trying to model this character (the cactus) for around 2 hours but Lapse kinda glitched and didnt count them (it just said server error). But i am getting better at blockbench"}, {"post_id": 5237, "ts": "2026-06-08T22:59:44Z", "hours": 0.8228, "text": "So now there is animations, and there is one character, the cactus. and i have also made yoyos and their spining animations. But i still havent decided if i should use smooth surfaces or pixelated, and if i should be using an actual game engine for it. I will do that later when i have a clear idea of what i am doing, but for now its looking pretty good. and i am still trying to figure out how to make the bounces work, right now they are really bad."}, {"post_id": 4646, "ts": "2026-06-08T01:40:19Z", "hours": 0.5947, "text": "Added more Yoyo functions to make the yoyo movement better including: Bounces to walls Recalling (bring the yoyo back before max lenght) And added more central keys for the throwing/moving/aiming and added an aim preview before throwing"}, {"post_id": 4612, "ts": "2026-06-08T00:00:00Z", "hours": 1.0489, "text": "I added controls through an actual controler and now it is able to shoot yoyos and the collisions actually work too. The controls are: Left joystick - movement A (nintendo) - Shoot/Aim and if aiming left joystick works just like it I am thinking now to add better maping and UI, or the actual animations."}, {"post_id": 3285, "ts": "2026-06-06T04:25:10Z", "hours": 0.9694, "text": "A game inspired by Boomerang Fu, but instead of Boomerangs, Yoyos"}]...
|
Title: Yo-Yo Fu by @benMakesStuff | Stardance
Dev Title: Yo-Yo Fu by @benMakesStuff | Stardance
Devlogs:
A game inspired by Boomerang Fu, but instead of Boomerangs, Yoyos
I added controls through an actual controler and now it is able to shoot yoyos and the collisions actually work too. The controls are: Left joystick - movement A (nintendo) - Shoot/Aim and if aiming left joystick works just like it I am thinking now to add better maping and UI, or the actual animations.
Added more Yoyo functions to make the yoyo movement better including: Bounces to walls Recalling (bring the yoyo back before max lenght) And added more central keys for the throwing/moving/aiming and added an aim preview before throwing
So now there is animations, and there is one character, the cactus. and i have also made yoyos and their spining animations. But i still havent decided if i should use smooth surfaces or pixelated, and if i should be using an actual game engine for it. I will do that later when i have a clear idea of what i am doing, but for now its looking pretty good. and i am still trying to figure out how to make the bounces work, right now they are really bad.
I have started using Godot tp get the game into an actual game engine. Its my first time using it so its not going relly well, its really slow and stuff, but i am getting better. I have also started using Blockbench for 3d modelling my characters and i have been trying to model this character (the cactus) for around 2 hours but Lapse kinda glitched and didnt count them (it just said server error). But i am getting better at blockbench
Made the chcarter move in godot, and it looks kinda amazing. But its is still really plain and i dont know a lot of stuff so its basically nothing.
Big update for the main character! The cactus finally got a glow-up with a cute head flower, eyes, a mouth, and proper spikes. Even better, basic movement is officially live. You can now move and dash, and the character smoothly turns toward your movement direction (just like the best game in history: Boomerang fu).
I worked on getting the yo-yo to show up in the player’s hand and launch properly, but it was pretty confusing and I ended up with a lot of errors and a non-working yo-yo. I also worked on the file structure; my files were scattered all over the place, so I asked an AI how to organize them using Boomerang Fu as a reference, and I did what I could with that. Finally, I started working on the main menu UI to make it look a bit more finished, even though it’s still far from it!
Made and organized the README.md, to be more professional and document all of the project better.
Got the main menu working (the quit and start button) and it now has nice text/logo thing, and a bg for the main menu (made with AI). And also worked on getting more charcters....
|
1793141571.1329124
|
1793746371.1329124
|
|
34054
|
Orion by @phattar4phan | Stardance
|
phattar4phan
|
1
|
9.72
|
92
|
[{"ship_num": 1, "ts": "2026-0 [{"ship_num": 1, "ts": "2026-07-22T19:20:46Z", "hours": 9.0, "multiplier": 9.95, "payout": 92, "blessing": "neutral", "text": "I make an AI model that could classify white blood cell from scratch (one input at a time as I dont have enough compute unit), the challenging parts ware that I’m not really that good at math so yeah need some AI to help coding the model part to ensure as much accuracy as possible, although it’s minimal but I tried to make it have the highest possible accuracy, the last trained one got ‘Peak’ at 99.19% quite good but it results in getting 100% confident score every time. Before testing, you can test it directly in the web, no downloading or installation required unless you want to make it locally (test at orion.phattar4phan.workers.dev), Proud to show that at least I can make an AI model, next one will be small language model with only ~7.8m parameters, just wait!", "repo": "https://github.com/phattar4phan/orion", "demo": "https://orion.phattar4phan.workers.dev/"}]...
|
[{"post_id": 33586, "ts": "202 [{"post_id": 33586, "ts": "2026-07-23T17:06:01Z", "hours": 0.7214, "text": "Retrained the model as I have added ‘label_smoothing=0.1’ to criterion to lower the probability of image that is jot white blood cell to be classified and show as a type of wbc with high confident score, also removed static glassmorphism header from the site and also added grid table with some clustered gradients as the background to not make it static"}, {"post_id": 33129, "ts": "2026-07-22T19:11:35Z", "hours": 1.7517, "text": "Finale version, removed the 5 models comparison as I dont have time to create all that right now. Only 1 model 1 interference and it’s donee"}, {"post_id": 29552, "ts": "2026-07-16T15:47:41Z", "hours": 3.8708, "text": "Created new landing page and web app page, also bunch of new objs"}, {"post_id": 27749, "ts": "2026-07-13T16:05:40Z", "hours": 0.5442, "text": "Modified some configurations and deploy or vercel (try it at orion-cnn.vercel.app)"}, {"post_id": 27173, "ts": "2026-07-12T14:29:04Z", "hours": 3.0931, "text": "Trained CNN from scratch model, and more training logs: Training Logs ┏━━━━━━━┳━━━━━━━━┳━━━━━━━━━━┳━━━━━━━━┳━━━━━━━━━━━━━┓ ┃ Epoch ┃ Loss ┃ Accuracy ┃ Valid ┃ Duration(s) ┃ ┡━━━━━━━╇━━━━━━━━╇━━━━━━━━━━╇━━━━━━━━╇━━━━━━━━━━━━━┩ │ 1/20 │ 0.8463 │ 66.54% │ 86.70% │ 48.77 │ │ 2/20 │ 0.5111 │ 81.43% │ 92.74% │ 47.21 │ │ 3/20 │ 0.3835 │ 86.39% │ 91.02% │ 47.00 │ │ 4/20 │ 0.3203 │ 88.78% │ 93.51% │ 46.79 │ │ 5/20 │ 0.2671 │ 90.80% │ 93.51% │ 47.19 │ │ 6/20 │ 0.2448 │ 91.36% │ 93.58% │ 47.44 │ │ 7/20 │ 0.2161 │ 92.34% │ 94.11% │ 47.21 │ │ 8/20 │ 0.1961 │ 93.18% │ 95.82% │ 47.16 │ │ 9/20 │ 0.1859 │ 93.48% │ 96.25% │ 47.15 │ │ 10/20 │ 0.1693 │ 93.97% │ 95.72% │ 47.82 │ │ 11/20 │ 0.1592 │ 94.35% │ 94.46% │ 47.51 │ │ 12/20 │ 0.1503 │ 94.60% │ 96.07% │ 47.39 │ │ 13/20 │ 0.1405 │ 95.24% │ 95.26% │ 47.59 │ │ 14/20 │ 0.1356 │ 95.07% │ 96.28% │ 47.66 │ │ 15/20 │ 0.1232 │ 95.79% │ 96.21% │ 48.00 │ │ 16/20 │ 0.1218 │ 95.91% │ 96.81% │ 47.60 │ │ 17/20 │ 0.1195 │ 95.93% │ 98.11% │ 47.72 │ │ 18/20 │ 0.1162 │ 96.10% │ 97.54% │ 48.10 │ │ 19/20 │ 0.1076 │ 96.49% │ 97.58% │ 47.76 │ │ 20/20 │ 0.1054 │ 96.36% │ 97.05% │ 47.81 │ └───────┴────────┴──────────┴────────┴─────────────┘ Best: E:17 | Validation Accuracy: 98.11 Resulted in the best validation accuracy at 98.11% and at epoch 17th, only need to train the remaining 4 models"}]...
|
Title: Orion by @phattar4phan | Stardance
Devlogs Title: Orion by @phattar4phan | Stardance
Devlogs:
Trained CNN from scratch model, and more training logs: Training Logs ┏━━━━━━━┳━━━━━━━━┳━━━━━━━━━━┳━━━━━━━━┳━━━━━━━━━━━━━┓ ┃ Epoch ┃ Loss ┃ Accuracy ┃ Valid ┃ Duration(s) ┃ ┡━━━━━━━╇━━━━━━━━╇━━━━━━━━━━╇━━━━━━━━╇━━━━━━━━━━━━━┩ │ 1/20 │ 0.8463 │ 66.54% │ 86.70% │ 48.77 │ │ 2/20 │ 0.5111 │ 81.43% │ 92.74% │ 47.21 │ │ 3/20 │ 0.3835 │ 86.39% │ 91.02% │ 47.00 │ │ 4/20 │ 0.3203 │ 88.78% │ 93.51% │ 46.79 │ │ 5/20 │ 0.2671 │ 90.80% │ 93.51% │ 47.19 │ │ 6/20 │ 0.2448 │ 91.36% │ 93.58% │ 47.44 │ │ 7/20 │ 0.2161 │ 92.34% │ 94.11% │ 47.21 │ │ 8/20 │ 0.1961 │ 93.18% │ 95.82% │ 47.16 │ │ 9/20 │ 0.1859 │ 93.48% │ 96.25% │ 47.15 │ │ 10/20 │ 0.1693 │ 93.97% │ 95.72% │ 47.82 │ │ 11/20 │ 0.1592 │ 94.35% │ 94.46% │ 47.51 │ │ 12/20 │ 0.1503 │ 94.60% │ 96.07% │ 47.39 │ │ 13/20 │ 0.1405 │ 95.24% │ 95.26% │ 47.59 │ │ 14/20 │ 0.1356 │ 95.07% │ 96.28% │ 47.66 │ │ 15/20 │ 0.1232 │ 95.79% │ 96.21% │ 48.00 │ │ 16/20 │ 0.1218 │ 95.91% │ 96.81% │ 47.60 │ │ 17/20 │ 0.1195 │ 95.93% │ 98.11% │ 47.72 │ │ 18/20 │ 0.1162 │ 96.10% │ 97.54% │ 48.10 │ │ 19/20 │ 0.1076 │ 96.49% │ 97.58% │ 47.76 │ │ 20/20 │ 0.1054 │ 96.36% │ 97.05% │ 47.81 │ └───────┴────────┴──────────┴────────┴─────────────┘ Best: E:17 | Validation Accuracy: 98.11 Resulted in the best validation accuracy at 98.11% and at epoch 17th, only need to train the remaining 4 models
Modified some configurations and deploy or vercel (try it at orion-cnn.vercel.app)
Created new landing page and web app page, also bunch of new objs
Finale version, removed the 5 models comparison as I dont have time to create all that right now. Only 1 model 1 interference and it’s donee
Retrained the model as I have added ‘label_smoothing=0.1’ to criterion to lower the probability of image that is jot white blood cell to be classified and show as a type of wbc with high confident score, also removed static glassmorphism header from the site and also added grid table with some clustered gradients as the background to not make it static
Ships:
I make an AI model that could classify white blood cell from scratch (one input at a time as I dont have enough compute unit), the challenging parts ware that I’m not really that good at math so yeah need some AI to help coding the model part to ensure as much accuracy as possible, although it’s minimal but I tried to make it have the highest possible accuracy, the last trained one got ‘Peak’ at 99.19% quite good but it results in getting 100% confident score every time. Before testing, you can test it directly in the web, no downloading or installation required unless you want to make it locally (test at orion.phattar4phan.workers.dev), Proud to show that at least I can make an AI model, next one will be small language model with only ~7.8m parameters, just wait!...
|
1793659968.5307102
|
1793746368.5307102
|
|
33487
|
Project mr pernesian para pero by @Zayna | Stardan Project mr pernesian para pero by @Zayna | Stardance...
|
Zayna
|
0
|
0.0
|
0
|
[]
|
[]
|
Title: Project mr pernesian para pero by @Zayna | Title: Project mr pernesian para pero by @Zayna | Stardance...
|
1793141567.5082343
|
1793746367.5082343
|
|
8193
|
MMF-Portefeuille by @mrmefish | Stardance
|
mrmefish
|
0
|
0.0
|
0
|
[]
|
[]
|
Title: MMF-Portefeuille by @mrmefish | Stardance
|
1793141565.3916252
|
1793746365.3916252
|
|
6912
|
My first slack bot! by @sans114114 | Stardance
|
sans114114
|
0
|
0.0
|
0
|
[]
|
[]
|
Title: My first slack bot! by @sans114114 | Starda Title: My first slack bot! by @sans114114 | Stardance...
|
1793141563.567603
|
1793746363.567603
|
|
29921
|
My first slack bot! by @Rakshith | Stardance
|
Rakshith
|
0
|
0.0
|
0
|
[]
|
[]
|
Title: My first slack bot! by @Rakshith | Stardanc Title: My first slack bot! by @Rakshith | Stardance...
|
1793141561.4889777
|
1793746361.4889777
|
|
47357
|
Cosmic conqueror by @ayaan17120 | Stardance
|
ayaan17120
|
1
|
44.0
|
615
|
[{"ship_num": 1, "ts": "2026-0 [{"ship_num": 1, "ts": "2026-08-24T20:29:24Z", "hours": 44.0, "multiplier": 13.86, "payout": 615, "blessing": "neutral", "text": "i made a game called the cosmic conqueror, the adventures of mishi, this game is something i worked and it honestly was reallt tiring, i got stuvk like a million times for small errors and it was really tiring. i love this game but now after doing everything i realised i have put every effort intp and i lovr this despite anything. i made a small error tho, to the space riddle, i didnt change the question so there are two blackhole riddles, but the answer to one is space", "repo": "https://github.com/Jsvuskgxixylsurdoyc/COSMIC-CONQUUEROR", "demo": "https://qaziiiayaan.itch.io/cosmic-conqueror"}]...
|
[{"post_id": 54033, "ts": "202 [{"post_id": 54033, "ts": "2026-08-24T19:46:19Z", "hours": 4.7894, "text": "i finally added all the start pause game over, complete scenes and finallt put all of these guys intop thier respective places and the game is finally complete"}, {"post_id": 53058, "ts": "2026-08-23T13:38:16Z", "hours": 3.9117, "text": "I coded these interactive riddle walls basically, you walk up to a dead end, a UI pops up, and you have to type in the exact right password to a riddle. If you get it right, the wall literally deletes itself and clears the path. I placed four of these riddle gates across the map. Getting the UI to actually work was a nightmare though. but now I finally have actual on-screen popups that yell ‘Right Answer!’ or ‘Wrong Answer!’ in your face and fade out after a couple of seconds. On top of that, I built out the whole Space Key fragment mechanic and completely mapped out the dungeon layout. You start in this bottom tunnel, solve your way through the main gates, and then have to survive branching left and right mazes to hunt down these key fragments. I set it all up so you’ll eventually have to clear a central boss arena and fight off skeleton mage ambushes just to get the pieces. I also spent way too long fixing dumb bugs like my character freezing mid-run when opening a menu, or endlessly jumping against flat walls like an idiot because of broken physics code. But I locked the movement inputs down, and it finally actually plays like a real dungeon crawler. The grind was unreal, but we’re locked in now."}, {"post_id": 52527, "ts": "2026-08-22T18:05:25Z", "hours": 3.2258, "text": "Today, I mapped out the core layout for my game and officially shifted the concept to a sci-fi “space dungeon.” The main loop is now focused on exploring the map, fighting through various enemies, and eventually finding a way to escape back to your home planet. To make the exploration actually matter, I decided to add a collectible space key that the player must find to unlock the final escape shuttle. After some trial and error with the engine’s physics, I successfully got the key fully implemented and working. With the escape puzzle finished, I am ready to move on and start building out the rest of the stuff, like the enemies and boss fights!"}, {"post_id": 51768, "ts": "2026-08-21T16:38:51Z", "hours": 1.6261, "text": "today i jus worked on player animations, added different spells and added drain and limit systems for that, and i also added stamina drain systems"}, {"post_id": 51155, "ts": "2026-08-20T17:29:56Z", "hours": 1.6436, "text": "today i couldnt do much. i jus fixed a lot of bugs. and i also started to work on the abilities of the player and what they can do"}, {"post_id": 50415, "ts": "2026-08-19T16:08:32Z", "hours": 5.0589, "text": "i added the projectile attacks, made them work for anyday. and made sure the attacks are perfect and fixed the bugs and now working on ui, too tired to post a screenshot, sorry guys :)"}, {"post_id": 49721, "ts": "2026-08-18T17:07:48Z", "hours": 2.6131, "text": "today i did a lot of work, i added the attack mechanics and made my player get attacked and attack. its not only animation now it works, now ive to work on the projectiles and health bars and make sure the player dies actually, so this is all very cool"}, {"post_id": 48890, "ts": "2026-08-17T13:37:17Z", "hours": 2.4631, "text": "first i added the skeleton warrior and did everything related to him Then I added the new Skeleton Mage, and oh my god, this guy gave me so many headaches. Whenever I clicked on him, the editor threw this weird float and bool mismatch error. I had to go into the animation tracks and change the update mode to discrete so the engine wouldn’t freak out. And then, after writing all the codes and doing everything, he STILL wasn’t attacking me. I made sure the script was perfect, right? But then I realized I plugged the wires backwards in the Animation Tree… I literally had the move state plugged into the shot port. Fixed that, and he still wasn’t shooting. Why? Because I just forgot to tick the ‘Autostart’ box on his attack timer. Honestly so annoying."}, {"post_id": 48377, "ts": "2026-08-16T18:14:54Z", "hours": 3.67, "text": "Worked on setting up and fixing the boss AI and animation state machine in Godot. Got the base movement working, fixed the attack timer pacing so the boss doesn’t instantly spam ranged attacks from across the map, and successfully resolved the issue where the boss kept playing the running/walking animation in place instead of returning to idle. Decided to temporarily shelf the spin attack feature by commenting out the code to keep things simple for now, and finalized a smooth, working combat loop with proper melee and ranged states."}, {"post_id": 48023, "ts": "2026-08-16T09:38:10Z", "hours": 4.2953, "text": "#devlog so finally i am done with the player mechanics completely, my player now blinks jumps runs walks, sprints, can defend using a sheild, can attack with a sword and can switch to a wand and attack using that. now ill start working on the attack mechanics and the enemies"}, {"post_id": 47392, "ts": "2026-08-15T09:42:46Z", "hours": 3.8317, "text": "right now i first addeed the sprint and jump to the capsule and then i finally added the chharacter and his animations and made those animations work, jump run and idle"}, {"post_id": 47024, "ts": "2026-08-14T16:50:48Z", "hours": 3.6786, "text": "earlier i messed up and put everything in one scene, i had to redo everything and fixed it, plus i added spring and did everything related to the camera. now im workingg on the jump"}, {"post_id": 46809, "ts": "2026-08-14T10:05:00Z", "hours": 3.5264, "text": "i am working on survival game which is inspired from the legend of zelda in which you kill the final boss of another planet and escape on your shuttle. right now i have made the base and the character, i have coded the character and the camera controls, gave the camera basic code to follow the character and basic rotational mechanics"}]...
|
Title: Cosmic conqueror by @ayaan17120 | Stardance Title: Cosmic conqueror by @ayaan17120 | Stardance
Devlogs:
i am working on survival game which is inspired from the legend of zelda in which you kill the final boss of another planet and escape on your shuttle. right now i have made the base and the character, i have coded the character and the camera controls, gave the camera basic code to follow the character and basic rotational mechanics
earlier i messed up and put everything in one scene, i had to redo everything and fixed it, plus i added spring and did everything related to the camera. now im workingg on the jump
right now i first addeed the sprint and jump to the capsule and then i finally added the chharacter and his animations and made those animations work, jump run and idle
#devlog so finally i am done with the player mechanics completely, my player now blinks jumps runs walks, sprints, can defend using a sheild, can attack with a sword and can switch to a wand and attack using that. now ill start working on the attack mechanics and the enemies
Worked on setting up and fixing the boss AI and animation state machine in Godot. Got the base movement working, fixed the attack timer pacing so the boss doesn’t instantly spam ranged attacks from across the map, and successfully resolved the issue where the boss kept playing the running/walking animation in place instead of returning to idle. Decided to temporarily shelf the spin attack feature by commenting out the code to keep things simple for now, and finalized a smooth, working combat loop with proper melee and ranged states.
first i added the skeleton warrior and did everything related to him Then I added the new Skeleton Mage, and oh my god, this guy gave me so many headaches. Whenever I clicked on him, the editor threw this weird float and bool mismatch error. I had to go into the animation tracks and change the update mode to discrete so the engine wouldn’t freak out. And then, after writing all the codes and doing everything, he STILL wasn’t attacking me. I made sure the script was perfect, right? But then I realized I plugged the wires backwards in the Animation Tree… I literally had the move state plugged into the shot port. Fixed that, and he still wasn’t shooting. Why? Because I just forgot to tick the ‘Autostart’ box on his attack timer. Honestly so annoying.
today i did a lot of work, i added the attack mechanics and made my player get attacked and attack. its not only animation now it works, now ive to work on the projectiles and health bars and make sure the player dies actually, so this is all very cool
i added the projectile attacks, made them work for anyday. and made sure the attacks are perfect and fixed the bugs and now working on ui, too tired to post a screenshot, sorry guys :)
today i couldnt do much. i jus fixed a lot of bugs. and i also started to work on the abilities of the player and what they can do
today i jus worked on player animations, added different spells and added drain and limit systems for that, and i also added stamina drain systems
Today, I mapped out the core layout for my game and officially shifted the concept to a sci-fi “space dungeon.” The main loop is now focused on exploring the map, fighting through various enemies, and eventually finding a way to escape back to your home planet. To make the exploration actually matter, I decided to add a collectible space key that the player must find to unlock the final escape shuttle. After some trial and error with the engine’s physics, I successfully got the key fully implemented and working. With the escape puzzle finished, I am ready to move on and start building out the rest of the stuff, like the enemies and boss fights!
I coded these interactive riddle walls basically, you walk up to a dead end, a UI pops up, and you have to type in the exact right password to a riddle. If you get it right, the wall literally deletes itself and clears the path. I placed four of these riddle gates across the map. Getting the UI to actually work was a nightmare though. but now I finally have actual on-screen popups that yell ‘Right Answer!’ or ‘Wrong Answer!’ in your face and fade out after a couple of seconds. On top of that, I built out the whole Space Key fragment mechanic and completely mapped out the dungeon layout. You start in this bottom tunnel, solve your way through the main gates, and then have to survive branching left and right mazes to hunt down these key fragments. I set it all up so you’ll eventually have to clear a central boss arena and fight off skeleton mage ambushes just to get the pieces. I also spent way too long fixing dumb bugs like my character freezing mid-run when opening a menu, or endlessly jumping against flat walls like an idiot because of broken physics code. But I locked the movement inputs down, and it finally actually plays like a real dungeon crawler. The grind was unreal, but we’re locked in now.
i finally added all the start pause game over, complete scenes and finallt put all of these guys intop thier respective places and the game is finally complete
Ships:
i made a game called the cosmic conqueror, the adventures of mishi, this game is something i worked and it honestly was reallt tiring, i got stuvk like a million times for small errors and it was really tiring. i love this game but now after doing everything i realised i have put every effort intp and i lovr this despite anything. i made a small error tho, to the space riddle, i didnt change the question so there are two blackhole riddles, but the answer to one is space...
|
1793659960.36006
|
1793746360.36006
|
|
15421
|
My very own WebOS by @nora_mudd_2029 | Stardance
|
nora_mudd_2029
|
0
|
0.0
|
0
|
[]
|
[]
|
Title: My very own WebOS by @nora_mudd_2029 | Star Title: My very own WebOS by @nora_mudd_2029 | Stardance...
|
1793141559.7230344
|
1793746359.7230344
|
|
34868
|
My first slack bot! by @s_b575 | Stardance
|
s_b575
|
0
|
0.0
|
0
|
[]
|
[]
|
Title: My first slack bot! by @s_b575 | Stardance
|
1793141557.8946495
|
1793746357.8946495
|
|
41757
|
Competitive Programming Helper by @lnsekhon | Star Competitive Programming Helper by @lnsekhon | Stardance...
|
lnsekhon
|
0
|
38.99
|
0
|
[]
|
[{"post_id": 49272, "ts": "202 [{"post_id": 49272, "ts": "2026-08-17T23:43:57Z", "hours": 2.2642, "text": "added the main “Competitive Programming Helper” text on entry of project. pretty cool ig"}, {"post_id": 48587, "ts": "2026-08-17T01:24:30Z", "hours": 0.3581, "text": "I created a small animation for the openning of the app, scrolling up our two current pages with text that prompts the user to click any key to continue into the app. The text also flashes which is pretty cool and I thought was fun to implement!"}, {"post_id": 48565, "ts": "2026-08-17T00:30:58Z", "hours": 36.3714, "text": "In this build, I added the problem fetcher and the contest fetcher to Competitive Programming Helper. Both systems connect with platforms like Codeforces and AtCoder. Without these features, the app was just a static text editor that required copying and pasting test cases manually. Fetching data directly turns it into an automated workflow tool.functionality-wise, the problem fetcher takes a problem ID from Codeforces, extracts the sample test cases, and runs the user’s local code against them to check the output. At the same time, the contest fetcher uses a web scraper to pull upcoming competition schedules from both Codeforces and AtCoder into a single list.Together, these features build out the core data pipeline for the app, handling local test execution and schedule tracking in one place."}]...
|
Title: Competitive Programming Helper by @lnsekhon Title: Competitive Programming Helper by @lnsekhon | Stardance
Devlogs:
In this build, I added the problem fetcher and the contest fetcher to Competitive Programming Helper. Both systems connect with platforms like Codeforces and AtCoder. Without these features, the app was just a static text editor that required copying and pasting test cases manually. Fetching data directly turns it into an automated workflow tool.functionality-wise, the problem fetcher takes a problem ID from Codeforces, extracts the sample test cases, and runs the user’s local code against them to check the output. At the same time, the contest fetcher uses a web scraper to pull upcoming competition schedules from both Codeforces and AtCoder into a single list.Together, these features build out the core data pipeline for the app, handling local test execution and schedule tracking in one place.
I created a small animation for the openning of the app, scrolling up our two current pages with text that prompts the user to click any key to continue into the app. The text also flashes which is pretty cool and I thought was fun to implement!
added the main “Competitive Programming Helper” text on entry of project. pretty cool ig...
|
1792882357.2882843
|
1793746357.2882843
|
|
38854
|
Pulsandola by @slecesama | Stardance
|
slecesama
|
1
|
5.0
|
0
|
[{"ship_num": 1, "ts": "2026-0 [{"ship_num": 1, "ts": "2026-07-26T15:11:15Z", "hours": 5.0, "multiplier": null, "payout": 0, "blessing": "neutral", "text": "this is the first time i dealt with APIs and it was really challenging, thankfully i had a friend of mine and ai that helped me understand some things more deeply and eventually i succeded and im happy with how it turned out! it has 3 widgets, the nasa one, an animal facts one (all facts are stored locally, all customized by my friend) and a weather one. it also has a lil blackjack for when i’m bored. idk if my favorite things are the backgrounds (that i got from reactbits) or the blackjack but im happy about them either way", "repo": "https://github.com/pickledroided/pulsandola", "demo": "https://pickledroided.github.io/pulsandola/"}]...
|
[{"post_id": 35227, "ts": "202 [{"post_id": 35227, "ts": "2026-07-26T15:07:05Z", "hours": 0.8639, "text": "**DEVLOG #04 it’s ready to ship! i added a new widget that displays sicily’s hottest cities (including mine even when it’s not in the top 5 hottest) i fixed the blackjack rules not being set properly and tried fixing the nasa API key that failed to fetch everytime and looked up that it’s their problem rn and not mine so i made a fallback that displays the one from yesterday. i used ponytail to optimize, code review and get rid of the ai slop that helped me fix these things and now it’s ready! i really like it and hopefully i will not be the only one using it :c"}, {"post_id": 34639, "ts": "2026-07-25T15:12:40Z", "hours": 1.5069, "text": "**DEVLOG #03 bgbg i added a lotta things on my free time and the main things are: background selecter: choose bether the galaxy one (the previous one) and this one. shoutout to reactbits.dev, where i got them both from blackjack player: i really like blackjack (not gambling tho) so i thought it would be cool to just add a lil minigame tweaks to widgets: made them bigger so they fit everything, still dont know what to add to the third one still have a lot of optimization work to do and code review, but after that and adding the third widget it will be ready to ship!"}, {"post_id": 34034, "ts": "2026-07-24T13:41:18Z", "hours": 1.3606, "text": "**DEVLOG #02 i revamped the look, even tho rn it’s just a basic layout and added the favorites urls that i can add locally. made the default research engine google but i will make it so u can change search engines such as brave, duckduck etc. and added this widget that displays some fun facts about animals said by my fellow friend who is knows a lot about em. adjusted some looks and css and i have some other ideas in mind that i will post about in a next devlog"}, {"post_id": 33796, "ts": "2026-07-24T00:38:30Z", "hours": 1.0792, "text": "**DEVLOG #01 hi i am now working on this new mission and i am liking it so far! i followed every single step in the guide and got my api key from nasa and this is what it shows today! the only thing that i’ve done other than that was to use a background from reactbits (i love them) and some basic css. still don’t know what to add and what purpose it will have, but im having fun"}]...
|
Title: Pulsandola by @slecesama | Stardance
Devlo Title: Pulsandola by @slecesama | Stardance
Devlogs:
**DEVLOG #01 hi i am now working on this new mission and i am liking it so far! i followed every single step in the guide and got my api key from nasa and this is what it shows today! the only thing that i’ve done other than that was to use a background from reactbits (i love them) and some basic css. still don’t know what to add and what purpose it will have, but im having fun
**DEVLOG #02 i revamped the look, even tho rn it’s just a basic layout and added the favorites urls that i can add locally. made the default research engine google but i will make it so u can change search engines such as brave, duckduck etc. and added this widget that displays some fun facts about animals said by my fellow friend who is knows a lot about em. adjusted some looks and css and i have some other ideas in mind that i will post about in a next devlog
**DEVLOG #03 bgbg i added a lotta things on my free time and the main things are: background selecter: choose bether the galaxy one (the previous one) and this one. shoutout to reactbits.dev, where i got them both from blackjack player: i really like blackjack (not gambling tho) so i thought it would be cool to just add a lil minigame tweaks to widgets: made them bigger so they fit everything, still dont know what to add to the third one still have a lot of optimization work to do and code review, but after that and adding the third widget it will be ready to ship!
**DEVLOG #04 it’s ready to ship! i added a new widget that displays sicily’s hottest cities (including mine even when it’s not in the top 5 hottest) i fixed the blackjack rules not being set properly and tried fixing the nasa API key that failed to fetch everytime and looked up that it’s their problem rn and not mine so i made a fallback that displays the one from yesterday. i used ponytail to optimize, code review and get rid of the ai slop that helped me fix these things and now it’s ready! i really like it and hopefully i will not be the only one using it :c
Ships:
this is the first time i dealt with APIs and it was really challenging, thankfully i had a friend of mine and ai that helped me understand some things more deeply and eventually i succeded and im happy with how it turned out! it has 3 widgets, the nasa one, an animal facts one (all facts are stored locally, all customized by my friend) and a weather one. it also has a lil blackjack for when i’m bored. idk if my favorite things are the backgrounds (that i got from reactbits) or the blackjack but im happy about them either way...
|
1793659956.2695673
|
1793746356.2695673
|
|
16576
|
Frictionless by @Sharkle | Stardance
|
Sharkle
|
0
|
0.0
|
0
|
[]
|
[]
|
Title: Frictionless by @Sharkle | Stardance
|
1793141555.8192723
|
1793746355.8192723
|
|
15710
|
Frictionless by @anish10senthil | Stardance
|
anish10senthil
|
0
|
0.0
|
0
|
[]
|
[]
|
Title: Frictionless by @anish10senthil | Stardance
|
1793141554.9012578
|
1793746354.9012578
|
|
48168
|
PDF Forge by @MadameLouise | Stardance
|
MadameLouise
|
1
|
9.0
|
0
|
[{"ship_num": 1, "ts": "2026-0 [{"ship_num": 1, "ts": "2026-08-15T12:05:39Z", "hours": 9.0, "multiplier": null, "payout": 0, "blessing": "neutral", "text": "PDF forge, a local tool which can merge, edit, compress etc pdf no need to upload to 3rd party websites. Submitting to be published on firefox was challenging because it kept showing errors in manifest.json", "repo": "https://github.com/AmruthaMuralidhar1/pdftoolbox", "demo": "https://amruthamuralidhar1.github.io/pdftoolbox/"}]...
|
[{"post_id": 47461, "ts": "202 [{"post_id": 47461, "ts": "2026-08-15T12:04:17Z", "hours": 8.565, "text": "PDF forge, a local tool which can merge, edit, compress etc pdf no need to upload to 3rd party websites"}]...
|
Title: PDF Forge by @MadameLouise | Stardance
Dev Title: PDF Forge by @MadameLouise | Stardance
Devlogs:
PDF forge, a local tool which can merge, edit, compress etc pdf no need to upload to 3rd party websites
Ships:
PDF forge, a local tool which can merge, edit, compress etc pdf no need to upload to 3rd party websites. Submitting to be published on firefox was challenging because it kept showing errors in manifest.json...
|
1793659953.3618042
|
1793746353.3618042
|
|
14851
|
inventory management system by @pabasaramadhawa | inventory management system by @pabasaramadhawa | Stardance...
|
pabasaramadhawa
|
0
|
0.0
|
0
|
[]
|
[]
|
Title: inventory management system by @pabasaramad Title: inventory management system by @pabasaramadhawa | Stardance...
|
1793141551.2939458
|
1793746351.2939458
|
|
19103
|
Untitled project by @Treta | Stardance
|
Treta
|
0
|
0.0
|
0
|
[]
|
[]
|
Title: Untitled project by @Treta | Stardance
|
1793141547.7969463
|
1793746347.7969463
|
|
31948
|
Hackpad by @rishitsahu_2008 | Stardance
|
rishitsahu_2008
|
1
|
2.0
|
0
|
[{"ship_num": 1, "ts": "2026-1 [{"ship_num": 1, "ts": "2026-10-27T17:23:02Z", "hours": 2.0, "multiplier": null, "payout": 0, "blessing": "neutral", "text": "I made this macropad which features a 3*3 layout a display, a rotary encoder and cool RGB lighting to shape the mood. I have made this basically to use for gaming but I might add some layers in the future to use it for other purposes as well. This project was engaging and doable for me but the coding part felt a little messes up initially (indeed it was lol) but somehow I figured it out. Anyone can try my project from my GitHub. (I am sorry I cant attach a complete image of my macropad because the 3D print is delayed and will arrive after 31st October.)", "repo": "https://github.com/RishitSahu2008/ClutchPad", "demo": ""}]...
|
[{"post_id": 79612, "ts": "202 [{"post_id": 79612, "ts": "2026-10-14T18:22:02Z", "hours": 0.5333, "text": "I was debugging the LEDs of my board. So I was able to make them work but the wave effect I really wanted is not working. Also 2 of the LED’s are not lighting up , so I will first replace them and then further work on the LED part. Then finally I will make the OLED display work. The 3D printed case will also be there in a week or so."}, {"post_id": 77087, "ts": "2026-10-05T16:41:05Z", "hours": 1.0167, "text": "I had forgotten to record myself while soldering the components on the PCB. Right now I was debugging the code. It was not working . So I was able to make the keypresses work but the rotary encoder and OLED display and LED are still not working. Will try to fix them too as soon as possible."}, {"post_id": 30034, "ts": "2026-07-17T09:13:20Z", "hours": 0.4833, "text": "I have now finally completed my project firmware and named it “Clutchpad” (ill use it for gaming). All the files and images have been uploaded to github and will now submit the design and hope it gets accepted."}, {"post_id": 29406, "ts": "2026-07-16T10:33:38Z", "hours": 0.7669, "text": "I am working on the firmware for my hackpad. I am using kmk for it and plan to switch to qmk after a while. It is quite challenging as the docs are kinda tough to understand and there are not many yt videos teaching the concept."}, {"post_id": 27615, "ts": "2026-07-13T11:10:44Z", "hours": 1.2153, "text": "I have finally completed the case for my hackpad. I will now once go through all the design again and make any minimal changes if required. Then ill start woking on the firmware for my board."}, {"post_id": 27576, "ts": "2026-07-13T09:01:09Z", "hours": 1.8003, "text": "Hello. I am currently working on making the backplate of the hackpad. This process is taking quite a time as it is my first time using fusion and designing 3d things. Learning many new things while working."}, {"post_id": 27035, "ts": "2026-07-12T06:17:25Z", "hours": 0.4336, "text": "Hello. I am now working on the case. I imported my pcb design file into fusion. Then i figured which type of keyoard layout would be perfect for me. I did some measurements of my pcb and starting to work on the backplate."}, {"post_id": 26590, "ts": "2026-07-11T14:39:56Z", "hours": 1.1006, "text": "Hello. Today I learned fusion 360 by watching a yt video which tought some basics of using the software. I made a simple assembly using it. Now i will start designing the case for the hackpad and will learn new things as they come on my way. If anyone has any suggestions regarding my project pls let me know."}, {"post_id": 25941, "ts": "2026-07-10T13:21:57Z", "hours": 1.4, "text": "Hello. I have now completed the pcb part. I traced the connections on the pcb. had to reduce the no of LED’s by 4 as they have 4 pins so create kindof a problem when spread. Had to repeat everything again like assigning 3d models, arranging etc."}, {"post_id": 25894, "ts": "2026-07-10T11:54:11Z", "hours": 1.8169, "text": "I started routing my pcb. But then i discovered i had made a huge blunder. I had not connected led to the microcontroller and the orientation of things was not perfect so i had to place vias . many of them. Now ill have to start the pcb design over again. I guess ill even have to remove those extra jumpers that i has previously added . T_T"}, {"post_id": 25781, "ts": "2026-07-10T07:32:24Z", "hours": 0.7656, "text": "I added 3d models for each components in kicad. This took quite a time as i couldnt figure out how to add 3d model into footprint. I have 9 switches and 10 led so had to add the 3d model to each one of them. I tried adding it to the footprint and was even succesfull in that but still the 3d models were not coming into the 3d viewer. If someone has any idea regarding how to asign same 3d model to many pieces of same component in kicad pls let me know in the comments. Also if there is any design change that you think will be helpful let me know."}, {"post_id": 25361, "ts": "2026-07-09T16:39:23Z", "hours": 0.6836, "text": "I arranged the components in the pcb editor. The part that was a little challenging was deciding the gap. I searched of the keycap width and breadth and then spaced accordingly. I also made some changes in the led arrangement and added an led. Also i was facing problem with some footprints i had added so i troubleshooted them as well. Then viewed it in 3d and it seems to be good. I will now add a logo or something to the pcb. Then will start working on the 3d case."}, {"post_id": 25267, "ts": "2026-07-09T12:52:52Z", "hours": 0.6836, "text": "I assigned the footprints to the schematic components. Then i converted in into pcb. However i am facing the problem that the 13th pin of the xiao board is also being assigned as 5v . The same problem is happening in the oled module. I thought that i had downloaded the wrong footprint for the board. but then i downloaded from the official site and uploaded them but still facing the same problem. Later i checked the problem was i had done a huge blundr. All the things are correct just at one place i had mistakenly connected the gnd and 5v. (spent too much time but learned something ). Will now work on designing the pcb and the orientation of components. Pls let me know if you have any suggestions for the same."}, {"post_id": 25241, "ts": "2026-07-09T11:38:03Z", "hours": 0.8172, "text": "I realised that the schematic i designed earlier was too basic and could be done better. So I have now added diodes (as i have to use a matrix design cuz it does the task by utilising only 6 pins of the controller). I have also added an oled display and a rotary encoder. I also thought of adding lights to make it cooler and think of controlling them using the rotary encoder. Also i had a pin left so i have provided headers for that extra pin , gnd, 3.3v, 5v, scl and sda(so if i want to add something in the future it will be much more accessible). Will once again check this circuit for any errors and assign footprints and then design the pcb . Currently thinking for some design ideas for the pcb rather than rectangular."}, {"post_id": 24658, "ts": "2026-07-08T11:56:27Z", "hours": 0.3669, "text": "I designed the basic schematic. Might think of adding a feature or two. Learning while working."}, {"post_id": 24111, "ts": "2026-07-07T14:01:12Z", "hours": 0.25, "text": "Currently working on learning kicad so i can design the schematic and pcb."}]...
|
Title: Hackpad by @rishitsahu_2008 | Stardance
De Title: Hackpad by @rishitsahu_2008 | Stardance
Devlogs:
Currently working on learning kicad so i can design the schematic and pcb.
I designed the basic schematic. Might think of adding a feature or two. Learning while working.
I realised that the schematic i designed earlier was too basic and could be done better. So I have now added diodes (as i have to use a matrix design cuz it does the task by utilising only 6 pins of the controller). I have also added an oled display and a rotary encoder. I also thought of adding lights to make it cooler and think of controlling them using the rotary encoder. Also i had a pin left so i have provided headers for that extra pin , gnd, 3.3v, 5v, scl and sda(so if i want to add something in the future it will be much more accessible). Will once again check this circuit for any errors and assign footprints and then design the pcb . Currently thinking for some design ideas for the pcb rather than rectangular.
I assigned the footprints to the schematic components. Then i converted in into pcb. However i am facing the problem that the 13th pin of the xiao board is also being assigned as 5v . The same problem is happening in the oled module. I thought that i had downloaded the wrong footprint for the board. but then i downloaded from the official site and uploaded them but still facing the same problem. Later i checked the problem was i had done a huge blundr. All the things are correct just at one place i had mistakenly connected the gnd and 5v. (spent too much time but learned something ). Will now work on designing the pcb and the orientation of components. Pls let me know if you have any suggestions for the same.
I arranged the components in the pcb editor. The part that was a little challenging was deciding the gap. I searched of the keycap width and breadth and then spaced accordingly. I also made some changes in the led arrangement and added an led. Also i was facing problem with some footprints i had added so i troubleshooted them as well. Then viewed it in 3d and it seems to be good. I will now add a logo or something to the pcb. Then will start working on the 3d case.
I added 3d models for each components in kicad. This took quite a time as i couldnt figure out how to add 3d model into footprint. I have 9 switches and 10 led so had to add the 3d model to each one of them. I tried adding it to the footprint and was even succesfull in that but still the 3d models were not coming into the 3d viewer. If someone has any idea regarding how to asign same 3d model to many pieces of same component in kicad pls let me know in the comments. Also if there is any design change that you think will be helpful let me know.
I started routing my pcb. But then i discovered i had made a huge blunder. I had not connected led to the microcontroller and the orientation of things was not perfect so i had to place vias . many of them. Now ill have to start the pcb design over again. I guess ill even have to remove those extra jumpers that i has previously added . T_T
Hello. I have now completed the pcb part. I traced the connections on the pcb. had to reduce the no of LED’s by 4 as they have 4 pins so create kindof a problem when spread. Had to repeat everything again like assigning 3d models, arranging etc.
Hello. Today I learned fusion 360 by watching a yt video which tought some basics of using the software. I made a simple assembly using it. Now i will start designing the case for the hackpad and will learn new things as they come on my way. If anyone has any suggestions regarding my project pls let me know.
Hello. I am now working on the case. I imported my pcb design file into fusion. Then i figured which type of keyoard layout would be perfect for me. I did some measurements of my pcb and starting to work on the backplate.
Hello. I am currently working on making the backplate of the hackpad. This process is taking quite a time as it is my first time using fusion and designing 3d things. Learning many new things while working.
I have finally completed the case for my hackpad. I will now once go through all the design again and make any minimal changes if required. Then ill start woking on the firmware for my board.
I am working on the firmware for my hackpad. I am using kmk for it and plan to switch to qmk after a while. It is quite challenging as the docs are kinda tough to understand and there are not many yt videos teaching the concept.
I have now finally completed my project firmware and named it “Clutchpad” (ill use it for gaming). All the files and images have been uploaded to github and will now submit the design and hope it gets accepted.
I had forgotten to record myself while soldering the components on the PCB. Right now I was debugging the code. It was not working . So I was able to make the keypresses work but the rotary encoder and OLED display and LED are still not working. Will try to fix them too as soon as possible.
I was debugging the LEDs of my board. So I was able to make them work but the wave effect I really wanted is not working. Also 2 of the LED’s are not lighting up , so I will first replace them and then further work on the LED part. Then finally I will make the OLED display work. The 3D printed case will also be there in a week or so.
Ships:
I made this macropad which features a 3*3 layout a display, a rotary encoder and cool RGB lighting to shape the mood. I have made this basically to use for gaming but I might add some layers in the future to use it for other purposes as well. This project was engaging and doable for me but the coding part felt a little messes up initially (indeed it was lol) but somehow I figured it out. Anyone can try my project from my GitHub. (I am sorry I cant attach a complete image of my macropad because the 3D print is delayed and will arrive after 31st October.)...
|
1793659947.3075445
|
1793746347.3075445
|
|
11277
|
My awesome macropad! by @ojasmane | Stardance
|
ojasmane
|
0
|
0.0
|
0
|
[]
|
[]
|
Title: My awesome macropad! by @ojasmane | Stardan Title: My awesome macropad! by @ojasmane | Stardance...
|
1793141546.8442597
|
1793746346.8442597
|
|
7592
|
My first slack bot! by @jameseknight | Stardance
|
jameseknight
|
0
|
0.0
|
0
|
[]
|
[]
|
Title: My first slack bot! by @jameseknight | Star Title: My first slack bot! by @jameseknight | Stardance...
|
1793141541.3562567
|
1793746341.3562567
|
|
3286
|
My awesome macropad! by @adityavengata | Stardance
|
adityavengata
|
0
|
0.0
|
0
|
[]
|
[]
|
Title: My awesome macropad! by @adityavengata | St Title: My awesome macropad! by @adityavengata | Stardance...
|
1793141539.1666539
|
1793746339.1666539
|
|
39244
|
My Portfolio by @Harpaavan108 | Stardance
|
Harpaavan108
|
3
|
51.0
|
792
|
[{"ship_num": 1, "ts": "2026-0 [{"ship_num": 1, "ts": "2026-09-08T02:40:17Z", "hours": 13.0, "multiplier": 18.14, "payout": 243, "blessing": "neutral", "text": "Ship #2 for My Portfolio This is my second ship for this project. Since my first ship, I have mainly just added some small features to increase the UX. A lot of these changes were features that I had seen on websites that I liked. So when the time came to bedazzle my website, I implemented these features in my own website. One really consistent thing that I noticed while implementing these features, is that a lot of features are quite simple to implement once you understand the basic logic. I also noticed that once you add these small features, it can make a great effect on the UX, and that the few hours you put into the little things, can have a huge impact and create a great impression on those who visit your website. New Features I added a cool gradient horizontal scroll bar that fills up as you scroll down. I thought this was a super cool feature and required some simple JS logic to implement. The next thing was a loading page. It is a quite simple one, just having a gradient filled circle outline which spins to show a loading effect. Again a small feature just to add nice feel from the moment a person opens the webpage. The next thing was a scroll fade up reveal to everything in the site. I really like seeing this effect on other websites as well, so I wanted to implement it into my website as well I added media queries because I saw how bad the website looked on the phone, and it was just really annoying me. So I took the time to add that just in case I ever had to show anyone my webpage on the phone. After that, I decided to upload some of my certificates onto the website so people could very them, just to add another level of validity. However, instead of making the images open in another tab, I made them open in a modal that stays in the browser tab. I thought this was a super cool effect. Last thing was that I added my photo. To do this, I made it so that when someone hovered over my about me card, it would have a flip animation and on the other side my photo would show. I thought this was a nice and subtle was to implement my photo, without messing up any other styling on the page. Learning JS A lot of these features were implemented with JS, especially ones that were triggered with user input. I will acknowledge that I used AI to help with understanding JS logic for some of these features, and debugging as well, but I also learned along the way. I find JS much more complicated than HTML and CSS, and I think that I have really come far in understanding and implementing it. For examples, I can assign elements and add and remove classes based on user input. I still have some trouble with syntax, and that causes a lot of my problems, but I am really starting to get the hang of JS. I think that JS can create some really neat animations and effects, so I want to learn and understand this language, so that I can let others experience the cool things that I see on other websites. Overall I spent a lot of time on this project, and put in hours even after school started. It is a really personal project. I have come really far since I first started this project and I have grown confident in understanding and writing code and achieve the desired results. I probably will not work on this project after this ship, and will instead turn to other projects that I have pending. Please enjoy this project. If you have any suggestions, let me know in the review or as a comment, and I will try to implement it. Thank You!! Below is a picture of my stardance certificate in the modal that I made, and the other is a picture of the spinning gradient loader. Enjoy!!!", "repo": "https://github.com/Harpaavan-S/my-personal-website", "demo": "https://harpaavan-s.github.io/my-personal-website/"}, {"ship_num": 2, "ts": "2026-08-17T04:39:55Z", "hours": 37.0, "multiplier": 14.92, "payout": 549, "blessing": "neutral", "text": "My Portfolio Project Hi! Welcome to my Stardance project. In this project, I made a personal portfolio website so I could showcase my work. Especially as I enter high school this year, I wanted to have a platform to record all of my progress and have a way to display it to the public. I also wanted to get more experience with coding. Over the past few years, I have done like super mini project in HTML and CSS, but this website is one of my first fully developed projects, and that I have coded all by myself. So I took this opportunity to properly learn HTML and CSS, and also introduce myself to languages like JS and GLSL. Features The website has 6 sections that I made: Hero About Me Projects Experience Achievements Contact Here are some features of my website: The website has an interactive navbar which links to each section in the webpage. There is also a logo in the corner which will link to the Hero section. The navbar has a frosted glass look, which makes blurs the background behind it. The title in the Hero section (which is my name), has a rainbow gradient applied to it. The cool part is that the gradient moves and loops in the name, so the gradient is always moving slowly. This is actually applied to all of the section headings in the webpage. Each card in every section has a frosted glass look applied to it, so it will blur the background behind it. They also enlarge and brighten when you hover over them. The cursor is a small white dot instead of a regular cursor, which enlarges and turns light purple when hovering over a link to communicate to the user that the link is clickable and will lead somewhere. One of the main highlights is the background, which is a shader background made with GLSL, WebGL, and Three.js. The background is an animated gradient. It is also interactive as it will respond to the cursor on the screen. It is one of the key aspects that really make this website shine, and what really makes this project unique and different from other ones. The Easy and Hard Parts Easy Part There were some really easy parts while building this. One was building the HTML layout. After I understood the basics of making classes and organizing texts and everything, it was quite easy to start filling out info for all of the sections. I thought it would be like a really big thing to fill in all of that info, but turned out it wasn’t quite hard. Hard Part There were also hard parts. One main one was the shader background. First it took a really long time to code the first draft of that, as I had to make a shader in GLSL and then import Three.js, and all of that. But then that first draft didn’t work, so then it took me a really long time to debug the code as I had to look through everything for like typos and all that. I did use AI for this part, but it was still a really long and hard process, going back and forth trying to see what was wrong. But in the end it was totally worth it. Overall Overall, I spent a lot of time and effort in this project. One thing that I really wanted to do was make just that I documented all of my progress frequently in devlogs, and I think that I achieved that because all of the 13 devlogs that I have written are pretty detailed. I also wanted to make this unique to me, and I think that the shader background achieved that and just brought the project to a new level. I really hope you enjoy it, and I am happy to take any feedback. I hope to constantly keep updating this project over the next few years. Otherwise, I might add some new features to it (including a scroll bar) in the next month before Stardance ends and I get too busy with school. Below you can view some screenshots of each section of the website (it doesn’t let me upload a video, or else I would’ve done that). Enjoy!!!", "repo": "https://github.com/Harpaavan-S/my-personal-website", "demo": "https://harpaavan-s.github.io/my-personal-website/"}, {"ship_num": 3, "ts": "2026-07-26T23:22:26Z", "hours": 1.0, "multiplier": null, "payout": 0, "blessing": "neutral", "text": "I am working on my personal portfolio. Right now I am just working and crafting the sections and filling in some info. I still have to work on styling and go through all of the sections. But for now I am going to ship", "repo": "https://github.com/Harpaavan-S/my-personal-website", "demo": "https://harpaavan-s.github.io/my-personal-website/"}]...
|
[{"post_id": 63958, "ts": "202 [{"post_id": 63958, "ts": "2026-09-08T01:36:41Z", "hours": 2.1653, "text": "Devlog # 17 This is my final devlog before I ship! I wanted to add a picture of myself in the website so I tried to find a way to do that. I decided that I will make it so that the about me card will flip when hovered over and on the other side will be my image. I thought it would be pretty simple, so I began working on it at 12 last night thinking I could finished it in about 30 minutes. Turns out I was wrong. It took me more than two hours just to get a card to flip and show my image. It was a pain, but the end result looks really neat. Current Progress To make the flip card, I had to restyle the entire about me section. I used a W3Schools tutorial, but i couldn’t end up working well with it, so then I turned to AI for debugging, because I had so many div layers for that card, and then I finally styled it to look good. The effect looks really good though. As well, I decided to publish everything to Github as well now because I hadn’t published anything for the past couple of days so yeah. Then I found a problem with the images not getting pulled correctly, so then I had to transfer all of those to a public/ folder and then adjust the file paths for all of them in my code, and then reload and redeploy like a bajillion times. So it was a lengthy process, but I finally got it working publically, Next Steps My next step is to ship. I really hope I get rated good because I want a pebble time 2. After this I will begin to work on my next project for the remainder of the event, which is a new tab page. After that, I am done with Stardance, as I also have a lot of school work now. So I will ship soon!!"}, {"post_id": 63201, "ts": "2026-09-06T21:23:17Z", "hours": 4.7169, "text": "Devlog #16 So I decided to implement some feedback that I got from the last ship. One piece of this was adding my actual certificates into the website, so people could actually view them in the webpage. So I took some time to scan all my certificates. Creating the links wasn’t quite hard, and at first I thought about just letting it open in a new tab, but then I decided to create a modal just to enhance the UX. Current Progress I decided to add all my certificates into the webpage, just to add a layer of validity to my work. The first part was finding all of the certificates. Whatever I had, I added them to my GitHub repo, and just linked the relative paths in the webpage. The ones which I had online, I just drag and dropped into the repo, while the physical ones I had to scan and then add in. So that took a while, but wasn’t too tedious of a process. After that, I just made a “View ->” sign that appears when you hover over the card, and that is actually a link to the image. Then I decided to make a modal. I realized it actually isn’t too hard, but the JS logic is a but complicated. I styled the modal in CSS, and then just added a .open class to it which was activated when you click the link. So I’m starting to understand JS logic, the only thing that I have trouble with now is writing like proper syntax, as I still have trouble with writing the correct syntax, and that can cause some problems. So then I styled how the image looks in the modal. At first I though about add ing a X to close the modal, but then I made it so then if you press outside the image, then the modal disappears. Some of my UCMAS achievements do not have images attached to them because I couldn’t find actualy certificates for them, so I might take pictures of my trophies to put there, but I haven’t got to that yet, and I don’t want to put low-quality images. So those are still empty, but almost everything else is filled, so now you can go and view those. Next Steps I literally don’t have anything left to do on this, so I think the next step is to just ship. I will take a break from this project and begin to work on my next one, which will be making a cool new tab page from my browser. So expect a ship soon. If anyone has any suggestions on something to add, you can let me know! Below is an image of my stardance certificate shown in the modal on the page."}, {"post_id": 57641, "ts": "2026-08-29T21:00:28Z", "hours": 2.5014, "text": "Devlog #15 This will be a fairly short devlog. I spent this block adding media queries to my CSS code because I opened the website on my phone, and it just looked so wrong to me, so I spent some time doing that. I figured out a great way to simulate a phone screen in my browser using DevTools so I was able to adjust everything through that. Current Progress The plan was that I was going to do media queries at first, but I thought it would be too complicated so I held it off. Now I was kinda forced to after seeing how bad the webpage looked on a phone screen. I realized you just have to make on CSS rule for media queries using media (max-width: 768px) {} . I decided to use 768px because that is like a standard width, but I mainly tested it on 400px width. After that, I opened two windows with my code and as I went through it, I would add a media query rule in the other window. So I conquered my fear of media queries, and addressed that issue. Next Steps I am looking for things to do. One piece of feedback that I got was that my cards had hover effects that made them look like buttons, but had no button effects, so it was kinda misleading. So to fix this, I’m thinking of like scanning my certificates and uploading them as pictures that people can view in the browser. So that’s my next step. To accompany this, I might also do like a redesign of the website, like just adjusting some of the features. Also, I’m thinking of adding a dark mode/light mode feature on it. Below is a quick video of the site on a device with a width of 400px."}, {"post_id": 53562, "ts": "2026-08-24T04:58:54Z", "hours": 4.0317, "text": "Devlog #14 So I started working on it further before my project even got fully rated, so this is my first devlog after shipping my portfolio! During this block, I just added some small features that just overall polished my site a bit more. A lot of these features were added in JS, and I think I actually am starting to get the hang of JS in the way that I actually am starting to understand how to identify objects using const and like how to select them using document.querySelector . So I think I am starting to learn, and just working with these little features just got me a little more familar with JS. I also got the hang of CSS animations, as before I had a little trouble understanding keyframes, but now it makes sense, so it was a good block. Current Progress I added three main things to my website, each of which use JS in them, and I will explain how. The first thing that I added was a scroll progress bar at the top. I really wanted to add this onto website, as I really liked seeing them on other websites, and I styled it to match my theme, and it just looks super good. I make a horizontal bar in my navbar for this, and it has a rainbow gradient. Basically, JS detects where the person is at the website, and just adjusts the scale based on that to show the bar. At first, I made it so it would expand as I scrolled, but then the rainbow was like squished at the beginning, and then I adjusted it so that it actually revealed the bar as I scrolled down, so like same idea but just applied to a different thing. I looks super cool now. The next thing that I added was a loading page. I tried to look into some videos for this, but I ended up making a super simple gradient ring that was animated (again to spin a rainbow). For this, I like made a loader page, which covered the whole view. In it, I made a circle which had a rainbow conic gradient, and then just animated it in CSS to rotate to 360 degrees over the course of like 1.2 seconds. I then used JS to add a class which made the loader disappear and like unresponsive to any pointer controls when the site finished loading. It also looks super good and totally matches the vibe of the site. So yeah, super happy with that. The last thing that I added was like a scroll fade up reveal effect to almost everything in my site, like the cards and the headings and everything. Again, this was a pretty simple trick that I used. Basically you set the object a set number of pixels (like I used 30px) down on the Y axis and turn the opacity down, and then when JS detects the object as the person scrolls, it just moves it up to 0px on the Y axis and goes to full opacity, and it ends up looking super sleek. That little touch just upped the whole website. I was actually looking to add this feature in the beginning of my site, but I never got to it mainly because it used JS, so now I took the chance to add it in. A lot of these features were ones that I saw in like cool websites. So like I’m always on the lookout for cool features, and these were some that I thought really made a website look more polished, and I realized that they are not actually that hard to build once you understand the core concept. Through these I really got better in JS, and upped my skills in CSS, so it was a good block. Next Steps I really do not have anything left to add in this project. Like I even added extra stuff. Please, if you guys have any suggestions, comment them so I can implement them. I will attach a video of my site so you guys can see what its like. One thing I might consider adding is like a easter egg thing or some like sequence or action that will generate a cool surprise. I have to still think about that. But right now I have almost nothing left to do. I actually might ship this again just to get the hours counted in. Below you can see the loading and the scroll fade up reveal and the scroll progress bar at the top."}, {"post_id": 48639, "ts": "2026-08-17T03:42:49Z", "hours": 7.0575, "text": "Devlog #13 (Last Devlog Before Ship) I am finally done with my website. Please read the NEXT STEPS section of this devlog as I have favour to ask you guys . I spent 7 hours of my life building a shader background for my website, but it totally paid off in the end because now I have a really cool, interactive, animated gradient background. I used GLSL to write a shader, and WebGL and Three.js to implement it into my website. I used a video tutorial and some AI debugging to achieve the effect, but it really was a learning process, as I had to install all the tools for it and then work with those, so I learned how to use those. Because of this, I also spent some time updating my README. Current Progress First of all, it took me a really long time to find a good tutorial to make a background, because I really wanted an animated one to show my blur effect and really add a pop to my website. To acheive a shader background I watched a video tutorial from Codegrid, which explained everything really nicely and was quite quick, so I was able to write the code. After though, the background didn’t quite show, so then I used the help of AI to help debug the code and get it working. After I finally got it to work, I spent some time adjusting colors, and brush strength and size, and then distortion amount and fluid decay and all of that stuff until I found the perfect values for a super good looking background. Overall, it was definately worth the time and added a really nice touch to my webpage. I also updated by README, because now the user will need to install some dependencies for this webpage because of the addition of Three.js and everything. So I updated the README to include proper instructions for that and so it explained some more features of my website. I really polished it up, because it was kinda messy before, so I got it ready for a ship. I also changed my cursor one last time. What I had before was a <div> element in HTML following my actual cursor using mousemove in JS, and my actual cursor was hidden in CSS. However, it was like lagging behind and that was starting to show on my new background. So instead, I just made my cursor a little white dot in CSS by liking making a svg file and linking it to the cursor. It just improved user interaction a lot be removing any lag between an following element and the actual cursor. There is still the feature where it will turn bigger and light purple when hovering over a link. Next Steps My next step is to ship!!! However, I have to ask you guys for something. I need some color suggestions for my background. I got a nice one right now that is like dark purplish, but I want your guys’ suggestions on what type of gradient I should make. I can put 4 colors into the gradient. You can use the attached video below to view how the shader looks on the hero page. I do have glass cards, so I don’t want something too light, but it could make a nice addition in a dark gradient. So please put some suggestions in the comments!!! Thank you!!! I will ship right after this, but I will for sure try to look over some color suggestions and experiment around with them. I might try to use one before I ship the final version of the website, so please put some suggestions. Expect a ship really soon."}, {"post_id": 46584, "ts": "2026-08-13T22:23:45Z", "hours": 4.4961, "text": "Devlog #12 This block was mainly dedicated towards making my site look a lot more aesthetic. I spent over 4 hours just tinkering with JS and fonts and color combos and everything, trying to find the perfect combos and fonts that looked super good. I am overall very happy with the progress that I made in this amount of time. At first I thought that the site looked good even without any styling because of my color gradients and all of that, but I just realized how much better it is with like better fonts, and like the small things, like moving gradients instead of static ones. So this whole block was just dedicated to making my site look better. Current Progress The first thing that I did was change my cursor. For this I had to use JS. I changed the cursor to just be like a little white dot with a nice glow around it, and then when it hovers over like a link, then it gets a bit bigger and turns into a light purple color. In JS, I figured out how to like grab an element from CSS, and then use like states, like mousemove to have like a specific action, and then like have the dot follow my actual cursor, but super close so it seems like that is the cursor. And then I hid my actual mouse to really sell the illusion. For the hover thing, I created a hover class in CSS, and then added that class when the mouse “entered” a link, and removed it when it “left” the link. The next thing I did was make the gradients on my text like circle around, so the gradient was always moving around and it looked like dynamic. I actually got this idea from the Hack Club website because in there they have a moving gradient on the text. For this, I actually did not need any JS, and instead just make a looping animation in CSS for the background of the text. I first did it only for the Hero title, but then I liked it so much that I added it to all of the section headings so yeah I thought was a really nice addition The next thing that I did was to edit my skill icons. I mentioned in a previous devlog when I was styling the About Me section, that the little subtitle for each skill was showing on the top of it, so then for skills in the bottom row, it was covering the skill on top. I also used JS for this fix. I first made a class for the subtitle on the bottom, and then again in JS made it so if it was detected to be lower, that class would apply The last thing I did was change the fonts. I am really happy I did this, because the site just looks so much better with different fonts. I imported all of my fonts from Google Fonts. I inserted the link in the <head> section and then used that font family in CSS. I did a lot of like comparing and swithcing around and researching and all of that just to find good fonts, and I have a really bad habit of like taking a lot of time on these kind of things, and it wasn’t even getting tracked on Hackatime, so I tried to do it quickly. I found some really nice fonts for the headings and titles so I am super happy with that. Next Steps Now the only thing left to do that I still havent gotten around to yet is making a really nice background in JS. I really want to make an animation background, because I think that will be like a unique aspect of my website. The main thing I really want that for is the glassmorphism effect that I have on the cards. On a plain dark background, you can’t tell at all that there is a glass effect. But with a sick background that moves, you can see that shapes blur under the cards. So I think that is the last thing to do, because I finished up all the small little details. However, I also think this will be the longest and hardest part because of its complexity in JS so yeah. I am really hoping to ship soon after 1 or 2 more devlogs. Below is a video of the new hero section with cool fonts and a moving gradient background."}, {"post_id": 45456, "ts": "2026-08-11T22:41:43Z", "hours": 3.7847, "text": "Devlog #11 I have finally finished styling my whole website in CSS. It was such a long process, but I really think that I learned how to code in CSS. Position and display no longer confuse me and I have gotten the hang of adding cool effects to me elements. I am really liking the theme of my website, but I still have more to do. Right now, I have a lot of empty space in my website. Because all of my cards are glassmorphism, I am planning to use JS to make really neat background just to add like a nice touch and really sell the website, but that might be after the first ship. I am also planning to change some fonts and all that, so still a lot to do. Current Progress I finished the Achievements and Contact section and also styled my footer. I made a masonry style layout for the achievements, and I think the design turned out really neat. At first, I thought I would use a flexbox or a grid, but then I saw that I could just make a fized number of columns and the text would just automatically arrange itself. So I used that instead of getting all tangled up in like flex and grid properties and all of that. But then it actually made it like vertically ordered, but I wanted it horizontally, so I took the time to like arrange them so that the layout would appear even and it would look like it was horizontally arranged, when in reality it is actually vertically arranged but in a weird way. It makes more sense when you look at it. I also finished the Contact section. This was quite easy. I just styled it like the Hero and added two little icons: one to my email, and the other to my github, so yeah that was pretty simple. I first thought of adding a contact form, but then I realized that that needed a backend, so I decided against that. Again, if I want, I might add it later in the future, but for now I will leave it at just to two icons. So mainly I finished those two sections in this block. One more cool thing that I discovered was how to make links open to a new page, because while I was trying out links it was bugging me that it was always opening in that page, so this really put my mind to ease a bit, and makes navigation a bit easier. Next Steps I am planning to ship very soon. I am thinking of just adding some finishing touches before shipping the first version, like some font changes. I might also just try to play around in JS, and like get a feel of it, Because I think that a cool background will really take it to the top, so I will play around a bit with that. i’m also thinking about adding like scroll up effects, especially for like my experience timeline. But yeah next steps might just to be to polish it up just a bit before shipping. I am super excited to try out JS, and hope that the final product will be awesome. Below is a picture of the masonry effect of the achievements section."}, {"post_id": 44357, "ts": "2026-08-10T02:05:02Z", "hours": 3.055, "text": "Devlog #10 I have finished the Experiences section of the website. This section was for sure a lot trickier than I thought it would be. The hardest part was trying to figure out how to arrange the boxes in a vertical but staggered order, so I could build the timeline. However, on the upside, I was able to quickly do styling, because a lot of the colors and like hover effects and everything was already set up in my code from styling the previous section, so that did not take too much time. Overall, I really like how this section turned out, and I think it is a bit different from the rest of the sections. Current Progress I completed the Experience section. This one is styled a bit differently from the other two. In this one, the timeline in centered and it goes longer than the length of the screen. The about me section and the projects section were all set to be as tall as the screen itself using height: 100dvh , but this one is actually dictated by the length of the cards, and then I added some padding at the bottom to separate it from the next section. The tricky part was to actually make the timeline affect. At first I did some research and thought or using pseudo elements in CSS to create a line through the middle of the page and arrange the boxes beside it. But that was way too complicated and didn’t seem to work for me, so I decided to arrange the boxes first and then add the line later. To arrange the boxes, I first centered them vertically in the middle of the screen, and then gave half of them one class and the other half another class. Then I pushed one class completely to the right, and the other to the left and that created a staggered timeline look. Then I needed to add a line through it. To do this, I created an empty <div> tag at the beginning of my experience section and then styled it as a line as long as my experience cards and then filled it with a rainbow gradient to kinda match my theme. I also added tiny circles using the same method to the timeline wherever their was a card to kinda just make it look cooler. I will acknowledge that I did use a bit of AI for this section to research the different ways to position the boxes, but otherwise I implemented all code by myself and I did not copy paste anything in. I really think this section introduced me to the flexibility in CSS, and how to manipulate different rules and elements to get the desired effect. Next Steps I am now going to work on the Achievements section. I am planning on making this section like a staggering kinda page of acheivements, like not quite even, just like a mosaic, because there is a lot of content in this section. For a kind of visualizer, I am planning to kinda style it like a pinterest page so like staggered and just fitting together. I just hope that it doesn’t turn out to jaggedy or uneven at the end of that part, and that it doesn’t take too long to organize them to look like at least like reasonably even at that. Hopefully I finish this section pretty quick, like just an hour or 2, and then I will quickly finish up the contact section as well, so then I will post a devlog of those two, but yeah I will see. I think I am getting close to a ship so keep an eye out for the next few days. Below you can see like the full experience timeline like zoomed out and I am hovering over the first card."}, {"post_id": 43667, "ts": "2026-08-09T01:57:34Z", "hours": 3.26, "text": "Devlog #9 I finished the Project section of the website. I also took some time to like style and experiment with some like hovering effects in the website. I also figured out how to color texts with gradients, so I changed all of my main section headings to cool colorful pastel gradients. I also made each glass card look cool when you hover over it. I also made some of the text like get bigger or show cool stuff when you hover over it. So yeah. I really think I am getting the hang of CSS. Most importantly, I think that I am able to use resources from the internet and apply them accordingly to my website. This block was mainly like a styling portion to kinda experiment and apply some aesthetics to my site. Current Progress I finished the Projects section. This section was much easier to arrange. Instead of using display: flexbox I used display: grid to help position each of the cards into an organized layout. What I really like about this display is that it automatically does all the math itself and gives each card its own equal amount of space so that they look even on the page. I got 4 nice cards for each project. I also styled the the heading to look like a gradient. I figured out that you make the background image a gradient, and then clip it to the text, and then just make the text clear so that the color shows. So I made all the headings look like that. Another thing that I did was use box-shadow to make the cards look cool when I hover over them. I realized that there are a lot of elements for the box-shadow, though once you figure them out, its not too complicated. So then I applied the box shadow effect to everything in the website that it would look good on. So yeah that was also a learning experience. I also figured out how to make a specific thing appear once you hover over like a bigger topic. So like I made some text a bit bigger or like an element appear when i hover over the whole card. You add the hover rule for the big card, and then add the class for the specific element, and then do your ending look. I used that for some things. So I really got some styling done to make my website like look better. Next Steps I will now work on the Experience section. I have around 6 cards for this. For this section, I am planning on making like a scrolling timeline to showcase like all of the past stuff in a chronological order. This might be tricky because up until now I was using the height: 100dvh to determine how big a section would be, but this one is going to have to different from that because of its scrolling nature. So yeah. But I think I am really getting the hang of positioning and display. and how to manipulate objects between different rules. I am starting to realize that code is not as strict as I thought it was. Like I thought everything needs to be like letter precise, but you have a bit space to improvise and experiment. So I can actually code a bit in CSS. I really enjoying styling things, like the gradient texts or like hover effects, so I am going to make sure to include those things in this next section as well. I am excited to get to work and encounter this new challenge. Below is a picture of the Projects sections and I am hovering over the first card, so you can see the hover effect."}, {"post_id": 43107, "ts": "2026-08-08T06:12:14Z", "hours": 3.0431, "text": "Devlog #8 I am finished the About Me section. I came across a problem though. In the pills, I want it to be like that when I hover over the pill, the name of that skill shows above it in a small text. However, pills in the bottom row, their text will start to hover into the pill of the next row, so that messes up the thing. BUT, if I add a space, it will look like a really weird gap between the rows. I did some research and I read that I might need to use some JS to fix, so like pills on the bottom, their text shows on the bottom, and pills on the top, their text shows on the top. So I am going to leave that for now, and work on it after I am done with the rest of the webpage. Current Progress Right now I finished position the stuff for the About Me section. I found this part really complicated, especially with the little icons. I ended up having to add more classes in my HTML to style them accordingly in CSS. Again, I still have a bit of problems with positioning, but I am starting to get the hang of like display , margin , padding , and gap , and how they work with different classes to arrange and organize everything. I also learned how to use transition to just make thing shift smoothly when you hover one them. This section took me a really long time because I had to arrange the about me text and all of my skills. I figured out where like display: relative and display: absolute are used, because I then had to arrange my text so that it was like positioned vertically 110% and horizontally 50% of the icon, so they helped in that. Otherwise, this part really familirized me a bit more with CSS. I especially got the hang of like background and border styling, and how to experiment with corner rounding and different colors and transitions and all of that, so I think this section was really a learning experience. Next Steps I will now begin to work on the Projects section. For this section I am just thinking making cards for each project each with a glassy effect behind it. Because I am giving each element like a glass effect, I am planning on making a super cool background later once I finished the site in JS so that the glass effect really shows and provides a unique aspect to my website. I think this section will be a lot simpler, but I will have to add more classes in HTML to do this I think. A tricky part might be to style the links, because I have links to all of my projects and their repositories, so yeah. Once I figure out the positioning of the cards, its practically smooth sailing from there, because like adjust font sizes and colors are like pretty easy for me. I might even make like the glass lighten up when I hover. One thing I want to experiment with is with box-shadow so that a shadow shows underneath the card. So I will play around with that. Otherwise, I am excited to continue working on this. The layout for this section is similar to the rest, so I think from here I will begin to quickly finish up the rest of the sections. You can view the about me page here. I am hovering over the HTML pill, and you can see the text over it."}, {"post_id": 41119, "ts": "2026-08-05T03:35:16Z", "hours": 3.1164, "text": "Devlog #7 I finished creating the navbar and have finally started on the CSS. Now because I am a complete beginner to CSS, I did use some help of AI just to kinda get the hang of like rules and all the different like properties. I DID NOT copy paste anything from AI. This is a project that I am doing to learn HTML and CSS. I actually want to learn this, and AI is just assisting me. I completed the navbar in CSS, and started on the Hero section. Right now positioning for CSS is confusing me a bit, so I need to work on that a bit more. The Hero was fairly easy as in the text, and I haven’t added much to it, but I figured out how to center it. The next steps will be to work on the about me section. Current Progress I finished up the navbar by quickly making a list of links at the very top of my html that went to each section. I also added a logo in the other corner (which is just my initials for now) which will link back to the hero page, like the top of the webpage. I was able to add a nice frosty glass effect the navbar, which was pretty simple. All you got to do is make the background like a little translucent and then add a blur effect. I thought it would be super hard, but it actually wasn’t. I am probably going to use this same formula for the glass cards of each section. My plan is to make them more interactive as I continue, but for right now I will just keep it at that. For the hero, the plan is to just make my name and a short subtitle below, and then add a cool effect around it. For now I just mapped out the area of the hero section. I realized that 100vh is the same as the whole area of the screen, so that is perfect for the hero section. I set the height to that. I also learned that you could access text from within sections that you have id’ed, ex. like I could access the <p> text in the hero section by using the rule #hero p {} so that was pretty neat. Like I mentioned, I used AI to help with some of the centering stuff, because there are a lot of rules for that. I also learned a lot about default positioning, and relative, and fixed positioning. I decided to use position: fixed; for the navbar so it stays on the page the whole time. I still need to get the hang of positioning, but as I begin the next sections, I think I will learn to do that on my own. Next Steps I finished the Hero section for now for CSS, so I will start with the About Me sections. Again this section will have like a blurb about me and then little icons of all of the skills that I know. This is for sure going to be a lot more trickier than the Hero section. My plan is to first try and do the basic styling on my own, and then refer to other resources to polish it up. I am probably going to use the glass effect for the about me blurb and then as a little background behind each icons, like a little drop. I am excited to get this part complete because right now I just have like a very long list of large images in the website, (which are the icons for the skills) that are taking up like the whole screen and I am so ready to get rid of those and just clean up the webpage a bit. After those are organized into the skills, then everything will just be a little cleaner. I am planning to organize the skills based on software, hardware, and then others. The icons are already organized in HTML, so I am excited to begin tomorrow on styling the next section. The navbar is glassy, its just because there is nothing under it to be blurred thats why it doesn’t show."}, {"post_id": 40465, "ts": "2026-08-04T00:41:21Z", "hours": 2.0869, "text": "Devlog #6 I have finally finished the HTML section. I have organized all of my sections and filled in enough information to make a complete portfolio website. I’m not going to worry about any more of the info and just continue on to CSS and styling my website, I think this is going to be a lot more tricky because now I have to arrange and order everything and make it look pleasing and smooth. Right now I am going for a darker vibe. I don’t have like a specific theme, but I might add like hints of color around the website. I am planning on making like cards that each have a glass morphism effect. Current Progress Right now I filled in the skills sections. Like I said before, I am planning to just show the icon on a glassy back. I am going to back it so that when the person hovers over it, it will show like a text of what the skill actually is like the name. I learned how to use a <snap> tag, which is kinda like <div> tag but it doesn’t need it’s own line, so you can kinda group things inside groups without like tabbing again. I put it on the labels for each skill so I could style it separately from the icon in CSS. I was able to get icons for every skill in there. I used Devicon for some programming languages and Flaticon for some of the other ones. I finally got the hang of images. They show on the preview so I think they will show in GitHub pages later as well when I publish them. I still have to see but I think that a succes because in my first devlog the images actually didn’t work, so this is good. Right now they are huge, but I will fix them in CSS. I put them all in the same class, so I think it won’t be too hard. Next Steps I actually forgot to make a navbar, so I will quickly make a navbar and then begin CSS. I don’t thing a navbar will be too hard because it is just links. I will most likely keep it as a header at the top, and just apply a nice glassmorphism effect to it. But yeah, I actually got to make a navbar in HTML, so not completely done with that, but after that I will for sure be done. I might not post a devlog after building the navbar and might just move onto CSS, but it depends on how much time it will take. If it takes more than an hour, then I’ll post a devlog, other than that, I wil post one after some work with CSS, maybe after making the hero section. Below are the some of the image from Flaticon"}, {"post_id": 40271, "ts": "2026-08-03T18:12:42Z", "hours": 1.47, "text": "Devlog #5 I am still working on the HTML portion, but I am nearing completion. I think that the next devlog that I post will be the last one of HTML, and after that I will start to move onto CSS. Speaking of CSS, I am still deciding whether I want to experiment with JS for this project. I have no experience in JS, so it might be like a later thing I want to add after I finish the initial draft of the project. I think it will make it look super smooth with cool animations, but I am still deciding, I think the amount of time I will spend in CSS will decide whether I want to use JS or not. Current Progress I have now added some cards to the Awards section. This one did not take too long because I was able to figure out the tags quite easily because by now I have experimented a lot with them. One thing I learned how to do was to create lists in HTML. It was quite simple. Once you figure out the tags then it is pretty easy. I have a lot of awards that are like issued from a single organization and then some standalone ones, so I used the <ul> tag to create an unordered list and the <li> to add each item to my list. Overall I am planning to make like a card mosaic. Because they are all going to be like different sizes, so they will look kind of like a Pinterest post with like broken blocks, but fit nicely together. I think that will be the simplest way to style it in CSS right now, so I am going with that. Overall, this did not take as long as I expected. I actually already had a document ready, so many were just copied from there. Next Steps I have already filled out the Contact section. I just linked my email and added a little description. I don’t have a lot of forms of contact , so I am going to stick to just email. Now I am going to work on adding my skills, because that is in the about me section. I am not going to actually write it but instead add like little logos for each like skill so that is the next step. I am planning to separate them by like software, and hardware, and like other maybe, but I am going to work on that next. Again I hope that the next devlog will be the last for HTML before I begin CSS."}, {"post_id": 38499, "ts": "2026-07-31T22:25:20Z", "hours": 3.4719, "text": "Devlog #4 I have filled in some more sections of my webpage. I am still at the HTML portion. Right now the webpage looks like really bad when I view, and it’s tempting for me to move right to CSS to begin styling, but I think it will be easier for me in the long run if I finish all of the HTML now, at least all of the sections. Of course, if I move onto CSS, it won’t mean that I’m completely done with HTML, I will always be adding more stuff and I find ways to improve my website. Current Progress So before I had filled out the Projects section. I was working with GitHub a lot, uploading my projects so I could link them. I also had to use the Github desktop app to upload some files. Because I had opened the website repository in my VSCode desktop app, I think that something got mixed up, and the file didn’t save properly, so then my whole projects section got deleted. I had to spend some time filling that in again, though it wasn’t too hard the second time because the live preview in the browser still had the text in it, and I had already created all of the links again. Then I made sure that my files would autosave, and that the repository was properly linked. After I pushed the commits to Github to save it there, and I will do the same after posting this devlog. After that I began to fill in the Experience section, and that was mainly the majority of this time block. Again, I had to like go back and kinda figure out the dates of everything. I am thinking like a timeline style for this one, and that I will have like a little card for each thing. The plan is to make a scrolling website, so that each card will like appear as you scroll down. I have got a good solid like 6 cards of stuff, so for now I am done with that section. I learned more about like div and section tags during this. I also learned the effect of applying classes to text, as it seperates it from other text when styling it in CSS. I applied it to the date text in the experience sections, so that the time frame will be like a little substitle, different from the actual text in the card. Next Steps I am probably done for today. Next, I will start to work on the awards sections. A challenge will be to organize those sections because like I have many awards from a specific section but then some are just standalone, so I still a have to figure out how to organize the sections in HTML and how to apply the section and div tags. However, I don’t think I will use the section tag, as that may only be for sections that will be in the navbar. But organizing the awards using div and applying different classes will be tricky and hard to keep organizing. i want to make sure that I continue and keep my code nice and clean so that CSS styling is easy."}, {"post_id": 37296, "ts": "2026-07-29T22:04:53Z", "hours": 1.9631, "text": "Devlog #3 I have started to fill in some more information about myself in the webpage. The plan is that I will first constuct the HTML layout and fill in all of the sections. Because I am still a high student, my portfolio will look a bit different because I am not actually advertising a service or anything like that. The order that I am planning to go in is the following: Hero About Me (along with skills) Projects Experience Achievements/Awards Contact Current Progress Right now I have constructed each of the sections in HTML. I am using the section tag to separate each of the parts that I just described above so that I can link them using a navbar, though I have not created anything for a navbar yet. One thing that confused me for a while was the difference between section and div tags. After some research, I realized that section actually separates the parts in the HTML file, while the div just like adds an invisible containor around the parts and doesn’t actually effect the HTMl at all. It just like groups them together. The section tag is great for the navbar. I am using the div tag for like sub sections, like for an individual project within the Projects section. This will help later with design as I am planning to make like each project a card on the screen. That brings me to my next thing. Right now I have filled in around 3 projects that I have made. The biggest hurdle was that not all of them were on Github, so I had to go back into my files and like refresh by brain on those past projects. I wanted to have links to projects in the website, so some of my past projects, I had to spend like an hour or two just trying to upload those and get the repositories set. I have attched 3 projects so far. I will probably add more, but for now I think I will move on Next Steps Next, I am going to start filling in some of the other sections, like the About Me section. I am still thinking on how to display the Experience section, but I will start filling in that section too. I will also begin to organize like the subsections for each section and begin to build a navbar. By the end of the week, I hope to have like a basic HTML structure with all of the sections roughly filled in, and then I will move onto CSS. I think the biggest challenge will be to organize everything neatly for experiences and achievements. But otherwise I am looking forward to start filling those in."}, {"post_id": 35488, "ts": "2026-07-26T23:14:47Z", "hours": 0.8378, "text": "I have kinda gotten a sense of how I want my site to be like. For the portfolio, I will kinda have around 5 sections: Hero, About Me, Projects, Achievements. and Contact. I am think of a kinda dark aesthethic theme with neon accents in there. I am also thinking that I will make like each section themed to what I have achievemed or what is added in that section. Right now I have added a gradient to my background and written some stuff in the about me section. I have also added a link to my astrobounce project which is also here on stardance."}, {"post_id": 35031, "ts": "2026-07-26T06:02:46Z", "hours": 0.3153, "text": "My personal site. Right now I am just getting started on this website. Mainly this project will be for me to learn basic HTML and some more CSS code. I want the end goal to be a nice smooth and polished site. I have still yet to pick a theme. Right now the only hurdle I have encountered is that the image isn’t uploading properly into the website, so I will be looking into that and trying to fix that. Otherwise I am only planning to spend a couple more hours. I might plan to make this a personal portfolio site for myself as I enter high school to help showcase some of my experiences and achievements. But I am still deciding on the theme. And that will be in a later devlog."}]...
|
Title: My Portfolio by @Harpaavan108 | Stardance
Title: My Portfolio by @Harpaavan108 | Stardance
Devlogs:
My personal site. Right now I am just getting started on this website. Mainly this project will be for me to learn basic HTML and some more CSS code. I want the end goal to be a nice smooth and polished site. I have still yet to pick a theme. Right now the only hurdle I have encountered is that the image isn’t uploading properly into the website, so I will be looking into that and trying to fix that. Otherwise I am only planning to spend a couple more hours. I might plan to make this a personal portfolio site for myself as I enter high school to help showcase some of my experiences and achievements. But I am still deciding on the theme. And that will be in a later devlog.
I have kinda gotten a sense of how I want my site to be like. For the portfolio, I will kinda have around 5 sections: Hero, About Me, Projects, Achievements. and Contact. I am think of a kinda dark aesthethic theme with neon accents in there. I am also thinking that I will make like each section themed to what I have achievemed or what is added in that section. Right now I have added a gradient to my background and written some stuff in the about me section. I have also added a link to my astrobounce project which is also here on stardance.
Devlog #3 I have started to fill in some more information about myself in the webpage. The plan is that I will first constuct the HTML layout and fill in all of the sections. Because I am still a high student, my portfolio will look a bit different because I am not actually advertising a service or anything like that. The order that I am planning to go in is the following: Hero About Me (along with skills) Projects Experience Achievements/Awards Contact Current Progress Right now I have constructed each of the sections in HTML. I am using the section tag to separate each of the parts that I just described above so that I can link them using a navbar, though I have not created anything for a navbar yet. One thing that confused me for a while was the difference between section and div tags. After some research, I realized that section actually separates the parts in the HTML file, while the div just like adds an invisible containor around the parts and doesn’t actually effect the HTMl at all. It just like groups them together. The section tag is great for the navbar. I am using the div tag for like sub sections, like for an individual project within the Projects section. This will help later with design as I am planning to make like each project a card on the screen. That brings me to my next thing. Right now I have filled in around 3 projects that I have made. The biggest hurdle was that not all of them were on Github, so I had to go back into my files and like refresh by brain on those past projects. I wanted to have links to projects in the website, so some of my past projects, I had to spend like an hour or two just trying to upload those and get the repositories set. I have attched 3 projects so far. I will probably add more, but for now I think I will move on Next Steps Next, I am going to start filling in some of the other sections, like the About Me section. I am still thinking on how to display the Experience section, but I will start filling in that section too. I will also begin to organize like the subsections for each section and begin to build a navbar. By the end of the week, I hope to have like a basic HTML structure with all of the sections roughly filled in, and then I will move onto CSS. I think the biggest challenge will be to organize everything neatly for experiences and achievements. But otherwise I am looking forward to start filling those in.
Devlog #4 I have filled in some more sections of my webpage. I am still at the HTML portion. Right now the webpage looks like really bad when I view, and it’s tempting for me to move right to CSS to begin styling, but I think it will be easier for me in the long run if I finish all of the HTML now, at least all of the sections. Of course, if I move onto CSS, it won’t mean that I’m completely done with HTML, I will always be adding more stuff and I find ways to improve my website. Current Progress So before I had filled out the Projects section. I was working with GitHub a lot, uploading my projects so I could link them. I also had to use the Github desktop app to upload some files. Because I had opened the website repository in my VSCode desktop app, I think that something got mixed up, and the file didn’t save properly, so then my whole projects section got deleted. I had to spend some time filling that in again, though it wasn’t too hard the second time because the live preview in the browser still had the text in it, and I had already created all of the links again. Then I made sure that my files would autosave, and that the repository was properly linked. After I pushed the commits to Github to save it there, and I will do the same after posting this devlog. After that I began to fill in the Experience section, and that was mainly the majority of this time block. Again, I had to like go back and kinda figure out the dates of everything. I am thinking like a timeline style for this one, and that I will have like a little card for each thing. The plan is to make a scrolling website, so that each card will like appear as you scroll down. I have got a good solid like 6 cards of stuff, so for now I am done with that section. I learned more about like div and section tags during this. I also learned the effect of applying classes to text, as it seperates it from other text when styling it in CSS. I applied it to the date text in the experience sections, so that the time frame will be like a little substitle, different from the actual text in the card. Next Steps I am probably done for today. Next, I will start to work on the awards sections. A challenge will be to organize those sections because like I have many awards from a specific section but then some are just standalone, so I still a have to figure out how to organize the sections in HTML and how to apply the section and div tags. However, I don’t think I will use the section tag, as that may only be for sections that will be in the navbar. But organizing the awards using div and applying different classes will be tricky and hard to keep organizing. i want to make sure that I continue and keep my code nice and clean so that CSS styling is easy.
Devlog #5 I am still working on the HTML portion, but I am nearing completion. I think that the next devlog that I post will be the last one of HTML, and after that I will start to move onto CSS. Speaking of CSS, I am still deciding whether I want to experiment with JS for this project. I have no experience in JS, so it might be like a later thing I want to add after I finish the initial draft of the project. I think it will make it look super smooth with cool animations, but I am still deciding, I think the amount of time I will spend in CSS will decide whether I want to use JS or not. Current Progress I have now added some cards to the Awards section. This one did not take too long because I was able to figure out the tags quite easily because by now I have experimented a lot with them. One thing I learned how to do was to create lists in HTML. It was quite simple. Once you figure out the tags then it is pretty easy. I have a lot of awards that are like issued from a single organization and then some standalone ones, so I used the <ul> tag to create an unordered list and the <li> to add each item to my list. Overall I am planning to make like a card mosaic. Because they are all going to be like different sizes, so they will look kind of like a Pinterest post with like broken blocks, but fit nicely together. I think that will be the simplest way to style it in CSS right now, so I am going with that. Overall, this did not take as long as I expected. I actually already had a document ready, so many were just copied from there. Next Steps I have already filled out the Contact section. I just linked my email and added a little description. I don’t have a lot of forms of contact , so I am going to stick to just email. Now I am going to work on adding my skills, because that is in the about me section. I am not going to actually write it but instead add like little logos for each like skill so that is the next step. I am planning to separate them by like software, and hardware, and like other maybe, but I am going to work on that next. Again I hope that the next devlog will be the last for HTML before I begin CSS.
Devlog #6 I have finally finished the HTML section. I have organized all of my sections and filled in enough information to make a complete portfolio website. I’m not going to worry about any more of the info and just continue on to CSS and styling my website, I think this is going to be a lot more tricky because now I have to arrange and order everything and make it look pleasing and smooth. Right now I am going for a darker vibe. I don’t have like a specific theme, but I might add like hints of color around the website. I am planning on making like cards that each have a glass morphism effect. Current Progress Right now I filled in the skills sections. Like I said before, I am planning to just show the icon on a glassy back. I am going to back it so that when the person hovers over it, it will show like a text of what the skill actually is like the name. I learned how to use a <snap> tag, which is kinda like <div> tag but it doesn’t need it’s own line, so you can kinda group things inside groups without like tabbing again. I put it on the labels for each skill so I could style it separately from the icon in CSS. I was able to get icons for every skill in there. I used Devicon for some programming languages and Flaticon for some of the other ones. I finally got the hang of images. They show on the preview so I think they will show in GitHub pages later as well when I publish them. I still have to see but I think that a succes because in my first devlog the images actually didn’t work, so this is good. Right now they are huge, but I will fix them in CSS. I put them all in the same class, so I think it won’t be too hard. Next Steps I actually forgot to make a navbar, so I will quickly make a navbar and then begin CSS. I don’t thing a navbar will be too hard because it is just links. I will most likely keep it as a header at the top, and just apply a nice glassmorphism effect to it. But yeah, I actually got to make a navbar in HTML, so not completely done with that, but after that I will for sure be done. I might not post a devlog after building the navbar and might just move onto CSS, but it depends on how much time it will take. If it takes more than an hour, then I’ll post a devlog, other than that, I wil post one after some work with CSS, maybe after making the hero section. Below are the some of the image from Flaticon
Devlog #7 I finished creating the navbar and have finally started on the CSS. Now because I am a complete beginner to CSS, I did use some help of AI just to kinda get the hang of like rules and all the different like properties. I DID NOT copy paste anything from AI. This is a project that I am doing to learn HTML and CSS. I actually want to learn this, and AI is just assisting me. I completed the navbar in CSS, and started on the Hero section. Right now positioning for CSS is confusing me a bit, so I need to work on that a bit more. The Hero was fairly easy as in the text, and I haven’t added much to it, but I figured out how to center it. The next steps will be to work on the about me section. Current Progress I finished up the navbar by quickly making a list of links at the very top of my html that went to each section. I also added a logo in the other corner (which is just my initials for now) which will link back to the hero page, like the top of the webpage. I was able to add a nice frosty glass effect the navbar, which was pretty simple. All you got to do is make the background like a little translucent and then add a blur effect. I thought it would be super hard, but it actually wasn’t. I am probably going to use this same formula for the glass cards of each section. My plan is to make them more interactive as I continue, but for right now I will just keep it at that. For the hero, the plan is to just make my name and a short subtitle below, and then add a cool effect around it. For now I just mapped out the area of the hero section. I realized that 100vh is the same as the whole area of the screen, so that is perfect for the hero section. I set the height to that. I also learned that you could access text from within sections that you have id’ed, ex. like I could access the <p> text in the hero section by using the rule #hero p {} so that was pretty neat. Like I mentioned, I used AI to help with some of the centering stuff, because there are a lot of rules for that. I also learned a lot about default positioning, and relative, and fixed positioning. I decided to use position: fixed; for the navbar so it stays on the page the whole time. I still need to get the hang of positioning, but as I begin the next sections, I think I will learn to do that on my own. Next Steps I finished the Hero section for now for CSS, so I will start with the About Me sections. Again this section will have like a blurb about me and then little icons of all of the skills that I know. This is for sure going to be a lot more trickier than the Hero section. My plan is to first try and do the basic styling on my own, and then refer to other resources to polish it up. I am probably going to use the glass effect for the about me blurb and then as a little background behind each icons, like a little drop. I am excited to get this part complete because right now I just have like a very long list of large images in the website, (which are the icons for the skills) that are taking up like the whole screen and I am so ready to get rid of those and just clean up the webpage a bit. After those are organized into the skills, then everything will just be a little cleaner. I am planning to organize the skills based on software, hardware, and then others. The icons are already organized in HTML, so I am excited to begin tomorrow on styling the next section. The navbar is glassy, its just because there is nothing under it to be blurred thats why it doesn’t show.
Devlog #8 I am finished the About Me section. I came across a problem though. In the pills, I want it to be like that when I hover over the pill, the name of that skill shows above it in a small text. However, pills in the bottom row, their text will start to hover into the pill of the next row, so that messes up the thing. BUT, if I add a space, it will look like a really weird gap between the rows. I did some research and I read that I might need to use some JS to fix, so like pills on the bottom, their text shows on the bottom, and pills on the top, their text shows on the top. So I am going to leave that for now, and work on it after I am done with the rest of the webpage. Current Progress Right now I finished position the stuff for the About Me section. I found this part really complicated, especially with the little icons. I ended up having to add more classes in my HTML to style them accordingly in CSS. Again, I still have a bit of problems with positioning, but I am starting to get the hang of like display , margin , padding , and gap , and how they work with different classes to arrange and organize everything. I also learned how to use transition to just make thing shift smoothly when you hover one them. This section took me a really long time because I had to arrange the about me text and all of my skills. I figured out where like display: relative and display: absolute are used, because I then had to arrange my text so that it was like positioned vertically 110% and horizontally 50% of the icon, so they helped in that. Otherwise, this part really familirized me a bit more with CSS. I especially got the hang of like background and border styling, and how to experiment with corner rounding and different colors and transitions and all of that, so I think this section was really a learning experience. Next Steps I will now begin to work on the Projects section. For this section I am just thinking making cards for each project each with a glassy effect behind it. Because I am giving each element like a glass effect, I am planning on making a super cool background later once I finished the site in JS so that the glass effect really shows and provides a unique aspect to my website. I think this section will be a lot simpler, but I will have to add more classes in HTML to do this I think. A tricky part might be to style the links, because I have links to all of my projects and their repositories, so yeah. Once I figure out the positioning of the cards, its practically smooth sailing from there, because like adjust font sizes and colors are like pretty easy for me. I might even make like the glass lighten up when I hover. One thing I want to experiment with is with box-shadow so that a shadow shows underneath the card. So I will play around with that. Otherwise, I am excited to continue working on this. The layout for this section is similar to the rest, so I think from here I will begin to quickly finish up the rest of the sections. You can view the about me page here. I am hovering over the HTML pill, and you can see the text over it.
Devlog #9 I finished the Project section of the website. I also took some time to like style and experiment with some like hovering effects in the website. I also figured out how to color texts with gradients, so I changed all of my main section headings to cool colorful pastel gradients. I also made each glass card look cool when you hover over it. I also made some of the text like get bigger or show cool stuff when you hover over it. So yeah. I really think I am getting the hang of CSS. Most importantly, I think that I am able to use resources from the internet and apply them accordingly to my website. This block was mainly like a styling portion to kinda experiment and apply some aesthetics to my site. Current Progress I finished the Projects section. This section was much easier to arrange. Instead of using display: flexbox I used display: grid to help position each of the cards into an organized layout. What I really like about this display is that it automatically does all the math itself and gives each card its own equal amount of space so that they look even on the page. I got 4 nice cards for each project. I also styled the the heading to look like a gradient. I figured out that you make the background image a gradient, and then clip it to the text, and then just make the text clear so that the color shows. So I made all the headings look like that. Another thing that I did was use box-shadow to make the cards look cool when I hover over them. I realized that there are a lot of elements for the box-shadow, though once you figure them out, its not too complicated. So then I applied the box shadow effect to everything in the website that it would look good on. So yeah that was also a learning experience. I also figured out how to make a specific thing appear once you hover over like a bigger topic. So like I made some text a bit bigger or like an element appear when i hover over the whole card. You add the hover rule for the big card, and then add the class for the specific element, and then do your ending look. I used that for some things. So I really got some styling done to make my website like look better. Next Steps I will now work on the Experience section. I have around 6 cards for this. For this section, I am planning on making like a scrolling timeline to showcase like all of the past stuff in a chronological order. This might be tricky because up until now I was using the height: 100dvh to determine how big a section would be, but this one is going to have to different from that because of its scrolling nature. So yeah. But I think I am really getting the hang of positioning and display. and how to manipulate objects between different rules. I am starting to realize that code is not as strict as I thought it was. Like I thought everything needs to be like letter precise, but you have a bit space to improvise and experiment. So I can actually code a bit in CSS. I really enjoying styling things, like the gradient texts or like hover effects, so I am going to make sure to include those things in this next section as well. I am excited to get to work and encounter this new challenge. Below is a picture of the Projects sections and I am hovering over the first card, so you can see the hover effect.
Devlog #10 I have finished the Experiences section of the website. This section was for sure a lot trickier than I thought it would be. The hardest part was trying to figure out how to arrange the boxes in a vertical but staggered order, so I could build the timeline. However, on the upside, I was able to quickly do styling, because a lot of the colors and like hover effects and everything was already set up in my code from styling the previous section, so that did not take too much time. Overall, I really like how this section turned out, and I think it is a bit different from the rest of the sections. Current Progress I completed the Experience section. This one is styled a bit differently from the other two. In this one, the timeline in centered and it goes longer than the length of the screen. The about me section and the projects section were all set to be as tall as the screen itself using height: 100dvh , but this one is actually dictated by the length of the cards, and then I added some padding at the bottom to separate it from the next section. The tricky part was to actually make the timeline affect. At first I did some research and thought or using pseudo elements in CSS to create a line through the middle of the page and arrange the boxes beside it. But that was way too complicated and didn’t seem to work for me, so I decided to arrange the boxes first and then add the line later. To arrange the boxes, I first centered them vertically in the middle of the screen, and then gave half of them one class and the other half another class. Then I pushed one class completely to the right, and the other to the left and that created a staggered timeline look. Then I needed to add a line through it. To do this, I created an empty <div> tag at the beginning of my experience section and then styled it as a line as long as my experience cards and then filled it with a rainbow gradient to kinda match my theme. I also added tiny circles using the same method to the timeline wherever their was a card to kinda just make it look cooler. I will acknowledge that I did use a bit of AI for this section to research the different ways to position the boxes, but otherwise I implemented all code by myself and I did not copy paste anything in. I really think this section introduced me to the flexibility in CSS, and how to manipulate different rules and elements to get the desired effect. Next Steps I am now going to work on the Achievements section. I am planning on making this section like a staggering kinda page of acheivements, like not quite even, just like a mosaic, because there is a lot of content in this section. For a kind of visualizer, I am planning to kinda style it like a pinterest page so like staggered and just fitting together. I just hope that it doesn’t turn out to jaggedy or uneven at the end of that part, and that it doesn’t take too long to organize them to look like at least like reasonably even at that. Hopefully I finish this section pretty quick, like just an hour or 2, and then I will quickly finish up the contact section as well, so then I will post a devlog of those two, but yeah I will see. I think I am getting close to a ship so keep an eye out for the next few days. Below you can see like the full experience timeline like zoomed out and I am hovering over the first card.
Devlog #11 I have finally finished styling my whole website in CSS. It was such a long process, but I really think that I learned how to code in CSS. Position and display no longer confuse me and I have gotten the hang of adding cool effects to me elements. I am really liking the theme of my website, but I still have more to do. Right now, I have a lot of empty space in my website. Because all of my cards are glassmorphism, I am planning to use JS to make really neat background just to add like a nice touch and really sell the website, but that might be after the first ship. I am also planning to change some fonts and all that, so still a lot to do. Current Progress I finished the Achievements and Contact section and also styled my footer. I made a masonry style layout for the achievements, and I think the design turned out really neat. At first, I thought I would use a flexbox or a grid, but then I saw that I could just make a fized number of columns and the text would just automatically arrange itself. So I used that instead of getting all tangled up in like flex and grid properties and all of that. But then it actually made it like vertically ordered, but I wanted it horizontally, so I took the time to like arrange them so that the layout would appear even and it would look like it was horizontally arranged, when in reality it is actually vertically arranged but in a weird way. It makes more sense when you look at it. I also finished the Contact section. This was quite easy. I just styled it like the Hero and added two little icons: one to my email, and the other to my github, so yeah that was pretty simple. I first thought of adding a contact form, but then I realized that that needed a backend, so I decided against that. Again, if I want, I might add it later in the future, but for now I will leave it at just to two icons. So mainly I finished those two sections in this block. One more cool thing that I discovered was how to make links open to a new page, because while I was trying out links it was bugging me that it was always opening in that page, so this really put my mind to ease a bit, and makes navigation a bit easier. Next Steps I am planning to ship very soon. I am thinking of just adding some finishing touches before shipping the first version, like some font changes. I might also just try to play around in JS, and like get a feel of it, Because I think that a cool background will really take it to the top, so I will play around a bit with that. i’m also thinking about adding like scroll up effects, especially for like my experience timeline. But yeah next steps might just to be to polish it up just a bit before shipping. I am super excited to try out JS, and hope that the final product will be awesome. Below is a picture of the masonry effect of the achievements section.
Devlog #12 This block was mainly dedicated towards making my site look a lot more aesthetic. I spent over 4 hours just tinkering with JS and fonts and color combos and everything, trying to find the perfect combos and fonts that looked super good. I am overall very happy with the progress that I made in this amount of time. At first I thought that the site looked good even without any styling because of my color gradients and all of that, but I just realized how much better it is with like better fonts, and like the small things, like moving gradients instead of static ones. So this whole block was just dedicated to making my site look better. Current Progress The first thing that I did was change my cursor. For this I had to use JS. I changed the cursor to just be like a little white dot with a nice glow around it, and then when it hovers over like a link, then it gets a bit bigger and turns into a light purple color. In JS, I figured out how to like grab an element from CSS, and then use like states, like mousemove to have like a specific action, and then like have the dot follow my actual cursor, but super close so it seems like that is the cursor. And then I hid my actual mouse to really sell the illusion. For the hover thing, I created a hover class in CSS, and then added that class when the mouse “entered” a link, and removed it when it “left” the link. The next thing I did was make the gradients on my text like circle around, so the gradient was always moving around and it looked like dynamic. I actually got this idea from the Hack Club website because in there they have a moving gradient on the text. For this, I actually did not need any JS, and instead just make a looping animation in CSS for the background of the text. I first did it only for the Hero title, but then I liked it so much that I added it to all of the section headings so yeah I thought was a really nice addition The next thing that I did was to edit my skill icons. I mentioned in a previous devlog when I was styling the About Me section, that the little subtitle for each skill was showing on the top of it, so then for skills in the bottom row, it was covering the skill on top. I also used JS for this fix. I first made a class for the subtitle on the bottom, and then again in JS made it so if it was detected to be lower, that class would apply The last thing I did was change the fonts. I am really happy I did this, because the site just looks so much better with different fonts. I imported all of my fonts from Google Fonts. I inserted the link in the <head> section and then used that font family in CSS. I did a lot of like comparing and swithcing around and researching and all of that just to find good fonts, and I have a really bad habit of like taking a lot of time on these kind of things, and it wasn’t even getting tracked on Hackatime, so I tried to do it quickly. I found some really nice fonts for the headings and titles so I am super happy with that. Next Steps Now the only thing left to do that I still havent gotten around to yet is making a really nice background in JS. I really want to make an animation background, because I think that will be like a unique aspect of my website. The main thing I really want that for is the glassmorphism effect that I have on the cards. On a plain dark background, you can’t tell at all that there is a glass effect. But with a sick background that moves, you can see that shapes blur under the cards. So I think that is the last thing to do, because I finished up all the small little details. However, I also think this will be the longest and hardest part because of its complexity in JS so yeah. I am really hoping to ship soon after 1 or 2 more devlogs. Below is a video of the new hero section with cool fonts and a moving gradient background.
Devlog #13 (Last Devlog Before Ship) I am finally done with my website. Please read the NEXT STEPS section of this devlog as I have favour to ask you guys . I spent 7 hours of my life building a shader background for my website, but it totally paid off in the end because now I have a really cool, interactive, animated gradient background. I used GLSL to write a shader, and WebGL and Three.js to implement it into my website. I used a video tutorial and some AI debugging to achieve the effect, but it really was a learning process, as I had to install all the tools for it and then work with those, so I learned how to use those. Because of this, I also spent some time updating my README. Current Progress First of all, it took me a really long time to find a good tutorial to make a background, because I really wanted an animated one to show my blur effect and really add a pop to my website. To acheive a shader background I watched a video tutorial from Codegrid, which explained everything really nicely and was quite quick, so I was able to write the code. After though, the background didn’t quite show, so then I used the help of AI to help debug the code and get it working. After I finally got it to work, I spent some time adjusting colors, and brush strength and size, and then distortion amount and fluid decay and all of that stuff until I found the perfect values for a super good looking background. Overall, it was definately worth the time and added a really nice touch to my webpage. I also updated by README, because now the user will need to install some dependencies for this webpage because of the addition of Three.js and everything. So I updated the README to include proper instructions for that and so it explained some more features of my website. I really polished it up, because it was kinda messy before, so I got it ready for a ship. I also changed my cursor one last time. What I had before was a <div> element in HTML following my actual cursor using mousemove in JS, and my actual cursor was hidden in CSS. However, it was like lagging behind and that was starting to show on my new background. So instead, I just made my cursor a little white dot in CSS by liking making a svg file and linking it to the cursor. It just improved user interaction a lot be removing any lag between an following element and the actual cursor. There is still the feature where it will turn bigger and light purple when hovering over a link. Next Steps My next step is to ship!!! However, I have to ask you guys for something. I need some color suggestions for my background. I got a nice one right now that is like dark purplish, but I want your guys’ suggestions on what type of gradient I should make. I can put 4 colors into the gradient. You can use the attached video below to view how the shader looks on the hero page. I do have glass cards, so I don’t want something too light, but it could make a nice addition in a dark gradient. So please put some suggestions in the comments!!! Thank you!!! I will ship right after this, but I will for sure try to look over some color suggestions and experiment around with them. I might try to use one before I ship the final version of the website, so please put some suggestions. Expect a ship really soon.
Devlog #14 So I started working on it further before my project even got fully rated, so this is my first devlog after shipping my portfolio! During this block, I just added some small features that just overall polished my site a bit more. A lot of these features were added in JS, and I think I actually am starting to get the hang of JS in the way that I actually am starting to understand how to identify objects using const and like how to select them using document.querySelector . So I think I am starting to learn, and just working with these little features just got me a little more familar with JS. I also got the hang of CSS animations, as before I had a little trouble understanding keyframes, but now it makes sense, so it was a good block. Current Progress I added three main things to my website, each of which use JS in them, and I will explain how. The first thing that I added was a scroll progress bar at the top. I really wanted to add this onto website, as I really liked seeing them on other websites, and I styled it to match my theme, and it just looks super good. I make a horizontal bar in my navbar for this, and it has a rainbow gradient. Basically, JS detects where the person is at the website, and just adjusts the scale based on that to show the bar. At first, I made it so it would expand as I scrolled, but then the rainbow was like squished at the beginning, and then I adjusted it so that it actually revealed the bar as I scrolled down, so like same idea but just applied to a different thing. I looks super cool now. The next thing that I added was a loading page. I tried to look into some videos for this, but I ended up making a super simple gradient ring that was animated (again to spin a rainbow). For this, I like made a loader page, which covered the whole view. In it, I made a circle which had a rainbow conic gradient, and then just animated it in CSS to rotate to 360 degrees over the course of like 1.2 seconds. I then used JS to add a class which made the loader disappear and like unresponsive to any pointer controls when the site finished loading. It also looks super good and totally matches the vibe of the site. So yeah, super happy with that. The last thing that I added was like a scroll fade up reveal effect to almost everything in my site, like the cards and the headings and everything. Again, this was a pretty simple trick that I used. Basically you set the object a set number of pixels (like I used 30px) down on the Y axis and turn the opacity down, and then when JS detects the object as the person scrolls, it just moves it up to 0px on the Y axis and goes to full opacity, and it ends up looking super sleek. That little touch just upped the whole website. I was actually looking to add this feature in the beginning of my site, but I never got to it mainly because it used JS, so now I took the chance to add it in. A lot of these features were ones that I saw in like cool websites. So like I’m always on the lookout for cool features, and these were some that I thought really made a website look more polished, and I realized that they are not actually that hard to build once you understand the core concept. Through these I really got better in JS, and upped my skills in CSS, so it was a good block. Next Steps I really do not have anything left to add in this project. Like I even added extra stuff. Please, if you guys have any suggestions, comment them so I can implement them. I will attach a video of my site so you guys can see what its like. One thing I might consider adding is like a easter egg thing or some like sequence or action that will generate a cool surprise. I have to still think about that. But right now I have almost nothing left to do. I actually might ship this again just to get the hours counted in. Below you can see the loading and the scroll fade up reveal and the scroll progress bar at the top.
Devlog #15 This will be a fairly short devlog. I spent this block adding media queries to my CSS code because I opened the website on my phone, and it just looked so wrong to me, so I spent some time doing that. I figured out a great way to simulate a phone screen in my browser using DevTools so I was able to adjust everything through that. Current Progress The plan was that I was going to do media queries at first, but I thought it would be too complicated so I held it off. Now I was kinda forced to after seeing how bad the webpage looked on a phone screen. I realized you just have to make on CSS rule for media queries using media (max-width: 768px) {} . I decided to use 768px because that is like a standard width, but I mainly tested it on 400px width. After that, I opened two windows with my code and as I went through it, I would add a media query rule in the other window. So I conquered my fear of media queries, and addressed that issue. Next Steps I am looking for things to do. One piece of feedback that I got was that my cards had hover effects that made them look like buttons, but had no button effects, so it was kinda misleading. So to fix this, I’m thinking of like scanning my certificates and uploading them as pictures that people can view in the browser. So that’s my next step. To accompany this, I might also do like a redesign of the website, like just adjusting some of the features. Also, I’m thinking of adding a dark mode/light mode feature on it. Below is a quick video of the site on a device with a width of 400px.
Devlog #16 So I decided to implement some feedback that I got from the last ship. One piece of this was adding my actual certificates into the website, so people could actually view them in the webpage. So I took some time to scan all my certificates. Creating the links wasn’t quite hard, and at first I thought about just letting it open in a new tab, but then I decided to create a modal just to enhance the UX. Current Progress I decided to add all my certificates into the webpage, just to add a layer of validity to my work. The first part was finding all of the certificates. Whatever I had, I added them to my GitHub repo, and just linked the relative paths in the webpage. The ones which I had online, I just drag and dropped into the repo, while the physical ones I had to scan and then add in. So that took a while, but wasn’t too tedious of a process. After that, I just made a “View ->” sign that appears when you hover over the card, and that is actually a link to the image. Then I decided to make a modal. I realized it actually isn’t too hard, but the JS logic is a but complicated. I styled the modal in CSS, and then just added a .open class to it which was activated when you click the link. So I’m starting to understand JS logic, the only thing that I have trouble with now is writing like proper syntax, as I still have trouble with writing the correct syntax, and that can cause some problems. So then I styled how the image looks in the modal. At first I though about add ing a X to close the modal, but then I made it so then if you press outside the image, then the modal disappears. Some of my UCMAS achievements do not have images attached to them because I couldn’t find actualy certificates for them, so I might take pictures of my trophies to put there, but I haven’t got to that yet, and I don’t want to put low-quality images. So those are still empty, but almost everything else is filled, so now you can go and view those. Next Steps I literally don’t have anything left to do on this, so I think the next step is to just ship. I will take a break from this project and begin to work on my next one, which will be making a cool new tab page from my browser. So expect a ship soon. If anyone has any suggestions on something to add, you can let me know! Below is an image of my stardance certificate shown in the modal on the page.
Devlog # 17 This is my final devlog before I ship! I wanted to add a picture of myself in the website so I tried to find a way to do that. I decided that I will make it so that the about me card will flip when hovered over and on the other side will be my image. I thought it would be pretty simple, so I began working on it at 12 last night thinking I could finished it in about 30 minutes. Turns out I was wrong. It took me more than two hours just to get a card to flip and show my image. It was a pain, but the end result looks really neat. Current Progress To make the flip card, I had to restyle the entire about me section. I used a W3Schools tutorial, but i couldn’t end up working well with it, so then I turned to AI for debugging, because I had so many div layers for that card, and then I finally styled it to look good. The effect looks really good though. As well, I decided to publish everything to Github as well now because I hadn’t published anything for the past couple of days so yeah. Then I found a problem with the images not getting pulled correctly, so then I had to transfer all of those to a public/ folder and then adjust the file paths for all of them in my code, and then reload and redeploy like a bajillion times. So it was a lengthy process, but I finally got it working publically, Next Steps My next step is to ship. I really hope I get rated good because I want a pebble time 2. After this I will begin to work on my next project for the remainder of the event, which is a new tab page. After that, I am done with Stardance, as I also have a lot of school work now. So I will ship soon!!
Ships:
I am working on my personal portfolio. Right now I am just working and crafting the sections and filling in some info. I still have to work on styling and go through all of the sections. But for now I am going to ship
My Portfolio Project Hi! Welcome to my Stardance project. In this project, I made a personal portfolio website so I could showcase my work. Especially as I enter high school this year, I wanted to have a platform to record all of my progress and have a way to display it to the public. I also wanted to get more experience with coding. Over the past few years, I have done like super mini project in HTML and CSS, but this website is one of my first fully developed projects, and that I have coded all by myself. So I took this opportunity to properly learn HTML and CSS, and also introduce myself to languages like JS and GLSL. Features The website has 6 sections that I made: Hero About Me Projects Experience Achievements Contact Here are some features of my website: The website has an interactive navbar which links to each section in the webpage. There is also a logo in the corner which will link to the Hero section. The navbar has a frosted glass look, which makes blurs the background behind it. The title in the Hero section (which is my name), has a rainbow gradient applied to it. The cool part is that the gradient moves and loops in the name, so the gradient is always moving slowly. This is actually applied to all of the section headings in the webpage. Each card in every section has a frosted glass look applied to it, so it will blur the background behind it. They also enlarge and brighten when you hover over them. The cursor is a small white dot instead of a regular cursor, which enlarges and turns light purple when hovering over a link to communicate to the user that the link is clickable and will lead somewhere. One of the main highlights is the background, which is a shader background made with GLSL, WebGL, and Three.js. The background is an animated gradient. It is also interactive as it will respond to the cursor on the screen. It is one of the key aspects that really make this website shine, and what really makes this project unique and different from other ones. The Easy and Hard Parts Easy Part There were some really easy parts while building this. One was building the HTML layout. After I understood the basics of making classes and organizing texts and everything, it was quite easy to start filling out info for all of the sections. I thought it would be like a really big thing to fill in all of that info, but turned out it wasn’t quite hard. Hard Part There were also hard parts. One main one was the shader background. First it took a really long time to code the first draft of that, as I had to make a shader in GLSL and then import Three.js, and all of that. But then that first draft didn’t work, so then it took me a really long time to debug the code as I had to look through everything for like typos and all that. I did use AI for this part, but it was still a really long and hard process, going back and forth trying to see what was wrong. But in the end it was totally worth it. Overall Overall, I spent a lot of time and effort in this project. One thing that I really wanted to do was make just that I documented all of my progress frequently in devlogs, and I think that I achieved that because all of the 13 devlogs that I have written are pretty detailed. I also wanted to make this unique to me, and I think that the shader background achieved that and just brought the project to a new level. I really hope you enjoy it, and I am happy to take any feedback. I hope to constantly keep updating this project over the next few years. Otherwise, I might add some new features to it (including a scroll bar) in the next month before Stardance ends and I get too busy with school. Below you can view some screenshots of each section of the website (it doesn’t let me upload a video, or else I would’ve done that). Enjoy!!!
Ship #2 for My Portfolio This is my second ship for this project. Since my first ship, I have mainly just added some small features to increase the UX. A lot of these changes were features that I had seen on websites that I liked. So when the time came to bedazzle my website, I implemented these features in my own website. One really consistent thing that I noticed while implementing these features, is that a lot of features are quite simple to implement once you understand the basic logic. I also noticed that once you add these small features, it can make a great effect on the UX, and that the few hours you put into the little things, can have a huge impact and create a great impression on those who visit your website. New Features I added a cool gradient horizontal scroll bar that fills up as you scroll down. I thought this was a super cool feature and required some simple JS logic to implement. The next thing was a loading page. It is a quite simple one, just having a gradient filled circle outline which spins to show a loading effect. Again a small feature just to add nice feel from the moment a person opens the webpage. The next thing was a scroll fade up reveal to everything in the site. I really like seeing this effect on other websites as well, so I wanted to implement it into my website as well I added media queries because I saw how bad the website looked on the phone, and it was just really annoying me. So I took the time to add that just in case I ever had to show anyone my webpage on the phone. After that, I decided to upload some of my certificates onto the website so people could very them, just to add another level of validity. However, instead of making the images open in another tab, I made them open in a modal that stays in the browser tab. I thought this was a super cool effect. Last thing was that I added my photo. To do this, I made it so that when someone hovered over my about me card, it would have a flip animation and on the other side my photo would show. I thought this was a nice and subtle was to implement my photo, without messing up any other styling on the page. Learning JS A lot of these features were implemented with JS, especially ones that were triggered with user input. I will acknowledge that I used AI to help with understanding JS logic for some of these features, and debugging as well, but I also learned along the way. I find JS much more complicated than HTML and CSS, and I think that I have really come far in understanding and implementing it. For examples, I can assign elements and add and remove classes based on user input. I still have some trouble with syntax, and that causes a lot of my problems, but I am really starting to get the hang of JS. I think that JS can create some really neat animations and effects, so I want to learn and understand this language, so that I can let others experience the cool things that I see on other websites. Overall I spent a lot of time on this project, and put in hours even after school started. It is a really personal project. I have come really far since I first started this project and I have grown confident in understanding and writing code and achieve the desired results. I probably will not work on this project after this ship, and will instead turn to other projects that I have pending. Please enjoy this project. If you have any suggestions, let me know in the review or as a comment, and I will try to implement it. Thank You!! Below is a picture of my stardance certificate in the modal that I made, and the other is a picture of the spinning gradient loader. Enjoy!!!...
|
1793659938.1383734
|
1793746338.1383734
|
|
21899
|
My awesome macropad! by @Chaurya | Stardance
|
Chaurya
|
0
|
0.0
|
0
|
[]
|
[]
|
Title: My awesome macropad! by @Chaurya | Stardanc Title: My awesome macropad! by @Chaurya | Stardance...
|
1793141537.3183494
|
1793746337.3183494
|
|
4425
|
My first slack bot! by @quiquetsz | Stardance
|
quiquetsz
|
0
|
0.0
|
0
|
[]
|
[]
|
Title: My first slack bot! by @quiquetsz | Stardan Title: My first slack bot! by @quiquetsz | Stardance...
|
1793141536.4341002
|
1793746336.4341002
|
|
46693
|
WildOS by @Ri | Stardance
|
Ri
|
0
|
0.0
|
0
|
[]
|
[]
|
Title: WildOS by @Ri | Stardance
|
1792882334.8595932
|
1793746334.8595932
|
|
54062
|
New Page by @tiyas | Stardance
|
tiyas
|
1
|
12.0
|
0
|
[{"ship_num": 1, "ts": "2026-0 [{"ship_num": 1, "ts": "2026-08-28T05:38:17Z", "hours": 12.0, "multiplier": null, "payout": 0, "blessing": "neutral", "text": "i have used many ‘new page’ extensions, but i have always faced a problem, all of them provide the option to choose which search engine you want to use , but its not handy to change the search engine again and again. and for dev people its so irritating, so i made it, you have all search engines in left side, you can search in any of them as per your need. and it also have a monthly calendar and a clock and mit rss news fetcher, it will update daily, and keep you updated too…", "repo": "https://github.com/Tiyasbanerjee/New-Page", "demo": "https://tiyasbanerjee.github.io/New-Page/"}]...
|
[{"post_id": 56413, "ts": "202 [{"post_id": 56413, "ts": "2026-08-28T05:32:42Z", "hours": 0.5728, "text": "i have fixed some bugs ,and some styling issues, now it looks great, and ready to use, and i am shipping it now."}, {"post_id": 56394, "ts": "2026-08-28T04:43:28Z", "hours": 0.3911, "text": "i fixed it, now news is showing properly."}, {"post_id": 55743, "ts": "2026-08-27T18:34:45Z", "hours": 2.0158, "text": "Now the search bars are working, but the news api’s are not working properly…."}, {"post_id": 55134, "ts": "2026-08-26T16:28:29Z", "hours": 2.2278, "text": "i have added the clock and the search bars. next i will add the news feed, weather report , and the search logic , and a section to add your favorite apps."}, {"post_id": 55028, "ts": "2026-08-26T13:41:53Z", "hours": 0.7411, "text": "added a new section where news will be shown, and also made it show image of the day from nasa as the background image…"}, {"post_id": 54707, "ts": "2026-08-25T19:38:38Z", "hours": 2.0497, "text": "i have finished making the calendar… it was a tough time… because i had spend extra half hour because i saw a wrong calendar and thinking that aug has 29 days… after using 200% of my brain i at last find out my code was correct, i was mistaking…"}, {"post_id": 54547, "ts": "2026-08-25T15:59:36Z", "hours": 1.6264, "text": "Now I am building a calendar from scratch.. seems like my brain will be roasted while doing this…"}, {"post_id": 54301, "ts": "2026-08-25T07:46:00Z", "hours": 1.9564, "text": "i have set up vite. and now configing the github deploy stuffs.. i have also make the html and css a bit, like the main wallpaper and 2 sections. at first i was building it from my mind, but when i saw the guide i understood it uses vit, and github deploy , so i had to spend time understanding those things…"}]...
|
Title: New Page by @tiyas | Stardance
Devlogs:
i Title: New Page by @tiyas | Stardance
Devlogs:
i have set up vite. and now configing the github deploy stuffs.. i have also make the html and css a bit, like the main wallpaper and 2 sections. at first i was building it from my mind, but when i saw the guide i understood it uses vit, and github deploy , so i had to spend time understanding those things…
Now I am building a calendar from scratch.. seems like my brain will be roasted while doing this…
i have finished making the calendar… it was a tough time… because i had spend extra half hour because i saw a wrong calendar and thinking that aug has 29 days… after using 200% of my brain i at last find out my code was correct, i was mistaking…
added a new section where news will be shown, and also made it show image of the day from nasa as the background image…
i have added the clock and the search bars. next i will add the news feed, weather report , and the search logic , and a section to add your favorite apps.
Now the search bars are working, but the news api’s are not working properly….
i fixed it, now news is showing properly.
i have fixed some bugs ,and some styling issues, now it looks great, and ready to use, and i am shipping it now.
Ships:
i have used many ‘new page’ extensions, but i have always faced a problem, all of them provide the option to choose which search engine you want to use , but its not handy to change the search engine again and again. and for dev people its so irritating, so i made it, you have all search engines in left side, you can search in any of them as per your need. and it also have a monthly calendar and a clock and mit rss news fetcher, it will update daily, and keep you updated too…...
|
1793659932.545512
|
1793746332.545512
|
|
41749
|
Hackpad! by @evie_creates | Stardance
|
evie_creates
|
0
|
2.97
|
0
|
[]
|
[{"post_id": 40470, "ts": "202 [{"post_id": 40470, "ts": "2026-08-04T00:49:34Z", "hours": 1.45, "text": "I worked on my Hackpad case. I ran into a lot of problems, mainly because I wasn’t used to the software I was using. Hopefully I can finish the tutorial sometime this week and start working on my own additions."}, {"post_id": 38624, "ts": "2026-08-01T03:41:54Z", "hours": 0.35, "text": "I started working on making the case for my Hackpad. I haven’t added any additions so far, but I will be doing that soon once I understand how everything works. So far, it hasn’t completely gone according to plan, but the vision is there."}, {"post_id": 37941, "ts": "2026-07-30T23:38:11Z", "hours": 1.1667, "text": "I have started building my super cool Hackpad! With this I’m hoping to be introduced into electronics and hardware. I can’t wait to learn about making schematics, PCB’s, and 3D modeling!"}]...
|
Title: Hackpad! by @evie_creates | Stardance
Devl Title: Hackpad! by @evie_creates | Stardance
Devlogs:
I have started building my super cool Hackpad! With this I’m hoping to be introduced into electronics and hardware. I can’t wait to learn about making schematics, PCB’s, and 3D modeling!
I started working on making the case for my Hackpad. I haven’t added any additions so far, but I will be doing that soon once I understand how everything works. So far, it hasn’t completely gone according to plan, but the vision is there.
I worked on my Hackpad case. I ran into a lot of problems, mainly because I wasn’t used to the software I was using. Hopefully I can finish the tutorial sometime this week and start working on my own additions....
|
1793141531.6461298
|
1793746331.6461298
|
|
41748
|
My own site! by @ivan0 | Stardance
|
ivan0
|
0
|
0.0
|
0
|
[]
|
[]
|
Title: My own site! by @ivan0 | Stardance
|
1793141529.564071
|
1793746329.564071
|
|
47840
|
NULL
|
NULL
|
0
|
0.0
|
0
|
[]
|
[]
|
|
1792882329.1596386
|
1793746329.1596386
|
|
47836
|
NULL
|
NULL
|
0
|
0.0
|
0
|
[]
|
[]
|
|
1792882328.2902095
|
1793746328.2902095
|
|
41746
|
WarioWare Game by @Dami | Stardance
|
Dami
|
0
|
0.0
|
0
|
[]
|
[]
|
Title: WarioWare Game by @Dami | Stardance
|
1793141527.5794618
|
1793746327.5794618
|
|
32862
|
Momento by @boberto | Stardance
|
boberto
|
0
|
9.39
|
0
|
[]
|
[{"post_id": 29304, "ts": "202 [{"post_id": 29304, "ts": "2026-07-16T04:05:59Z", "hours": 9.3872, "text": "What am I working on? Momento isn’t just another desktop agent, it’s a personal assistant that actually understands you. Instead of waiting for commands in a blank chat box, Momento lives in your desktop, watching your workflow and creating a digital map of you and how your work operates. It proactively coordinates your day, catches scheduling conflicts before they happen, and orchestrates your mornings. Inspiration This project was inspired by J.A.R.V.I.S. and I plan to make a one-on-one replica with custom toolings. Features morning summary calendar, notion, todoist, gmail integrations a node graph of your workflows, tasks, emails, connections, and todos"}]...
|
Title: Momento by @boberto | Stardance
Devlogs:
W Title: Momento by @boberto | Stardance
Devlogs:
What am I working on? Momento isn’t just another desktop agent, it’s a personal assistant that actually understands you. Instead of waiting for commands in a blank chat box, Momento lives in your desktop, watching your workflow and creating a digital map of you and how your work operates. It proactively coordinates your day, catches scheduling conflicts before they happen, and orchestrates your mornings. Inspiration This project was inspired by J.A.R.V.I.S. and I plan to make a one-on-one replica with custom toolings. Features morning summary calendar, notion, todoist, gmail integrations a node graph of your workflows, tasks, emails, connections, and todos...
|
1792882327.465547
|
1793746327.465547
|
|
41745
|
Frictionless by @Dami | Stardance
|
Dami
|
0
|
0.0
|
0
|
[]
|
[]
|
Title: Frictionless by @Dami | Stardance
|
1793141526.6882744
|
1793746326.6882744
|