Added project carousel!

React component

I used React to make a reusable image carousel thing where you can pass an array of photos as an argument and it will put it into the the SplideJS slides

Used SplideJS again

Added a featured projects carousel that has some cool projects that our Code Without Borders Bootcamp participants made!!
Added arrows to the carousel too

Tailwind

Added a gradient background for aesthetic purposes :)

Challenges

I generally had a hard time figuring out how to style the features component–it was really looking rough to start with but we landed on something 😭 I think the gradient helped a lot

Additional information

• I also tweaked styling for the rest of the webpage
• I added some join buttons and linked the donation page
• Updated the impact numbers

Future additions

• About to add the proper join form and also get started on the about us page :D

Keytchen - More visual feedback and debugging!

Had to backtrack w/debugging

I debugged the entire timing system of beats because the gameplay was just not fun, it was not registering beats sometimes and the visual beat feedback wouldn’t update when it was supposed to. I fixed this by separating the visual beat updating system with the input tracking of beats for gameplay and it worked out well 😭

Visual feedback

• Error for wrong timing red key
• Error for wrong key red key
• Key you’re supposed to press is highlighted green
• The beats pulse whenever a beat happens to help the player feel the beat in the game better

Miscellaneous

• You can access the minigame through the main screen’s cutting board now!

Challenges

• Debugging my beat system was so painful and a nightmare because my code was so messy and I confused myself with it. I solved this by commenting out all my code so now there’s no way I get confused LOL

Future additions

• As you can tell, I still haven’t added the new potato / zucchini textures so i will have to do that :’). The next time you see a post it will have different textures not just a carrot i promise!!
• I’ll need to create some kind of inventory system so that the cut up vegetables can be stored somewhere so when the player wants to cook something using those ingredients they have it on hand and can add it to a pot or pan or something

That’s all folks! see ya in the next update! ;D

Cutting mechanism almost done

Notes autoload

Now the player knows what notes to hit based on the note shown on screen! I’m going to add a note guide so that it’s also more obvious which note to hit if they’re not familiar with cdefgabc keys!

Different vegetable settings

Though there aren’t any graphics to match at the moment, there are different vegetables that call for different mini-games! I finished the carrot, zucchini, and potato mini-games.

Music added

I added some plain beat in the background that the player needs to match with the notes accordingly. It won’t work unless the player matches the beat well enough.

Challenges

• It’s hard to match up the switch of the note; i’m still working on this. sometimes the note even though switches in game logic doesn’t show up and the game remembers the last note as the one to show on screen (u can actually see it in the vid)
• I had to learn a bit about rhythm and bpm in order to set my variables for next beat and secs per beat stuff like that correctly 😭

Next additions

• graphics for different veggies
• the note showing on screen will have flawless timing
• sfx for notes
• there will be a note guide added for players who aren’t familiar with cdefgabc notes!

sorry my updates have slowed down…i’ve started school again D:

Carrot cutting animation + hooked to nanoKEY2!!

Art / animations

I used Aseprite to make the cutting board and the carrot graphics! I made each cut of the carrot a different image to make this work. Now there is a visible cutting animation for carrots!
I timed position changes, rotations, and modulation using AnimationPlayer.
Currently, the animation steps are triggered by a ui_accept input. I’ll change it to be musical chords that the player has to time perfectly as my next update.

Hooked controls to nanoKEY2

I looked into how MIDI inputs are controlled by Godot, and it doesn’t natively detect MIDI inputs from the Input Map in Project Settings, so I had to create a script that detects MIDI input and maps it onto a default Godot input like ui_accept and ui_left etc!
But now it’s working really well :DDDD

Challenges

• It was incredibly time consuming to key frame each individual position but hopefully I can just reuse these frames now and just replace the textures because I left the names generic for modularity
• I didn’t understand how MIDI inputs worked and matching them to other native inputs in Godot so it was tough understanding how to do it (so many diff things like MIDI_MESSAGE_NOTE_OFF/ON that I had to learn)

Next Steps

• I’m going to be adding the chords timing feature so that cutting is actually hard and not just a matter of ui_accept lol
  Stay tuned!

Added some basic game functionality! + recolored background

You can select a pot or pan for each stovetop now

Through a ton of pressed() signals and booleans we have made this happen

Focus

To pair this with my nanoKEY2, I’m starting game development with keyboard focus features early so that it isn’t a hassle to do later on!

Recolored stuff

I changed the colors of the background to make it even more approachable and friendly! I like this cool toned version… that last version looked a little eerie

Future additions

I will be adding:

• hooking nanoKEY2 to the actual game
• actual pot cooking mechanic
• pan cooking mechanic
• cutting vegetables mechanic (maybe I’ll start with a carrot first)
• a bunch of graphics to support those features

Challenges

Not many challenges this time but I keep forgetting to record my aseprite using lapse…I need to remember!

Stay tuned!

Main background drawn!

Aseprite

I drew the main background for the game’s kitchen area with Aseprite! There’s a stove and cutting board so far.

Future additions

Soon, I’ll be adding the following:

• Stove cooking mechanic
• Cutting board mechanic
  So mainly I’ll be establishing gameplay with the nanoKEY2!

Challenges faced

• Choosing the right color and vibe for this cozy game was pretty difficult, but I think I’m happy with the colors I have currently. I can change it anytime I want anyway! :D
  Stay tuned!

Audio + Speed scaling + Pause menu

Audio

Took sounds from freesound.org that had CreativeCommons0 licenses and used them in my game! it makes it feel so much more alive :)

