Latest / The Laravel Podcast / Mastering Design Systems with Jeremy Butler

Transcript

Mastering Design Systems with Jeremy Butler · The Laravel Podcast

• 0:00
  The Laravel Podcast is brought to you by Tighten,
• 0:03
  your friendly neighborhood Laravel experts.
• 0:05
  Check us out at tighten.com
• 0:08
  and also by other sponsors you will hear about later in the episode.
• 0:10
  Hey and welcome back to Laravel Podcast season seven.
• 0:13
  I'm your host, Matt Stauffer, CEO of Tighten, and this season I'm joined every episode by a member of the Laravel team.
• 0:18
  Today I'm joined by my friend Jeremy Butler, design lead at Laravel.
• 0:21
  Jeremy, can you say hi and share a little bit about what you do at Laravel?
• 0:25
  Hi everyone.
• 0:26
  So my name is Jeremy Butler.
• 0:27
  I'm the product design lead at Laravel and I take care of a lot of the evolving design systems and kind of the design direction for cloud, Nightwatch and Forge, and a little bit
• 0:40
  around, you know, the Laravel brand as well.
• 0:43
  Okay.
• 0:44
  And I have so many questions, in part because I've actually seen your fingerprints on quite a bit of open source things.
• 0:48
  So I'm curious like where that goes.
• 0:50
  But before we do that, you know, the first question we have to ask is what is the story of you coming to work at Laravel?
• 0:55
  So what you know, go as far back as you want or keep it as short, but I I want a story that ends up in you've signed a contract and you're working there on your first day.
• 1:03
  Okay, so we have to go back maybe eight or nine years.
• 1:06
  Okay.
• 1:07
  Because that's where really where the story begins.
• 1:09
  So I've worked with Philip Harton, who's our senior PM here at Laravel, almost for 10 years.
• 1:15
  And the first project that we were working on together was distressed media.
• 1:21
  So selling adverts to pretty big companies for print, for like outdoor advertisement.
• 1:28
  And we decided to build it in the system that we knew, which was WordPress.
• 1:33
  And WordPress came out in 4.7 with an API.
• 1:37
  And we thought, okay, this is gonna be it.
• 1:39
  This is how we build our first application together, but immediately started hitting problems.
• 1:44
  We had performance problems, authentication problems, just all sorts of issues all the way down, full downstream effect.
• 1:52
  And Phil went away and he bought a book called Laravel Up and Running, which of course is your book.
• 1:58
  So all of this is comes back to you.
• 2:01
  Yeah.
• 2:01
  It is your fault.
• 2:03
  He read it in a weekend and rewrote the full this was a national application.
• 2:08
  He rewrote it in two weeks in Laravel.
• 2:11
  Must have been five point something back then.
• 2:14
  And that's really what we got into Laravel as a framework, as like a ethos of how to build software, how to build clean software, predictable software.
• 2:23
  And we built the next probably ten applications in Laravel until we moved into a medical application.
• 2:29
  And from there we grew.
• 2:32
  The system and the the business itself grew into the NHS and the UK.
• 2:37
  And we had to build the best Laravel application possible with the best app book, the best Laravel team possible.
• 2:45
  So that's where we reached out to people in Australia, like Jess and Tim and James Carpenter and Sabrina.
• 2:53
  And we built a team really for this medical software that was world class.
• 3:00
  It really was.
• 3:01
  And
• 3:02
  Things happened there and Jess and Tim, of course, moved into Laravel itself and started building, you know, open source systems and started to build this new application.
• 3:13
  By that time, Phil and I had started another business again to running those channels.
• 3:18
  That's what does we have to.
• 3:20
  I think we've we've had five companies over 10, almost 10 years together.
• 3:25
  So Jess reached out and said, Hey, look, we're doing something pretty special here and we're actually gonna get the
• 3:32
  You know, the freedom and the the funding to go chase this idea.
• 3:36
  Do you want to come do some design?
• 3:38
  I was like, of course.
• 3:38
  Like we're kept it all and kept in touch.
• 3:41
  And it's like, this is going to be great.
• 3:43
  That turned into to Nightwatch.
• 3:45
  And it grew to the point where we needed Phil as well.
• 3:49
  So we got the offer to kind of, do you want to both move over and just go full time at this new application called Nightwatch?
• 3:57
  So really that's the that's the genesis.
• 4:00
  is coming from having to rebuild this system into Larva all thanks to your book.
• 4:05
  That's
• 4:06
  Wild.
• 4:08
  And you guys have told me that that there was it played a role, but I didn't realize it had played that much of a role.
• 4:14
  It was such a pivot, like it we're heading down towards you know, doom and gloom with this application.
• 4:21
  And yeah, just that methodology and that change in framework saved the project.
• 4:27
  So long delay.
• 4:29
  Thank you.
• 4:30
  What yeah, of course.
• 4:32
  I'm so delighted to play a part of it.
• 4:34
  What a fun story.
• 4:35
  Before we kind of move on with the rest of the rest of the podcast, I want to hear the story of what you got you into kind of what you do on a day to day.
• 4:43
  Because I know you have design chops, I know you have programming chops.
• 4:47
  So where like where in that world did you start?
• 4:49
  Where in that world would you place yourself today?
• 4:51
  And we don't need to talk about the projects you're working on, but just sort of like your evolution from like how do you imagine you what your work was gonna be, you know, how that
