The Changelog: Software Development, Open Source - Friends on the Frontend (Friends)

Episode Date: March 14, 2025

Adam's friend on the frontend, John Long joins the show to explore his usage of AI, design tools and the stack he prefers. We talk Next.js vs Rails, maintaining open source, building websites with Framer, their mutual love for Figma, and more.

Welcome to Change Login Friends, your weekly talk show about tools on the front end. A big thank you to our friends over at fly.io, deploying 35 regions, fork off VMs like their processes and so much more. Learn more at fly.io. Okay let's talk. Well friends, I'm here with a good friend of mine, David Shue, the founder and CEO of Retool. So David, I know so many developers who use Retool to solve problems, but I'm curious.

Help me to understand the specific user, the particular developer who is just loving Retool. Who's your ideal user? Yeah, so for us, the ideal user of Retool is someone whose goal first and foremost is to either deliver value to the business or to be effective. Where we candidly have a little bit less success is with people that are extremely opinionated about their tools. If for example, you're like, hey, I need to go use WebAssembly. And if I'm not using WebAssembly, I'm quitting my job, you're probably not the best virtual

user, honestly. However, if you're like, hey, I see problems in the business and I want to have an impact and I want to solve those problems. Retool is right up your alley. And the reason for that is virtual allows you to have an impact so quickly. You could go from an idea to go from a meeting like hey, you know, this is an app that we need to literally having the app built at 30 minutes, which is super, super impactful in the business. So I think that's the kind of partnership or that's the kind of

impact that we'd like to see with our customers. You know, from my perspective, my thought is that, well, Retool is well known. Retool is somewhat even saturated. I know a lot of people who know Retool, but you've said this before. What makes you think that Retool is not that well known? Retool today is really quite well known amongst a certain crowd. Like I think if you had a poll like engineers in San Francisco or engineers in Silicon Valley, even, I think it'd probably get like a 50, 60, 70% recognition of Retool. I

think where you're less likely to have heard of Retool is if you're a random developer at a random you're a random developer at a random company in a random location like the Midwest, for example, or like a developer in Argentina, for example, you're probably less likely. And the reason is, I think we have a lot of really strong word of mouth from a lot of Silicon Valley companies like the Brexas, Coinbase, Doordash, Stripes, etc. of the world. There's a lot of chat, Airbnb is another customer and videos. So there's a lot of chatter about Retool in the valley.

But I think outside of the valley, I think we're not as well done. And that's one goal of ours to go change that. Well, friends, now you know what Retool is, you know who they are. You're aware that Retool exists. And if you're trying to solve problems for your company, you're in a meeting, as David mentioned, and someone mentions something where a problem exists and you can easily go and solve that problem in 30 minutes, an hour, or some margin of time that is basically a nominal amount of time.

And you go and use Retail to solve that problem. That's amazing. Go to Retool.com and get started for free or book a demo. It is too easy to use Retool and now you know. So go and try it once again. Retool.com. Okay John. So I saw a post on LinkedIn from you three months ago. This is kind of maybe old news, technically, especially in the world of AI. And it has to do with AI. As many know, you may, they may know you as a product designer, a developer, a front end or maybe even just a designer, you know, not to just, just you, but just a designer, but design front end, all that good stuff. And you used AI to do

some cool stuff. And I thought, Hey, you're a friend. Let's get you on this show. And totally friends do about fun stuff. Yeah, sure. There you go. So I guess in my daily work, I've been doing kind of a mix of product design and marketing work. And I've been working with a local startup, O-Pine. They kind of make software for salespeople. And we're a handful of people. Everybody's sort of sharing roles,

doing, you know, spread across multiple things. And so we use AI a lot for different things. And basically for the documentation side of things and then the marketing side of things, when I'm writing content, I created a custom GPT just through chat. GPT is like standard interface. Uploaded all the content I could find

from the website and LinkedIn, so it knows about everybody that's involved. And then started writing marketing content content and eventually we did the documentation site as well with ChatGPT. What do you think about that? Are you obviously you're for it because you did it, but like in retrospect was it, you know, in your job, I'm sure it made your job a lot easier, but you know, as a human being consuming content generated

How's that make you feel? Yeah, I mean I would I would describe it if you haven't done it is very much like Working with someone who is fast at generating drafts, right? like in chapter GPT writes better marketing content than, dare I say it, most marketing people I know that are kind of doing that in their day job. So if you're not using it kind of as your drafting system, and I think there are certainly times where you want to slow down and just write out what you're doing, right? But think about your positioning and get all of those things figured out.

Those kinds of documents on the marketing side, you need to spend time writing that. Write about your angle, all that kind of thing. But then once you have that, like why not create a custom GPT and let it write your drafts for you? You can, you know, give instructions about the style that you want it to compose in. And for me, I'm one of those people that can can come to the blank page and like, I don't know what to do kind of thing. And it's not that I can't get there. It's just, it takes me like 40 minutes to write my first rough draft.

So like chat GPT will shortcut that for me so that in five minutes I have my draft. I go back and forth with it a little bit, and then I jump in there and edit it myself because you know, you can't quite get what I want it to do. So there's a lot of sort of back and forth and I have some of these chats where, you know, it depends on what I was doing. I think the documentation one, the most epic thing that I did was to do a full walkthrough as kind of the documentation. So it was a full walkthrough of the product. And that was a ton of back and forth with Chat GPT. First, I had it write the outline for what I wanted to do. And then I took the outline major point by major point and asked it to write the content. I would review it. I'd

say, no, that's too long. Make it shorter. I would tell it when it got things wrong because it's really good at reading in between the lines. But sometimes it will say things that aren't true about your product too. So you have to hold it accountable. But I mean, I don't think that's any different from working with a writer on things. So it's really interesting. My perspective on the GPTs is like, they're here to stay, whether we like it or not, right? But learning how to like work with them, whatever your role is, if you write marketing content in your J job,

if you're a developer that needs to write marketing content, whatever it is, they can definitely increase your throughput, would be the way that I would describe it. And you can do things in days now with GPTs that used to take, you know, weeks to pull off when it comes to writing. So do you think the so you think the writing is is similar to the drafts you might get with a you know, staff writer or something like that and you think that some of the they call them hallucinations, you know, the ai hallucinates or It makes things up. Essentially they call them the the terminology has been hallucinations. So it hallucinates

You think those are similar to the way you know a staff writer a human writer would be not fully correct on everything because they're trying to Massage words and make it sound cool. It's not much different than that Yeah, I would say it's not much different than that You might have to, so another usage that your listeners might be curious about is, is I've been using it to write cover letters for job applications, right? Been in between jobs. And it is similar in the sense that like, sometimes it gets things wrong and sometimes it repeatedly gets things wrong.

I think humans are better at not getting repeatedly things wrong than chat GPT is, would be the way that I would describe it. But it's probably better at writing than maybe 80% of the people out there. Um, so I don't know. I don't know if those numbers are exact, but it, it does write remarkably good copy. How much, uh, so you're a product designer, you teeter in marketing a little bit, as you've said, in your most recent role at opine. Uh, we've had you on the show years ago Creator of serve an open source project that written in Ruby. I think a lot of people may know of

You've designed icon sets. I think is it open source is it open source 200 of them are 200 of them are Prior contributor to radiant CMS. I don't know if you did you start it or did you can yeah, I created it Yeah, creator of I mean geez I'm forgetting. I mean, I'm so old. I'd forgotten what you've made You know, so you've been around doing this stuff and now you find yourself more More in designer land and marketing land than maybe developer land Is that pretty accurate to like your current? Maybe not your most current role, but like in the last couple years? Yeah, so originally, I think when my career kind of kicked off, I was doing a bit of both.

I did programming and design for a period of time. I think in my first role, it was more front end than it was design. And I sort of encouraged the people that, hey, I could actually do the full designs. And then in my second role, it was designing, coding. But I think it was by the time I made it to my third, like I wasn't doing the coding anymore. So, I mean, that was 10 years of code. I've maintained code on the side. I have my own projects. I'm pretty into Next.js these days, and of course, I went deep down the rails rabbit hole years ago. But

rails has changed so much since I used it. Yeah. It was just a good or bad, this change. You know, I have a ton of admiration for DHH and his like ability to just say, no, this is the simpler way. Let's walk in it. It's very different from the way the rest of the world seems to have evolved. I love the React ecosystem. You know, I'm very aware, of course,

you can use React with Rails, but the Rails way is different than that, right? And so, yeah, I have a lot of respect for that. I haven't used Rails in the new configuration, so I can't speak to it. What's the last version you play with? Gosh, it probably would be like Rails 5. Is that something? Oh gosh.

