project screenshot 1
project screenshot 2
project screenshot 3
project screenshot 4

Crash

Starknet / Cairo learning platform for kids inspired by (MIT Scratch)

Crash

Created At

StarkHack

Winner of

trophy

Dynamic - Pool for projects which use Dynamic

Prize Pool

Project Description

CRASH is a learning platform inspired by MIT Scratch, designed to teach kids blockchain technology and programming using Cairo on the StarkNet blockchain. It aims to make blockchain and smart contract development accessible and engaging for young learners.

Use Cases 1 : Sharing Secrets Safely (Blockchain Encryption)

Two sprites want to share a secret message. They use encryption to send it securely across the blockchain.

when green flag clicked
ask [Enter your secret message:] and wait
set [secret message] to (answer)
set [coded message] to []
replace item (1) of [secret message] with [A] 
replace item (2) of [secret message] with [B] 
say (coded message)

Narrative:

"Whispering Willow and Chatterbox Chipmunk want to share a secret. They use blockchain encryption to ensure their message remains private. Can you help them encrypt and send their message safely?"

How it's Made

Platform Architecture

We used Reactjs for the client side, and leveraging the Google Blockly project https://github.com/google/blockly which is a web-based Visual programming editor that automatically converts drag and drop interactions into XML / JSON / Python & Javascript

We leverage the XML markup as a simplified rules engine between the crash-vm for handling our cairo contract and compilation + crash-js-runtime for executing all client side instructions.

Our repository structure uses Git submodules to allow development in one cohesive directory. Since this project is heavily inspired by the MIT Scratch Project, most of our core modules like Audio, Paintly + environment & costume for learning characters are based off internal scratch foundation projects.

The Rust/Cairo VM & Crash-JS runtime allow us to abstract execution from GUI interaction.

All GUI operations are based on standard React/Javascript conventions and we handle injecting web3 interactions through the GUI by maintaining a global browser state upon initializing the project on any web browser.

This state keeps track of starknet connection, injected wallets, authentication, drag and drop rules etc.

Since we're using this global state, we've not had a need for a database.

Hacks

We could not complete our rust pre-processor vm during this hackathon, so we make mock contract interactions to communicate the concept.

In an ideal scenario, we'd favor using a blockchain native storage option like filecoin or arweave to retain state and maintain a single reference within our starkvm to keep pointers of compiled projects and their arweave paths.

Challenges

We tried using the dynamic SDK, however it was a bit of a challenge due to how operations are executed, although the GUI uses React, the Crash-js runtime does not rely on it, so we needed a way to call and execute web3 interactions in a dynamic-rule based manner.

i.e. we take input from Blockly and generate a set of execution rules to trigger smart contract interaction.

We've learnt so much about the Starknet ecosystem from exploring this idea and it's been so much fun hacking on the project.

background image mobile

Join the mailing list

Get the latest news and updates