• 4:59
  evolved over time.
• 5:01
  I think most designers back in in my day kind of started in print.
• 5:05
  It was the the most viable area to to be a designer.
• 5:09
  I struggled.
• 5:10
  So I was freelancing at the time, but there was all these web offers.
• 5:14
  So I said, okay, I can design a website.
• 5:16
  Let's do that.
• 5:17
  And I really, really struggled to find good developers to work with.
• 5:21
  So foolishly enough, I said I I could probably do this and started to learn.
• 5:25
  Yeah, yeah.
• 5:26
  It's just like
• 5:27
  HTML looks easy and it, you know, it was until you get into all the rest of what you have to build to to make a successful website.
• 5:35
  Um, so my life's really just been to and fro between design and front end.
• 5:40
  Uh I I would have thought I was okay as a full stack, but now that I'm working with people like Jess and Tim and the rest of the Laravel teams, like I can't.
• 5:49
  None of us feel like we know what we're doing compared to them.
• 5:52
  Yeah, yeah.
• 5:53
  That's the most humbling kind of movement and situation you can do is go into a an engineering team where there's like those sorts of people and those builds in the the
• 6:03
  community.
• 6:03
  It's like, okay, I'll not touch that anymore.
• 6:06
  Yeah.
• 6:07
  Totally.
• 6:08
  So yeah, I've kind of gone deep into design and kind of deep into design ops and design theory and just trying to make sure that design has a voice in Laravel and within
• 6:19
  engineering teams.
• 6:19
  It's like this is, I guess, a way to solve problems.
• 6:22
  A way to see solutions and kind of all get people together around a single artifact, which is usually a design, and a user journey and a few kind of things that go user centric.
• 6:33
  And yeah, that's really my day to day right now, is how do we make that voice a little bit louder and a little bit more present in the product that we're the multiple products that
• 6:43
  we're building.
• 6:44
  Okay.
• 6:45
  And you when I'll go in there for a sec in a second, but first we will say thank you to our first sponsor real quick and we'll be right back.
• 6:51
  Move fast and fix things with Honey Badger's intelligent error tracking and application monitoring for Laravel.
• 6:55
  This is everything you need to keep production healthy and users happy.
• 6:58
  Get your free developer account today at honeybadger.io.
• 7:02
  And Laravel, the mothership and also employer of our guest today.
• 7:06
  This episode is also sponsored by both Laravel Cloud and Laracon US.
• 7:10
  Laravel Cloud is the fastest way to deploy Laravel apps, and it also solves all sorts of common problems that keep web artisans from shipping.
• 7:17
  And Laracon US is the premier in-person event for all web artisans to come be with your people, level up, and leave ready to ship faster and better than ever.
• 7:25
  So check these out at cloud.laravel.com and Laracon.us.
• 7:30
  So I do want to get to where you are today.
• 7:32
  I'm really fascinated by
• 7:33
  The ways you talk about design as a interpersonal thing, as a systemic and cultural thing versus just a practice that one person does.
• 7:40
  But before you do that, I want to talk about when you first worked at Larabelle, what you were working on.
• 7:45
  So you had mentioned that they said, Hey, we're gonna do this new thing, we're gonna get the freedom to work on it.
• 7:49
  So, what was your introduction to that first project?
• 7:52
  What did you first kind of get exposed to and what was the pitch?
• 7:56
  It started with an apology.
• 7:57
  So I remember the first the first call I had with Jess was sorry for what I'm going to show you, but like let me tell you about what's underneath it.
• 8:04
  Okay.
• 8:05
  And it was that was probably justified.
• 8:06
  The first screens were just like, here's what we can pump out on a white screen.
• 8:10
  Um with, you know, dark text and a HTML table.
• 8:14
  But like the underlying core of what Nightwatch was, like the the engine behind it, was pretty exciting.
• 8:21
  It was pretty compelling when that plugged into
• 8:24
  You know, the grander vision for for cloud and for Laravel itself.
• 8:28
  It's like, okay, we're creating a suite of products and we're creating like a holistic solution for developers.
• 8:33
  So we started working on designs and the the freedom that we had was really just a brief from Taylor saying, you know, dark and hacky.
• 8:42
  Uh just as like a starting point.
• 8:45
  Couldn't can be this kind of feeling, this kind of vibe for for Nightwatch.
• 8:51
  And we ran with it.
• 8:52
  And it's just like
• 8:53
  We started designing screens like really quickly and implementing that as as fast as I could design them.
• 9:01
  They're kind of being implemented at the same time.
• 9:03
  So that first six months of of Nightwatch, which was like July 2024, I think.
• 9:09
  Okay.
• 9:09
  until the release.
• 9:11
  but yeah, that really just came together quickly.
• 9:14
  It was obviously because we'd worked together for a number of years before, it was very familiar.
• 9:21
  Like
• 9:22
  We we knew the team, we knew our strengths, we knew our weaknesses.
• 9:25
  We just kind of clicked and really ran with it.
• 9:27
  So Yeah.
• 9:29
  Yeah.
• 9:29
  And so those first days you didn't have PM, right?
• 9:31
  So you were just been told, here's a whole bunch of data tables, here's dark and hacky.
• 9:35
  Who was actually defining, you know, the user journeys in the UX and you know uh because I assume you weren't just doing UI at this point, right?
• 9:43
  You're probably doing broader stuff.