It's been a bit then. Yeah, it's been a bit then Yeah, it's been a long while. Yeah, I believe we're on rails eight. I believe right Something like that. Yeah. Yeah rails eight is like the latest thing out there. I want to say we're about to play with some rails again Over here. We you know, we've we've been yeah rails eight dot zero dot one. I had to make sure released December 13th this last year. So basically on the tip, 8.0.1. So you're a Next.js lover or just user? Oh yeah, it's a great framework. Next.js for life?

Oh, I mean, as much as anything, right? Like I would start another project in it tomorrow, right? But like, so to me, Next.js is a really great choice if you're using, if you decide you wanna go with React. And on the front end, you know, I have mixed feelings about it. I do think that the Rails 8, like there was something, well, not Rails 8, but back at Rails 3,

let's just stay there. There was something sure about like doing views and CSS and like a little bit of JavaScript. Like it was great. I mean, it was so easy to sort of comprehend the ecosystem compared to like Next today, right? But at the same time, and there's stuff when I look at Next where I'm like, man, if they

only provided like a default ORN, you know, database system, like out of the box, like it could be so much more. So I look at it like that. But every language or framework seems to like pick a line as to like how far they will go. And like I get it. I mean, there's different choices on the ORM side for Next, although everything I've done has been like Prisma with it. And I think Prisma might be the leading candidate. And there is a sense in which it seems like the default stack

is very much evolving around Vercell and the options that they give you that are easy, I guess you could say. But Next is still, doesn't have as many defaults as Rails does. You have to configure it. I wonder why that is, honestly. Especially since that Vercell had an opportunity to create a convention over configuration, right? Which is the whole adage that David's been pushing

for a very long time and still does to this day. Like it's not changed. Just to give a date for Rails 3, okay? The release date. You wanna take a guess, Rails 3's release date? Oh man, it's like 20 years ago, isn't it? I mean, it's pretty close to 20. What is it, 2006?

15. No, really? 15 years ago, August 29th, 2010. 2010 was Rails 3? Rails 4 was released in 2013. Okay. And you didn't touch Rails 4, right? Rails 3 is the last version you touched?

So we did some upgrading with Radiant before, the really brutal thing with maintaining Radiant was upgrading between the major Rails versions because so many things broke. And we would spend a couple of weeks trying to, well, it was probably more like a couple of days, but when you're working part-time on it, it's a couple of weeks each time. And eventually it was just, it was too difficult for, I think, us to maintain at the current, you know.

You're not involved in the project anymore Radiance done for you. Uh Radiant is kind of parked There were two different maintainers after me that that took over the helm Jim gay is the current maintainer But there's not a lot of activity on the project and it has not been upgraded to the latest version of Rails. So it's unlikely to have any users.

And if they're users, they're not choosing it, they're still there. Every once in a while something will come along and it seemed like it will have new life. There was a fork of it at one point. I think I feel kind of gratified on two fronts. Like, it was a lot of effort early in my career to maintain. And I think a lot of people got something out of it

and were inspired by it. And I mean, it's incredible as a developer to have gone through that experience. But there comes a point where, like, is open source going to be your life, right? And for some of us, like, you know, that's what they, that's what you choose. But for me, I've, like, I sort of feel like I have two professional careers, design and development, right? And maintaining both of those is is difficult

And then family life as well. I've got An eight-year-old a six-year-old and a three-year-old now, so things are busy at our house. So busy. Yeah. Yeah Wow Three kids will keep you busy. That's for sure It's so good. That's a triple zigzag right there. Yeah. It's tough because they're all close to the same age at the moment, but yeah, there's, there's a me at least. Yeah. Yeah. They're, they're, they're each incredible, wonderful people.

We love kids around here. Of course. I got three myself. Jared's got six. Gosh, six children. You got three. I'm looking at this commit history for radiant. And I don't know if this is accurate or not, but it says four years ago was the last commit. That makes sense. I think radius, which is the core templating language

under it, we've had some commits in the last six months on that. But the main project doesn't surprise me that it's been four years. So back to establishing some of the things that you're dabbled in. So an icon designer, some of them open source. Is that Zest? Is that right? Zest icons? That's Zest, yep. Now you're more front-ender designer than you would say back-end. Definitely, yep.

And no longer dealing with Ruby hanging out in JavaScript land loving as best you can Next.js missing some convention over configuration, it seems. But pretty happy. Yeah, I mean, like, I'm not coding in my day job, right?

Like in my day job, I'm generally just focused on like Figma and I've done a lot of framer recently for the marketing side side. But I have a side project I've been working on in Next. And I often find myself in React land from time to time needing to like do a component to demonstrate something to a developer, right? do a component to demonstrate something to a developer.

Right? So I do a lot of like CodePen React stuff from time to time, it depends. But when you're doing developer handoff, like that's kind of when, you know, I might do a little bit of code on something. And it would typically be more complicated interactions. you know, I might do a little bit of code on something. And it would typically be more complicated interactions. The point where it's too difficult to just write it out

or draw pictures of what you want it to do. And it's just easier to, you know, do some code. What's good you have that history of being a developer. Not that you're not today, but you practice in practice on the day to day. You're not Developing you're designing primarily, but you have that language that History that Lexus that that ability to sort of still spike something out like you mentioned a component to To sort of get somebody a developer the speed to an idea you have. It's funny, I know it's a sort of controversial thing that comes up, should designers learn how to code

from time to time, and I'm of the opinion, like, heck yeah, and learn how to do business too, and learn all the things. Take it one at a time, don't just stay in one lane. That's my opinion, because it like makes you better at communicating, better as a designer across the board. There's so much stuff right now where like, even just looking at Figma, it seems like it's going

about 90% of the way there. Framer's better on that side on some things, It seems like it's going about 90% of the way there. Framer's better on that side on some things. But both of them, I'm just like, could you just learn a little bit more about what components are and provide the things that we need to make handoff easier essentially. And I've talked with a lot of designers from time to time

and one of the big challenges when you come just from UX land is understanding how it's going to be built into a system. Because we're all designed systems now, whether you want to or not. And if you design with the grain of the system, you might say, things are easier. If you design against the grain of the way that the system has been built, then things are hard.

So yeah, learn a little bit about coding. Get into the CSS a little bit, but also get into the React side a little bit and try and learn some of that. What would you say that you like a lot about what you're doing now? Like if you're on that front end side of things and you're sort of in design marketing world

and you're building with Framer even. Like I think Framer's pretty awesome. Haven't personally used it myself, but I think there's a lot happening in the ability to build out a front end website that looks really good, that doesn't require you to touch a lot of code, if any really at all.

But I think familiarity, like a past front ender who has hand coded front to back would thrive in my opinion on some of these newer tooling because you know a lot of what it can do. You know what the web can do. Even though you're not doing it, you know where the limitations and peripherals are in terms of where the boundaries might be? Yeah, it's very much like that. Um, so the thing that I'd say is as a designer, there's only so far that you can go with just

like static pictures and particularly when it comes to like motion and scroll driven designs and that kind of thing. Almost anything that you produce in Figma is gonna be kind of hand wavy as you try and hand off to the developer. And there's this thing that happens, designer fatigue, where you're trying to get a project out the door, you have some ideas for how the motion should work.

And you could spend a lot of time in Figma, like trying to articulate that, and hopefully your developer can come along and pick up those notes and like make it awesome, right? But you're not necessarily always working with people who can do that. And tools like Framer and Webflow now are, they're sort of speaking both languages

and sitting really well in this niche of, you can't do anything you want with the tools, but you can do a lot, like 90% of the common use cases now. And what that means is that as a designer, you spend less time trying to articulate these interactions because you can just design and prototype them in the tool. And that's pretty incredible.

It's really neat to see these web-based tools now. The hilarious part about this is I remember Dreamweaver. Dreamweaver is what I cut my teeth on, right? Yeah, man. But it's taken us, what, 20 years to get to this point where we have web-based tools that are of a similar caliber to what they had in desktop apps way back when. And when you're doing that, one of the really cool things about Framer is that

it's managing deployments in kind of a modern way, and it does it all for you, but you can roll back to older versions, right? Which is kind of like a GitHub, you know, kind of feel to it. So, yeah, I mean, I'm coming off a framer high right now. So you might take it with a grain of salt, but I- It's time to espouse your thoughts. Yeah, I kind of think, like, why if you were a web startup would you not use Framer right now? Or maybe Webflow. And I haven't done anything with Webflow. Are they similar?

I mean, I know they're similar. They are similar. Yeah, they are similar. I've heard that and kind of looked at Webflow. I need a Webflow project is what it is, but Webflow's component system looks like it's a little more developed than Framer at this point. It's funny, I would say that Framer feels like Figma,

