← Previous · All Episodes · Next →
Make it real: Show the whole process - Lu Wilson from tldraw Episode 69

Make it real: Show the whole process - Lu Wilson from tldraw

· 30:32

|
Lu Wilson:

I had no idea that this visual approach to prompting an AI or interacting in a kind of AI native way, I had no idea it would work so well with databases.

Jack Bridger:

Hi, everyone. You're listening to Scanning DevTools. I am joined today by my friend, Lou Wilson, who is also known as ToadPond on the Internet. Lou is software engineer slash wearer of many hats at TL draw, and TL draw is the infinite canvas for the Internet, which is a cool way to say that you can make, like, Figma type drawing or really do anything whiteboard y with tldraw. And tldraw has kinda taken over Twitter, so you may well have already seen it.

Jack Bridger:

Lou, thank you so much for joining.

Lu Wilson:

Yeah. Thanks, Jack. Yeah. It's great to be on the podcast.

Jack Bridger:

Lou, so, just for the people on YouTube, do you wanna quickly do, like, a demo of, like, TL drawer and stuff just so people know? And if you're on the podcast, you wanna see this, and we'll just go straight to the interview. Yeah. So and bringing this back. So now we're we're back together, podcast and video.

Jack Bridger:

Yes. So you made the this make real, kind of demo, but and it and it exploded. But I I you told me that, there was one week where you were gonna just, like, not build any features and just do a bit of marketing. And Steve said to you, your your, found the founder of TLDR said to you, can you get a 100 likes on Twitter this week? And it all went from there.

Lu Wilson:

Yeah. So, basically, like, back in October or November last year, so not too long ago, I think we just secured some, like, an extension round of funding. We just secured some more customers. And, you know, like, it was getting to the end of 2023. We we just put out, like, we just wrapped up our new version of the library.

Lu Wilson:

So I think some of us were just looking forward to using this thing that we've been working on for so long, like using this library, trying to make some fun stuff. And, yeah, normally, my to do list is is quite long at the start of the week. This particular week, Steve, my boss, who's in the other room, just said, hey. Hey, Lou. And this is my Steve impression.

Lu Wilson:

Hey, Lou. Your job, oh, that's terrible, is to get 200 likes on Twitter. And so I asked him, like, okay. What what time scale are we thinking here? You know, like, and he said, within a week.

Lu Wilson:

So I built this little demo, using Sawyer's one as a starting point. The key difference was we wanted to put the website back on the canvas. And then, yeah, that night, it got 200 likes. I got a cute little message from my boss, like, hey. Well done.

Lu Wilson:

200 likes in one day. You know, nice, nice little, like, pat on the head. And then and then the following day, we did the feedback loop thing. And it got like 2,000 likes. Following day.

Lu Wilson:

Oh, it's then it yeah. Just it was just a chain reaction after that.

Jack Bridger:

It was, like, almost, like, double your growth or something. Right? It was like huge amount, like your stars.

Lu Wilson:

We were on 4 I think we were on around 14,000 followers on Twitter. And, in that period of time when we were going viral, we we jumped up to 40,000. Now we're on 50 50,000, above 50,000.

Jack Bridger:

Yeah. So it was like, I think, almost like the dev tools success marks successful campaign of the year, I I would say. It's hard to think of anything that went better.

Lu Wilson:

Yeah. I mean, and it's and it's it's interesting hearing that from you because, like I said, we would we always just share what we're working on on Twitter. I think that's part of the company culture here, you know, like, when we're working on these really hard features, and enjoying these milestones of, you know, reaching reaching some new concept that we can share or working on something, like, ridiculously hard problem with arrows, which is usually what we're working on. It's nice to share that, but not just share the end result, like, in a like in a launch week, but share share the entire process. And so from my point of view, we were doing the same as usual, but we were just really just going for it this time, I think.

Jack Bridger:

Yeah. So how how does it work? Like, what it what is it, like, actually, like, the nitty gritty of, like, you doing this? Like, how did you come up with this idea? Like, and and then and then how did you get it out there?

Lu Wilson:

Yeah. Well, I I think all of us on the team here, there's about oh god. I've I can't count. Like, 8 or 9 of us now. I think all of us know this TL draw library really well at this point, obviously, because we've been building it.

Lu Wilson:

And sometimes it's, it's a bit frustrating, because we're building all these tools that we we know enable lots of really fun, cool stuff. So sometimes it feels a bit sad, like making these toys and not being able to use them ourselves as much as much of the time because, you know, we want to make sure that they're working for other people to use. You know, we we make this library and we see other people play with our toys. So I think all of us here have have pretty clear ideas of of fun demos of, like mind blowing new concepts to build. So it's probably less so about finding these ideas because we know what's possible.