• 9:45
  So like who was defining what and where did you fit into that kind of workflow?
• 9:50
  So s Phil and I were still running the studio.
• 9:52
  So I got to lean on him a lot, even though he wasn't officially on the project.
• 9:57
  Got it.
• 9:57
  And yeah, a lot of it was kind of pre-thought by Jess and Tim of just like what this should be.
• 10:04
  And of course, Taylor as well.
• 10:06
  And yeah, we we really just found the strengths in that and tried to magnify it.
• 10:11
  It's just like, okay, how do we kind of cut down a lot of the the noise in the system?
• 10:15
  Because observability
• 10:17
  is that is trying to like find a signal in a whole bunch of noise.
• 10:21
  So yeah, a lot of it was kind of pre thought, pre chewed, and that made it really easy to kind of go that next stage and that next level with it straight away.
• 10:29
  Yeah.
• 10:29
  Okay.
• 10:30
  That makes sense.
• 10:31
  I want to talk about your kind of process as a designer and then we'll move on to like what you did then versus what you're working on now.
• 10:37
  Do you have a tool that you love to use more than anybody else?
• 10:39
  Do you have any processes as a designer that you think are any different than, you know, that that that are unique to you or kind of like what's your workflow when you go from
• 10:47
  I've been told dark and hacky by the boss and I've some developers have given me some some HTML tables through to the final design?
• 10:56
  Yep.
• 10:56
  There's really a few different methodologies that I kind of like to approach.
• 11:02
  And this is only after like years and years of maturing what is product and what is design.
• 11:07
  Yeah.
• 11:08
  so there's there's design thinking itself.
• 11:10
  So we kind of look at macro, micro uh lenses over the product is like overall, what's the user experience, what's the u user journey versus what's a button next to an input?
• 11:22
  Like that's kind of
• 11:24
  Super, super granular.
• 11:25
  But yeah, with the design thinking, you go through the like the viability of it.
• 11:30
  And this is what we do as the the product team.
• 11:33
  So can we make money off it?
• 11:36
  You know, is it cheap to run?
• 11:37
  Are we able to make the books, you know, balance by creating this product or creating this feature?
• 11:44
  There's the desirability, which is what we in design probably work the most in.
• 11:48
  It's just like, can we make this compelling?
• 11:50
  Can we make this valuable to a user that they're happy to spend?
• 11:54
  X amount of dollars on it.
• 11:56
  And then like feasibility.
• 11:58
  And that's where we work with engineering.
• 11:59
  It's like, okay, we've got this big grand scheme of ideas and and kind of direction to take.
• 12:06
  Can you do it?
• 12:07
  What do we need to change on our side?
• 12:09
  So it makes it easier on your side.
• 12:11
  And yeah, I think that's a lot of the work that we do on the product team.
• 12:17
  And then yeah, there's all the human-centric kind of approaches as well.
• 12:20
  It's just like, how do we build?
• 12:23
  solutions that have empathy kind of baked in.
• 12:26
  So the the newest user is comfortable moving through a system like cloud versus the most experienced, you know, DevOps can move through the system.
• 12:35
  Maybe at a different plane, at a different level, but like they both get the same outcome.
• 12:39
  And that's kind of what we're trying to do a lot of the way through.
• 12:42
  So
• 12:43
  Okay, so what informed you?
• 12:45
  Because again, like I said, like there's many designers who are very excellent and talented div designers who would have just talked my ear off about Figma, who would have
• 12:52
  talked about design systems, who would have talked about, you know, and you, you know, within your first hundred words were like empathy and user journeys and all that kind of
• 13:01
  stuff.
• 13:01
  So what informs that being the way you think about design versus, you know, practical implementation details and gradient maps and stuff like that.
• 13:10
  You know, like what's what what's the source of that?
• 13:13
  Probably a lot of failures and a lot of mistakes along the way until the point of just like I think so I approached like systems thinking as a way for me to fix a lot of my kind
• 13:25
  of flaws in design.
• 13:26
  It's like, how do I fix something bigger than just the screen that I'm looking at?
• 13:30
  And how do I think about the user when I'm sitting here trying to create a solution?
• 13:35
  So I kind of I was drawn to systems thinking and like, okay, how do I
• 13:40
  take ten steps back and and think about the whole picture.
• 13:44
  And instead of thinking of things in parts, I think about it as a whole product.
• 13:47
  How does everything work together?
• 13:49
  Yeah, I kind of dove deep into that and deep into a few different approaches of just how to think about problems themselves.
• 13:56
  And they're not magic and they're not perfect.
• 13:59
  Like these tools are there just to guide you.
• 14:01
  And any guide is to try and get you to some endpoint, but you will trip and fail along the way.
• 14:07
  But it it's better to have guide rails, I think in
• 14:10
  Mm-hmm.
• 14:10
  The way that we approach software.
• 14:12
  Um, so we can bounce back quickly.
• 14:14
  So I still I mean, I love to get into data as well.
• 14:18
  So
• 14:19
  Yeah, talking about that seems like that might be a natural transition because a lot of people whose whose work in their particular career is really targeted on on individual
• 14:29
  contribution.
• 14:30
  That is is most common when the whole thing is about what I am building and what I'm delivering.
• 14:34
  But everything you just said sounds like something that makes a transition to leadership more natural.
• 14:39
  But I don't want to project that on you.
• 14:41
  Did you find that that was something that happened before you stepped into leadership?
