Join us Oct. 7 for a live episode at designFAO
Use DifEdFAO for 10% off:

Jordan Singer

Building Design Tools
SEASON
1
EPISODE
2
‚ÄĘ
October 12, 2021
Jordan: I know when I'm designing, I'm thinking in my mind, like, you know, I want this thing to look X, Y, and Z style. Or, you know, whatever. And it's interesting cause we're translating these thoughts, and words in our minds and our output is turning into inputs on the keyboard and mouse, and the clicks on the canvas. Could we actually sort of eliminate that layer, that intermediate interaction we have to click and tap a few keys. Could you just go straight? From thoughts to... or words to design? I think anytime you can even imagine eliminating like, a layer of input, that's kind of necessary.

[intro music]

Bruno: Hello, everyone, and welcome again to Design is for Everyone. A show where we talk about the role of design in the modern world, with guests from all around the globe, and where today we'll be learning all about Jordan Singer and his incredible design tools.

Although being a product designer, Jordan is known for his intersections between design, code, and most recently, artificial intelligence. He's a maker, that started from a very young age to learn as much as he could about how the web is built. And now he's helping to build the next chapter of what design is.

[fading music]

Bruno: Okay. It's working. It's recording. So. Yeah, well, let's start.

So, hi everyone and welcome again to the Design is for Everyone podcast. Today, I'm here with Jordan Singer. Hi Jordan.

Jordan: Hi, what's going on.

Bruno: I'm guessing everything is going to be way better, now that we're here talking with each other. I'm just going to start with the question that I've been starting with everyone, which is a little bit like: how did you ended up in the world of design? What drove you into design? What's your backstory here?

Jordan: I got started when I was a bit younger. I would say probably early elementary school. I was probably. I don't know, six or seven at the time. And I remember having a computer in my room that wasn't connected to the internet. And that computer, it wasn't a Mac. I wish it had been a Mac.

It was one of those beige, you know, Compaq desktop PC kind of things. And I just remember being really curious about how this computer worked. And I was hearing about the internet through school. We had just begun exploring the internet. And I wanted to be able to just kind of mess around with the computer and see, you know, what it was all about.

As I started to do that, one of the places I landed on in the early internet, in my exploration, was on Apple.com.

Bruno: Which is a classic.

Jordan: Yeah. And, you know, what an amazing site to land on back then. I think at the time, it was like they had that hero image, introducing the original iPod, and they had their older iBooks and iMacs and stuff. And all I remember thinking was being really captivated by how different that site looked, compared to almost every other site I was on at the time. Which was very, you know, Times New Roman, black and white blue links.

Bruno: Classic. Classical internet.

Jordan: And it just stood out so much to me, compared to everything else I was seeing. And I instantly just thought like: "How? How do I make that kind of thing?" Because I know it takes people to make that stuff, and I want to know how they made it. What they were thinking about, why they made the decisions they made.

And I was just so captivated by the site that that was my really, like, original draw into digital design. I had a lot of experiences over the years. Being exposed to different... whether it was Apple devices, that just had beautiful industrial design. You know, more, more websites like the Apple.com that were really well-designed.

And my design taste... I knew I had the taste and the sense of style, that was kind of always there. But I was never really capable of like... One, I didn't really know what a designed tool was. And two, I could've never really even began to put together those kinds of designs.

And so that was my original inspiration for getting into design. Was: I want to be able to make something that looks like this. And so that's really, for me where it all started. And over time, I was much younger back then, but it evolved into where it is today. Where I've just always been a really curious person in general. And that curiosity has led to exploring that thing I was captivated by further, and figuring out how to make a website. How to design something. How, you know, et cetera. And so for me, that's, that's really where it all began.

Bruno: So you basically just went in and kickstarted everything by looking at Apple.com. Which is a classic, I would say. Although in my defense, I think I only figured out what a Mac was, an Apple device was actual laptop, when I was like 16, 17. Because in Portugal iPods where a thing, but Macs, for younger people were not like what they are nowadays. And it feels very interesting to listen to people on the States talk about that. And the difference, because for me I spent most of my life with those beige Desktops, and then those clunky laptops that were black plasticky things. And it makes perfect sense too, that that's such an inspiration at the end of the day, which is amazing.