but a tool that you can build website with. And then Webflow feels like Dreamweaver to me. Like it's kind of this, like on the web. That's kind of the difference between the tools. It's really cool. For those who don't know Dreamweaver, what do you mean by that? Is it like code and the view in the same tool kind of thing?

Is that what you mean by that? Yeah, it's Webflow from my memory and it's been about five years since I played with it or maybe four years. From my memory, it seemed like it had more like Uke code to do things in it when you needed to. And Framer doesn't really do the same things. Framer doesn't have like events,

like an events system would be the way I would describe it. It can do like simple, like interactions on click and things like this for components and component transitions, which is enough for like most things that you're going to do. But if you're trying to build something a little bit more interactive, you almost, it feels like you have to break out of the matrix in Framer.

You can write React that works with Framer, but the worlds don't really coexist very well, would be the way that I would describe it. I think Framer will eventually get better and better in this regard but it feels very much like I have to be a pretty smart coder to do coding in Framer or I just don't have access to that world, essentially. Well, friends, I'm here with Scott Dietzen, CEO of Augment Code. Augment is the first AI coding assistant that is built for professional software engineers

and large code bases. That means context aware, not novice, but senior level engineering abilities. Scott Flex for me, who are you working with? Who's getting real value from using Augment Code? So we've had the opportunity to go into hundreds of customers over the course of the past year and show them how much more AI could do for them.

Companies like Lemonade, companies like Kodem, companies like Lineage and Webflow, all of these companies have complex code bases. If I take Kodem, for example, they help their customers modernize their e-commerce infrastructure. They're showing up and having to digest code they've never seen before in order to go through and make these essential changes to it. We cut their migration time in half because they're able to much more rapidly ramp, find the areas of the code base, the customer code base

that they need to perfect and update in order to take advantage of their new features. And that work gets done dramatically more quickly and predictably as a result. Okay, sounds like not novice right? Sounds like senior level engineering abilities, sounds like serious coding ability required from this type of AI to be that effective. 100%. You know these large code bases when you've got tens of millions of lines in a code base you're not going to pass that along as context to a model, right? That is, would be so horrifically inefficient. Being able to mine the correct subsets of that code base in order to deliver AI insight to help tackle the problems at

hand. How much better can we make software? How much wealth can we release and productivity can we improve if we can deliver on the promise of all these feature gaps and tech debt. AIs love to add code into existing software. Our dream is an AI that wants to delete code, make the software more reliable rather than bigger. I think we can improve software quality, liberate ourselves from tech debt and security gaps and software being hacked and software being fragile and brittle.

There's a huge opportunity to make software dramatically better. But it's going to take an AI that understands your software, not one that's a novice. Well, friends, augment taps into your team's collective knowledge, your code base, your documentation, dependencies, the full context. You don't have to prompt it with context. It just knows. Ask it the unknown unknowns and be surprised It is the most context aware developer AI that you can even tap into today

So you won't just write code faster. You'll build smarter. It is truly an ask me anything for your code It's your deep thinking buddy. It is your stay in flow antidote And the first step is to go to augmentcode.com. That's A-U-G-M-E-N-T-C-O-D-E.com. Create your account today. Start your free 30 day trial. No credit card required. Once again, augmentcode.com.

You said you're coming off a high. What did you build? So we built the opine website, tryopine.com in, in framer. And how many people were involved in this project? I did all the, the design on it. We worked with a company, Fletch. They're also based in Texas on the homepage copy, but everything else I wrote or designed on the site.

So everything you see at tryopin.com is you. That's right. Aside from copy. And I mean, you can see this sort of scroll animations and things like that. And we did, we did, it was really interesting. This is what I'm saying, it's hard to prototype interactions. We did actually more complicated animations in Framer. And as we were talking about it, the founders and I, we kind of backed away from it

because it was feeling like we were hijacking the scroll bar. I don't know if you've ever been on a site where you scroll and like it just everything's like you know reacting to it. But that I mean I say that because you can go overboard with it and I don't know how I would have articulated to a developer to build the site without having a lot of back and forth and iterations and things like that. And just being able to get that instant feedback of designing it in the tool. The other thing that's interesting there is we, they have an import from Figma, which is pretty good. And it basically turns all your Figma stuff into

devs and, you know, with borders and, you know, a little bit of SVG code here and there. And what's really interesting about that is you can build responsive screenshots in a way that like if you had if you had screenshot them or exported them to PNG or even SVG like you can't quite achieve. So on both of those sides like I'm pretty stoked about like what we were able to achieve with out development in the tool. So. I mean, just browsing the site, I mean,

not that I'm trying to say that Framer or Webflow or tools like this are bad, but I can't tell that it's not a hand-coded kind of front-end marketing site. It's not easy to tell that it's something more simple, I suppose, or maybe you can speak to the end quotes more simple than I'm suggesting. I'd imagine it's just as hard because you gotta put the design work into it.

You gotta, you probably have less control over everything. And so maybe it's actually slightly harder than hand rolling your own code to get to the result. Was there much code involved in building this site out? This one, they have something called a behavior and there were a couple of little things that I had to work around. Framer stuff with like a, I don't know, a 10 line behavior.

What's the language for that behavior? It's JavaScript. Obviously, right. It's kind of like, I think it's basically, what do they call that? It's in React where you compose components by like, they call them higher order components. So that's how you dedicate, you decorate things if I'm using the right terms.

This is what I'm saying. So I come to React and I enjoy using just React, the library, I've never used state management stuff, things like that. And I know JavaScript very well, but, and I love using just react on its own. It's such a beautiful little library. It feels like jQuery to me. And like, I have a lot of joy using it.

There's so little code required to pull off interactive things. It's crazy with it. But then when you try and do it in Framer, you have to learn the Framer way. And it does use some of the things that I'm less familiar with. So yeah.

But Framer has so much that's just available from drag and drop sort of perspective. It's interesting too, I run across designers that don't use auto layout in Figma. And auto layout is just like Figma's version of Fluxbox. And Framer is built on auto layout, right? Because you're actually trying to build something responsive, essentially. So there is a little bit of a change to it when

you go to the tool, but like you, if you're not used to draw, drawing in Figma with auto layout and building things in Figma with auto layout, then you'll have to change that as you learn how to use Framer. Framer does have absolute positioning, like you can do that, but of course, like, you don't want to absolute position everything. Your website will be a nightmare to maintain, right?

See, this is where I think having that background in CSS makes sense somebody who doesn't come to a tool like framer Like I actually came up in the day whenever you would absolutely position whether you would absolutely position everything, but you would float Everything the whole layout was float based. That's right. This is prior to The new tools these kids have these days. You know what I'm saying? Like the best era of CSS is today in my opinion, but it's still hard. Yeah, it's still hard.

And I think it's a little more overwhelming than it was. I guess there was a lot of things in the beginning with CSS that like, It was the beginning. You would come across somebody's site and you would be like, whoa, how did they achieve achieve that and then you'd look at it and it'd be like oh it's all floats everywhere this is weird why would they do that that's so gross and then you'd start doing it right I mean I remember reading

the book who wrote the book there was a famous book I want to say pre 2010 I'll find it and I'll put in the show nuts because it's it's the oldest of old-school books. Yeah Yeah, are you talking about Mike Myers? It was like a black-and-white book It read more like a novel than a CSS training tutorial book. I Might even still have a library training tutorial book. I might even still have it in the library. Eric Meyers. I think you're talking about Eric Meyers. So Eric Meyers was the godfather, I think still might be, of CSS and I think you and I both came up in the days whenever the industry was transitioning from tables, literally from tables. Yeah, so some of the first websites I did were in the new mindset. So using CSS for layout essentially.

That was unheard of, it was just formatting, just decoration for a little while if you use it at all. You know, it was very, it was always in the head of the document. There wasn't a separate document that was strictly for the CSS and then it became Well, no tables is the old way we have screen readers So we have to you know screen readers can't read tables

well and you need to do all these different things and then you had web standards and Jeffrey Zeldman and all these things that popped up and then you had even things like what was it called called, microformats. Remember microformats? Yeah, microformats are still around and you should learn. They're still around, yeah. Now you just sort of like, you know, expect that to be metadata that you, I don't even know how it gets there these days, honestly.

Well, it should be by, like, your platform knows about it and spits it out, right? As a developer, you're not like hand coding those things anymore. Now you're putting in variables and you're plugging into a developer, you're not like hand coding those things anymore. Now you're putting in variables and you're plugging into a database and you're part of a front end code to some sort of backend.