• 14:46
  Or is it something happened after or did they happen together?
• 14:49
  Because obviously, like your journey at at Laravel has been one, but you were already leading, you know, agency work for years prior to that.
• 14:56
  So like where where what was the timeline of the two?
• 14:59
  Growing as an agency leader, growing as a leader in design spaces, starting to look at design is less just kind of like pixels on paper and also systems and people and all kind
• 15:07
  stuff.
• 15:08
  I think it kind of happened at the medical company.
• 15:09
  So I was head of design there, and Phil was like head of engineering.
• 15:13
  And we had to pretty much pitch, we're pitching to fairly large medical companies, as well as like the NHS.
• 15:21
  And we you can't pitch a product based on how it looks and you know how you interact with it.
• 15:28
  You have to pitch it on the underlying currents of what you're trying to solve.
• 15:32
  So we were kind of drawn to all of that and trained as well.
• 15:37
  In how to think about the the bigger problem and the bigger solution.
• 15:42
  So we could actually have those conversations with fairly large bodies.
• 15:45
  So that kind of came naturally then to the agency when we're talking to clients who are either being burnt by another software company or burnt by the industry itself and would
• 15:57
  come in and try and say, Hey, let's change the lens on this.
• 16:00
  Like let's think about it from a different angle.
• 16:03
  The solution is good, but the execution might be wrong, or the execution is good, but the timing was wrong.
• 16:09
  And we try and piece it all back together.
• 16:10
  And again, you can't do that just with pixels on a screen.
• 16:15
  They've seen that they've kind of they can appreciate good design, but what they're looking for is vision and direction.
• 16:22
  And those kind of conversations have far deeper kind of contextual meaning when you when you want to chat with people.
• 16:30
  Like you have to go deep.
• 16:33
  Okay.
• 16:33
  That makes a ton of sense.
• 16:34
  So talking about your journey, let's talk a little bit about your journey from joining Laravel initially to work on Nightwatch through to where you are today.
• 16:42
  Kind of what what steps have you taken?
• 16:44
  What roles have you had and where have you landed now?
• 16:47
  Yeah, so when we started Nightwatch, that was awe consuming and I was, you know, back into the front end and I was I was as happy as could be like mostly breaking things, but like
• 16:57
  building screens and like this is exactly how that animation should be.
• 17:01
  I'm gonna spend a day executing that because that's
• 17:05
  Are you working in like Framer and React at this point, or are you purely working the design side right now?
• 17:10
  At that point?
• 17:10
  was that was all Figma and React.
• 17:14
  So we'd done a little bit of React before.
• 17:15
  I think almost everyone in View was like previously oh sorry, everyone in Larva was previously in View.
• 17:21
  Yes.
• 17:21
  so got to kind of skill up in in React at the same time.
• 17:25
  Then we got to a point where like Nightwatch was up and running.
• 17:30
  And I was saying, like, okay, now what?
• 17:33
  I can work on some new features, but you know, the dev side of things, um, that's gonna continue on its direction as well.
• 17:40
  And I started working on the the new Laravel website and a lot of the branding work.
• 17:46
  It's just like, okay, while I'm here, I'm gonna do something that I think is kind of personally hits where the the framework is evolving to and where kind of AI and you know
• 17:58
  agents are kind of leading us towards.
• 18:00
  So I built the the latest Laravel.com website.
• 18:04
  Um and then really from there it was okay, how do we
• 18:12
  use some of that approach and some of that thinking into cloud as well.
• 18:17
  and that's kind of where it's only I guess in the last few months I've started working more deeply in cloud and more kind of deeply across our three products.
• 18:28
  Yeah.
• 18:29
  Where did cause I like I said, I I saw you do some work in open source.
• 18:32
  I know you worked on the like the era page and some other things.
• 18:35
  How deep were you involved in any open source work?
• 18:37
  Was that just a few little touches?
• 18:39
  Yeah, I think we really wanted to do a lot of I guess some of the local experience of Laraville.
• 18:47
  so when you're developing on your machine, how do we make that better?
• 18:49
  I mean, we've designed a few concepts that sitting in Figma, but we also got like the exception page.
• 18:55
  It's just like, how do we make that something that's useful?
• 18:58
  Uh, some of the great Twitter comments back is just like I'm purposely making it fail so I can see this page again.
• 19:04
  It's like, okay, that's pretty good.
• 19:07
  I'll I'll take that.
• 19:08
  Love that.
• 19:09
  Working on a few things with the open source team, but they're kind of in development at the moment.
• 19:15
  Okay.
• 19:15
  So we'll hear about them months down the road and we'll be like, Jeremy, I see what you're doing.
• 19:21
  I see what you were not telling us about in the podcast.
• 19:22
  Love that.
• 19:23
  Very cool.
• 19:24
  Okay.
• 19:25
  So at what point was your role officially because I assume that you weren't product design lead when you first joined.
• 19:31
  So when did that transition happen?
• 19:33
  Or tell me if I'm wrong, and that's actually was your role on day one?
• 19:36
  I think it was kind of towards the end of last year it started to evolve.
• 19:40
  And then I guess over the last four months it's been officially like let's really go hard on this.
• 19:46
  So Okay.
• 19:47
  All right, that makes sense.
• 19:48
  And that's our natural transitions.
• 19:50
  We'll pause to thank our next set of sponsors.