But what most people know about you, is that usually you don't just linger in the world of design. You kind of wobble a little bit between design and code. And actually you do a lot of code nowadays, and a lot of really cool things when it comes to creating things, coding things. How did this ended up mixing up in your world? And how do you feel like you use them nowadays?

Jordan: Yeah. It's a great question because I, you know... as recently as a few months ago, I spent four years at Square as a product designer. But it turns out I would really consider myself, and where I got my start, was really engineering driven and coding kind of first.

And back to that Apple.com example. One of the first things I remember discovering was that you could, on that site, right click and inspect element or view the source, and see the code that actually made the website. And I was like: oh my gosh. You can just steal this and like, use it.

You know for yourself. Like, I don't have to do anything and that's what led me to getting into code. Which was because you know, all back then at least, all of the static website code was all there right in front of you. You could copy it, put it into your own index.html file.

And so I did that with the Apple.com source code. And when I opened up that index.html file, what I discovered was that it again, looks very bare bones, Times New Roman, blue links. And so I was like: what? Like, I just copied the exact code. What's, what's missing here. And that's what led me to discover then CSS. Because what, you know, of course, in that source code that I copied the paths to the style sheets were relative, thereforeyou couldn't trace to the original CSS. So then I started looking at: okay, what is the CSS thing? And then I discovered that's the... that's where you get the styling in front. And that's where the nice stuff comes from. And so, I kind of started to explore that whole thing.

And websites in general, HTML, CSS... that was my thing for a long time when I was younger. That's what I was focused on building. These little mini websites, web apps that we're really like desktop oriented. And so the thing, as it relates to like design and code, that I ran into was, I got so comfortable, at a certain point, with code, and like HTML, CSS... I was able to generally get something functional and look half decent. But I knew, still, the things I was building didn't look quite like what I wanted them to look like.

Bruno: Yeah. Yeah.

Jordan: And so my taste at the time, my sense of style didn't match my design skillset. And so through that, Is really where I got into design. After building lots and lots of static websites and web apps over time. I finally just took it upon myself, without wanting, to have to go find some other designer that really doesn't want to help you with your random thing. I just decided to try to do it myself.

And so, early on for learning design for me, it was very self-taught. And it was very... imitating, you know, sometimes just straight up copying what I thought looked good. Again, back to that apple example.

Bruno: Yeah. Which by the way is a great way of learning, for sure. If anyone is out there and you're beginning into design, and beginning into code. Copy a lot of things, because there's a lot of learnings you get into seeing how people build things.

Jordan: Exactly. Learning by doing is the way I like to learn. And, I think the reason that I find it so useful is, as you dive in, you know, I dove straight into trying to understand the HTML code, or the CSS. I dove straight into like trying to design something to make it look good. And the things I knew that looked good, I wanted to copy.

And I think you start to... as you're kind of mimicking or copying other things that you find beautiful, you start to kind of pick up on the high level. Like, they tend to use a lot of white space or, you know, the color choices that they make, and the padding, you konw, et cetera. And that starts to really become ingrained inside of your brain, as things that you use when you go to design something on your own. And so ultimately yeah. Like the design and code thing, I think really came about just by, again, trying to learn by doing. Being first interested in building websites, then wanting to make those websites look good.

And all of that was kind of self-taught and it was only through lots, and lots of repetition, and iteration over the years that I was able to really. You know, get to a point where I felt really comfortable with both design and code.

Bruno: And nowadays, at least on my perspective, and the great things that you've been building.

It does feel like you're very comfortable with design and code.

Jordan: Thank you.

Bruno: And honestly, there's really amazing products that you're putting out there. From the entire lil world of apps that you built to Airport. Would you care, talking a little bit about those. Letting everyone know, like how did you came to be and... explain them a lot better than I can because honestly, I always forget, for example, that Airport is an app store for TestFlight apps. I always forget the TestFlight name. I prefer Airport.

Could you talk a little bit about that. About the lil world of apps and Airport.

Jordan: Yeah, totally. Those two projects in particular: lil software and Airport, both came about during the pandemic. And the reason for that was, I just found myself at home with way more time on my hands to hack around. And I was still at Square, working on Cash App. And, what was interesting was I've always kind of dabbled in like building iOS apps and things like that. And leading up to that point when I started a little software, I think in early... yeah, early like 2020. Last year Swift UI was really maturing and becoming more of a thing. And that was really attractive to me, but I never had really learned it. And again, back to this idea of learning by doing... all I wanted to do, as it pertains to lil software, which makes a bunch of these little apps, which I'll explain. All I wanted to do at the time was learn how to write Swift UI code and build an iOS app that's entirely Swift UI.

