This repo contains a very basic example of how to use tldraw in a Next.js app.
yarnto install all the dependencies
yarn devto setup the frontend service with command
Here are some AI/Editing concept I am exploring, trigger different kinds of experiment with Cmd + k hotkey on the Mac.
1. AI: Fast diffusion (Latent Consistency Model) 🔗
- You will need a real-time Latent Consistency Model python server (from ) for this experiment. follow the instruction and setup the backend service (you will need to do a
git checkout ee4d659to specifc version of the project). - Toggle the Command Menu (cmd + k) and select Fast diffusion (Latent Consistency Model) to start the function
- Try to draw an illustration inside the frame. the UI will send the doodle + frame name (as the prompt) to the backend to generate the result
2. AI: remove background (client side only) 🔗
- Update a photo and click to select it
- Toggle the Command Menu (cmd + k) and select Remove background to start the function
- wait for 5-8 second, and you will get the result
3. Editor: Linked list selection 🔗
- Create some stickys and connect them with connectors
- Toggle the Command Menu (cmd + k) and select Linked list selection to start the function
- Click to select the parent sticky and move it around
- You will see that the children stickys update the position as well.
4. Editor: Joystick control 🔗
- Create some stickys and connect them all to a single sticky with connectors
- Toggle the Command Menu (cmd + k) and select Joysticky control to start the function
- Click to select the parent sticky, and control the Joystick
- You will see that the children stickys update their position.
5. Editor: Crayon doodle 🔗
- Toggle the Command Menu (cmd + k) and select Crayon effect to start the function
- Switch to doodle mode and start to draw on the canvas
6. Editor: drag and drop 🔗
- Toggle the Command Menu (cmd + k) and select sticker panel to start the function
- drag the sticker in the side panel and drop it on the canvas