Lu Wilson:

But sometimes we just want to share what's possible with the rest of the community, if that makes sense. Like, the I think we were hoping that someone would make something like this. But I guess when, for example, when Sawyer made his initial version, he didn't, he didn't necessarily go further to the point of, like, putting this website back on the canvas and being able to annotate it. So from our point of view, we wanna show what's possible with this library so that we we don't have to do that so much. So the other people, like, take on the library and and build, fun stuff on it themselves.

Jack Bridger:

Yeah. So I don't think we covered that, but Sawyer so so who was who was Sawyer?

Lu Wilson:

Yeah. So, Sawyerhood, where is actually an employee at Figma, I believe, wanted to build a little experiment on a on a canvas. So used teal draw to make a draw a UI demo. GPT Vision API had just come out, and and I think he had the insight to see that, oh, actually, I could just draw a website and make it real by sending it to GPT. So he made he made this first version.

Lu Wilson:

We saw it. We're mind blown by it. But what we wanted to do was show that you could actually put it back on the canvas and start a feedback loop where, like, GPT brings back a website, then you annotate that website, can send it back and get into this back and forth. And it and it's been it's it's been great when when people have been trying this and and sharing it with us, like, hey, look, look, I made this website, the most fun thing is, is not just seeing that end product, you know, like the final website that they build, and maybe like share with their friends or community. It's been amazing to see this whole process from start to finish where they just first sketch just like a real low fidelity wireframe.

Lu Wilson:

And then DPC visions brought back something. And then they've annotated it, or they've highlighted something, or they've just crossed something out. Right. And then they've sent that back. And this is some of these sessions seem to have gone on for hours, right?

Lu Wilson:

Like, like, when I think of building a website, I imagine myself sitting down at computer and typing away, but it seems like that. I think we've just got like a taste of a different way of building maybe prototypes, maybe maybe just something that you that you just want to make quickly, or you just want to you just want to share with a small number of people for a small use case. So so it it's been great to see this whole process, this whole different way of working.

Jack Bridger:

It does feel very, like, kind of playful and experimental. Like, I see a lot of, like, the things that you put out is like, hey, you could do this. So, like, what happens when I do this? And, like, it feels very, like, playful.

Lu Wilson:

Yeah. I yeah. And I think that's that's how we think about, like, that's how we think about the messages we wanna give out about this. I think we've we've picked up over time what kind of content. I hate hate to call it content.

Lu Wilson:

But, yeah, what what kind of content is popular on on Twitter or on LinkedIn, TikTok? And we've I think we've realized that the the most successful kind of messaging and storytelling is about the journey that we go through and give giving people a little glimpse of that. So, you know, if if we discover something something amazing or surprising, and we wanna share that with other people, I think the most effective way we can do that is, is to share our shock or surprise. It's sometimes hard when when I'm right, writing tweets isn't that hard, but like, it's sometimes hard when you're writing a tweet, you want to wanna show off a bit. You wanna say, hey, look how good we are.

Lu Wilson:

But actually, that's not my genuine reaction when I'm building this stuff. My genuine genuine reaction is, what the hell? You know, like, like, when something when something works, and I didn't expect it to work, like, that seems like a a key moment to share. And and we this whole build in public community is built on the idea. I think the thing we're doing at teal draw is trying to take that into a team.

Lu Wilson:

And and a bigger, more serious products, like to like the teal drawer library. And it seems to work really well.

Jack Bridger:

Yeah. And do you how much of this, like, because I could imagine if someone's listening and they're like, oh, yeah. But teal drawer is like an inherently, like, interesting thing. It's very visual. If someone was like, you know, just like, I don't know, building a a database, like, how would you, like is there are there any of, like, the the kind of principles that you guys use that, like, would carry over to, like, something that's, like, a bit less visual?

Lu Wilson:

Yeah. That's we are very lucky because we work on a very visual problem. Right? So it it is part of our job to make the most of that, I think, in the process of get trying to get more people involved, more people trying it out and giving us feedback. But even with things like databases, at the moment of like, this is the best time to be sharing visual content on any any topic intact.

Lu Wilson:

If it's not visual, just make it visual. Like, I I I think there's always a way. When when, when some of this make real stuff was going viral, I went along to the Superbase meetup here in in their launch week. And, again, I went through this, this journey of discovery. I had no idea that some of this more vision this visual approach to prompting an AI or interacting in a kind of AI native way.

