I made a game with Webflow

Community resources Show & Tell
1

Just like the the title says I made a game with Webflow with no custom code. It is a maze with one level currently.

Have fun and good luck completing it! If people enjoy it enough I will make more levels.

https://hiddenpath.webflow.io/

I have also added it to my showcase available for cloning :slight_smile:
https://webflow.com/website/hiddenpath

3 Likes
2

I can’ even begin to understand how you accomplished this… even after cloning the project :joy:

Care to explain?

3

@Hunter_Reynolds

So basically I made 3 grids:

  • The base layer is not needed but is more a tool to map it out but could be used for fun interactions later.
  • The path layer is made in the grid as the base layer but only the boxes that will be apart of the correct path.
  • The choice layer is made in the same grid as the base layer but only the boxes that could be a choice for the player.

Once you have the grids made then comes the interactions:

  • Display hidden all the boxes with hide/show as initial on page load through the class “box”
  • Display the first choice box through the page load animation

(Repeat section)

  • On click of the correct choice box display hidden that box

  • Display the “Path Layer” box equivalent to the chosen box

  • Display the new choice boxes in the choice layer

  • Move the “Ground” to replicate motion of the “camera”

  • If the wrong box is chosen call reset animation which moves “Ground” back to original position and re-hides all boxes through the class

  • On the last correct box choice make some some fancy animations and Show the congrats screen

Hopefully this gives you a better idea :slight_smile:

4

Woah, that’s amazing! Great job man

1 Like
5

Wow, awesome work! .

1 Like
6

That’s amazing! good job bro!

1 Like