And so again, taking this learning by doing approach, I started to straight into Xcode. And, you know. Create that sample project and just start trying to hack on stuff. And this is where I think this learning by doing mentality really was the inspiration for lil software and all the apps it makes. Because I, again, I learned best by doing. And I wasn't about to try to sit down, read a Swift UI tutorial, build something that I really didn't want to make. Maybe it taught me a few things, but I just want to jump straight into it.

And so the original idea was actually to, before I even had the lil software, the lil brand or anything, the original idea was: I kind of just wanted to create these really simple, utility-based apps, with Swift UI That was kinda my way, my excuse of learning Swift UI was I'm not going to try to think of this crazy novel, new, next big op idea thing. I'm going to just try to remake something like a weather app or a calculator. And just make it really simple, and build it entirely in Swift UI.

And so. That's what I started doing, and the original naming convention I had for these apps was, literally just mimicking what Apple does, just call Weather or Calculator, et cetera. But ultimately that really wasn't going to work cause it, you know, you can't really have that name on the App Store, et cetera. So I have a friend who I worked with at Square, on Cash App who did a lot of the Cash App branding. Um, and we were kind of, I was kind of just chatting with him. His name is Kyle Fletcher, about what I was working on and the idea behind everything. Just these really simple apps.

And he was the one who came up with the brilliant idea to just call them, you know, lil Weather lil Calculator, lil Browser, you know, et cetera. And so I kind of just took that and ran with it. Cause I thought it was so perfect . And so, yeah, you know, that was my excuse in way of learning Swift UI. I was building these little apps. And so each lil app it's a very simple, focused experience. You know, the weather app just gives you the current weather and then there's all of like, the sun. Calculator, just really simple calculator. Lil Browser... that's one of my favorites, where there's no tab management.

Bruno: It's just you and the URL.

Jordan: Yeah. Just an address bar, and that's it. So really simple little notes app. A little to do.

Bruno: Which, by the way... not only are they very well-designed and very simple in use. But it also, at least for me, broke the conversation about the mega apps, if you want to call it like that. Nowadays, everyone wants to put everything into every app. It's not a new problem, I would say. The first time I ever worked on app design, probably back in 2013, I had a customer that I remember wanted to put every little feature. And it's like, lack of focus on features and everything is a very common issue with people trying to put things in apps.

But nowadays, with so many productivity apps already using all of these services, being able to just focus on one thing, making it, just that simple app that works perfectly for that reason. That for me was the selling point on all the lil software. That was a great, great escape from all that over the top, too many feature apps type of thing.

Jordan: Awesome. Yeah. I love that. Really appreciate that. I mean. I just wanted to make things that, you know, I wanted for myself. This also goes back to the whole, I build my ideas kind of tagline I have, which is like, ultimately that's, that's what I do is I just come up with crazy ideas and try to build them. Trying to figure it out.

So it's kind of, it's ironic, you mentioned the whole, like bundling of these mega apps, because what I found with little software was there was at one point, I think, like 10 different little apps. And each of them is like a different TestFlight app and you have to maintain it. And unfortunately, I ran into a few problems with Apple where, ironically enough, they rejected several of them for the App Store because they didn't meet the minimum functionality requirements. Which is exactly like the intention. So that was, you know, unfortunate, but they still exist kind of as TestFlight apps.

But it became so hard to maintain 10 different TestFlight apps and bump their version every 90 days because they expire, to keep them running and everything. So. What I ended up doing was, back to your point on these kind of like mega apps, I ended up consolidating all the lil apps into a single app called lil OS. And lil OS, when you open it up, it very much mimics kind of the home screen layout. Like the iOS home screen. And it's just inside of lil OS is one app that contains all of the lil apps inside of it. And so for me, that became a lot easier to maintain and I think it's kind of ironic the idea that there's an app, that's an OS almost inside of iOS.

So that's where that, that's the direction, that stuff kind of took. But overall it was an amazing project because it did a few things that helped me learn Swift UI. That was like the biggest thing. The biggest reason I started doing that stuff. It created this awesome brand lil software that I took in a lot of different directions. And the amazing thing about that brand is it's so flexible. And it doesn't just have to apply to apps. It can apply to. You know, hardware,...