• 19:53
  Laracon AU returns November 4th to 6th in Brisbane with deeper learning, practical insights, and ideas that will stretch how you think about building with Laravel.
• 20:01
  Get your tickets now at Laracon.au and come hang out with me and Jeremy, because we're both going to be there.
• 20:08
  Okay, so we have kind of caught up to today.
• 20:10
  We're at the point where you are the product design lead across those different three different products.
• 20:14
  One of the things I want to ask is
• 20:16
  how much of your job is design, like on the ground?
• 20:19
  How much of your job is managing people?
• 20:21
  And how much of your job is leading kind of design efforts across the products?
• 20:26
  So, you know, I'm I'm I guess those are like kind of three spaces.
• 20:28
  One of those like individual contributor work, one of those managing people, and one of them is like leading individual contributor work from a design perspective, but more
• 20:35
  leaderly.
• 20:35
  Like where are you?
• 20:36
  How much are you doing of each of those?
• 20:39
  So my kind of scope is really within the design direction.
• 20:45
  And so I'm working like deeply in the the design systems.
• 20:48
  Just like, how do we make sure it's something that can scale?
• 20:51
  And by that I mean like it's quick to make designs, it's quick to make evolutionary changes to our systems.
• 20:57
  The people management side.
• 20:59
  So I kind of share this role with Jason Beggs as well.
• 21:01
  Okay.
• 21:02
  So he takes care of people management.
• 21:05
  And takes care of a lot of the UX quality of like the execution that users get to see.
• 21:10
  Yeah.
• 21:11
  And kind of between the the two of us, we share a vision of like how do we move forward as Laravel with design attached to everything that we do.
• 21:22
  Yeah.
• 21:23
  So that's that's really interesting.
• 21:25
  And I guess we've got now a dedicated product team, um, which is led by Joe Dixon.
• 21:33
  And
• 21:34
  That's the first time I think within Laravel, products always been there, design's always been there, but it's never been like a pillar and a discipline that stands outside of
• 21:43
  engineering.
• 21:44
  So now that we've got that, like it's a extremely strong voice and it's kind of a product led evolution and solution company, which is really, really great, especially for the
• 21:55
  design team to kind of have this place to explore and have our freedom of our own processes, our own disciplines.
• 22:03
  So yeah.
• 22:03
  And that's very fun.
• 22:04
  I think I talked to Jason on the podcast right before he was moving to the design team.
• 22:09
  It's an untraditional arrangement having, you know, you and Jason kind of co leading there, but it also if for anybody who knows the two of you, it's also brilliant.
• 22:18
  Who set that up?
• 22:19
  Was that a Joe thing?
• 22:21
  I I think so, yeah.
• 22:22
  So between Joe and leadership is just like how do we have the best of all worlds together?
• 22:28
  Love that.
• 22:29
  That's so good.
• 22:30
  Okay.
• 22:30
  So what does your day to day look like right now?
• 22:34
  Obviously, you are working on these broader systems, but also you also have to deliver on deadlines for products and stuff.
• 22:39
  How much thinking are you doing?
• 22:40
  Do you sit in Figma at all still?
• 22:42
  Like what are you actually doing every day?
• 22:45
  So I I guess I'm still like an individual contributor.
• 22:47
  Um kind of are still either pushing code or pushing pixels.
• 22:54
  And so I've got like my own kind of projects or my own kind of tasks that everyone else has.
• 23:01
  Um I think about half and half is like I get to step out for half of it.
• 23:05
  Okay.
• 23:06
  Look, something's not right here.
• 23:07
  It's this system's or this kind of loop is making a bit of noise.
• 23:12
  Can I step out for a day and like fix that for everyone?
• 23:15
  And then jump back in.
• 23:17
  Um so yeah, I get a really good mix of high level thinking.
• 23:22
  And then I mean, I still love it day to day, just moving pixels around a screen until it looks right.
• 23:28
  So Yes.
• 23:29
  It's good.
• 23:30
  And that's what I imagine.
• 23:31
  You know, you strike me as someone who loves the big thinking and also loves getting your fingers dirty, which you you you mentioned.
• 23:36
  You're like, you're, hey, when I got back and night watched it, I was able to just do the thing.
• 23:40
  Um, and as someone who's kind of gone through that in my own journey, I I I definitely recognize that leadership without the opportunity to practice sometimes you miss out on,
• 23:48
  like you said, those little frictions of like, wait a minute, this system's not working quite right.
• 23:51
  So that's that's really fun.
• 23:53
  Um I know that.
• 23:54
  Usually when I talk to people who are involved in anything product at Larival, the answer of what you're working on right now is uh you'll see in a couple of months, is there
• 24:02
  anything you're working on right now that you can tell us about?
• 24:05
  There is kind of a lot more that we're doing around the metrics in cloud and how we present that and some of the the learnings that we've got through Nightwatch.
• 24:14
  So that'll start to evolve and and take place.
• 24:18
  The latest bit of work was kind of around the managed queues.
• 24:26
  Um keep watching what's happening there.
• 24:29
  every kind of system is now evolving and kind of meeting a a bar.
• 24:34
  so everything is moving at the same time.
• 24:38
  There's a lot that might be shown out.
• 24:41
  uh
• 24:44
  you four weeks before Laracon, you're gonna not be able to tell me much.
• 24:48
  Yeah.
• 24:48
  Yeah.