And you know, the CMS or the platform takes care of sprinkling in the goods. There's so many good things though now in CSS. The grid layout was kind of the biggest thing recently that has made it so much easier to build these things but flexbox, of course and then there's all kinds of niches to get into like This the scrolling stuff in CSS to get the snapping and everything just right things like that

well, I think we got there by talking about really Framer, but from the lens of having been steeped in building front ends yourself. And I think having that, those battle scars, if you want to call them that, going into a tool like Framer, one, you could probably appreciate it more, but then command it more because you literally know how the web should work if you were hand rolling the code. Yeah, I mean, it certainly helps. I will say it's wonderful to see a tool like Framer taking an approach that's probably more for people like me,

I guess you could say. I think there was a lot originally of envisioning the tool in a way that was maybe not that practical, right? Like, you know, I mean, just no one would argue over like using tables, but like when we first got started, you would export your fireworks image to a table. And then in Dreamweaver, you would tell it how to size it appropriately.

It was crazy. But the way that the tools are built, Framer's built on all that good layout stuff and everything that CSS has. And they have catered to designer terminology for that kind of stuff. I don't think it says Flexbox anywhere, but it supports the Flexbox stuff. So if you're already in that mindset,

it does give you an edge for using a tool like that. I also used a lot of YouTube stuff to learn Framer as I was doing it and I do more with YouTube learning for some of this stuff now than I did in the past. You know, I'm with you on that. I feel that I waste a lot of time, especially on beginner content. I feel like almost everyone on YouTube assumes the person is new and novice and that just drives me nuts. I was gonna ask you, you know, in regards to that,

cause like if you're using YouTube, you're probably leveraging, you know, chat GPT for example, to say, okay, I'm using Framer and I wanna do this kind of thing that you could do in CSS. What's the equivalent in X and XB3? Yeah, so actually it's interesting that you say that cause I did use chat GPT from time to time. I found it had mixed results. And part of it is that Framer has

different libraries that it knows about. So sometimes it couldn't discern whether I was asking about the application or about the programming APIs that they have. So that was a little interesting. One of the great things about Framer, I know I'm glowing about it a little bit, but like there really is a large community and there's a large community on YouTube too. So, you know, in my most recent role, I was building a content management system,

content management world, right? And there were a lot of things, it was called Unstack. There were a lot of things about it that were great. And we were building the component system and things like that. But we didn't have a ton of users in the way that like Framer does. And so using a tool like Framer,

now it does cater towards a more technical kind of person to be able to pull off a site in it than what we were doing with Unstack. Unstack was strictly for the business user marketing people. But there's such a big community like learning the two different tools is a very different process. Like you can just go and, you know,

they have beginner focused stuff, but they also have a lot of niche stuff as well. Some of the things I was looking at was like, how do I get my menus to be responsive? So that was like one thing that I was consulting on YouTube. And there were two or three videos that I looked at for that. So you can get kind of niche in.

And that's a really interesting spot to be in for a tool when you're on top, I guess you could say. So. Interesting. So what is this Unstack? Where was this, what were you doing there again? Or you were building the CMS itself, or you were doing the front end stuff? At Unstack I was head of product and design.

It was my first role doing both product and design. It's funny, so the company I was at before then, we were going through this phase where they had a WordPress website and they brought me on as a designer. And I was again, in a sort of like mixed marketing. I was helping marketing a lot role and doing product design. And we were looking at the website

and it was something that the founders had stood up like six months ago before they had funding. And it was really just to begin to put content on the web about what they were doing. So the design was not great. just to begin to put content on the web about what they were doing. So the design was not great. And so designer, of course, I want to upgrade that. And so I was looking for tools and I stumbled across Unstack.

And Unstack at the time was really focused on the sort of SaaS businesses. That was their heart, to make it easy for SaaS businesses to have a website. Something that's not as complicated as WordPress to set up with a lot of pre-built components to do things. And I was blown away because I built the first version of our homepage in about four hours on Unstack. home page in about four hours on Unstack.

Unstack, you have to design for the system, but it was pretty good. And it was pretty good in the sense that like, the founders could use the tool as well to like build pages. And that was important to me. I love tools that you can be collaborative in with people and build content together and build things together. I still think Unstack is a great tool for this, but we did pivot more towards e-commerce.

For a while we were focused on Shopify. We were eventually acquired by this company, Elastic Path, and the tool is now called Studio, and it's been integrated with Elastic Path and the tool is now called Studio and it's been integrated with Elastic Paths for offering so you know you can you can build Elastic Paths storefronts and studio. Are you using AI a lot in your processes aside from this obvious one with O-Pine where you did the You know the awesome sort of guide I suppose I imagine was a PDF as well as maybe a web version of a potentially But do you find yourself using a lot of or even being open to? Tools that help you as a designer developer get further faster better. Yeah, you know, it's

It's one of those things that on the design side, sometimes it's easy to feel sort of conflicted about it, because now it's my profession. The way that I think things are evolving, and not just my opinion, but it seems like a lot of people's opinion is really more that people who use AI, like you'll become more, it's not that designers will disappear,

it's that a lot of the designer's work will be augmented by it, and the designer will be more of an operator of the AI's kind of thing in order to build things out. That's kind of my view of it. And I think you'll see, you know, lightweight design being done by the, you know, there's things like for cells v0 right now, bolt.new,

lovable that are doing the full coding, one shot prompt kind of things. I think you'll see these things get better and better as things go by. So people with expertise and then we'll be able to do more and better and they'll be, you won't even know they're using AI sometimes, but they know the right AI tool to reach for to do the job and get it done quickly.

ChatGBT I've done a lot with. More recently, we did a logo for our swim club. And it's very interesting using it as a tool. I could generate like lots of different versions with different texts, get different ideas, and then you can mash up, right? And so your skills in Figma are still important because you're gonna take like the different ideas

and put them together, but it's a different workflow in order to build these things. Figma is getting more and more AI as well. It's not quite to the point where it can use my design system to build screens. I think that's the killer application when you can give it your design system and say, hey, build a workflow for this.

And then the hard part of design comes, which is that, like, editing, like, what really needs to be on the screen? And right now, the work that we do as designers, a lot of times we're, like, building up to that point where we can do editing, right? But imagine if you could spend that time that you would normally spend just building up to it, like focusing on the, you know, the really important editing, getting it just right, dialed in sort of activities.

I think, I think that's the near future. I think you're right. I think in a lot of applications, which are, you're on the edge of like, and what I think will happen is, it's already happening, is you have a lot of entrepreneurs who have a vision or a big idea or a direction, and they don't necessarily need to camp out and let me learn how to build the best XYZ in Figma specifically. It's more like what does my user need communicated to? You know, and so that might be AB testing, lany page that might be AB testing or like even just iterating on the design of

and the editing as you said, of a homepage. What really captivates the essence of our brand and what we offer and what we aim to offer. It's sometimes you call that working on the business versus in the business and that kind of reminds me of that. It's like, do I want to be working on the business which is vision, systems, people, direction, product, customer analysts, you know, analysis, capital raising, or do

I want to be, you know, do I want to work in the business, which is moving this from here to there, literally hammering if it's a physical thing or literally coding it if it's a digital thing. And obviously we're talking about digital here. But I feel like this is like this era where that line begins to blend because you got a lot more possibility for the non, I don't wanna say non-talented necessarily, but someone who doesn't really need to gain the talents

in a particular area, just to achieve their outcome. You know what I mean? And that might seem like a shortcut, but it's sort of this weird world worrying where that's more real than it has ever been before or more possible. Yeah. I mean, let me give you an analogy.

When I was a kid growing up, I was homeschooled in high school, interestingly enough, and I can remember having this argument with my mom that I didn't need to keep doing spelling. She had me doing spelling in high school because I was bad at it, because Microsoft Word can spell check my work. Why do I need to learn it kind of thing? And word can spell check my work, why do I need to learn it kind of thing. And I still, I didn't get me out of my vocabulary, I still had to learn the spelling of all these things. And but later on in life, I really looked back on that and came to value it because there's, there were so many, it's getting better, but there's so many applications

where if you don't know how to spell, it just shows up in your work, right? Like, you know, whether you're hand coding a webpage or some component or doing something in Figma, Figma's finally got some spell checking there. So for much of my professional career, it's been valuable to like know how to spell, know when words are spelled wrong, right? I think that I think it's going to be

similar for us in the future. We're probably going to have arguments with our kids about, like, why do I need to learn how to do this, the AI can do it, right. But the people that are going to be like, the true craftsmen in the trades of what we're doing are the people that are going to understand like how to do it at the very lowest level kind of thing. And that's sort of always been true in this type of work. Right. Yeah. That's what gives you an edge, because you're able to quickly jump down to the point where you're not. I mean, playing around with GPTs today, writing code, they can get pretty far, but they tend to get stuck.