Bruno: Anything that you just want to play around with.

And this build. Build it yourself kind of mentality is interesting. And it's very on point with the way that we, now, interact with technology as it's so easy for us to just go after it. And you actually create an API for a little software, right? Like for other people too build on top of what you built.

Jordan: Yeah, exactly. That's a great point. Like there's also a lil APIs, which are just the APIs that power, the lil apps. And all I wanted to do is make like really... again, in the spirit of these really simple ideas. Lil APIs are just really dead simple, no authentication required API end points to fetch the weather, or the news, or stocks. So, yeah, there, it was really cool because it created a lot of products that weren't just iOS apps. So that was, that was...

Bruno: That's interesting.

Jordan: ...quite a moment in time. And so, yeah, that's kind of, that's kind of a little software. I haven't... I haven't done any active development on that stuff recently. I think lil OS kind of exists as is, and I might go make smaller, little updates over time. But yeah, that was a really, really fun experiment. And, certainly got me, it started in this whole iOS thing, and building iOS apps, which, which is kind of a lead into Airport.

And so. Airport is another kind of... results very much, I think, of the pandemic where I had a ton of time, extra time on my hands at home to build stuff. And almost, interestingly enough, back to that problem I had of maintaining those, those like 10 independent apps on TestFlight.

Bruno: Yeah. Yeah.

Jordan: Distribution is one problem. Like, I ended up kind of just creating the website lil.software. And each app is listed there with a TestFlight link, and that's kind of how I distributed the TestFlight apps. But distribution is a really hard problem, especially for indie developers who don't necessarily have a ton of reach to be able to get their app in the right hands to get the testing and feedback that they need to be able to, kind of graduate from TestFlight to the App Store.

And the trend I was sort of noticing was, this was around August of 20... what was it? 2019, 2020. That particular summer, there were so many TestFlight apps flying around. And everyone was trying to get an invite to the next thing, because. I think again, back to this being the result of the pandemic, people just had way more time to build stuff.

Bruno: Yeah. And creativity was flowing like crazy. There were great ideas being built everywhere and people just wanted to put them out. And yeah, I remember... I remember starting seeing on Twitter wait too many TestFlight links and way too many like, waitlists, with people just throwing their ideas out to test things, which was definitely a moment in time, very specific to creativity and the space of creating apps actually.

Jordan: Yeah. I agree. And so I was trying to capture a lot of what I saw that was going on, which was: there's so many TestFlight apps out there.

I have a lot of FOMO from not getting access to the... I wish I could just see them all in one place and just be able to casually browse everything that's new. And so, my mind went to what if there was an app store just for TestFlight Apps. And that was literally the core of the idea.

And so I benefited certainly from all the lil software stuff, because I had done so much building iOS apps over the time. That the execution of the idea was actually the easy part for me. Cause I was basically able to pull a lot of different pieces from previous apps I had built.

I kind of just had to figure out a few things like how are developers gonna submit their app, to Airport. Is there a server involved? How do we store data? You know, that kind of stuff.

Bruno: The kind of technicalities that comes with creating an app store. Because that's the thing, you created an actual app store at the end of the day.

Jordan: Right. And so what's interesting about this one is that, it actually came together literally, I think over the span of four days. The first version of it. Where I tweeted, you know, I remember the original tweet was like, what if there was an app store for TestFlight apps or something like that?

Yeah. And it got a ton of reception, like: oh my God, you got to make this. So I just, I started right away. And my approach is always to, before all the how are people going to submit apps to the Airport thing. All that. I always start with the front end. Being the iOS app and the Swift UI code. Because that's the part, you know, no matter what I know I'm going to need.

So I immediately jumped into building that piece. And again, back to mimicking designs that I like, you know, Apple already kind of solved sort of how to design an App Store. And so I very much just mimicked the way that they list apps and the App Store detail page, and all that kind of stuff. Airport, the app itself is really quite simple. It's just a list of apps and you can search by name or category. But I built that, you know, in Swift UI and then it turns out I have used AirTable a lot in the past, to store data and kind of act as a database because of the new API. And so as opposed to spinning up my own server, you know, and all that stuff, which would have taken a bit more time, I kind of just use AirTable to start as the backend for Airport. And what's amazing about AirTable is they let you submit... They give you a form to be able to submit data to the table. And so that kind of solved the whole app submission thing. And again, like in the span of four days, it went from idea to on TestFlight. And that was, that was a really, really fun experience. To build that. And create it, create a community around people who wanted to test TestFlight apps and beyond the newest stuff. And also giving developers more distribution and reach. For those people who are interested in testing.