• 24:49
  Okay.
• 24:49
  So obviously quite a bit of the future for you is tied up in the things we just talked about.
• 24:54
  But as you look six, twelve months out in your role at at the company and in the community and the organization, how do you feel about like what are you excited about?
• 25:03
  What are you looking forward to?
• 25:04
  What the changes at at Laravel?
• 25:06
  What are the changes in the ecosystem and in the environment that you're like, this is something that's you know got my energy and my attention.
• 25:12
  So I think I was deeply captivated around AI and kind of agents in the system and how we represent them.
• 25:20
  So that's evolving, I guess, even like what Taylor did with just the the Laravel SDK.
• 25:26
  It's like that is now a first class citizen of the framework.
• 25:30
  Um so it's how do we support that and how do we encourage and grow that to the point where newcomers choose Laravel because it is the most viable solution for
• 25:42
  AI engineering effectively.
• 25:44
  So yeah, over the next few months, I'm sure that's going to keep evolving and growing, both in Laravel and in, you know, AI, the marketplace itself.
• 25:54
  So yeah, we'll keep thinking and we'll keep kind of making sure that we're the the best option and the best choice for for the rest of
• 26:01
  That makes sense.
• 26:02
  I mean, you mentioned kind of like working on the layer of a landing page and thinking about marketing and branding.
• 26:07
  How much of your, you know, whether or not you're actually doing it in a day to day, if you had your choice, how much of your job would be communication and marketing, and how
• 26:16
  much would it be user experience and user interface?
• 26:20
  Again, like to split that in half.
• 26:22
  Okay.
• 26:22
  The the two play together so well.
• 26:25
  So I guess one of the initiatives that we've got within the product team is like how do we stop the seesaw of like products ahead of marketing and the the communication?
• 26:34
  And then it can get ahead of the products because you know, we want to talk about new things and we want to kind of reassure people that we've got a direction and a vision for
• 26:42
  where we're taking both cloud and and Laravel.
• 26:44
  So yeah, it's kind of making sure that those two things happen together and it's like this.
• 26:50
  coexistence that feels natural.
• 26:52
  So yeah, I I really like playing in both spaces and kind of I guess communicating what we're doing in a really clear way.
• 27:00
  Okay.
• 27:01
  Well that makes sense.
• 27:02
  And it makes sense that you're doing it for people and then you want people to know about what you're doing and you want other people to know that they should want to know what
• 27:08
  you're big doing.
• 27:08
  It's all kind of a big part of part of the whole thing.
• 27:11
  Okay.
• 27:12
  So I'm about to wrap on our time talking about you at Laravel.
• 27:16
  But before I ask you questions about a few completely unrelated things, is there anything else about your job at Laravel, your journey to come here, or anything else like that you
• 27:22
  wanted to make sure we got a chance to talk about?
• 27:25
  Only that if you can come to Laracon US in Boston, but also AU.
• 27:32
  We've got a a magic spot in Brisbane and we love international guests.
• 27:37
  We love national like we love Australian guests as well.
• 27:40
  But there's something special when someone's traveled so far.
• 27:43
  Cause I think the flight, my flight to Boston is like twenty something hours.
• 27:49
  So it's a decision that you have to make.
• 27:52
  And yeah, when we get people coming to Brisbane, it's something special.
• 27:55
  They've they've traveled a long way.
• 27:56
  It's
• 27:56
  Special for so many reasons.
• 27:59
  It's special because the Australian Larville community is the most welcoming Larville community I ever visited, and that says a lot.
• 28:06
  It's special because the conference itself is designed very intentionally to be a space where people can feel welcome and get to know each other and learn and whatever.
• 28:15
  It's special because Brisbane's gorgeous.
• 28:18
  Like Imani and I visited Brisbane and we're like, are we going home or are we just staying here?
• 28:23
  And I'm I'm sure it's gonna happen again this year because
• 28:26
  Yeah, it's worth that crazy trip because my gosh.
• 28:29
  So thank you for mentioning that because it's it's an incredible conference.
• 28:33
  of course Michael Durand does one of my favorite human beings in the entire world.
• 28:36
  So that didn't doesn't hurt either.
• 28:37
  So yeah, hundred percent with you.
• 28:38
  Definitely come to both.
• 28:41
  Okay.
• 28:42
  So I've got, you know, one of the things I do ahead of everybody's interviews is I kind of like look up, you know, is there so there's times where I'm really active in social media
• 28:51
  and times where I just completely disappear.
• 28:53
  And so I'm just like, you know, I know these people, but I might have missed entire periods of their lives.
• 28:58
  So I've got your Twitter profile up and I've got useMods.com and useClassy.com.
• 29:02
  And I need you to talk about at least classy because I haven't heard people talking about classy and it's beautiful.
• 29:10
  And I so please tell the people what is it, what does it do, and what kind of brought about your interest in it.
• 29:16
  So useClassy allows you to write multiple class lines and it will collapse them all and make it a so when v kind of compiles, it'll make it a single class.
• 29:29
  So you can kind of separate your your media utility.
• 29:34
  So you can have a separate line for all your
• 29:38
  I guess your your smalls and your larges and your dark themes, all on separate lines.
• 29:43
  So you can classify it and sort it separately to each other.
• 29:47
  And yeah, it kind of came about just because in my IDE it was one big long line and I had to horizontally scroll so far just to make sense of anything.
• 29:58
  Yeah.