And if you don't know how to code, you don't know how to give them the instructions to tell them what's wrong, right? So it can be, there will be a lot of sort of lightweight applications of this where I'm a marketing person, I need to have a tool to collect email addresses for some event or something that I'm doing. I want it to be done a certain way and feed it into this spreadsheet on Google.

Like, chat GPT can do that stuff all day kind of thing, right? But you're not going to see those people transitioning into the like full on development stuff until they learn a little bit more as well. And I think these things will get better. They'll be, you know, chat GPT will be able to do more complicated applications. But there's always that little bit that's not quite good at yet. That's leftover, I guess you could say. And then for the practitioners, like the people that like are doing design or doing development, they're going to be a benefit because again,

they can spend more time focusing on what really matters, but they're still, they still got another stuff to do it well. Right. Mm hmm. When you look at your, the stack you use and your, your process, you know, you're, I think you got a new job. Did you do a new job? We didn't catch up on that. I did.

Yeah. Just, just over the weekend. So over the weekend you accepted something. Can you mention that yet, or is it still? Well, I'm going to Geared. I'll be head of design at Geared. Geared is another startup in the e-commerce space, so it's kind of my background right now.

And what they do is they help brands like, you know, AT&T with a lot of refurbished cell phones, for instance, be able to list them on platforms like eBay and Amazon. So we're building a product that does that. And so, yeah. How do you spell geared? Is it just geared? It's gierd.com. Gierd.com.

Well, first I would start with like, gosh, let's spell that a way that... It's a short domain name, right? I mean, it's awesome short domain name, but you have to ask, you know, don't make me think. Yeah. It's old, but Steve Krueger had it best. Don't make me think, you know, when it comes to web UX or brand UX. It's true.

It's, but it's, I mean, there's trade-offs. Like I think once you know it, you'll, you'll know how to spell it. And you can get there every time you know me gi erd Comm it is just her domain name. So you're starting there soon. What will you fault you? What's your role there same? So I'll be head of design there head of design So is there an existing?

Design system that you're aware of or designer? Yeah, yeah, yeah. So I'll be the first designer. Okay. And yeah, we'll ultimately build out a team. But yeah, I mean, right now it's still relatively small. I think Geared is like, I haven't actually asked the exact number, but I think it's around 60 people at the moment. They are really interesting because they have kind of built the relationship with customers and have done the effort manually, and now they're building the product that will replace

a lot of the manual effort of their processes right now. So the website looks good. I mean, I'm on geared.com, G-I-E-R-D.com. Not a bad website. I mean you couldn't tell that they don't have a designer or haven't traditionally hired one. I'm sure they've probably outsourced or consulted with folks. Yeah, they've worked with an agency. Right. I guess what I'm trying to drive towards really is when you, not that you know your marching orders already, but if you had to choose your stack,

when it comes to rethinking or implementing something new, what will you do? Will you sketch something out on paper first? Will you begin literally directly in Framer? How will you go about it? Will you do some market analysis with a GPT or an LLM or some sort of inference model? How will you approach what your next role will be here

and apply your skill set there? Well, it sort of depends on what the ask would be. So at Geared, I will be supporting the marketing team. So I think there will be some things that we like collaborate on essentially. I think I will have a relationship with the agency as well. Some of these details we still gotta kind of work out. Let's maybe zoom out instead of, let's instead of literally what's gonna happen.

Let's make an assumption. Well, let me go to, I think what the question you're asking is, if I'm a startup today and- Right, that's what I wanna figure out. How will you approach this? What would you do? The question you're asking is, if I'm a startup today and I have to start fresh, what would you do? So, like, some of these questions are like, what your objective is.

So for me, I would probably go with Framer, because it's a tool that I know right now. And I know it can get us like really far. It does all the standard startup stuff that I'm gonna want, right? I might compare it with a tool like Webflow because I haven't used it yet, like in earnest. So I might look at that. There's other options that are more technical.

One of the ones that we were exploring for Opine was just doing it with Next.js. You know, even in the next six months, depending on how the LLMs do, like there's been talk of the idea that like perhaps marketing people in the future just ask the LLM to code the page, right? And bypass the coding side of things.

Maybe, maybe. But in this moment, like I think Framer's the perfect choice for a SaaS based startup. If you have design talent in one of your founders or your early people. So you're not going to paper. How are you thinking about this? You're going in Framer.

You're just gonna start building a website? You got artifacts in Figma, you got artifacts in... Are you using Illustrator still yet? Like what other tool are you using? I'm still enough of a designer where I would have to start in Figma on this stuff. But the interesting thing about the O-Pod and site is that the way it came together was I left Figma a lot earlier than I normally would have. So the conceptual side of it started in Figma with the development of the brand, I guess you could say, and the implementation of the brand on the website started in Figma. But after I had kind of done the homepage, basically gotten it figured out, then it was pulled into Framer, right?

And I got it all set up, I got header, footer, and then just iterated. And it's iterated to the point where what's in Framer, it resembles what was in Figma, but like there's a lot of little changes. And most of the other pages were just built out in Framer without any work in Figma. I tend to have to go back to Figma if I need to do illustration of some kind, but when you kind of build your brand assets and get them set up inside of Framer. You know, if you're just reusing, you can build up full pages without ever touching,

you know, Figma. So Figma and Framer, Figma is, I mean, your blank page beginner spot, right? I mean, that's, and back in a different day, you may have used Illustrator. You may have used potentially even Photoshop. Yeah. I mean, I think Illustrator has its edge on some things still.

Photoshop is well of course if you need it for photo editing. I think for a lot of things I think people tend to be using other tools and it's only for like very specific things. So in my last role I, we're talking speaking of AI, I did use Photoshop for the AI features, which is interesting. So combining it with Mid Journey, Mid Journey could do the initial conceptual work

and then you could get Photoshop to replace this part of the picture that Madjourney could quite get right. So, combining the tools together, that was a really nice workflow. But I personally, I tried to stay out of the Adobe landscape. It's funny because I don't know if I have any legitimate reason to not like Adobe these days, but there was a point where it felt like they took over your computer with like in order to use it, you had to have their little thing sitting in your taskbar that ran all the apps and updated all the apps. And I remember any time I installed Adobe products, all of a sudden my computer ran slowly.

With Figma running in the browser now, it seems like everything runs in the browser. It just feels so much more native than some of their tools. But Adobe has also been a kind of like acquirer of good software. And killer, potentially. And sometimes killer. So yeah, I mean, they killed Fireworks, which was my first love in design tools, right?

So many people loved that, yeah. And then there was a short period of using Illustrator, and then Sketch came along, and then it was Figma. So even with like Zest icons, that was all in Sketch? No, I did Zest in Figma from the beginning. Really? I would say, from what I understand, you should probably compare Illustrator to Figma

if you're doing icon work, but I'm such a lover of Figma at this point, and Figma has something called vector networks, is what they call them, which is a fancy way of saying that you can join any point to any point in Figma, which was a novel concept at the time that they invented it. I'm not sure if it's supported by Illustrator now, it might be. But essentially, you can build shapes that are all connected and then tell it where you want the fill to be in in Figma inside that shape.

And that is a nice sort of upgrade for doing icons. I'm not convinced that Figma is the ultimate tool for icons. I feel like something native to SVG probably is. And I say that because I often have to, I export from Figma to SVG and it, at least historically, I'm not sure if they prove this, but it would convert the paths to filled shapes, which is interesting, because Figma has slightly different rules for the way that it curves paths than SVG. So there's some things where it feels like, Figma, why did you go to the other direction? Why did you choose to be a non-web tool technology?

From what I understand, the originally implemented or an early version of Figma was SVG, but they went away from it because the WebGL was so much faster than SVG. SVG has a hard time rendering in browsers, or it did. I don't know if it still does. Massive SVGs are very hard to render. But for icons, your output you want is SVG. So if you could have a tool that was, there probably is one out there, that spoke pure SVG and was tailored to the icon workflow, that would be awesome. Well friends, I'm here with Samar Abbas, co-founder and CEO of Temporal.

Temporal is the platform developers use to build invincible applications. So Samar, I want you to tell me the story of Snapchat. I know they're one of your big customers, well-known, obviously operating at scale, but how do they find you? Did they start with open source, then move to cloud? What's their story? Yes, Snapchat has a very interesting story. So first of all, the thing which attracted them to the platform was the awesome developer experience

it brings in for building reliable applications. One of the use cases for Snap was Snap Discover team, where every time you post a Snap story, there is a lot of background processing that needs to happen before that story starts showing up in other people's timelines. And all of that architecture was built composing using queues, databases, timers and all sorts of other glue that people kind of deal with while building these large scale asynchronous applications. And with temporal, the developer model, the programming model is what attracted them to the technology. So they start using our open source first, but then eventually start running into issues because you can imagine how many Snap stories are being posted every second, especially

