Hacker News Board Hacker News, browsed like a classic message board
Live data from Hacker News

Learn CSS Grid with a virtual garden game

cssgridgarden.com

Post reply on HN
Print view View original

21–30 of 63 posts

Re: Learn CSS Grid with a virtual garden game

#21

Post by bluelightning2k »

rezonant wrote: post #16
j16sdiz wrote: post #3

Some random note: 1. Good: The answer is verified by checking the absolute position. You can pass the level with any valid answer -- including non-grid variant. 2. Ugly: It send google analytics for every attempt.

re (1): Indeed, I think we all agree that "position: relative; left: 31.4em;" is a solid solution to the first challenge.

This made me laugh. Well deserved upvote for you.

Re: Learn CSS Grid with a virtual garden game

#24

Post by rimliu »

spyrosk wrote: post #20

For a moment I thought this was about https://csszengarden.com/pages/about/ (A long time ago) it was an amazing source to learn CSS, and get design inspiration.

I still consider those years to be the golden years of the web development. When the fruits of web standards movement started to appear. Alas, then came react and all the good stuff was thrown out of the window. I guess tag soup is palatable, when it is buried deep in node_modules.

Re: Learn CSS Grid with a virtual garden game

#27

Post by louthy »

martini333 wrote: post #11
sandreas wrote: post #2

While this game is quite nice and fun to play, I find it kind of tempting to just experiment with the values until you solve the current problem instead of focussing on the "How does it really work" aspect of the problem, which would lead to a deeper understanding... One way to solve this could be to allow more freedom in solving the problem as well as a small penalty on more than 2 or 3 tries.

You can't blame the game for your own discipline.

The whole purpose of a game is to complete a goal. Good games gamify you to achieving that goal. If the goal is to learn CSS and the game hasn't guided you to achieve that goal then it's failing at its purpose. Blaming the player for not playing correctly is an unbelievably bad take. The mechanics of the game should punish the user for doing the 'wrong' thing and reward them for doing the 'right' thing.

Re: Learn CSS Grid with a virtual garden game

#28

Post by cubefox »

infogulch wrote: post #15
martini333 wrote: post #11

Earlier quoted context omitted.

You can't blame the game for your own discipline.

Yes you can. Giving players so much freedom that they can easily identify and execute a grindy, brute-force but boring strategy is an extremely common problem in game design. Fault is irrelevant, it is the game's problem if the player stops having fun because they got trapped in a psychological pit tying to circumvent the rules when playing by the rules is ultimately easier. This is a tradeoff so requires some balanc…

Exactly. That's also the same reason why a game being too easy is the game's fault. One could object that players should be more disciplined and intentionally forego (e.g.) the stronger weapons in the game. But part of the fun of playing the game is to try to get the best possible weapon. Similarly, it is little fun to play e.g. tennis or chess against a weak opponent. Either it is too easy, or you don't give your best, neither of which is particularly fun.

Re: Learn CSS Grid with a virtual garden game

#29

Post by lenkite »

bluelightning2k wrote: post #22

I did this and enjoyed it. Maybe I'm getting old but I just use flexbox every time. Makes me very "meh" about CSS grid.

Grid definitely requires a bit more up-front thinking. With flexbox, you can code and then change in stream-of-consciousness coding.
Post reply on HN