Lu Wilson:

I had no idea it would work so well with databases. I no offense to Supabase, but I find databases very boring. Right? And even I was excited to see that you could cross out a row. So look look look how excited I'm getting about databases.

Lu Wilson:

Like, you could cross out a row if you wanted to delete a row. We tried an experiment where you could draw fruit, like draw a picture of a fruit to put it in a database. Right? Okay. Just just think about okay.

Lu Wilson:

This is the problem on a podcast. It's it's not visual. But when you just show drawing a picture to edit a database, suddenly, database is a visual.

Jack Bridger:

Yeah. That's that's really interesting. And I think, like, yeah, the the it doesn't have to be like a whiteboard for it to be visual. It's like a medium and, yeah, that that makes so much sense.

Lu Wilson:

Yeah. For sure. I mean, the thing is, like, even forgetting the AI, the AI, APIs are now available. So there there is all of this vision API and multimodal, models. Multimodal models is quite a tongue twister.

Lu Wilson:

But, yeah, multi multi multimodal models are more popping up now. So that is a tool at your disposal. But no matter what the problem is, I'm certain that in engineering teams and developer teams, there are all sorts of diagrams, scribbles, like tables, visualizations that people make while they're developing. Like, it maybe they do it on a piece of paper, maybe they do it in a notebook. Maybe they do it on a like a physical whiteboard.

Lu Wilson:

Maybe they do on a virtual whiteboard. Hopefully, it's teal draw. But I know that these things happen. And and if they don't happen in your team, then just try it. Just try it.

Lu Wilson:

Try visualizing your non visual things. Yeah. It's it's always a reminder for me. So when I when I'm working on a problem, and and there's no visual representation other than other than text, that's when I try to stop and think, how can I represent this visually so that other people can engage with it? You know, sometimes that's part of the process as well when we're when you're trying to explain something to someone else on the team.

Lu Wilson:

And by sharing that in public on Twitter or LinkedIn or wherever, that's basically just inviting that audience to join your team as well. And, you know, we we want to we want people to get involved. You know, we want people to give their ideas. If you make something visual, you make it more accessible. Anyone can understand the drawing.

Lu Wilson:

Not everyone can understand your 16,000 lines of typescript.

Jack Bridger:

That's a really good one. Just let that hang there. Every almost everything that you put on Twitter on the teal drawer, Twitter is is like a GIF for a video.

Lu Wilson:

Yeah. We had some new starters, join 2 weeks ago, and we have, like, a whole guide on how to do a good GIF.

Jack Bridger:

Really?

Lu Wilson:

Yeah. So there's, like, the technical guides. Like, hey, here are some quirks of the software we use to make sure the compression is good enough and make sure it's at 50 frames per second and stuff like that. And I think that is mostly stuff that Steve and me have just picked up over the years. But there's also more of, like, the the approach.

Lu Wilson:

You know, how long should a GIF be? 8 seconds or less, hopefully. And there's things about how to make sure it, like, invites the viewer to look at it. So often we'll start with like a swoop of a cursor, if you have a look, look back at some of our like more popular ones, we often start with a little swoop. And and it just like we we wanted to invite you to watch and and to think about what's going on.

Lu Wilson:

That so, yeah, it's it's it's a big part of the culture here, for sure.

Jack Bridger:

Is there any chance that that would ever be made public? It sounds pretty cool.

Lu Wilson:

Yeah. Yeah. Sure. Yeah. In fact, we should do a Twitter thread about it.

Lu Wilson:

It's a good shout.

Jack Bridger:

That would be amazing.

Lu Wilson:

Okay. Yeah. It's no secrets. It's it's just, I do wonder that, like, bigger companies, I guess, don't necessarily have the the freedom to just freely post. You know, there's obviously brand guidelines.

Lu Wilson:

Messaging needs to get checked. But but I I think there is there's something you miss when you do that. You know? And and there's a there's a huge level of trust here on the team. Me and Steve and also Alex were all posting from the same account, sometimes within minutes of each other.

Lu Wilson:

You know? And and that love that level of trust, getting everyone on the same page about the messaging we wanna give out was extremely valuable. You know, people were asking, like, on people were replying to us on on the Twitter saying things like, you know, hey, person who runs the teal draw Twitter account. Like, how do you put out so many tweets? And and the secret is that there were 3 of us doing it, basically.

Lu Wilson:

Right? That's the simplest that. And that's how they that's why they were varied as well because everyone was posting different kind of things.

Jack Bridger:

So you don't, like, specify, like, we all have to sound the same, we all have to have our own?