let's say on a New Year's Eve. So this is where temporal cloud was a differentiated place for them to power those core mission critical workloads, which has very, very high scalability needs. Although they started with open source, but they very quickly moved to temporal cloud and then start leveraging our cloud platform. And they've been running on top of temporal cloud for the last two, three years and then a pretty happy customer. Okay. So maybe your application doesn't require the scale and resilience that Snapchat requires, but there are certain things that your application may need, and that's where Temporal can come in.

So if you're ready to leave the 90s and develop like it's 2025, and you're ready to learn why companies like Netflix, DoorDash, and Stripe trust Temporal as their secure, scalable way to build invincible applications, go to Temporal.io. Once again, Temporal.io. You can try their cloud for free or get started with open source It all starts at temporal.io Yeah, I can speak to the

Your sentiment about figma. I had to go Recently to to help somebody out with something. I was messing with Figma and I happen to have two computers, you know, like that kind of person where I've got like a, a laptop and I've got an older machine that I still use every once in a while. And actually I retire it and I bring it back and I retire it and I bring it back sometimes, but it's an older iMac Pro that still has so much

firepower in it that I just can't in good conscience get rid of it. And so I'll use it. And so I've had my studio which I'm in now and then my home office which is about to merge. You know I'm about to start producing my version, my side of the show from a different location. But it's been a while. And so I've been a two location person for almost three years now. And so I've had to embrace this mobility requirement to my flows. And so I don't do a lot of front end stuff

in terms of design. And I had to be in Figma for some things recently. And I was like, wow, this is kind of cool because I Can be on my laptop? figma cool Then I'm on my desktop, you know in air quotes desktop this iMac Pro Different machine figma everything's still there Extensions are still there. Extensions are still there. All the things are still there.

It's the dream, man. I didn't have to install the application. I didn't have to make sure plugins were enabled. I didn't have to do anything besides just log in to Figma and Figma was, and it was the first time I'd personally experienced it, and I was like, that's pretty crazy. That's pretty crazy.

The thing I need to use is a web based tool, which means it's not operating, you know, operating specific operating system, specific. I can probably even hop on a windows machine and open up Figma and Figma is still Figma. Is that, is that pretty, is that true? That's true. Yeah. I mean, I feel like an idiot even asking, is that true? I mean, like obviously it's true, yeah. I mean, I feel like an idiot even asking is that true? I mean, like obviously it's true, right? Yeah, so that's true and this was true,

let's see, six years ago. So this is a six year old thing. This is not new news to anybody. Yeah, so this was, the funny part about this is I was at a company at the time, I was leading the design team, we had about eight designers working for us,

and the team had just grown from three to eight, and the new guys were all sketch people, and they were like, we gotta switch back to sketch. So we had reviewed tools and we decided to go with Figma when there were just three of us, but the new people all wanted to do sketch. And I was pushing against it, pushing against it. to go with Figma when there were just three of us, but the new people all wanted to do Sketch. And I was pushing against it, pushing against it.

Well, I eventually left that company and the team adopted Sketch, right? And at the time, the only thing Sketch had going for it was the plugin system. And there were a lot of designers that were dependent on the plugin system for certain workflows, things like that. And Figma was like new and different, but it could do almost everything Sketch could do, except for the plugin system. So that was sort of the big, big beef.

I think they eventually switched back to Figma. I can't see how they wouldn't at this point. But it was funny to me that like I got it on a little too early with that team. And then Figma introduced its plugin system, which is great. And yeah, it seems like that was the point where a lot of design teams started choosing Figma. And it really is because of that collaboration. is the point where a lot of design teams started choosing Figma. And it really is because of that collaboration. The crazy part is doing any kind of design review now with other people, you want to do it in the tool if you can.

Like, give them that Figma link. Don't share your video. I mean, you can if you want, but do it in the tool. Click on that person's face and follow them around the tool as they are presenting. And you get it so much clearer. You know, you can have the window as big as you want on your screen.

You can zoom in on a particular detail. It's the way, it's so much fun. It seems like your stack is pretty simple simple then figma is where you begin Yeah Framer cuz yeah, yeah, maybe some mid-journey Yeah, you need to do some image generation some finishing touches in Photoshop progressively reluctantly Yeah, of Adobe tools. So

using mid-journey and Reluctantly, inside of Adobe tools. So using Mid Journey and Photoshop, what I was doing was generating a product catalog for a fake store, right? And it was amazing experience. Like you could do different things with it. We also used, so we had two different ones. One was a furniture store and the other was apparel. And we used a tool called humans.ai for humans, generating humans.

And that one's pretty incredible. But you would end up sometimes with something not quite being right. Like in either case, like furniture or people, you could just quickly pull that into Photoshop, select the area, have it regenerate it. Photoshop can upscale pretty easily with AI, and it can generate more of the background. So one of the things sometimes that's hard about mid-journey would be that it's not zoomed in quite right for you. And you can do some of this with Mid Journey.

They've added more and more tools on that. But you have to send it off to the server to like regenerate and it's kind of slow. So when you get it pretty close to what you want, just jumping into Photoshop, it can be a time saver. I'm on the humans AI website. So this will do what, what does, what does humans do? Human AI generated dot photos. That's the one that I use.

Sorry, I gave you the wrong thing. Generated. Dot photos. Dot photos. Well, we just gave humans.ai a little bit of motion. Unnecessarily. Yeah. Well, maybe, gave humans.ai a little promotion, unnecessarily. A little bit of parts there. Yeah, well maybe they should be promoted.

I don't know. The tool I used was generated.photos. Human generator. So. This is crazy. So, unique real-time face generator. Yeah. The feature is here, you can create a unique person

with your parameters in one click. So. Skin tone, hair color, emotion, age, head pose, gender. The last time I used this, my one critique of the tool is that it tends to generate really beautiful people only. Really beautiful people. So try and generate an average programmer in it and they're either like too heavy or they are like really skinny right like there's a profession? No I'm just saying like try to generate someone who looks like a

programmer like he picked their clothes. Oh well that's bias come on John what are you trying to say? No no I'm like an average human like I know so So Joe come on one of my times one of my criteria for this type of stuff is I don't want it to look too many I generated even thought music and I have to write it to a whole So if they're too pretty if they're too pretty then like you just like oh, these are all fake people, right? So but it's it's pretty good. it's pretty good at what it does. And one of the things that's cool about that particular use case was you can use basically the same model in different poses,

different clothing, whatever. And that's useful for generating fake storefronts because you need multiple images of the same person wearing the clothes from different angles. So that tool has a lot of promise and it's already very, very good. Okay, so generated.photos, Framer, obviously Figma, mid-journey here and, if you really need to.

Photoshop for the final touch, if you really need to go and replace something in the image. What else is in your stack? Well, Chat GPT for copy, and then it tends to do, because they've got Dolly built into it now, it tends to do better Line art sometimes you have to compare with mid journey, but if you're doing a logo, I like chat GPT. Okay Let's let's go there then. So what what do you do? You just log into your own chat GPT. You open up a new chat Are you are you word smithing for a bit there? You're kind of getting some emotions, some words, or do you go right into?

I'm probably the worst at this. It's always like, I know the idea of prompt engineering, but I'll just be like, generate a logo for my swim club competition named, you know, Terry City Swim Meet, because that's what we were doing. And then it'll do it. Uh, a lot of times I'll forget to say, Oh, I want line art or, Oh, I want a particular style. I want hand letter. You can, you can say things like that. What's the swim club named? Uh, it's Carrie swim club. I spell that? Uh, Carrie is our town.

C-A-R-Y. C-A-R-Y. Okay. Carrie, North Carolina. It is jokingly referred to as the containment area for relocated Yankees. Okay. Because we have a lot of us that have come down to North Carolina. So Carrie swim clubs was called?

Yes, Carrieeri Swim Club. So we have a meet every two years called Keri City. And we did a logo just this week. We were playing around with it. I found a Figma plugin, speaking of plugins, that I could take that generated text and vectorize it. And it vectorized it for me. And it's funny, you'll find that when it generates logos, so the one that we really liked, it said,

Saree City Swim Club, instead of Cary. For some reason, it changed the C into an S. So you have to do touch-ups on it right now. But I think it's a great way to get inspiration. Uh, and you might just get lucky with a one shot, did the right thing for you. It can do icons as well. I think it does pretty, pretty good at icons. But I mean, if you really need icons, you should check the zest out first.