Speed scaling

Now the game is harder because the obstacles move back faster as the game progresses. I used an autoload Timer for this and it works surprisingly well!
I hope you guys get to try my game out! I’m shipping it rn!

Pause menu

Now if someone calls you in the middle of you playing this game you won’t rage quit lol

Buildings added

Buildings

I modeled them in blender and stuff and made them modular. There are 5 types of buildings in total currently and 4 building chunk modules.

Spawn tweaks

I tweaked some spawner settings bc the more u got into the game the more weirdly the spawning would be like bursts of difficulty instead of constant accelerated difficulty. so fixed that :)

Future additions

• roads and buildings get faster so you feel how everything is getting faster
• audio
• basic pause menu
  after i finish those future additions I’ll finally ship Suiheisen’s first addition :D

Sky and more obsacles added

I added the limbo obstacle and now obstacle modularity is completely finished so i can just model obstacles and plug them in really easily. I also added a tutorial at the start for keyboard users.

obstacles + more!! :DDDDD

Obstacles

now there is:

• sawhorse barricade
• ‘road work ahead’ sign
• traffic cone
  all art and modeling and coloring etc done by me :D
  and i made the obstacle adding system modular so it’s really easy to add more obstacles as needed
  collisions are also all fine tuned to minimize rage quit lol

Player adjustments + bug fixes

Fixed a bug so now start screen fade out animation works as expected
the player’s height and camera was adjusted so obstacles are better seen and scaling is more realistic

future additions

• proper limbo obstacles and separating them from regular obstacles
• adding a pixelated sky texture via aseprite and godot worldenvironment
• sfx possibly
• buildings to surround the road to make it more lively and realistic

IT WORKS

Finally made modules for road terrain so now it looks like the thing is an actual infinite scroller now 😭 😭 😭 yessssssss

Art

• I had to draw aseprite road textures myself
• I also imported them in blender and after a lot of finessing I got them to this size. i actually might resize because it makes the player look super tiny lolll

scripts

I just made an array of the Node3Ds that had MeshInstance3Ds of each kind of road and made the spawner terrain controller thing alternate between them two :))

i’m losing my mind…

i’m trying to figure out how to make an infinite scroller in 3d godot but since it’s not like 2d u can’t just put parallax… u need to actual write a script to generate the mesh and get rid of them accordingly while moving all the mesh towards the player. and my tiny brain cannot wrap my head around it. so here’s what it looks like so far before i find out how to do this infinite 3d scroller thing :’)

Finished start screen!

Art

Art for the background of the start_screen and the blinking is done ! this took me hours holy moly

Animations

Coded and configured AnimationPlayer node to create this cool set of events when u boot the game
Basic code overall but super time consuming

Added footer + more

I added a footer to the home page to make it feel more complete

Number animations

now the number statistics animate when you scroll upon them. so i attached a video to show u what that looks like. I used the NumberFlow React library–it was pretty intuitive itself but then i had to use useState, useEffect, and useRef hooks and understand how to use those and how to defer the useEffect until the window detects it 😭 😭 u can do it with the native .getBoundingClientRect tho and u have to do it to an element you want to be the trigger, in my case i made the card the trigger, so if it shows then the animation will happen. and then make sure it’s less than window.innerHeight and element’s position.bottom must be greater than 0, which means that the element is below the top edge of ur screen
holy yap but this is how i teach myself bc that was something new for me 😭

Game Over screen polished

Game over graphics

now the game over scene has a cool cubicle graphic (i drew it on aseprite all graphics here are custom-made) and it blinks. the instruction to go back to the start menu looks like that because this game is supposed to pair with my SuiheisenPad micropad (like an arcade machine)
The cubicle changes depending on the message that the game chooses

Player collision bug fixes + movement fixes

Now the player goes still when the game is over and it’s fading out, and the player’s side dodge collisions aren’t spheres but custom convex 3D shapes so that they can’t dodge the limbo obstacle

Fade out animations

now when game over happens the main scene fades out to black and game over fades in
yippee

game over messages + more

asset update

I made the running animation look less cut off on the sides
I made the dodging animations more polished with outlines

game over scene

when the horizon bar is at 0 the game over scene is cued

game over messages

now there’s a randomization of 4 messages, them being

1. it looks like you’re working overtime…
2. it was worth a shot i guess?

Horizon concept

Horizon bar added

I added the horizon bar, which is basically this game’s version of a health bar. It’s to fit the concept tho. Basically, the premise of the game is that this office worker is trying to escape his mundane office life running towards the horizon. (wants to chase the horizon and touch it) so yeah that’s why the bar is a sky themed thing–it’s to represent the horizon almost.

FINALLY difficulty progression + points registering system

This took me way too long to figure out

Difficulty progression

the obstacles spawn more frequently by 1% every 3 seconds
spawning cap and cooldown for spawning are safeguards so that the game isn’t impossible

Points registering

If the player successfully avoids the obstacle, points are registered. If not, then points are not registered (soon there will be a consequence implemented as well.)

Obstacles and Collision

Player collision

Player collision optimized so that people don’t rage quit while playing lollll I had to make custom convex CollisionShapeD for limbo and regular running position

Player movement

Player now is forced to return to the running position after 0.5 seconds! unless you spam the button–in that case the player will remain in that position.

Obstacles

Obstacles now spawn randomly with a slightly higher weight for the limbo obstacle (1.2x more likely to pop up, tentative number)
Collisions are looking good so far! I will update them accordingly if they’re not accurate but they’ve been through like 10 rounds of optimization atp lol