• 29:59
  And then we we got into the the hacky pattern of like in React, you can separate that on d in it within an object.
• 30:06
  Right.
• 30:06
  You can separate it.
• 30:08
  And that felt a bit funny to me because I couldn't do the same in my Blade template and I couldn't do the same in my view template.
• 30:15
  so yeah, I just sat there when I should have been on holidays, I think, a few nights and just went, okay, I'm gonna learn a little bit about VET, because I hadn't played like
• 30:26
  deeply within it.
• 30:28
  And yeah, came out with after a weekend with a little plugin, a little VT plugin that does it all for you.
• 30:35
  it so much.
• 30:37
  I love it so much.
• 30:38
  I don't really use Vue and React very much because if the CEO of the company is programming, it's a hacky side project.
• 30:44
  It's not client work, right?
• 30:45
  So I'm always doing Blade or LiveWire, something that just allows me to get the thing out quickly.
• 30:50
  So my team uses Vue and React every day, and I don't get to.
• 30:52
  And I'm like, uh, but I want to use this because it's and for those, you know, like first of all, just U S E C L A S S Y dot com, useClassy dot com.
• 31:02
  Check it out.
• 31:02
  It's a lot easier to see it than for us to tell you.
• 31:05
  But I will just say like the simplest thing is if I were in view and I would say class equals P six, and then as a new property, I would say class colon hover equals P dash
• 31:16
  eight.
• 31:17
  That's it.
• 31:17
  And it's so much, especially the example on the website is so, so, so good to start seeing like, yeah, if you have the same hover or large or group hover, whatever, apply especially
• 31:27
  with the more complicated ones where it's braces and ampersands, whatever, and they're being applied to multiples, it's so much clearer to group them like this.
• 31:34
  And this is a really fun way of seeing that this is not just pixel push pushing, right?
• 31:39
  This is this is thinking about people, humans' interactions with the code they're doing and thinking about affordances and it can be so anyway.
• 31:46
  Freaking love this.
• 31:48
  Thank you for building this.
• 31:48
  I've never used it.
• 31:49
  I hope I get the chance to actually write a few React projects one day again.
• 31:53
  So very, very cool.
• 31:55
  Are there any other side projects you had that you want to share?
• 31:57
  I know you have, you know, the use mods.
• 32:00
  But do you want to talk about that?
• 32:01
  Are there any other side projects that are kind of on your mind or something you haven't published yet or something you're tinking around with that you want to talk about?
• 32:07
  There is one.
• 32:08
  So DSLinter.com.
• 32:10
  It's very much in an alpha stage, but it is working.
• 32:14
  And it's to lint your code base for design systems.
• 32:17
  So it'll tell you everywhere that you've incorrectly used the design system or you've injected your own hex values that break tokens.
• 32:27
  And it will give you accessibility scores and maintain not maintainability scores and all sorts of things over effectively your design system and your tokens.
• 32:38
  So let's talk design systems and tokens.
• 32:40
  If I were to build a brand new project tomorrow and Jeremy Butler was the design leader of my project, what things would you say, this is a organizational tool, you should use
• 32:50
  storybook, you should use this, that, or the other.
• 32:52
  What would you be like?
• 32:53
  Everybody should be using this when they're building a design forward, you know, user centric layer well application.
• 33:00
  Yeah.
• 33:00
  So governance is a big thing around design systems.
• 33:03
  And it's like how do you manage and maintain it long term?
• 33:07
  Because the the natural thing for any defined system is to bend and break and bubble out.
• 33:13
  It's so you how do you bring it back in?
• 33:15
  And how do you accept that things do progress faster than what the the rules and the tokens can accomplish?
• 33:22
  Uh so that's what this system kind of does.
• 33:24
  It gives you that holistic score and understanding of what's happening.
• 33:29
  I
• 33:30
  Haven't kind of fully completed it yet, but it can replace parts of storybook if you've written it within TypeScript.
• 33:36
  I can pull out the types and I can say, I know what a button is and I know all the props for a button.
• 33:41
  Here's a preview of the button.
• 33:43
  It does get more complex the more depth I guess those components go into.
• 33:47
  And then the basic rule for for me for design systems is how to keep it as primitive as possible.
• 33:54
  As soon as it becomes business logic, you move it into the actual design itself.
• 33:59
  It doesn't belong in the design system.
• 34:01
  The design system is there to establish like the baseline.
• 34:06
  What is this product?
• 34:08
  What is the experience of this product?
• 34:10
  And yeah, trying to keep it as maintainable and as small as possible.
• 34:15
  I love that.
• 34:15
  This is the stupidest thing I'm gonna say all day.
• 34:17
  I'm sitting on DSLinter.com as you're talking, and up at the top, the logo allows you to hover over something and it shows the the little marching ants for anything you're
• 34:26
  hovering.
• 34:26
  So first of all, I'm just having a great time with that.
• 34:29
  But second of all, I keep making the little circle and I keep finding where the circle of my my magnifying glass or whatever cursor overlaps with the circles that you've built in
• 34:39
  there.
• 34:39
  And it's just so pleasing.
• 34:40
  And I'm like, You're such a freaking designer.
• 34:42
  Like of of course.
• 34:43
  Of course it perfectly slots in here in the way that is itching the my brain in a certain way.
• 34:48
  So this is so fun.
• 34:50
  that's really, really cool.
