Draw Fast is a demo that shows how you can use the tldraw library with realtime image generation. The demo has now finished and we’ve taken it down. But you can still run it on your own machine and try it out.
Here are two ways of doing that.
Here's a video tutorial. Or read below for a written guide.
draw.fast.guide.mp4
Clone this repo!
git clone https://github.com/tldraw/draw-fast
Go to fal.ai
Login with github, and get a key from the keys page. (You can give it any name you want).
Copy your key.
Create a .env file in the root folder of your repo.
Paste your key there as FAL_KEY
Your file should something like this:
FAL_KEY=8bf6c68d-8711-426b-90c6-0d9636909fce:b774f2a649cfecbf56dce57db7966a73
In your terminal…
npm install
npm run dev
And open localhost:3000
Draw something in the rectangle! Double-clicking the prompt to change it. Click the small arrow to enter lens mode.
Record your screen and show us what you draw fast.
We’re @tldraw on twitter.
If the generated images don’t appear, try running npm install and npm run dev again, or try waiting a while for your key to activate.
Sign in on CodeSandbox. Click on Import repository.
Import the repo by pasting in https://github.com/tldraw/draw-fast and clicking Import.
Click Next until you get to the Set environment variables screen.
On the Set environment variables screen, click Add variable.
Name your key FAL_KEY.
You can get a key from fal.ai
Instructions on how to do that are here.
Click Save, then click Next until you get to the end of setup.
Finally, click Apply and restart, and wait about 5 minutes.
Draw something in the rectangle! Double-clicking the prompt to change it. Click the small arrow to enter lens mode.
Record your screen and show us what you draw fast.
We’re @tldraw on twitter.