Lu Wilson:

No. I mean, there is there is, like, a we're all singing from the same song sheet. You know? There's the there's the teal draw vibe, I guess. And and I guess we have this value of building in public and, yeah, inviting people into the process.

Lu Wilson:

But but no. No one's checking. I think some sometimes sometimes it I feel like posting something a bit more unhinged. Right? Like, or a bit more jokey.

Lu Wilson:

And I stopped myself because I think no. No. No. No. No.

Lu Wilson:

Like, you know, that's too far. That's too far. And then 5 minutes later, I see that Steve has posted something pretty much exactly so. So it just reminds me that no. No.

Lu Wilson:

No. Yep. As you know, as long as we're we're all in good faith and we're just sharing sharing the fun process that we go through.

Jack Bridger:

Yeah. It's, it's interesting. Like, yeah, Steve is is is great on Twitter. And you're also like a you're like a proper YouTuber. Like, you've got, like No worries.

Jack Bridger:

Thank you. YouTube channel.

Lu Wilson:

Yeah. I got to 20,000 subscribers recently, which was Yeah.

Jack Bridger:

Which is

Lu Wilson:

very nice. It's amazing. Thank you. Thanks. I mean, Steve, discovered me a couple years ago or a year year and a half ago when one of my one of one of my own tweets had a bit of success.

Lu Wilson:

So I guess it's it's been tweets from the start. You know?

Jack Bridger:

Tweets all the way down.

Lu Wilson:

It is part of the part of the journey. I we post on Twitter a lot, but I think our goal with some of these things is to not not just be contained to Twitter. You know, I think we may mostly focus on Twitter. But we know we've done really well when other people start to post it on our in other places and and sort of do our job for us in that regard. Like, it would be a lot more work to be posting everywhere, like, including LinkedIn, TikTok, Instagram.

Lu Wilson:

So when we post as well, I think part of it is showing other people what kind of content can do well. You know, we say, hey, look how look how well Teal draw lends itself to making videos or, like, little tutorials. So I think part part of the low fidelity tone of them, I think, is also like an invitation for other people to post about teal drawer as well. I hope this is this. I hope we're on the right topic.

Lu Wilson:

So we're talking very, very community, very, like, very social media management.

Jack Bridger:

I mean, I as I said, I think this is probably, like, the best example I can think of, as, like, a Twitter like, a social media success in 2023.

Lu Wilson:

I know you've had ant from super base on here before. Right? And and I know that he said about he talked about memes. Right? Yeah.

Lu Wilson:

Like on their Twitter. I know he said that people often ask him, why do you post so much so many memes? Why do you post jokes, you know, on on a database, Twitter account? And and he said, it works, right? It works.

Lu Wilson:

Like, at the end of the day, you know, you want people to enjoy seeing what what you put out. So it's it's why not have a bit of humor? And, and fun in it? Yeah. Superbasis changed more recently.

Lu Wilson:

I feel like they're trying to I I don't wanna speak for them, but it seems like they're trying to establish more of a serious tone. Yeah. I'd wanna ask about that.

Jack Bridger:

Yeah. That'd be a good question. I mean, I saw a lot of memes, like, in the last couple days. So I feel like they're still doing it, but they're probably also trying to yeah. I actually don't know.

Lu Wilson:

Yeah. That that that's that's an interesting Yeah. That's an interesting, approach to try and combine these two things.

Jack Bridger:

Yeah. I guess it's a it's a question, like, an open question of, like, do you have to get more? Like, as you start to go for, like, enterprise customers, like, do you have to, you know, be more serious?

Lu Wilson:

Well, like, I I think that's something we think about well, I think about can't speak forever on the team, but I think about a bit when we want to put out different kinds of information. You know, there are something some demos we make, some examples we make that are purely to try to, like, ignite your imagination a little bit and try to show you that something's possible that you you thought wasn't possible before. Some of the things we put out are much drier, but in a but also much more helpful. So I did just sit in front of the camera and explain how to do something that a lot of people were asking on our Discord, last week. And and that has a different kind of tone.

Lu Wilson:

And we also put out release notes every now and then sort of going through a lot of the changes that people might have noticed on tldraw.com. So they have different levels of seriousness and fidelity in a way. But in all cases, there is, there is a playful vibe. But even even with that playful, jokey tone, we're we're still able to alter some other things. You know, it's not one or the other.

Lu Wilson:

But, you know, we're we're continuing to to figure that out.

Jack Bridger:

When you say alter other things, is that like Yeah. Length or something like that? Like, you might if you want it to be, you know, a a big hit, it's gonna be 8 seconds. But if it's like an explainer, it's like longer.