Bruno: Completely, and that's actually the point that I like about Airport. Is like you not only created an app store, but you created an entire new type of marketplace. Where communities of builders and creators, and people that are just testing things out and want to put things out there. You actually gave them a distribution channel that they would never have if you hadn't had that idea. That crazy idea and just built it in four days. Which by the way, for me, it's just crazy.

But even talking about the way that you used AirTable and the way that nowadays with APIs and some No Code type tools with these connectors and this type of things. Many of the apps and the solutions that we want to build are so easy to build. It's interesting to see how different people pick it up.

Your story is one. I've heard a thousand more. But I love how it just becomes so easy to bring ideas to life.

Jordan: Yeah. I mean, in that span of four days, I was just trying to find the quickest way to. Get something off the ground. Very much, always try to optimize to just... I just like to ship stuff, get it out there, going back and iterate. Being able to use something like AirTable, for example, where the whole package is there and it's everything I need. That was awesome.

So, yeah, I did that whole thing and, over time it's grown to host, at this point, I think, well, over a thousand apps and thousands and thousands of testers. And it's been really, really awesome to grow that community. And I have a friend, Sidd Sharma, working on it with me. He's kind of focused on the web experience of Airport. And so, yeah, that was again, another awesome project that all started kind of with an idea and given, given kind of the the evolution of how I learned Swift UI, and things like that. It fed perfectly into that, that timing. So yeah, that was super fun.

Bruno: And it's interesting. It's interesting. The story of how you got from, I want more knowledge to, I build things with said knowledge, in such a short time span. And honestly, the pandemic was interesting in many ways.

Because you look at the way that people used their time during the lockdowns and what's not. There were people that were just trying to improve their life, do a lot of sports, whatever. There were people that was just creating and that was great to see there. There's a lot of really interesting things out there that are like children off the pandemic, if you want to put it like that. Which is actually interesting.

Yeah. And talking about all these things. Are built and what's not. And I mentioned before that, for example, you created the lil API. You now mentioned that you used something like AirTable that connects with other things. So, these are solutions and things that we're seeing more and more into software, into code that are more focused on things close to or directly side-by-side with what open source, and open code is, open software. What is the role of that? Or what is the role of those connections of software, that open software, if you want to put it like that, in the way that you create those things?

Do you think that it's essential for you? Do you think it's just something that helps you? What, what does that mean to you at the end of the day, when you create things?

Jordan: Yeah. I mean, I think anytime I can leverage something that you know, does the job, gets the job done for me that I otherwise would have had to spend a lot of time doing all my own, I'm always interested in whatever that happens to be. In this case, like, AirTable, for example. I also... even from my perspective, I tried as much as possible to share when I was learning Swift UI. A lot of the code that I was writing, and open sourcing some of that stuff. Because I've always found it to be most helpful when I was starting... when I start on occasion, a new project from scratch, it's nice to be able to take an existing open source repository and, know that perhaps it does like 50%, let's say, of what you want it to do. And you need to kind of remix it and add 50% to get it to do what you want it to do. And so. I was putting out a lot of code on GitHub, that I was writing in Swift UI, to show people like recreating, you know, for example, the MacOS Twitter App or recreating Slack in Swift UI and just showing the power of Swift UI. And that, you can literally do anything you want with it. And also in the hopes that, when someone stumbles upon this code, they can take it and it's got visual elements that they might want to copy. Or they can use it as a foundation for their next thing.

I think being, being really open about, the things that you're not only building, but also the code that you're writing and not being embarrassed to put it out there, because quite frankly, I think a lot of the code I share is... it's quite ugly.

Bruno: That's a super interesting conversation. People that fear of sharing code and being like overly analyzed by whoever is looking at that open source code. I'm not a good coder. I know that I've done my share of HTML and CSS. I do have a lot of JavaScript and stuff to learn, but the one thing that I've managed to do all the time, because I was afraid of people looking at my code, was always like, at least I left comments there. If it's unperceivable, the comments might help. Please just don't mock me or something because I'm nota pro coder, or whatever you want to call it. But it's interesting that specific point there.