Right. But, um, after that chat, GPT. Uh, last time I checked the zest was little dated, though, wasn't it? Is it dated? I mean, it's been a few years. I mean, you know, it's not as on the up as some of these other ones, you know? Oh, I don't know.

At the time, I still do a lot of custom icons as part of my job. If you want two pixel stroke, Zest is, I think, was leading the pack at the time. I found another one. There's a untitled UI that has the two pixel strokes. Why is it important to have two pixels? So if you're an icon nerd like I am, the great thing about two pixel strokes is that it's bolder than one pixel, which people tend to want a little bit bolder, and you can align

it perfectly to pixels, right? Because one is uneven, right? It'll be sharper as long as it's not curved. Now, curved icons are are gonna look great at whatever resolution but yeah. Are you familiar with iconic.app by any chance? Iconic I think I have played with this one. Is this what you use these days? I really don't use much but I pay attention to Orman Clark. He started dunked.com.

I think he's done some design at Stripe. I've just generally followed some of his work over the years. I would say like literally probably 15 years or more. And I've always enjoyed it. I've always enjoyed his style and his attention to detail. And I know he has Iconic out there, which is like free icons for designers and developers And so there's got like a mix of free ones there

But I'm not an icon nerd like you are where I'm like, well, there's two pixels here I just never thought about it. It just depends. I mean, I can't quite tell I'm looking at it right now I think he is he using 20 pixels are these 20 by 20? I think he is he using 20 pixels or at least 20 by 20. No, this is 24 by 24. You got some free ones in there. So if you go to the free ones, you can at least let's say use the AirPlay to TV option or the archive option

because that's something you can use everywhere. I think it's at different sizes. You can do it different sizes obviously. Yeah, I think if I'm looking at this, so if I'm looking at the AirPlay to TV one in particular, you'll notice that it's sort of blurry around the inside of it. So this is the challenge when you choose like a 1.5, which is probably what he's done, pixel stroke. It means that you have to sort of, when you do straight lines, you have to decide like, is it going to be right in between two pixels or is it going to be aligned to one pixel so it'll

be darker on one edge and the inside in this case is fuzzier essentially because it's using gray right because it doesn't any aliasing. So yeah, as a nerd, I love it when my lines can, like, line up with the pixels so that it's as crisp as it can be. So that was what I did. The one that, if you like a little bit lighter touch, I've been using on projects lately is Heroicons. Have you played with that one? No.

Heroicons is the tailwind guys. And I've, you know, some of this is a style thing, but they seem to mostly make the same stylistic choices. Uh, like they're in the same family. Ooh, see it says, here's the outline when It says 24 by 24, 1.5 pixel stroke. Yeah, so they use 1.5 pixel strokes. So you tell you what's interesting is you can scale up, I think, to 32 pixels. Yeah, 32 pixels and it'll align.

All right. See what I did there? Math is fun. But yeah, I mean, there's differences. I have thought for a long while that I might wanna do a zest medium and a zest light, but it's finding the time to kind of pull it off. So have you abandoned Zest completely in your updating or is it active?

It's... How active is it if it is active? I think it's been about two years since I did an update on it. So that's pretty inactive, John. Yeah, yeah, but... In this day and age, you gotta be, you know, here's what all like about icon

Iconic at least is they're frequently adding things to the library and there's a business model here They're frequently adding things to it and you can I believe get the pro. What is Ivan? I'm not trying to advertise for him, but I think their model is kind of cool. I'm just gonna go back there It's like I'm speak eloquently about it. Okay. What is their pro? Okay, so if you go pro Oh wait, hang on it says it up here 24 24 by 24 bounding box 1.5 pixel stroke. So you're right that That one is a little blurred. So you're a fan of 2 pixel because it's even okay So the iconic pro package. Hey Orman if you like this pay us but listeners just check it out Okay, don't buy this don't go and buy this. I'm kidding. You do what you want

Solo is 99 bucks a year and team is 249 a year. Yeah, and you get access to all the icons There's new icons every week. So I think if you revisited this as your as Your passive income plan, John. Yeah. You know, steal their model, borrow their model. Yeah, it's interesting. I think it takes me about four hours to do an icon update, right?

And so when I do it, so that's just to do a release and it could be faster, don't go be wrong, like automating all the steps. Yeah, I can make it faster, John. I believe, yeah, I can to do a release. And it could be faster, don't be wrong, like automating all the steps. Yeah, I can make it faster, John. I believe I can speed up my release. Maybe it could, maybe it could at this point. One hour. But the last time I did it, it took four hours.

And some of that's that there's not an easy way to automate sketch output, to automate Figma output. So there's a number of manual steps that are in the way of it. So where I am as a dad right now is that I've got a side project that I'm working on that takes my time. And so once a week, I meet together with my friend who we're working on it together. And that's where I'm spending my time. Zest is interesting.

I think I make a sale at this point every couple of months. So it's not doing great. But if I was to pitch it to you, it's a one time price. It's now only $30. I've sold it at different price points. It's over 600 icons and they are pixel aligned, um, for 24 pixels. So yeah, it's a, it's a baby. I want to get, I want to get back to it at some point, Adam.

Well, I'm here to encourage. I'm not here to make you feel bad. Hey, you know what? When it comes to children, man, I'm the first person to say family comes first. I think you have to have some things that keep you creatively alive, let's just say. Yeah, that's right.

So if your job doesn't do it for you, then you're gonna have some version of a hobby, whether it's a project, money making or not, to sort of like keep your own personal creative juices going and flowing because it's how it is as a creative. You know? Well, I mean, it's interesting too. It's cool putting stuff out because it's going to eventually become dated and you can kind of track your own progress by like seeing it. And so I would make different choices today, like on particularly on the landing page for Zest, like I'd love to do some different things there.

But I'm also pretty proud that like it's got some staying power. It's lasted. It's still in style, adam. It hasn't gone out of style. Uh Maybe maybe Let's say you uh, let's say you took your 30 bucks and you turn it to 29 bucks a year Because you sold it once for the license and let's say you started updating it Yeah, somewhat frequently. Let's whatever you would define that as somewhat frequently enough to make it valuable to somebody to pay you yearly roughly 30 bucks, 29 bucks a month. And let's say you had 500 sales in a year. That's $15,000 rounded up. Of course.

It's 14. Yeah. It's funny though. Like I don't know if I'm too much, too close to it, like, as a customer, but like, that's not how I wanna pay for icons. I like, I wanna pay once and be done with it, like. The subscription gives you a chance to keep them involved. Oh, I understand as a seller, but I'm saying as a person who purchases. And I also sort of, I like, I want

people that are buying it. So I did structure it so that it's not a multi-use license. It's it's purchased for your work on a project. If you are a agency, you would need to buy a new license for each site that you did for a customer kind of thing. But partly the reason is like I wanted to have that purchase once and you can use as much as you want and you get the updates sort of model as a user. Like that's the way I want to want to purchase icons. I get it. I get that there are people that are playing around with those models and particularly on the, I would say like there's other sites that have thousands and thousands of icons on them that use that subscription model. Yeah, it's almost too much.

Yeah, it does. It's almost overwhelming. Too much, but for like picking it for a project to me, like I wouldn't want to use a site like that because I don't want to just, like I have to negotiate with my boss like to purchase a new icon set. Like that's the last thing I want to do. But if I can say like, hey, it's 30 bucks. It's like, great, do it. Like that's 600 icons you don't have to design.

Well, if it's any consolation, I am not an iconic pro purchaser. Well, if it's any consolation, I am not an Iconic Pro purchaser. Oh, oh, oh. I'm not saying this as a buyer. I'm saying this as somebody who pays it. I mean, I don't even pay attention to that many icon sets out there. I mean, I didn't even know hero icons from the Tailwind folks,

but I think the table stakes though in this game is you have to offer a figma file Yeah, you have to offer React and view type components or some sort of integrations because that's the way Yeah, you know that is the front-end world we live in You still get SVG and PNG of course And I think that I don't know how, is Heroicons, is it free? Yeah, Heroicons. I think it's Heroicons.

Heroicons, it comes from like Hero. Heroicons. Alright, fine, Heroicons. Yep. Heroicons. Yes. Free. This is free.

By the way, it's Zest Icons, not Zestikons. Did I call it Zestikons? No, I'm just, if you read the domain name, people sometimes say it wrong. Did I call it Zestikons, Jon? No, you did not. You did not. Alright. Zestikons. I just... Heroikons, Heroikons... I think this is a problem with icon sets. I like it. Heroicons.

That's weird, but whatever. I'm going to call them hero icons. So he did a set that was much larger originally. They were called hero icons, right? And then they developed a smaller set, which I think ended up being the more popular. It's the default sort of tail windy so if you're in the tail wind world you're aware of it yeah you know it's really hard to compete with icons out there there's so