Lu Wilson:

Yeah. So I guess length length is one of them. Like, length of a video, length of a GIF, length of a length of a post also, like, length of a thread. But I I guess we're we're trying to communicate a different thing when we post release notes to when we post, like, a behind the scenes look at, oh my god. I just made something, and I can't believe it.

Lu Wilson:

You know, we're in in both cases, we're we're trying to involve our followers in the process of of this library and the development of this library. But we're shining a light on on different things. And, you know, with release notes, we're trying part of it is that we're we're showing that we're working on this thing day in, day out, fixing all these bugs that that you don't have to, and and like sharing some of the like the slog behind it, because it genuinely is sometimes just a hard work. I've been dealing with canvas sizes all day today. And, and it's not easy for it or it's, it just takes time just takes time.

Lu Wilson:

And so we're sharing, like the hard work, that we do that. And in some of these other cases, we're sharing the discoveries that we make. In each case, though, with with if there's still something to be enjoyed, you know, and there's still it still feels like a behind the scenes. Yeah. And we don't, I don't want us to have like a front, like a branding front.

Lu Wilson:

Because, you know, people are smart, people can see it. You know, it's it's much easier, much more effective to just build in public and just let people in on on that journey as well.

Jack Bridger:

Yeah. That makes sense. Make it real.

Lu Wilson:

Make it real. Make real. Make it real. That's that's the title.

Jack Bridger:

Yeah. Okay. Lou, I think that's about all we've got time for. Do you wanna give, like, a wrap up of, like, if there's any founders, dev tools people listening, what they could take away from, from what you've learned?

Lu Wilson:

Yeah. Okay. Think in the in the topic of community messaging and and social media and and telling people about your library or tool, I would say that don't be afraid of sharing the whole process. Don't think that you can only share it when you've released something or finished something. People will be interested in all sorts of different parts of that process, from start to middle to end, the bits that go right, but especially the bits that go wrong.

Lu Wilson:

Right? Don't don't be afraid of sharing your mistakes and your bugs. That's really interesting, you know, because people don't realize the the hard work behind your tools. They don't necessarily realize, oh, wait, that's I didn't know you had to do that. It's always it's always been surprising to me which bits land and which bits don't.

Lu Wilson:

But more often than not more is interesting than I expect. I guess just because we're working on it day in and day out, this feels more normal to us. So you may as well share, like, what's the worst that could happen? Like, people don't notice. That's fine.

Lu Wilson:

Just do another tweet. Right? The best that could happen is something like make real where our user base exploded. And, so, yeah, give it a shot. And I'd like to see it.

Lu Wilson:

Send send it my way. I I like this kind of content.

Jack Bridger:

Yep. Hopefully, you have, like, an army of, dev tools making all their content with, Teal Drawer as well now after this I hope so. Using your guidelines. Yeah. So if you want to learn more about Lou, you can follow Lou at toadepond, t o d e p o n d, on all the socials, I think.

Lu Wilson:

Yeah. Everywhere. Literally everywhere.

Jack Bridger:

Including YouTube. It's very go watch use lose videos as well. And tldraw as well, t l d r a w, I think on all the socials as well. Yeah. Yeah.

Jack Bridger:

And, Lou, thank you so much for coming. Oh, do you have any shout outs? Is there anything you wanted to share?

Lu Wilson:

Shout out shout out to the London coding scene. London coding scene is the best coding scene in the whole world. Get out of here, s f. You're you're old news. I'm joking.

Lu Wilson:

I'm joking. I'm joking. But but, really, I'm not. Seriously, London. If you if you're in London, come visit our office.

Lu Wilson:

Just at at tilderaw. Message us. Yep. It's the place to be.

Jack Bridger:

It's the center of the arena in Swix's, London AI scene as well. So

Lu Wilson:

Yeah. I mean, this this this this scene can hold so many scenes. Yeah. That's the crazy thing about it.

Jack Bridger:

Thanks, Lou. And thanks, everyone, for listening. See you again soon.

View episode details


Creators and Guests

Elliott Roche
Producer
Elliott Roche
Freelance Podcast Editor
Lu Wilson
Guest
Lu Wilson
building in public on another microblogging website that doesn't platform abuse~coder at @tldrawresearcher-in-residence at @inkandswitch

Subscribe

Listen to Scaling DevTools using one of many popular podcasting apps or directories.

Apple Podcasts Spotify Overcast Pocket Casts Amazon Music YouTube
← Previous · All Episodes · Next →