Jordan: Yeah. I mean, it's funny because I'm not a great commenter myself. So I'm doing a disservice to everyone and putting up code and...

Bruno: Yeah. Well, at the end of the day, and this is where the balance between everyone having the tools to build, everyone having the easyness to build, and actually putting out there ready for others to build on top. It's not as straightforward as one might think. Like, as you said, you inspected code when you were a kid. I did the same thing. It's like looking at websites, trying to understand all they build it.

Sometimes it just because that works in that person's brain and it's very hard to then create a language of code that works for everyone. Although the code has its own language, but that's the thing the end of the day. But it's interesting to think about how others then interpret our code. Because it's... even in regular language as I'm speaking now to you, I might miss misspoke a word or something, because I do a lot because I'm not native English speaker. And that might come completely wrong just because we didn't have a comment there, you know? And code is exactly the same thing. At least for me, I'd always felt like that. Trying to understand the line of code or a couple of them, and missing the fact that there's like, I don't know, a sentence that is written with a different letter or something. Just makes so much difference. In the way that you can actually build things in. And it's interesting to see that.

Jordan: Yeah, and I think I've benefited a lot from taking others open source code... reverse kind of engineering it to, again, do what I wanted it to do. And I benefited so much from others putting their stuff out that I kind of wanted to sort of return that favor. And despite me thinking that it's bad code and whatever, I'm sure it's going to help, hopefully someone when they're stuck on a problem or they want to copy a snippet that creates some visual thing for them. Like, you know, hopefully it does more good than bad.

Bruno: Definitely. And the thing about that whole benefiting others, and the way that you've been using code to build tools that interest you, but also could serve and support others... Most recently you've been working on a field, or on a specific set of field that I called design automation, which for me is incredible. And it's not just in design that you start seeing that. Even GitHub just launched like a code co-pilot. When did the idea for these type of things came to be?

Jordan: Yeah, you know... it started quite awhile back. If you recall, when Sketch was a thing in the design world. And they actually, had kind of a plugin ecosystem going a little bit. And back then I was kind of experimenting with code in the design tool. You know, that's sort of the intersection that I live at. And I was working on ways that I could write snippets of code to automate different things I was doing in the design tool, whether... it was really simple back then, whether it was to organize the file a bit more or move things around a little bit. You know, simple stuff.

One of the more interesting things I experimented with was a plugin, again, long time ago for Sketch, where the idea was: what if you could like talk to your design tool? And say, you know, draw a purple rectangle. And it would do that. You know, it all started with that really simple idea, because I was really interested in like natural language processing and that whole world.

And I think also creating smart design tools, like intelligent design tools, it was really interesting to me. And so, a long time ago I experimented with that idea and kind of put something out there. But it was very limited in its capabilities. And fast forward to about a year and a half ago or so, if you recall on Twitter, there were these crazy GPT 3 demos flying around, from open AI. And I just remember thinking to myself: I really need to get my hands on the beta because, I thought back to what I did with Sketch and being able to say like, draw a simple shape.

I thought I could dramatically increase the capabilities of what I was able to do. That kind of tool, with GPT 3. Because you could feed it a lot more input and nuance, and you could train it on how to understand what you're saying. And expect back some kind of structured response, that you could then do something with. And so, as soon as I got my hands on the beta I started to explore what does the intersection of GPT 3 and Figma, or like design and AI look like? The first demo that I shared that I hacked together, was this idea... this, this Figma plugin, where you could describe in words, an app...

Bruno: I remember that.

Jordan: And get it to design it for you, using your existing design system. And so you could say like, a photo app that has a list of photos and a heart icon, et cetera, whatever. And it would try to understand what you were saying through GPT 3. And it would send that response back to the Figma plugin to run some code, to connect the dots to your design system and output something.

And that was... you mentioned GitHub co-pilot... That, that demo I shared was met with very similar reception as the...

Bruno: Yeah. I remember that I remembered that.

Jordan: ...the copilot. There was a lot of angry designers, and there was a lot of like optimistic, you know, non-designers. Because on one hand, people are like, there's no way this is going to replace me as a designer. Which was certainly not the intention. Um, but on the other hand, I think it's, you know, on the theme of Design is For Everyone, I think that the non-designers saw for the first time that they could potentially be able to design something, without needing to know, quote on quote, how to design. And I think that's the opportunity I'm actually really quite excited about.

