Inspiration
The idea honestly just kind of clicked for me. I liked the look of crayon drawings on notebook paper, and I thought it would be funny if the stuff you drew actually became part of the physics world.
A lot of drawing games make your lines feel perfect or magical. I wanted the opposite. I wanted the player to draw some sketchy little ramp, hit play, and immediately realize it is way less stable than they thought.
What it does
Scrawl is a physics-based drawing game mixed with something like golf.
Each course has a ball, a cup, and some fixed obstacles. The player has a limited crayon budget and has to draw ramps, bridges, walls, chutes, or whatever else they think will guide the ball into the cup.
The catch is that everything the player draws also gets simulated with physics. So your perfect-looking ramp might tip over, collapse, lean on another object, or completely betray you the second the ball starts moving.
There is also a course editor where players can make their own levels. The main rule is that you cannot publish a course until you beat it yourself using the same crayon budget everyone else gets. However many attempts it takes you becomes par for that course.
Each player’s attempt count is tracked per course, and the leaderboard ranks people by the fewest tries.
How I built it
I built Scrawl with Devvit Web, Phaser 4, and Matter.js handling the physics on the client. There is also a small Hono backend that keeps track of scoreboards, completed runs, and the daily queue in Redis.
Every crayon stroke gets converted into a physics body while you draw, then simulated live when the player hits play.
One thing I’m happy with is that the game has zero image assets. The paper, crayon strokes, ball, cup, and even the “scrawl!” wordmark are all drawn in code at runtime. A bunch of layered, slightly jittered canvas passes give it that messy wax-crayon look. It also keeps the app small and lets every course feel like its own little sheet of notebook paper.
Challenges I ran into
The hardest part was definitely the hand-drawn physics.
Turning a wobbly crayon line into a collision shape sounds simple, but it gets messy fast. The ball needs to hit it cleanly, the drawn object needs to behave like it has weight, and the whole thing cannot just explode across the screen because two shapes touched the wrong way.
My first attempts used overlapping circles, then rectangles, and both caused problems. Lines would jitter, tunnel through each other, or randomly launch objects off the paper. A lot of the project was just trying to make drawn objects feel chaotic in a fun way instead of broken.
Accomplishments I’m proud of
The core idea ended up working better than I expected. Drawing a dumb little ramp and watching it almost work is weirdly satisfying.
I’m also really happy with the prove-it-before-you-post editor. Having creators beat their own course before publishing it makes user-made levels feel fair without needing a complicated moderation system. If a course exists, someone already suffered through it and proved it can be done.
The look also came together well. The notebook paper and crayon style fits the game better than I expected, and it gives the whole thing a playful feel without needing a bunch of art assets.
What I learned
Physics games are hard.
It is one thing to make physics “work,” but it is a completely different thing to make it feel good. A tiny change can make the game feel satisfying, broken, unfair, or hilarious. This project taught me a lot about how much tuning goes into making physics feel intentional, especially when the player can draw almost anything.
What's next for Scrawl
Next, I want to add more starter courses and build out the daily tournament idea, with weekly winners pulled from the scoreboards.
I also want players to be able to remix each other’s courses. You could open someone’s post in the editor, tweak it, and publish your own version.
I'd also really like to make it so you can playback other peoples solutions. However, we'd need to design around people stealing solutions, so this might be a longer term goal.
More crayon types would be fun too, like bouncy crayons, sticky crayons, or heavier materials, as long as they make courses weirder without making them unfair.
Longer term, I’d like to add more community features: featured courses, a hall of fame for the most-attempted-but-least-solved courses, and flair for players who top a leaderboard.
Built With
- devvit
- matter.js
- phaser.js
- redis
- typescript
Log in or sign up for Devpost to join the conversation.