many of them out there free not free paid not paid subscribe subscription not subscription you know it's it's like's like, unless you're into winning it, it's kind of hard to compete, you know? That's the thing. I think it's great that there are people doing this. I have an itch. I was in between jobs at the time, and I did most of the icons during that short window while I was searching for a job.

So, you know, and one of the things that to me, I like, I still benefit from Zest. Even today, I was pulling an icon over and making it look like the Heroicon 1.5 because I'm using Heroicons on another project because Zest has things that Herokon doesn't have. So it's great for me personally, just to have a library of things that I can pull from

and build from. It's better than starting from zero, right? Yeah. That's cool though. So as one note of feedback, maybe I'm just so used to this 1.5 world these designers force us into. But when I go from iconic to heroic to zest,

zest feels bold and thick. A little heavy. A little heavy. That's the branding. That's the branding. That's by design, huh? Bold and refreshing. There's even design, huh? Bold and refreshing. Look at this. There's even a Sass logo in here, John.

Oh yeah, man. I'm deep on certain areas. I'm pretty proud of... So Zest comes in three flavors. You can have social, which is like what you need for a website. And it's got stuff like Sass in there and other things that you might want. But it's got Instagram and all the different types of logos that you want for a website.

And those are pretty juicy. I haven't seen, and I'm a nerd, but I haven't seen a set that has as many and feels current and all that. So there's that. And then there's free, free Free which is 200 free icons, and I actually tried to put my best icons in zest free Okay, but when you're ready to pay for it You'll get all the extensions of the best icons, and that's what zest pro is so There you go. There you go. Well, you know, as a word of encouragement,

I think if you wanna be seen as not dated, and I don't wanna say that's necessarily true, but it's been two years, you gotta update the brand marks at least. Twitter's now X. That's true. Right? I'm not sure Google's that rounded. GitHub's Octocat is not that anymore. It's more a different silhouette version of it.

Less of a caricature. Oh, no, no, no. These are my take on the best version of the Mox. Oh, I see. So. Okay. But you are right. you're right. I do need to get X in there. I've actually have the icon designed. I just haven't done the four hours. Just gotta put it in there. Shit that update, John. So, yeah. So they queue up and I've got about 20 right now

that I need to do another update. Well, need to and have time to do different things. Always choose children and your wife over zest. Or your friend in this side project or whatever you're doing. But why make it a choice if it doesn't have to be a choice? Any final things to share, any final wisdom pieces.

I think one thing you may have that not a lot of people have is this ability to be both a designer and a developer, and you speak development as well as design. We have a lot of developers in this audience, and so I'm hoping some of them come to this conversation with the curiosity of what a designer thinks of when they choose their stack, when they choose how to leverage these AI tools

to get their job done in different things. And so I thought we'd have a grab bag of a conversation here, but any words of wisdom for a designer slash developer working with developers? What developers should know about a designer? Anything on that front? I mean, probably my little, my biggest thing for developers would be like,

hey, do a Figma course. It's easier than you think. And focus, like learn how to draw with it, but also focus on how to get the development stuff that you want out of it. Because there are plugins that are written that will like write half the code for you when you export it from Figma.

So it's well worth spending a little bit of time on the Figma side, doing that if you haven't. For designers, I mean, again, it's probably a challenge to spend some time on the other side of the fence. I think the AI coding tools are pretty impressive, but it is nice to just sit down and learn a little bit about CSS, learn a little bit about JavaScript, the basics of these things. But I don't know, I, on the, on the design side, I think sharing what you, what you know and what you've learned, maybe, maybe teach some developers how to use Figma kind of thing.

Like any particular courses you know of that you've seen or recommended for Figma or they have some of their own educational content? Figma, Figma is interesting. educational content. Figma is interesting. I haven't really explored that because I haven't been learning Figma in a while. But when people ask me about it, I generally say go to the Figma website.

They do have a lot of resources and they've invested in that for like teaching people how to use Figma. So you can kind of go down the outline on figma.com and learn it. You know, my experience recently with Framer would say, hey, go to YouTube as well. And you'd probably find some good people there.

Maybe you can do a Figma Crash Course, you know? Revisit Figma as a developer and say, well, but I want to know yeah and in all my 10 minutes or less all your free time John. I love it actually you know I used to sit down with every developer that joined the company like my goal was to just walk through Figma give them an introduction but even in just 30 minutes, it's not quite possible to pull out how to get the most

as a developer. So that's why doing some exploration, it will pay dividends. If your designers are asking you to look at Figma, then spend some time learning it, and it'll be easier for you. And you might, the other thing that's interesting is that Figma's recently gotten things like variables

and things like that. So as a developer, you should be getting all your design system stuff into Figma and a lot of your designers don't know how to do that. So you may end up having to educate them on how, how to do that. But the world is better when the systems that we're working in are very similar. Um, and I see a lot of teams that don't seem to quite understand how to use figment yet from either design or the development side, so yeah. Well, this episode, as you may know,

listeners was not brought to you by Framer. Although we did talk about framer.com quite a bit. I would happily have them as a sponsor. So if you're from Framer, say hello, you know? I'm down for that. I like Framer though. We, you know? I'm down for that. I like Framer though. We've been sponsored by Wix, we've been sponsored by, I think,

what was the other one you mentioned before? Webflow, I think Webflow sponsored us before. But I like Framer. If you like Framer, I like Framer, John. I trust your judgment. That's why I joined the show. Well John, it's been a pleasure catching up. It's been a while since you and I have spoken face to face.

I think probably years, right? You think it's been years? Yeah, it's been a while. I think our last conversation was on Radiant. Man, the last time I talked to you, you may have been pre-kids. Yes, that was pre-kids. So, I mean, you got three now,

so it's been almost a decade, John? Yeah, I was unmarried as well, the last time you talked to me. I think you were engaged. I think you're right, I think you were engaged. Okay. Now you're hopefully happily married. You don't, it's a podcast, Transcribe,

don't say it if you're not. Yeah, no, it is. And if you are, boast, of course. Yeah, yes. So it's been fun, not. Yeah, no, it is. And if you are, boast, of course. Yeah, yes. So it's been fun. Yeah, for the listeners, I guess in this little extended outro, Jon and I have known each other for many, many years.

We started the SaaS way together. What else do we do together, Jon? How did I meet you? Where did I meet you at? I think we were aware of each other's, so there was a time where we were going to similar conferences. Maybe Lesconf? Was it Lesconf?

Yeah, probably Lesconf. Forgallant Banks and Stephen Bristol. Did you do Ralesconf back in the day? I think I've done one. I did not meet you there though. I've only done one and it was in Portland, I believe. Okay. 2008.

Yeah, I might have. Ralesconf 2008. Done that one, yes. Portland, I believe. Okay. 2008. Yeah, I might have done that one. Real's comp 2008. Yes, I think I did. Maybe you did. Maybe I met you there. I know Steve and Alan were there. Yeah. I remember being with Steve in the trolley tram thing

that goes around the town. I don't know. Yeah. It's cool stuff, cool days. The less guys, the less guys are cool. Did you see Alan is running for mayor? Mayor. At Panama City. Vote for him if you're in Panama City. I mean, less guys are cool. Did you see Alan is running for mayor? Mayor. At Panama City.

Vote for him if you're in Panama City. I mean, I would like to become a resident just to vote for Alan. I would vote for Alan for anything, pretty much. Miss Alan, love Alan. Obviously miss Steve as well. But don't make me cry on a show, man. John, it's been fun, man.

Catching up. It's been fun. Stay cool. Always a pleasure Okay, it's been a couple years since I've talked to John I want to say gosh John and I Spent a few minutes after the show actually catching up on some family stuff and some other things and It's been I think a decade is what we said a decade since John and I last

talked. He wasn't married. He was engaged. He had no children. Now he has children. You know, it's just a different time then. So this show was a fun catch up with John and I've always loved John's front end and design eye. And I've been really curious about his tools and stack and choices over the years because I've always appreciated his taste when it comes to front end work and design work. If there's one thing worth taking away from me from this conversation,

it is two pixel lines when it comes to icons because John clearly believes in that. But I would say Framer. Framer got a big shout out on this show and I think it's probably worth checking out you know I'd love to get somebody on the show from the framer team and if you know somebody let them know we'll have them on the show it'll be fun. Okay big thank you to our friends over at Retool Retool.com, Augmentcode., and our friends over at Temporal.io. And of course to our friends and our partners over at Fly.io.

And those beats are banging the best beats in the business, Breakmaster Cylinder, so good. Okay friends, we'll see you on Monday.