And as I started to explore what I wanted to work on, after I left Square, I started to just connect the dots back to all the design tools I had built over the years. And a lot of tools internally at Square to automate different things our team was doing. We publish a lot of plugins on behalf of Cash App.

And I always just loved building design tools. I spent a lot of time in Figma. And being able to write code to automate different things is really fun and exciting for me um... to do. So I looked at some of the things I noticed, the insights I got on a design team at Square... again, really I find myself really passionate about building design tools. And all of this kind of led up to Tricycle.

Where Tricycle is basically trying to build a bunch of different design tools that are geared towards design automation, like you mentioned, on on a really wide spectrum. Everything from things geared towards saving you lots of time, to being able to design things for you. And I'm really, really fascinated by this idea that the intersection of design and AI still remains, in my opinion, relatively untapped. There's a lot of opportunity and potential there. So that's the latest thing I'm kind of focused on and that's kind of how I found myself working on Tricycle.

Bruno: Yeah. And that's super interesting to look at the way that Tricycle products that you've been showcasing, and you shared some demos really recently on Twitter, affect the way that you might look at design tools anyways.

Because it's not the replacement. I'm one that defends the use of AI for a lot of acceleration stuff. Look, we're recording this broadcast and an AI engine is transcribing it at the same time the recording, and I'm going to get the transcript. And I'm editing the audio through the transcript that the AI is doing for me, which is amazing. Right?

And looking at the way that the design and code tools can evolve so much with that help, and the way that we can also open doors to other people to enter that world through that feels really hopeful for me, in that perspective that I do defend that design is for everyone.

When you were talking in the beginning, about how you would inspect code to see how, like, a website was built. I would very much expect someone to try and describe a website that I like, like Instagram or something to your plugin and just get the design done and then inspecting layers and see how it's built. Because it feels like that's a really more natural way for them to look at those things, because it would feel more natural to look at layers, and to look at labels, and text, and objects than actually lines of code. And I don't know, it clicked with me a lot when you show that first Demo with the GPT 3 Designer, as you call it right?

Because it felt like that step that I've been talking about for a while. The tools are going to get there. We've been doing this for a lot of time. Not to discourage anyone, because we all know that we're drawing squares on screens, but the fact is machines can help us speed up this type of things. And if we like the way tools evolve, then... you talked about how Sketch was more of a industry standard, Figma is now becoming a little bit more, although I think it's still a little bit mixed. It is that step, it is that like how tools evolve and how they affect the way that we interact with design at the end of the day. Right?

Jordan: Definitely. And I think I'm really... I'm personally really interested in this idea. One trend I noticed, working on a design team, something like Figma, I think for the first time is seeing a lot more than just designers, spending time in the design tool.

Yeah, you've got PM's, engineers, data scientists, you name it. They also want to be able to visualize their ideas. And those, you know, those visualizations a lot of times end up looking like gray rectangles and text boxes. And it turns out a lot of design teams have built these really robust design systems, and those are the puzzle pieces that are in place, that you can pull from to piece together a screen. And when you're met with... when you don't know the nuances of a tool like Figma, and you're met with a blank canvas, it can be really hard to know, even just where to start. And I think this idea around, hopefully, everyone kind of knows what they want to be able to describe, and can describe it in words and can Tricycle build something that can connect those dots and output. You know, something that it's not going to be perfect, but maybe it gets gets you 75% of the way there, let's say. And then you can take that thing and, and adjust things, and go from there.

I think there's, there's something to be said about saving that time from having to know how to even, you know, place a component on the canvas or what to even place on the canvas. So...

Bruno: Yeah. And even people that are pro designers, and I've noticed this in teams that I've worked with on different projects and what's not, not everyone works the same way. Not everyone learns the same way. And, for example, you have best practices for a specific software as Figma. Figma created auto-layout and auto-layout is like a beast by itself. Not everyone understands auto-layout. So, if they can see how something is like pre-built using those rules, and then inspect it and learn from it, it' probably better for them than try and learn and build it, and break everything along the path. Because as you said, you never know where to start when you get such a big white canvas being a designer, pro, or not.

