Steve Ruiz Profile picture
Jan 29, 2022 18 tweets 5 min read Read on X
I think I got it, omg
Compare to current behavior:
Quick refresher on how arrows are *supposed to* work.
When we have an arrow between shapes, that arrow has a start and end point (actual location is based on a normalized "anchor" from when the arrow was last modified, long story)
We fire a ray from the start point through end point.
We expect to have have one intersection from the start shape, and two intersections in the end shape. We pick the intersection closer to the start point.
If the arrow has a decoration (ie an arrowhead) then we move the point back toward the other point by some distance.
Now we can draw our arrow.
Hooray!
To my great shame and frustration, this routine only works if certain conditions are met. Did you catch them?
For example, what if the shapes are overlapping?
Then you get this one.
Doesn't look very good, in part because the arrow is no longer pointing "towards" its anchor, but through it.
The fix for this is to force an arrow of a known distance that points toward the anchor point.
This also works if the shape is overlapping the target point, though not as well.
There's some more to deciding when to change strategies (arrow too short? contain or collide?) but that's the main approach.
Still some work to do 🤔

• • •

Missing some Tweet in this thread? You can try to force a refresh
 

Keep Current with Steve Ruiz

Steve Ruiz Profile picture

Stay in touch and get notified when new unrolls are available from this author!

Read all threads

This Thread may be Removed Anytime!

PDF

Twitter may remove this content at anytime! Save it as PDF for later use!

Try unrolling a thread yourself!

how to unroll video
  1. Follow @ThreadReaderApp to mention us!

  2. From a Twitter thread mention us with a keyword "unroll"
@threadreaderapp unroll

Practice here first or read more on our help page!

More from @steveruizok

Apr 6
Build popular open source library, train
own model on docs + examples (some private?), guarantee that model is updated with every release, sell as integration with user IDEs
Let’s say @threejs went this route. The core product is free (wedge) but AI assisted coding environments sometimes trip over out of date versions or make poor choices based on bad examples in their training data.
The threejs team announced ThreeAssist, an “expert” model fine-tuned on each minor release, fresh docs, etc. Outscores commodity models, produces better results, guaranteed to be true to the given version, etc.
Read 4 tweets
Jan 12
my thoughts on ai + canvas, Jan 2025

🧵sorry
I see a lot of AI uses for the @tldraw SDK. I’d say about 25% of our customers are full on AI apps and another 30% are looking to integrate AI tools into their canvas in the future
No surprise, the most shippable / effective use cases are currently where generated artifacts can augment existing use-cases
Read 9 tweets
Mar 31, 2023
nightmare fuel for browser apps. 2GB memory limit and no way(?) to recover once you’re over the limit.
Figma has a “wireframe view” that might help here as a fallback, if it means keeping images etc out of memory, though it would be up to the app to switch into that. (And actually I’m not even sure if that would work)
For tldraw we have a limit of shapes per page and pages per project but it’s still theoretically possible to crash it out via memory depending on your browser.
Read 5 tweets
Feb 3, 2023
feels pretty good
Here's the full interaction, complete with hover indicators.
|
Note that you can interact with text directly either: a) when editing text or b) when the text tool is selected. This will mean you can't create text on top of other text, but I'm guessing this is okay.
props to @djsheldrick for the idea here
Read 4 tweets
Feb 3, 2023
In @figma, holding shift while drawing a selection box over items will:
1. select deselected items
2. deselect selected items

Is this the right behavior? Have you ever accidentally selected / deselected items while shift-selecting?
@figma I remember working out some more complicated logic here with a rule like "if any new items are being added to the selection, don't deselect any other items"
Read 4 tweets
Jan 11, 2023
Remind me next time to migrate the database before shipping runtime validation 💀
In tldraw’s beta db, there were lots of different versions of our data scattered around, including some from the wild times before we wrote client-side migrations, and some that just included broken data, x = NaN etc.
We’d written validation in order to catch this type of bad data when it came into the app. We didn’t write any recovery from the bad data, the app would just throw as soon as it ran into it.
Read 10 tweets

Did Thread Reader help you today?

Support us! We are indie developers!


This site is made by just two indie developers on a laptop doing marketing, support and development! Read more about the story.

Become a Premium Member ($3/month or $30/year) and get exclusive features!

Become Premium

Don't want to be a Premium member but still want to support us?

Make a small donation by buying us coffee ($5) or help with server cost ($10)

Donate via Paypal

Or Donate anonymously using crypto!

Ethereum

0xfe58350B80634f60Fa6Dc149a72b4DFbc17D341E copy

Bitcoin

3ATGMxNzCUFzxpMCHL5sWSt4DVtS8UqXpi copy

Thank you for your support!

Follow Us!

:(