• 34:51
  if somebody heard you say everything you've said for the last five minutes and they're like, Jeremy, what's a design system?
• 34:57
  I can't ask you to teach us all about that in the next five minutes.
• 35:00
  What would be a good place for somebody to go look if that's a thing they're interested in learning more about?
• 35:05
  So there's there's a lot of good design systems to to work from.
• 35:09
  You've got Ratex and you've got Shad C and you've got all these kind of component libraries.
• 35:15
  The design system itself is what's lying underneath.
• 35:18
  So the first place I'd probably send people to uh is let me find the website so I get it right, is lawsofux.com.
• 35:29
  Okay.
• 35:29
  Because you can create great components, but you need to understand like the
• 35:33
  fundamentals and the principles behind, I guess, good design and good usability before you get into pure just pixels and presentation.
• 35:46
  And I think this is the same lesson for people designing with AI as well.
• 35:50
  It's just like you can absolutely design great systems and you know great UIs with AI.
• 35:58
  But in the same way that you need to know the fundamentals of development and engineering, you need to know the
• 36:03
  fundamentals of good design as well.
• 36:07
  And that'll help you further than I guess any great prompt or skill that you can import is just like uh establishing a good sense of taste and a good sense of what's right and
• 36:18
  wrong.
• 36:21
  And yeah, there's great checklists out there for design systems as well.
• 36:24
  Go find them.
• 36:26
  Um they'll give you a dot point of what makes a good button and what you need to remember about making a good button.
• 36:34
  Looks like Laws of UX has the website, but it also has a book and a poster.
• 36:39
  Uh have you heard anything about this book?
• 36:42
  Is it worth considering if someone wants to dive deeper?
• 36:44
  Or are you like, let's just start with the website and go from there?
• 36:46
  So they do have a book with O'Reilly on Amazon as well.
• 36:50
  And I desperately want to get some of the posters around my office.
• 36:53
  Um, but it is a kind of a reflection of the website.
• 36:56
  So the website's the best place to to start understanding and learning.
• 37:02
  Amazing.
• 37:02
  I love when I learn things on this podcast.
• 37:03
  This is wonderful.
• 37:04
  Yep.
• 37:05
  Thank you for that.
• 37:06
  Okay.
• 37:06
  Okay.
• 37:06
  Since we're coming up to time, I did ask you if there's anything else you want to talk about with your Laravel journey.
• 37:11
  Was there anything else other that's going on in the world that you just wanted a moment to talk about?
• 37:15
  I know that you'd mentioned AI a little bit.
• 37:16
  Is there anything in your brain that you're like, you know what?
• 37:18
  I have a platform, I've got a microphone, you must listen to me, or are you feeling like you got everything out?
• 37:24
  Definitely around my journey, I think I've got everything out.
• 37:28
  I'd only kind of say like be curious and kind of learn some more frameworks that sit outside your day-to-day work.
• 37:36
  Um, that's really kind of accelerated my problem solving abilities with like system syncing and just like keeping laws of UX there.
• 37:46
  And the other tab I've got is untools.co.
• 37:51
  Which again is just frameworks for uh I I guess breaking through problems.
• 37:57
  If you've got a barrier in front of you, there's usually some guide rails to help you push through it.
• 38:03
  And it's much better than sitting in a room trying to think through it yourself.
• 38:07
  So yeah, they're not magic.
• 38:09
  They're not intended to be an absolute guarantee to to solve a problem.
• 38:15
  But you'll progress two or three steps forward, and that's usually enough to unlock enough to.
• 38:21
  Create a solution.
• 38:21
  So
• 38:22
  That's great.
• 38:23
  you say the name of that domain again?
• 38:24
  Untools.co.
• 38:28
  Okay.
• 38:29
  Tools for better thinking.
• 38:31
  my gosh.
• 38:32
  I have so much learn to learn.
• 38:33
  I mean, the third tool here is the Eisenhower matrix, which is the urgent versus important.
• 38:37
  And I reference it at least once a week in business settings.
• 38:40
  So I'm like, yep, I clearly love this.
• 38:42
  So wow.
• 38:43
  Just learning the whole time.
• 38:46
  Jeremy Butler, you're great.
• 38:50
  Glad I can help.
• 38:52
  so if other people are like me just aghast with how much they're learning in this podcast episode, how do they keep up with you?
• 38:58
  Um I'm on Twitter and I need to be more active on Twitter.
• 39:02
  Um so it's my handle's horrible.
• 39:07
  So apologies, but it's J R M Y B T L R.
• 39:13
  So I've just taken I've taken all the vowels out.
• 39:16
  So
• 39:17
  funny because I often have ways that I silly silly pronounce people's Twitter handles and with yours I'm just it's it's always just Jimbutl Jalimbutol I'm like tumblers, you know
• 39:30
  there's always something in there.
• 39:31
  So yes.
• 39:32
  Well as always we'll make sure we link that in the show notes.
• 39:35
  We'll link all your sites and everything like that um to make sure it's all in the show notes.
• 39:38
  So my friend, it was so good to spend time with you.
• 39:41
  It was so good to learn from you once again.
• 39:44
  And thank you for your time, especially because I know the you know, you woke up early in the morning to to record with me and I appreciate that a lot.
• 39:50
  No, thank you so much.
• 39:52
  All right, for the rest of you, thank you for hanging out.
• 39:53
  We'll see you all next time.