Because it's like... It's a white canvas has always been, even before we entered the digital space, a completely open space for creativity or whatever you want to put there. And it's interesting, when we talk about these tools, that the word, the sentence start on a white canvas is still the thing. Because like painters did it centuries ago, and we still do it now. But now we're more focused on creating products than actually creating art. But, yeah. It's, it's interesting.

Jordan: Yeah, I think, just in general, making design more accessible for everyone and bringing out the inner creativity in everyone, and really letting us as humans focus on the piece, the parts of design that only we can really do, and attempting to sort of automate some of the rest of the tedious, time consuming, mundane tasks, that's the high level of, you know, some of the things I hope to work on with Tricycle.

Bruno: I'm completely on board with that goal. I see so much potential in Tricycle and the things that you're building. And really even sharing it with that extended world of what are people using design and what actually are designers. Because the definition of design has been shifted so many years and our job roles, if we had started working 50 years ago we would probably be industrial designers nowadays, we are called brand, and visual, and UI, and UX, and product, and what's not so. Yeah, there's there are so many levels there, that make me believe that these tools are the gateways to do better... not just better, but new different types of designers and new different types of creatives and people entering the industry, and bringing those things in.

I can only commend you for the work that you've been doing with this. Because we're all expecting it to come out. We're all just eager to play around with it but is interesting.

Um, yeah. I was going to try and finish a little bit with a question, which is, do you believe Design is for Everyone? But I guess you kinda just answered it. But do you have a more broad answer there or do you really believe it's where everyone? What do you feel?

Jordan: Yeah, I think... everyone is a... Can be described as a designer. I think we're all creators. We just happened to create different things, whether it's in the digital world, or the physical world. Everyone has ideas and things that they want to be able to come up with. And, you know, as it relates to... in the, in the digital world, like we just touched on, I'm super interested in making it possible, so that everyone can again, bring out that inner designer inside of them, and they don't need to know all the nuances of how to get there. They just need, you know, a simple interface to be able to describe, for example, what they want.

I think, yeah. At a really high level. I think we are all, in one form or another, we can be described as designers in general. And making that more accessible and for everyone. I'm fully onboard with that idea.

Bruno: That's a great thing. And, just one last thing on that. You talk about the way the interfaces and people shouldn't be limited through those things. You talk about natural language being part of what these tools and AI uses. Do you believe that language, can be a key player in the way that we actually evolve this type of things?

Jordan: I happen to think so. I mean, it's interesting when you think about... if you and I were just chatting. We didn't have a computer, or a screen in front of us and I'm describing something in words, and in your mind, you're able to kind of visualize what I'm thinking. I think the translation layer, going from words to design is pretty natural.

I know when I'm designing, I'm thinking in my mind, like, you know, I want this thing to look X, Y, and Z style. Or, you know, whatever. And it's interesting cause we're translating these thoughts, and words in our minds and our output is turning into inputs on the keyboard and mouse, and the clicks on the canvas. Could we actually sort of eliminate that layer, that intermediate interaction we have to click and tap a few keys. Could you just go straight? From thoughts to... or words to design? I think anytime you can even imagine eliminating like, a layer of input, that's kind of necessary. Like right now, that's super interesting.

And so. Yeah, to answer your question. I think words have a really interesting role to play in terms of design.

Bruno: Cool. Look, Jordan. Thank you for, for having me. Thank you for talking about your process, your products, the things that you've been building. I'm really, I don't know. I'll just say it better, but I think the community is just lucky to have you out there building things for everyone. Because the thing that we need is more people like you. Creating solutions that are more geared to people that want to build, that want to create, or they want to evolve what we can do with design, what we can do with code, with technology overall. Thank you for telling us how you got there. How you played around, the things that you've learned, and how you went from inspecting apple.com to building tools that turn speech into design, if you want to.

Jordan: Yeah, Bruno. Thank you so much. It's been a pleasure to be on your podcast and thank you for letting me share my story.

Bruno: Yeah. And thank you everyone else for listening. Meet you all again next week for another episode. Bye.

‚Äć

Help me build this project

I would love to keep up with this project for as long as I can, and for that I need to make sure it doesn't become cost preventive. So, to be as clear as one can be, here you can find all the costs for maintaining this project for a year. If you want, and only if you can, do support it and buy me a coffee or become a podcast subscriber.

Icon for Buy me a Coffee website

Follow us on social

Email, but only if important