1
00:00:01,080 --> 00:00:03,000
Speaker 1: How'd you like to listen to dot net rocks with

2
00:00:03,040 --> 00:00:07,879
no ads? Easy? Become a patron for just five dollars

3
00:00:07,919 --> 00:00:10,800
a month. You get access to a private RSS feed

4
00:00:10,839 --> 00:00:14,240
where all the shows have no ads. Twenty dollars a month,

5
00:00:14,279 --> 00:00:16,879
we'll get you that and a special dot net Rocks

6
00:00:16,960 --> 00:00:21,000
patron mug. Sign up now at patreon dot dot NetRocks

7
00:00:21,120 --> 00:00:36,320
dot com. Hey, welcome back to dot net rocks. I'm

8
00:00:36,399 --> 00:00:39,679
Carl Franklin, an amateur Campbell. We're here for the nineteen

9
00:00:39,759 --> 00:00:44,159
hundredth and sixty fifth time. Well you are leave it okay,

10
00:00:44,320 --> 00:00:47,280
fifty fifth free whatever and something like that.

11
00:00:47,679 --> 00:00:49,079
Speaker 2: New guy, I'm the new guy.

12
00:00:49,520 --> 00:00:53,079
Speaker 1: Yeah, okay, so uh yeah, we've been doing this a

13
00:00:53,079 --> 00:00:55,920
long long time. We are the OG podcast, not just

14
00:00:55,960 --> 00:00:59,280
the OG Developer podcast, not just the OG dot net podcast,

15
00:00:59,320 --> 00:01:01,840
but probably the longest running podcast that ever was.

16
00:01:02,719 --> 00:01:05,439
Speaker 2: I can get some older NPR shows, but they came

17
00:01:05,480 --> 00:01:08,599
to podcasting later. Yeah, they were on the radio first

18
00:01:08,640 --> 00:01:10,439
and then they turned them into podcasts, but we were

19
00:01:10,480 --> 00:01:13,519
doing it before they were, so the word podcast existing.

20
00:01:13,599 --> 00:01:16,079
Speaker 1: Yeah, that's right. I don't know. Every once in a while,

21
00:01:16,120 --> 00:01:18,640
I just feel like reminding our listeners to that you're

22
00:01:18,680 --> 00:01:22,920
listening to the og podcast. There might be some remnants,

23
00:01:23,000 --> 00:01:24,680
I don't know, but I don't see anything out there.

24
00:01:24,680 --> 00:01:28,879
All right, so let's start this show off really good,

25
00:01:29,200 --> 00:01:32,959
really well, really goodly with better no framework.

26
00:01:40,680 --> 00:01:41,560
Speaker 2: All right, man, what do you got?

27
00:01:41,680 --> 00:01:45,040
Speaker 1: I went looking for trending GitHub repos and yeah, always

28
00:01:45,040 --> 00:01:46,840
a good place to go. Yeah. So this one was,

29
00:01:46,959 --> 00:01:49,280
I don't know, a little far down in the list,

30
00:01:49,359 --> 00:01:53,159
but it was still in the top twenty. I think awesome.

31
00:01:53,400 --> 00:02:00,400
Claude code. Now, Claude, of course, is a developed meant.

32
00:02:00,719 --> 00:02:04,840
I think it's really a development environment for doing AI,

33
00:02:05,079 --> 00:02:11,639
using AI agents to work with code. And this is

34
00:02:11,800 --> 00:02:16,120
like most awesome list. It's a curated list of tooling

35
00:02:16,280 --> 00:02:21,479
and hooks and commands and Claude m D files both

36
00:02:22,039 --> 00:02:27,199
language specific, end domain specific clawed MD files, scaffolding and

37
00:02:27,360 --> 00:02:32,400
MCP stuff. Like, there's a lot here. Claude is sort

38
00:02:32,439 --> 00:02:35,120
of the hotness, the new hotness in.

39
00:02:35,159 --> 00:02:39,159
Speaker 2: Terms of tropics of the approach to exactly use it

40
00:02:39,199 --> 00:02:41,800
through cursor or you know, whatever tool you want.

41
00:02:41,759 --> 00:02:45,759
Speaker 1: Yep, yep, yep. So there you go. You know, just

42
00:02:46,800 --> 00:02:49,439
I'm just coming clean here. I haven't used it. This

43
00:02:49,599 --> 00:02:52,360
is not my wheelhouse, but I know it's very popular,

44
00:02:52,400 --> 00:02:53,879
and I know that there's a lot of people even

45
00:02:53,919 --> 00:02:57,719
in ft next that you know, use it, use claude

46
00:02:58,520 --> 00:03:04,599
and use entropic and so there you go, awesome claude code, cool, know,

47
00:03:04,840 --> 00:03:07,000
learn it, love it, and let us know, you know,

48
00:03:07,039 --> 00:03:09,599
if you're using this stuff and what you think of this.

49
00:03:10,000 --> 00:03:12,280
Obviously a lot of people think of it, highly of

50
00:03:12,319 --> 00:03:16,120
it because it's trending on GitHub. But there you have it.

51
00:03:16,599 --> 00:03:18,159
So who's talking to us, Richard?

52
00:03:18,240 --> 00:03:20,439
Speaker 2: Well, knowing we're going out to the design path, I

53
00:03:20,479 --> 00:03:22,840
thought I'd dip into the archive a little bit to

54
00:03:23,080 --> 00:03:25,000
one of the Billy Hollis shows, which you've done a

55
00:03:25,000 --> 00:03:27,639
bunch of and just recently did another one, This is

56
00:03:27,879 --> 00:03:31,080
seventeen sixty six, which we did back in November twenty one,

57
00:03:31,639 --> 00:03:37,280
talking about desktop development specifically. Nice and long time listener

58
00:03:38,199 --> 00:03:40,319
Rod Falinge had this great comments a few years ago,

59
00:03:40,360 --> 00:03:43,159
but he said, oh right, yeah, another great episode. I

60
00:03:43,159 --> 00:03:45,800
always loved listening to what Billy has to say. We

61
00:03:45,879 --> 00:03:48,319
all do. There were a couple of things you said,

62
00:03:48,319 --> 00:03:50,240
Billy which really stood out for me. The first was

63
00:03:50,280 --> 00:03:56,439
the idea of evil by design. Wow, I've witnessed that

64
00:03:56,560 --> 00:04:00,240
in action very often over the course of the last

65
00:04:00,280 --> 00:04:03,280
five years or so, we've had to design some truly

66
00:04:03,439 --> 00:04:06,240
awful looking apps. I think I've made seven or eight

67
00:04:06,280 --> 00:04:06,639
of them.

68
00:04:06,800 --> 00:04:07,159
Speaker 1: Wow.

69
00:04:07,360 --> 00:04:09,400
Speaker 2: Of those appsol onely one is in use today. That's

70
00:04:09,439 --> 00:04:11,960
because the CIO requires people to use it.

71
00:04:12,000 --> 00:04:12,560
Speaker 1: Good Lord, I.

72
00:04:12,560 --> 00:04:14,719
Speaker 2: Don't think the person who designed this had any evil

73
00:04:14,719 --> 00:04:16,720
intent when he designed it. I just don't think he

74
00:04:16,759 --> 00:04:19,639
knows how to make a good UIU as not evil

75
00:04:19,920 --> 00:04:24,519
just yeah, you know, because they've got that sort of

76
00:04:24,560 --> 00:04:27,759
banal evil effect, like not paying attention to this is

77
00:04:27,800 --> 00:04:29,639
in the sense somewhat of an evil act.

78
00:04:29,720 --> 00:04:31,800
Speaker 1: Well, well, Handlen's raisor applies, doesn't it?

79
00:04:32,399 --> 00:04:35,040
Speaker 2: Yeah, do not? Well, they hold you not attribute to me.

80
00:04:35,120 --> 00:04:37,079
I also that what you can be explained by incommondance

81
00:04:37,160 --> 00:04:37,759
is very fair.

82
00:04:37,920 --> 00:04:40,399
Speaker 1: Yeah, so it's not really evil. They just don't know

83
00:04:40,399 --> 00:04:40,839
any better.

84
00:04:41,120 --> 00:04:42,600
Speaker 2: Rod goes on to say, the second thing is the

85
00:04:42,680 --> 00:04:45,639
reduction in people's ATTENTIONSPN. Oh god, it's so true. I

86
00:04:45,720 --> 00:04:48,040
love the phrase you used of people being afraid to

87
00:04:48,040 --> 00:04:51,199
be alone with their own thoughts. I've said the same thing.

88
00:04:51,199 --> 00:04:52,319
Speaker 1: I'm sorry, did you say something?

89
00:04:52,680 --> 00:04:53,560
Speaker 2: Hello? What?

90
00:04:53,560 --> 00:04:58,120
Speaker 1: What? Sorry? Can you say? I was thinking of something else.

91
00:04:58,160 --> 00:04:59,279
I don't know why I'm.

92
00:04:59,120 --> 00:05:01,120
Speaker 2: Pleased with myself that I am not afraid to be

93
00:05:01,160 --> 00:05:03,199
alone with my own thoughts. However, I find that even

94
00:05:03,240 --> 00:05:04,959
when I am alone with my own thoughts, I'm not

95
00:05:05,040 --> 00:05:09,199
alone for very long, especially at home. I believe you

96
00:05:09,279 --> 00:05:11,800
have to be intentional about it. For example, being outside,

97
00:05:11,800 --> 00:05:13,839
I find it much easier to be alone my own thoughts,

98
00:05:13,959 --> 00:05:16,319
especially when hiking. Anyway, I recommend getting away from the

99
00:05:16,360 --> 00:05:18,639
day to day to help we reduce the noise and

100
00:05:18,839 --> 00:05:22,680
just thinking. Yeah, very fair. Yeah. For me, it was

101
00:05:22,720 --> 00:05:24,920
usually walking the dog. Walking a dog was to.

102
00:05:24,920 --> 00:05:28,519
Speaker 1: Get away, right, Well, now you got another puppy, and now.

103
00:05:28,439 --> 00:05:31,240
Speaker 2: I got a dog again. Yeah, we got another dog.

104
00:05:31,240 --> 00:05:32,879
And she's a little tricky to walk so far, but

105
00:05:32,920 --> 00:05:33,920
she's enthusiastic.

106
00:05:34,120 --> 00:05:35,879
Speaker 1: Do you listen to anything while you walk?

107
00:05:36,319 --> 00:05:36,480
Speaker 3: Uh?

108
00:05:37,000 --> 00:05:37,839
Speaker 1: You the dog?

109
00:05:38,279 --> 00:05:42,759
Speaker 2: Usually not when we're hiking in the wilderness because bears. Yeah,

110
00:05:42,879 --> 00:05:45,519
it's usually wise to be aware of what's going on

111
00:05:45,560 --> 00:05:47,839
in the forest or round where we are. We're in

112
00:05:47,879 --> 00:05:50,800
the wilderness here, right, this is a rural area. I

113
00:05:50,839 --> 00:05:54,600
am literally minutes away from Virgin Forest. Zach was your

114
00:05:54,639 --> 00:05:57,360
bare alarm, though, wasn't he? Zach was a bar alarm,

115
00:05:57,519 --> 00:05:59,839
and I could try. I watched Zach and then how

116
00:06:00,199 --> 00:06:02,319
Zach reacted. I knew what was up because he knew

117
00:06:02,360 --> 00:06:06,040
what was up. But Jojo is just a pop She's

118
00:06:06,079 --> 00:06:08,000
six months old, and so I've got to look out

119
00:06:08,000 --> 00:06:08,560
for her for now.

120
00:06:08,759 --> 00:06:14,800
Speaker 1: Jojo is a chicken fried potato wedge where I come from.

121
00:06:15,199 --> 00:06:17,959
Speaker 2: Well that's a not a bad description of this little spas,

122
00:06:18,040 --> 00:06:21,519
so I'm I'll go with that. It's you chicken fried

123
00:06:21,560 --> 00:06:22,439
potato wedge.

124
00:06:22,480 --> 00:06:24,120
Speaker 1: You see.

125
00:06:24,199 --> 00:06:26,160
Speaker 2: Yeah, she's a nutter right now, but you know, six

126
00:06:26,199 --> 00:06:28,480
months old, it's kind of up. It's a little poodle,

127
00:06:28,519 --> 00:06:31,360
a little Bernies, a little Azzie chefern, a little border college.

128
00:06:31,399 --> 00:06:32,519
So she's got a lot going on.

129
00:06:33,879 --> 00:06:34,199
Speaker 1: Rod.

130
00:06:34,759 --> 00:06:36,519
Speaker 2: Great to hear from me again immediately it was a

131
00:06:36,519 --> 00:06:38,399
few years ago. Thanks so much for the great comment.

132
00:06:38,439 --> 00:06:40,319
I'm pretty sure you already got a copy music code

133
00:06:40,319 --> 00:06:41,920
by but if you'd like a copy of music, goobe.

134
00:06:41,959 --> 00:06:43,639
I read a comment on the website at don at

135
00:06:43,720 --> 00:06:45,519
Rocks dot com or on the Facebook, so we publish

136
00:06:45,560 --> 00:06:47,560
every show there, and if you comment there and everybody

137
00:06:47,600 --> 00:06:48,800
on the show, we'll send you a copy of mus

138
00:06:48,879 --> 00:06:49,240
to go buy.

139
00:06:49,399 --> 00:06:51,639
Speaker 1: You can also follow us on all the social media's

140
00:06:51,680 --> 00:06:54,279
and if you send us a DM there or just

141
00:06:54,600 --> 00:06:58,000
you know, public message, sure, and we read it on

142
00:06:58,040 --> 00:06:59,800
the air. We'll also send you a copy of Me

143
00:07:00,279 --> 00:07:03,120
to Code by Music to Code by Still Going Strong

144
00:07:03,160 --> 00:07:06,720
twenty two tracks. You can get them at music toocodey

145
00:07:06,800 --> 00:07:09,160
dot net if you don't feel like writing a comment,

146
00:07:09,720 --> 00:07:12,680
and the collection is available in MP three flack D

147
00:07:12,800 --> 00:07:17,360
wave formats. All right, so before we introduced Diana, we

148
00:07:17,439 --> 00:07:20,680
got to talk about what happened in the year nineteen

149
00:07:20,920 --> 00:07:26,279
sixty five, sixty five sixty five. More civil rights, more

150
00:07:26,439 --> 00:07:29,959
Vietnam War. Yes, it just keeps going on. But now

151
00:07:30,000 --> 00:07:34,800
we have Malcolm X assassinated. We have Bloody Sunday. On

152
00:07:34,879 --> 00:07:39,040
March seventh, Alabama state troopers violently confronted civil rights demonstrators

153
00:07:39,040 --> 00:07:44,279
and Selma Alabama, leading to national outrage and support for

154
00:07:44,360 --> 00:07:48,199
voting rights. This is your America. You know this really happened.

155
00:07:48,639 --> 00:07:51,480
Richard will probably talk You'll probably talk about ed White

156
00:07:51,519 --> 00:07:57,639
and space exploration, but for sure, the Sound of Music premiered. Hey, yeah,

157
00:07:57,759 --> 00:08:01,920
it's a movie about Nazis. Hooray, I know it singing

158
00:08:03,319 --> 00:08:10,199
very strange with Nazis. Nazis, those crazy Nazis. The Muhammad

159
00:08:10,199 --> 00:08:13,120
Ali defeated Sunny liston of course, on May twenty fifth,

160
00:08:13,759 --> 00:08:17,720
the Indo Pakistani War. You know, these guys we're talking

161
00:08:17,720 --> 00:08:21,920
about batteries and sisters, you know that were that separated

162
00:08:21,959 --> 00:08:27,279
over religious differences and cultural differences, and it continues to

163
00:08:27,319 --> 00:08:31,800
this day and it's very sad. West Germany and Israel

164
00:08:32,039 --> 00:08:35,759
established diplomatic relations on May twelfth, marking a significant step

165
00:08:35,759 --> 00:08:39,320
in post World War II relations, and lots and lots

166
00:08:39,360 --> 00:08:43,559
of other things, more Beatlemania, of course, they you know,

167
00:08:43,639 --> 00:08:47,679
they were just the superstars of America at this point.

168
00:08:48,480 --> 00:08:51,919
So Richard, what do you got for space and science

169
00:08:51,960 --> 00:08:53,000
and all that?

170
00:08:53,320 --> 00:08:55,200
Speaker 2: A little more story on the Ed White bit. So

171
00:08:55,240 --> 00:08:58,320
this is about the spacewalks. So the Soviets did it first.

172
00:08:58,399 --> 00:09:01,799
Was alex A Alex Leonov who did the first spacewalk

173
00:09:01,799 --> 00:09:06,799
aboard the Vauxshad two. So five days later, on Geminy four,

174
00:09:07,200 --> 00:09:11,240
Ed White does the second spacewalk. Ever, both Alexi and

175
00:09:11,360 --> 00:09:13,159
ed have exactly the same problem, which is that their

176
00:09:13,200 --> 00:09:16,240
space suits aren't really well designed for spacewalks because nobody

177
00:09:16,240 --> 00:09:18,080
had done it before, and so their suits tend to

178
00:09:18,240 --> 00:09:21,840
expand and stiffen, and so they can't get back in.

179
00:09:21,919 --> 00:09:24,799
The vehicle oops to the point where, at least in

180
00:09:24,840 --> 00:09:27,879
Alexi's case, he punched a hole in his suit to

181
00:09:27,919 --> 00:09:31,639
reduce the pressure enough to get back inside, and Ed White,

182
00:09:31,639 --> 00:09:35,720
who by all accounts was stunningly fit, was utterly exhausted

183
00:09:35,759 --> 00:09:37,440
by the time he could get back into his seat

184
00:09:38,039 --> 00:09:39,480
in the Gementy.

185
00:09:39,080 --> 00:09:42,320
Speaker 1: Four I'm sorry, Ed, I'm afraid I can't do that.

186
00:09:42,679 --> 00:09:46,240
Speaker 2: Yeah, I can't get back in. And then later that year,

187
00:09:46,440 --> 00:09:49,919
the Americans fortially pull ahead in the space race, with

188
00:09:50,080 --> 00:09:55,120
Gemeny seven and Gemeny six A performing the first rendezvous

189
00:09:55,120 --> 00:09:58,679
in space. So only they had two vehicles up, but

190
00:09:58,720 --> 00:10:01,039
they got They were able to maneuve or within less

191
00:10:01,039 --> 00:10:02,879
than a foot of each other. If they'd had docking equipment,

192
00:10:02,919 --> 00:10:04,960
they could have docked together. So that was Borming and

193
00:10:05,039 --> 00:10:08,080
Level in Gementy seven and Sharon Stafford in Geminy six

194
00:10:08,240 --> 00:10:11,279
A and seven at that time would also set the

195
00:10:11,279 --> 00:10:15,159
record for the longest BaseFlight at fourteen days, a little

196
00:10:15,799 --> 00:10:22,759
sportscar like space. Fourteen days. Yeah, probably smelled. Couldn't do it.

197
00:10:23,360 --> 00:10:25,799
It was hard enough doing road trips with you, my god,

198
00:10:27,039 --> 00:10:30,120
we got away from each other every day, every day,

199
00:10:30,600 --> 00:10:34,679
every day, and on the computer side nineteen sixty five

200
00:10:34,840 --> 00:10:39,279
is the launch of decks PDP eight WOW, famously the

201
00:10:39,320 --> 00:10:43,320
first mini computer available for less than twenty thousand dollars cheap,

202
00:10:43,639 --> 00:10:46,240
a bargain so building on machines we've mentioned in the

203
00:10:46,279 --> 00:10:49,200
past few shows the link and the PDP five. It

204
00:10:49,320 --> 00:10:51,960
is a twelve bit word originally ship with four K

205
00:10:52,000 --> 00:10:55,320
could be expanded to thirty two K. It used diode

206
00:10:55,320 --> 00:10:58,919
transistor logic with what they call it hybrid ICY or

207
00:10:58,960 --> 00:11:01,440
the flip chip, which had some discrete components on it.

208
00:11:01,879 --> 00:11:04,559
Later models of the PDP eight would actually go to

209
00:11:04,679 --> 00:11:07,639
TTL I SES logic.

210
00:11:07,759 --> 00:11:09,559
Speaker 1: It occurs to me that they must have sold a

211
00:11:09,559 --> 00:11:11,600
lot of these at that price, because you know, small

212
00:11:11,600 --> 00:11:14,720
businesses or small to medium businesses could afford that.

213
00:11:14,679 --> 00:11:16,159
Speaker 2: They were getting in the realm. They sold the fifty

214
00:11:16,200 --> 00:11:18,960
thousand units over the run of WOW, six seven different

215
00:11:19,000 --> 00:11:22,759
models WOW, and the original units didn't have a There

216
00:11:22,799 --> 00:11:24,840
was no such thing as RAM yet, so when you

217
00:11:24,919 --> 00:11:27,919
powered up your PDP eight, you hand keyed in on

218
00:11:28,000 --> 00:11:30,519
the front of it the bootloader to get the paper

219
00:11:30,559 --> 00:11:34,240
tape running to actually load an operating system. And it

220
00:11:34,279 --> 00:11:36,200
came with a version of Fortren WOW, and it.

221
00:11:36,279 --> 00:11:40,679
Speaker 1: Sows for computational things obviously, were there any languages other

222
00:11:40,759 --> 00:11:42,120
than forour trend? I mean that's.

223
00:11:42,039 --> 00:11:44,559
Speaker 2: Eventually, yes, there'll be a basic and a PL one

224
00:11:44,600 --> 00:11:46,720
and so forth. But initially shipped a forourtrend in sixty

225
00:11:46,720 --> 00:11:49,039
to five, and of course the successor will be the

226
00:11:49,200 --> 00:11:51,600
very arguably the most famous deck, the PDPL eleven. But

227
00:11:51,679 --> 00:11:55,480
this was there were two lines of PDP machines being built,

228
00:11:55,519 --> 00:11:58,000
a sort of premium one which was the four and

229
00:11:58,080 --> 00:12:00,440
the twelve and things like that, and then they cost

230
00:12:00,480 --> 00:12:03,120
one that actually was wildly more popular, which was the

231
00:12:03,200 --> 00:12:04,679
five in the eight and the eleven.

232
00:12:05,960 --> 00:12:08,600
Speaker 1: Very cool, Richard, I love these little mini geek outs.

233
00:12:08,639 --> 00:12:11,720
We start to show it now, it's really getting good.

234
00:12:12,279 --> 00:12:14,639
Speaker 2: Yeah, we're right at the hub here. I mean, it's

235
00:12:14,679 --> 00:12:17,240
fascinating to say this machine was built both with Discrete

236
00:12:17,279 --> 00:12:19,639
Electronics's original models and they were about two hundred and

237
00:12:19,679 --> 00:12:22,480
fifty pounds each and then when they switched to ICs,

238
00:12:22,480 --> 00:12:23,799
it dropped down to eighty pounds.

239
00:12:24,000 --> 00:12:26,679
Speaker 1: Wow. Very cool. Yeah, all right, Well with that, I

240
00:12:26,720 --> 00:12:30,799
think it's time to introduce Diana. Diana Mounter as a

241
00:12:30,840 --> 00:12:34,759
designer with an interest in systems thinking code as a

242
00:12:34,840 --> 00:12:41,720
material and inclusive design, right, there. I'm so intrigued. Code

243
00:12:42,039 --> 00:12:43,639
as a material. All right, well, we'll talk to her

244
00:12:43,720 --> 00:12:46,720
in a minute. Most recently head of design at GitHub,

245
00:12:47,159 --> 00:12:50,799
she spent nearly a decade shaping its user experience from

246
00:12:50,960 --> 00:12:54,679
dark mode to copilot. She led the evolution of primer

247
00:12:55,159 --> 00:12:59,960
Gethub's design system, and later headed the whole design organ

248
00:13:00,639 --> 00:13:05,879
spanning product, brand research, and design engineering. She's currently taken

249
00:13:05,919 --> 00:13:08,159
some time off before she starts her next gig at

250
00:13:08,200 --> 00:13:12,159
Alpha Sense. Diana lives in Brooklyn. That's in New York, folks,

251
00:13:12,440 --> 00:13:16,639
with her husband and two cats. Welcome Diana, thank.

252
00:13:16,440 --> 00:13:18,279
Speaker 3: You very much for having me on the show.

253
00:13:19,120 --> 00:13:22,399
Speaker 1: Ah, you're welcome. Thank you for being here. That's some

254
00:13:22,559 --> 00:13:27,720
intriguing wording there in your bio code as material?

255
00:13:28,720 --> 00:13:30,000
Speaker 3: Is that where you want to start?

256
00:13:30,320 --> 00:13:31,960
Speaker 1: I don't know where do you want to start? I

257
00:13:31,960 --> 00:13:33,799
think the whole thing is intriguing to me.

258
00:13:35,960 --> 00:13:37,639
Speaker 3: Sure, Yeah, let's start there. Why not?

259
00:13:38,519 --> 00:13:42,559
Speaker 4: If you if you looked at my website, that would

260
00:13:43,360 --> 00:13:48,120
reference that. That framing comes from a guy called Wreen

261
00:13:48,200 --> 00:13:54,240
Madson who had this online book called Programming Design Systems

262
00:13:55,320 --> 00:13:59,320
that he started to develop. Probably I don't know an

263
00:13:59,360 --> 00:14:03,639
exact time, but let's say five six, seven, years ago

264
00:14:03,759 --> 00:14:06,879
or so when design systems were kind of hot and

265
00:14:06,960 --> 00:14:09,159
a thing that everyone was talking about, at least in

266
00:14:09,200 --> 00:14:13,840
my world. And he's someone that I got to meet

267
00:14:13,879 --> 00:14:17,919
and also invited him to speak at my meetup that

268
00:14:17,960 --> 00:14:21,679
I used to run in New York about design systems.

269
00:14:22,279 --> 00:14:25,759
And the thought behind this is at least my interpretation

270
00:14:25,919 --> 00:14:30,200
of what Roun talks about, is that if you think

271
00:14:30,279 --> 00:14:34,720
of code as just another material in your design toolbox,

272
00:14:34,960 --> 00:14:38,080
just like a design tool like figma or a pen

273
00:14:38,200 --> 00:14:42,120
and paper, a sketch pad, it's about knowing when to

274
00:14:42,240 --> 00:14:45,440
use the right tool for the job. And if you

275
00:14:46,399 --> 00:14:49,399
have read much about me or seen one of my talks,

276
00:14:49,440 --> 00:14:52,759
you'll probably pick up fairly quickly that I'm a strong

277
00:14:52,840 --> 00:14:57,159
believer in designers being able to code, particularly if you're

278
00:14:57,200 --> 00:15:03,279
working on a product with deep interactions, because I feel

279
00:15:03,279 --> 00:15:06,360
like you're going to get to a bit of a

280
00:15:06,399 --> 00:15:10,279
stronger result if you're able to actually prototype out what

281
00:15:10,320 --> 00:15:13,320
that what that product might feel like, or that tool

282
00:15:13,519 --> 00:15:16,159
that software might feel like, if you're able to get

283
00:15:16,200 --> 00:15:18,279
it closer to the to the real result.

284
00:15:18,879 --> 00:15:23,639
Speaker 3: So that's why I believe in code as a material I.

285
00:15:23,639 --> 00:15:28,799
Speaker 1: See, and certainly with design, because you know performance, effects design,

286
00:15:29,320 --> 00:15:33,000
navigation effects design, Like it's all It's all sort of

287
00:15:33,080 --> 00:15:36,200
that user experience, isn't it? And code is a big

288
00:15:36,240 --> 00:15:36,639
part of that.

289
00:15:36,919 --> 00:15:37,120
Speaker 3: Yeah.

290
00:15:37,200 --> 00:15:41,399
Speaker 4: Yeah, the ultimate you know, the resulting user experience is

291
00:15:41,720 --> 00:15:49,919
a factor of it being performance, having utility, and also

292
00:15:50,240 --> 00:15:55,120
that it is intuitive and sometimes that means also thinking

293
00:15:55,159 --> 00:15:58,320
about how it looks and feels right, So it's a

294
00:15:58,360 --> 00:16:01,480
combination of all of those things that actually affect the

295
00:16:01,559 --> 00:16:02,720
resulting experience.

296
00:16:02,919 --> 00:16:04,720
Speaker 2: We just did a show a little while ago where

297
00:16:04,759 --> 00:16:07,039
one of the listeners was talking about a designer who

298
00:16:07,120 --> 00:16:09,159
only worked in Figma and never thought about things like

299
00:16:09,320 --> 00:16:13,080
responsive design. And I don't know that you could understand

300
00:16:13,120 --> 00:16:16,360
responsive design if you didn't write some of the code

301
00:16:16,360 --> 00:16:19,039
for it and play with the effect of this is

302
00:16:19,039 --> 00:16:20,600
what it looks like on a phone and this is

303
00:16:20,639 --> 00:16:22,600
what it looks like on a tablet. Like that's just

304
00:16:22,840 --> 00:16:25,159
tough to do without having some coding chops.

305
00:16:25,480 --> 00:16:28,840
Speaker 4: Yeah, that's like incredibly surprising to me, and I think

306
00:16:28,879 --> 00:16:32,159
it's actually that designer is missing out.

307
00:16:32,799 --> 00:16:36,840
Speaker 3: So two things. One, responsive design is.

308
00:16:36,759 --> 00:16:41,360
Speaker 4: What got me really deeper into coding, at least in

309
00:16:41,440 --> 00:16:46,120
front end, because I felt like design tools couldn't cut it.

310
00:16:46,120 --> 00:16:48,360
They can't replicate what the experience would be.

311
00:16:48,519 --> 00:16:53,240
Speaker 1: Like, boy, you said that, I'm with you. I had

312
00:16:53,240 --> 00:16:56,720
to do a project with Figma and it was great.

313
00:16:56,759 --> 00:16:58,679
You know, the designers laid it all out and said,

314
00:16:58,679 --> 00:17:00,960
you got this pixels way and all that stuff. But

315
00:17:01,440 --> 00:17:05,359
when you implement it, it's it's not responsive. Yeah, and

316
00:17:05,440 --> 00:17:06,960
so how do you make it responsive?

317
00:17:07,200 --> 00:17:11,720
Speaker 3: Yeah? I think so. I think, like I loved Figma

318
00:17:11,799 --> 00:17:13,119
as a tool, like.

319
00:17:13,119 --> 00:17:15,720
Speaker 4: It's a great tool for thought and I can and

320
00:17:16,839 --> 00:17:19,359
you know, it's interesting how some of these other tools

321
00:17:20,000 --> 00:17:22,960
are evolving that let you type in some prompts and

322
00:17:23,000 --> 00:17:27,079
like explore, but still Figma is a bit faster to

323
00:17:27,160 --> 00:17:31,559
sort of make and direct manipulation, right to make like

324
00:17:31,680 --> 00:17:35,759
quick changes and like see the results. But yeah, it's

325
00:17:35,799 --> 00:17:39,920
not code. And so designing in the browser is is

326
00:17:41,400 --> 00:17:44,480
like was really I think a thing that became popular

327
00:17:44,559 --> 00:17:47,960
with with responsive and then the other thing that it

328
00:17:48,000 --> 00:17:51,839
brought with it with like the iPhone coming out and

329
00:17:52,119 --> 00:17:52,680
having like.

330
00:17:53,039 --> 00:17:56,480
Speaker 3: Everyone's websites on these chription a small screen.

331
00:17:57,119 --> 00:18:00,880
Speaker 4: Yeah, that that brought the sort of way of mobile

332
00:18:00,920 --> 00:18:04,720
first design, which I think is a really useful way

333
00:18:04,759 --> 00:18:07,839
to design because it just helps you prioritize and think

334
00:18:07,880 --> 00:18:12,480
about the hierarchy. It doesn't mean that you're going to

335
00:18:12,519 --> 00:18:19,000
say this exact design works should be the same on desktop,

336
00:18:19,039 --> 00:18:22,039
but it helps you really like make those tough calls

337
00:18:22,079 --> 00:18:24,839
on like what's the actual priority for the user experience

338
00:18:24,880 --> 00:18:28,920
on this device, So that designer is missing out and

339
00:18:29,039 --> 00:18:31,000
I hope that they get into it.

340
00:18:31,200 --> 00:18:33,839
Speaker 1: I mean, even if even if designers just new enough

341
00:18:33,839 --> 00:18:36,599
about media queries and how to make how to take

342
00:18:36,640 --> 00:18:42,079
a static CSS file and turn it into responsive design,

343
00:18:42,640 --> 00:18:46,079
there isn't much code required to do that. You just

344
00:18:46,160 --> 00:18:49,480
have to know enough about the CSS to write those

345
00:18:49,519 --> 00:18:50,200
media queries.

346
00:18:50,480 --> 00:18:53,400
Speaker 3: Yeah, I yes.

347
00:18:53,559 --> 00:18:57,119
Speaker 4: I also think CSS is a little underestimated in terms

348
00:18:57,160 --> 00:19:00,279
of like how much there is to learn and get

349
00:19:00,279 --> 00:19:04,880
it right. So you know, that's sort of what got

350
00:19:04,880 --> 00:19:11,480
me into design systems and things like that, because you

351
00:19:11,640 --> 00:19:14,319
might want to swap out and a whole entire component

352
00:19:14,519 --> 00:19:17,319
on a desktop screen, and understanding what that means for

353
00:19:17,400 --> 00:19:18,720
the markup and.

354
00:19:18,440 --> 00:19:22,200
Speaker 3: How you style things is really helpful.

355
00:19:23,640 --> 00:19:27,519
Speaker 4: That's also why I think, like that's I think the

356
00:19:27,640 --> 00:19:31,279
developments in in front end and CSS getting better and

357
00:19:31,319 --> 00:19:35,119
then new framework's coming out is also what led us

358
00:19:35,160 --> 00:19:37,640
into two people talking about the front of the front

359
00:19:37,759 --> 00:19:40,279
end and the back of the front end, and this

360
00:19:40,440 --> 00:19:45,079
sort of beginning of this divide, which which led to

361
00:19:45,319 --> 00:19:49,160
what I've been talking about conferences and anyone who will

362
00:19:49,160 --> 00:19:51,279
listen recently, which is design engineering.

363
00:19:51,920 --> 00:19:56,559
Speaker 1: What drew you into GitHub and get and code? Is

364
00:19:56,559 --> 00:19:58,559
a designer and all that stuff? What got you there?

365
00:19:58,839 --> 00:20:03,160
Speaker 4: Yes, I think I had always been dabbling in code

366
00:20:03,519 --> 00:20:07,839
and had sparked in interest in computers from my late teens.

367
00:20:08,599 --> 00:20:14,559
I'm old enough to have gone to land parties and

368
00:20:14,799 --> 00:20:20,279
played Action Quake and Stylecraft and things like that, and

369
00:20:20,480 --> 00:20:23,359
there I met I started to become interested in, like,

370
00:20:23,400 --> 00:20:25,599
how do I make the computer work the way I

371
00:20:25,599 --> 00:20:29,680
want it to work? And then that led into an

372
00:20:29,720 --> 00:20:36,759
interest in it and programming, And I found myself becoming

373
00:20:36,799 --> 00:20:39,960
interested in the web when I was working in prints

374
00:20:40,599 --> 00:20:43,680
and discovered that there was this whole job, but this

375
00:20:43,759 --> 00:20:48,039
whole area where you could build user interfaces. So later

376
00:20:48,480 --> 00:20:51,599
that sort of passion and that interest in the intersection

377
00:20:51,759 --> 00:20:56,720
of code and creativity sort of continued. And so although

378
00:20:56,799 --> 00:21:01,319
I know my whole career has really been in design,

379
00:21:01,799 --> 00:21:06,759
I still liked to build things. And when I was

380
00:21:06,839 --> 00:21:13,200
working in an agency in Sydney, this was in twenty ten,

381
00:21:15,079 --> 00:21:19,079
some of my colleagues and I went to a hackathon

382
00:21:19,400 --> 00:21:23,039
and they were using get and get herb to collaborate

383
00:21:23,079 --> 00:21:25,119
and they were like, hey, why don't you hop on

384
00:21:25,839 --> 00:21:29,000
to get herb and create an account so you can

385
00:21:29,000 --> 00:21:31,240
collaborate with this, because then you're a new for an

386
00:21:31,359 --> 00:21:34,240
end And that was it. And then I was like, oh,

387
00:21:34,839 --> 00:21:37,960
I want this feels something about this feels really awesome

388
00:21:38,359 --> 00:21:40,839
because I was in the same place as the engineers.

389
00:21:41,440 --> 00:21:44,319
Speaker 3: And then I really loved version control.

390
00:21:44,599 --> 00:21:47,039
Speaker 4: I mean, as a designer, you end up with lots

391
00:21:47,079 --> 00:21:53,839
of like, you know, homepage design, underscore, final hyphen done,

392
00:21:54,279 --> 00:21:55,400
final three.

393
00:21:56,599 --> 00:21:58,119
Speaker 2: Right this time?

394
00:21:58,799 --> 00:22:03,839
Speaker 3: Yeah, exactly, and so I like, I really liked that.

395
00:22:04,039 --> 00:22:08,000
Speaker 4: And then I found I made some excuses to keep

396
00:22:08,359 --> 00:22:10,480
using get and get hub so that I would like

397
00:22:11,119 --> 00:22:15,480
get more comfortable with the commands. And so I discovered

398
00:22:15,519 --> 00:22:21,480
jeckyl and ported my uh probably terribly built WordPress site

399
00:22:21,519 --> 00:22:25,880
over to Jackyl. And Jackyl also felt nice because I

400
00:22:25,880 --> 00:22:29,039
felt like I was like closer to directly, you know,

401
00:22:29,759 --> 00:22:32,400
touching the code that was actually resulting in the UI

402
00:22:32,799 --> 00:22:38,400
and I. Jackyl is a static site generator. It was

403
00:22:38,480 --> 00:22:41,519
created by I think it was by Tom Preston. Warner

404
00:22:41,720 --> 00:22:44,960
or he at least contributed to it, one of the

405
00:22:45,000 --> 00:22:49,559
founders for get hub, and it still I think it

406
00:22:49,599 --> 00:22:51,799
still exists. I don't Yeah, I don't really use it

407
00:22:51,839 --> 00:22:54,680
as much now. I think people have gotten interested in

408
00:22:54,960 --> 00:23:00,079
all sorts of other site generators and a lot of

409
00:23:00,519 --> 00:23:03,079
folks like working with reacting.

410
00:23:02,720 --> 00:23:05,160
Speaker 2: And front end site still up. All included in the

411
00:23:05,200 --> 00:23:05,920
show notes, So.

412
00:23:07,920 --> 00:23:08,319
Speaker 3: There you go.

413
00:23:09,079 --> 00:23:10,640
Speaker 4: I was like, I think it is because I feel

414
00:23:10,640 --> 00:23:15,359
like some people still use it. It was great. It was

415
00:23:15,599 --> 00:23:19,920
just like really I think easy to jump into it

416
00:23:20,440 --> 00:23:23,799
as a designer that knewed some HTML and CSS, and

417
00:23:23,880 --> 00:23:26,319
you could also use it with SASH when that became

418
00:23:26,359 --> 00:23:30,480
more popular. You could have like includes and things and

419
00:23:30,559 --> 00:23:33,200
for loops and stuff, so you started to learn the

420
00:23:33,240 --> 00:23:33,960
basics of.

421
00:23:34,079 --> 00:23:38,680
Speaker 1: Friends nice so you get control flow and CSS.

422
00:23:38,960 --> 00:23:40,240
Speaker 3: Yeah, yeah exactly.

423
00:23:42,000 --> 00:23:45,440
Speaker 4: But yeah that like just building my site in Jacko

424
00:23:45,519 --> 00:23:49,160
and hosting it on get her pages. That was also

425
00:23:49,240 --> 00:23:53,920
way easier than like FTP things and other sort of things.

426
00:23:54,359 --> 00:23:58,920
So that just kept me up with using get and getthub,

427
00:23:59,000 --> 00:24:01,359
and then it just sort of continue to grow from

428
00:24:01,400 --> 00:24:05,759
there and discovering open source and sort of learning how

429
00:24:05,839 --> 00:24:08,200
other people built sites and things.

430
00:24:08,279 --> 00:24:11,720
Speaker 1: So yeah, So you consider yourself sort of a designer

431
00:24:11,799 --> 00:24:13,839
slash engineer, right.

432
00:24:14,240 --> 00:24:15,200
Speaker 3: I would.

433
00:24:15,519 --> 00:24:21,519
Speaker 4: I'm passionate about I'm interested in design engineering as a

434
00:24:22,039 --> 00:24:26,279
role that I think is daily needed in design. But

435
00:24:27,119 --> 00:24:30,960
now I'm a serious boss person, so I don't think

436
00:24:31,000 --> 00:24:34,599
I would call myself a design engineer.

437
00:24:34,720 --> 00:24:38,640
Speaker 1: I have experience. You have experience clothing as well as designing,

438
00:24:38,720 --> 00:24:42,319
so you could probably talk to both of those entities

439
00:24:42,359 --> 00:24:45,839
and translate the language that flows between them.

440
00:24:45,880 --> 00:24:51,119
Speaker 4: I mean I think sure, yeah, And I helped establish

441
00:24:51,160 --> 00:24:55,160
that role at GitHub. I used to manage design engineers

442
00:24:55,200 --> 00:24:58,279
with that title of helped hire them.

443
00:24:59,799 --> 00:24:59,880
Speaker 2: It.

444
00:25:00,079 --> 00:25:03,920
Speaker 4: There's a funny quote on the internet. I think it's

445
00:25:03,960 --> 00:25:07,400
by a guy called whose name is Tangerine. I might

446
00:25:07,440 --> 00:25:13,079
be wrong, but he says designers who code walked so

447
00:25:13,119 --> 00:25:16,519
that design engineers could run. And I think that's that

448
00:25:16,599 --> 00:25:18,440
might not make sense in your head, but there was

449
00:25:18,519 --> 00:25:22,559
like the era of everyone in like design coding world

450
00:25:22,599 --> 00:25:25,559
in front end talking about designers she could, and then

451
00:25:25,640 --> 00:25:27,759
there was other people like designers shouldn't have the code,

452
00:25:27,799 --> 00:25:30,680
and there's the whole thing. And and now it's like

453
00:25:30,839 --> 00:25:34,519
design engineering and seeing being seen as a as a

454
00:25:34,599 --> 00:25:36,440
more serious discipline.

455
00:25:36,960 --> 00:25:41,599
Speaker 1: Yeah, tangerine you said was tangerine.

456
00:25:41,680 --> 00:25:42,400
Speaker 3: I think it is.

457
00:25:42,680 --> 00:25:45,839
Speaker 1: I am who would choose a handle named after a

458
00:25:45,880 --> 00:25:47,599
fruit or vegetable. I don't understand that.

459
00:25:47,759 --> 00:25:52,359
Speaker 3: I have no idea talk with never do anything like that.

460
00:25:53,880 --> 00:25:57,279
Speaker 1: Right, Why what's it do you love? Broccoli? Is your

461
00:25:57,279 --> 00:25:59,119
favorite vegetable? Why broccolini?

462
00:25:59,440 --> 00:26:03,920
Speaker 4: It is not my favorite vegetable, although many people think

463
00:26:03,960 --> 00:26:06,720
that and they like to send me photos of broccolini

464
00:26:06,759 --> 00:26:09,759
when they're having that for dinner, which is I should

465
00:26:09,759 --> 00:26:12,599
have made just a website out of people sending.

466
00:26:12,359 --> 00:26:13,400
Speaker 3: Me broccolini picks.

467
00:26:15,880 --> 00:26:25,480
Speaker 4: My favorite vegetals actually potatoes the best. Yeah. I don't

468
00:26:25,559 --> 00:26:28,319
know what JoJo's are, but I heard you mentioned them earlier.

469
00:26:29,319 --> 00:26:29,640
Speaker 3: Chicken.

470
00:26:29,920 --> 00:26:31,440
Speaker 1: You know, there's something that you eat three in the

471
00:26:31,480 --> 00:26:33,200
morning when you're stumbling home from the bar and you

472
00:26:33,240 --> 00:26:35,200
go to the gas station. They have fried chicken, and

473
00:26:35,200 --> 00:26:38,839
they have JoJo's, so they dip the wedges and chicken

474
00:26:38,920 --> 00:26:39,759
batter and frying.

475
00:26:39,920 --> 00:26:43,519
Speaker 4: So I haven't really lived until i've I've stumbled, not.

476
00:26:43,519 --> 00:26:44,680
Speaker 2: Enough stumbling at home after that.

477
00:26:45,000 --> 00:26:46,880
Speaker 1: I don't think you're missing much. They are good at

478
00:26:46,920 --> 00:26:48,559
three o'clock in the morning when you're.

479
00:26:48,559 --> 00:26:53,279
Speaker 4: You know, okay, I'll so Broccolini.

480
00:26:53,279 --> 00:26:55,720
Speaker 1: You just chose this why because the domain was available

481
00:26:56,000 --> 00:26:58,480
broccolini dot net or no.

482
00:26:59,359 --> 00:27:00,880
Speaker 3: When I was in Australia.

483
00:27:01,240 --> 00:27:05,119
Speaker 4: I h this would have been about two thousand and five,

484
00:27:05,160 --> 00:27:09,480
two thousand and six. Broccolini. You won't believe this was

485
00:27:09,559 --> 00:27:14,839
not the famous vegetable that it is now. And I know,

486
00:27:15,200 --> 00:27:18,720
I know there's some people that lived their life without

487
00:27:18,839 --> 00:27:25,079
knowing about Broccolini. So I was flipping through a restaurant menu.

488
00:27:25,279 --> 00:27:28,000
I think it might have been like a Chinese takeout

489
00:27:28,079 --> 00:27:30,319
or something like that, and I'd had a few glasses

490
00:27:30,359 --> 00:27:32,359
of wine and was hanging out with a friend of

491
00:27:32,400 --> 00:27:36,440
mine and saw Broccolini on there, and I was just like, Oh,

492
00:27:36,480 --> 00:27:39,559
they've run out of vegetable names, so they're just trying

493
00:27:39,559 --> 00:27:42,519
to make it sound more fancy and put eenie on

494
00:27:42,599 --> 00:27:43,000
the end.

495
00:27:43,400 --> 00:27:45,279
Speaker 1: So you thought it was like the tips of the

496
00:27:45,319 --> 00:27:46,279
broccoli or something.

497
00:27:46,359 --> 00:27:48,720
Speaker 4: Yeah, I was like, yeah, they're just you know, like

498
00:27:48,799 --> 00:27:53,480
when they rename like areas in New York neighborhoods in

499
00:27:53,519 --> 00:27:56,359
New York to like make it sell more. I've sort

500
00:27:56,359 --> 00:27:59,799
of thought it was like that sort of thing. Anyway, Okay,

501
00:28:00,039 --> 00:28:02,599
I'm this is the whole story. You can cut this

502
00:28:02,680 --> 00:28:04,799
out if still I think I want to know?

503
00:28:04,880 --> 00:28:06,960
Speaker 3: I mean, okay.

504
00:28:07,079 --> 00:28:12,680
Speaker 4: So a few days later, I'm walking along with the

505
00:28:12,720 --> 00:28:15,240
street with my friends and he's like, hey, can I

506
00:28:15,519 --> 00:28:19,079
pop into this restaurant. My friend's working as a wait

507
00:28:19,160 --> 00:28:22,359
staff here, and I was like sure, And he's chatting

508
00:28:22,440 --> 00:28:26,200
to his friend, Kerry, her name was, And I stood

509
00:28:26,200 --> 00:28:29,759
there flipping through the menu and there's broccolini on the menu,

510
00:28:29,880 --> 00:28:32,920
of course, and so I just start giggling and I

511
00:28:33,039 --> 00:28:35,440
look up and they're looking at me, like what's wrong

512
00:28:35,480 --> 00:28:38,279
with you? And I'm like, there's Broccolini on the menu,

513
00:28:38,640 --> 00:28:44,440
and they're like yeah. And so it turns out Kerry

514
00:28:44,759 --> 00:28:48,119
is looking for a housemate. About a month later, put

515
00:28:48,119 --> 00:28:51,400
me in a phone as Broccolini Girl because she cann't

516
00:28:52,440 --> 00:28:55,720
didn't either didn't remember my name or didn't want to

517
00:28:55,799 --> 00:28:57,279
because she thought this was funnier.

518
00:28:57,759 --> 00:29:00,759
Speaker 1: Yeah, my neighbors in my contacts as Laura next door.

519
00:29:01,599 --> 00:29:04,920
Speaker 3: Yeah context, Yeah, it helps.

520
00:29:06,319 --> 00:29:09,359
Speaker 4: Yeah. She she told all her friends that this girl

521
00:29:09,440 --> 00:29:12,559
called Broccolini was moving in and they would call me

522
00:29:13,160 --> 00:29:15,799
bros and broccols, and half of them didn't know that

523
00:29:15,880 --> 00:29:18,519
wasn't my actual name. So and so it's kind of

524
00:29:18,519 --> 00:29:21,359
a joke yeah, yeah, so when I had to make

525
00:29:21,400 --> 00:29:22,559
my Twitter handle.

526
00:29:22,480 --> 00:29:25,759
Speaker 2: An insight and not to be too geek out on

527
00:29:25,799 --> 00:29:28,799
this whole thing, but broccolini is a recent invention, like

528
00:29:28,880 --> 00:29:32,319
this is a selectively bred hybrid of broccoli and guy

529
00:29:32,440 --> 00:29:33,640
Land nineties.

530
00:29:34,720 --> 00:29:37,319
Speaker 3: Hence why it wasn't all that famous.

531
00:29:37,880 --> 00:29:39,000
Speaker 1: So it's a new new thing.

532
00:29:39,759 --> 00:29:42,160
Speaker 3: It was literally in the nineties, the new broccoli.

533
00:29:42,680 --> 00:29:45,640
Speaker 2: Yeah, plenty of the Elder did not write about this one.

534
00:29:45,680 --> 00:29:47,519
He wrote about cauliflower.

535
00:29:46,920 --> 00:29:48,680
Speaker 1: But not this one. Yeah, he wrote of a lot

536
00:29:48,680 --> 00:29:52,799
of wacky stuff. That guy was nuts. So I just

537
00:29:52,839 --> 00:29:55,759
want to talk about broccolini dot net. For a designer,

538
00:29:55,920 --> 00:29:59,640
this is really minimalist your website. I know it was.

539
00:29:59,759 --> 00:30:03,640
It's obviously intentional, but wow, I mean looks like it

540
00:30:03,720 --> 00:30:08,039
was printed on a typewriter and you know, with that

541
00:30:08,160 --> 00:30:12,359
font and just they're all no nonsense stuff, And I

542
00:30:12,519 --> 00:30:16,000
just wonder, like, what does that say about you as

543
00:30:16,000 --> 00:30:16,640
a designer.

544
00:30:17,079 --> 00:30:19,880
Speaker 4: Oh my gosh, Now I'm going to be looking at

545
00:30:19,880 --> 00:30:22,240
my website in terror. I think I need to I

546
00:30:22,319 --> 00:30:24,079
definitely need to redesign it.

547
00:30:24,759 --> 00:30:28,920
Speaker 1: I think it's awesome because websites should inform first, right,

548
00:30:29,519 --> 00:30:33,079
and I think, especially like if you're a designer. If

549
00:30:33,119 --> 00:30:36,039
you if you picked an elaborate design to go with

550
00:30:36,119 --> 00:30:39,400
for your website, well that's a statement. Also that's not

551
00:30:39,440 --> 00:30:44,240
good because you're pigeonholing yourself into that design. People will

552
00:30:44,279 --> 00:30:46,359
judge you by that. Well, that's not what I want

553
00:30:46,400 --> 00:30:49,039
in a design. And so I like the way that

554
00:30:49,079 --> 00:30:52,440
you did this stripped down because it's all just information.

555
00:30:52,759 --> 00:30:58,160
Speaker 4: Yeah, I think I do like minimalism. One of the

556
00:30:58,519 --> 00:31:01,720
sort of sayings we have herb and I'm I think

557
00:31:01,759 --> 00:31:07,400
it's from Carl n zenovige hub is everything added dilutes

558
00:31:07,480 --> 00:31:12,920
everything else. And I definitely that definitely is something that

559
00:31:13,240 --> 00:31:16,200
influences the way I design or the feedback I give

560
00:31:16,960 --> 00:31:21,640
to my team. But I also there's a little tiny

561
00:31:21,680 --> 00:31:25,359
bit of color on there, and it's it's because so

562
00:31:25,480 --> 00:31:29,839
I am. I am known for wearing a lot of black.

563
00:31:31,440 --> 00:31:33,000
I mean, it's not just because I live in New

564
00:31:33,079 --> 00:31:37,480
York and it's just I just like black.

565
00:31:37,559 --> 00:31:39,240
Speaker 3: I think it.

566
00:31:39,599 --> 00:31:42,920
Speaker 1: Yeah, this is one of the rare occasions. And Richard

567
00:31:42,960 --> 00:31:45,240
will tell you that I'm not wearing a black T shirt.

568
00:31:45,240 --> 00:31:47,720
I'm wearing a gray T shirt. But my uniform is

569
00:31:47,759 --> 00:31:49,319
a black T shirt and black shirt.

570
00:31:50,920 --> 00:31:53,359
Speaker 4: It's okay because gray is a shade of black, So

571
00:31:53,680 --> 00:31:58,359
in my book, that's that's permitted. Yeah, so I think

572
00:31:58,519 --> 00:32:03,400
I've been trying to I do like experimenting with splashes

573
00:32:03,440 --> 00:32:08,000
of color. So I've got some of those bright gradient colors.

574
00:32:08,039 --> 00:32:12,240
I love contrasts, even with myself. Well, no one's going

575
00:32:12,279 --> 00:32:17,160
to see the video, but I've got greenish nails right

576
00:32:17,200 --> 00:32:19,880
now because it's just a way to express.

577
00:32:19,599 --> 00:32:21,440
Speaker 1: Yeah, it looks like it reminds me of like a

578
00:32:21,480 --> 00:32:26,680
fifty seven Chevy or milkshake machine, you know, like that

579
00:32:27,079 --> 00:32:28,640
ceramic kind of green.

580
00:32:28,839 --> 00:32:31,720
Speaker 4: It was actually meant to be an homage to the

581
00:32:31,799 --> 00:32:36,359
contributions graph, but I was limited by what exact colors

582
00:32:36,359 --> 00:32:36,799
of green.

583
00:32:37,640 --> 00:32:40,279
Speaker 3: The nail technician nice.

584
00:32:41,160 --> 00:32:42,839
Speaker 2: Yeah, if you can take the contribution graphs, all the

585
00:32:42,839 --> 00:32:44,880
different greens that it generates to depending on a number

586
00:32:44,920 --> 00:32:48,000
of contributions in per block, you'd say, this is your palette,

587
00:32:48,000 --> 00:32:50,000
make each finger a different one of these.

588
00:32:50,440 --> 00:32:50,680
Speaker 3: Yeah.

589
00:32:50,839 --> 00:32:53,559
Speaker 1: Yeah, all right, Well we're overdue for a break, so

590
00:32:53,680 --> 00:32:55,440
we'll take a break. We'll come on back and we'll

591
00:32:55,480 --> 00:32:58,359
talk to Diana Mounter about what else she's thinking about

592
00:32:58,359 --> 00:33:02,880
these days. So stick around. We'll be Did you know

593
00:33:03,039 --> 00:33:06,000
you can lift and shift your dot net framework apps

594
00:33:06,039 --> 00:33:10,440
to virtual machines in the cloud. Use the elastic beanstock

595
00:33:10,559 --> 00:33:14,759
service to easily migrate to Amazon EC two with little

596
00:33:14,880 --> 00:33:19,119
or no changes. Find out more at aws dot Amazon

597
00:33:19,200 --> 00:33:27,960
dot com, slash Elasticbeanstock. And we're back at dot in Aros.

598
00:33:28,000 --> 00:33:30,559
I'm Carl Franklin, as my friend Richard Campbell. Hey, and

599
00:33:30,559 --> 00:33:33,480
we're talking to Diana Mounter and uh, we're talking about

600
00:33:33,480 --> 00:33:36,640
design and code and GitHub and all these great things.

601
00:33:36,680 --> 00:33:38,279
And by the way, if you don't want to hear

602
00:33:38,319 --> 00:33:41,640
these messages, consider becoming a five dollars a month patron.

603
00:33:42,039 --> 00:33:43,920
Go to Patreon at dot and irocks dot com to

604
00:33:43,920 --> 00:33:46,039
get an ad free feed. I don't want to let

605
00:33:46,079 --> 00:33:48,759
go of code as a material for no other reason.

606
00:33:48,759 --> 00:33:51,119
The heresy that not all problems can be solved with code.

607
00:33:53,200 --> 00:33:54,640
Speaker 3: Do you want to salk about that more?

608
00:33:58,119 --> 00:34:00,759
Speaker 2: But I think the implication, of course, is that not

609
00:34:00,839 --> 00:34:03,880
all problems are solved with code. I'd be interested in

610
00:34:03,920 --> 00:34:08,320
your design view there about when do we decide to

611
00:34:08,360 --> 00:34:10,039
code when working through a design?

612
00:34:10,480 --> 00:34:12,800
Speaker 3: Oh my gosh. Yeah.

613
00:34:11,719 --> 00:34:15,559
Speaker 4: I think it's a thing that you sort of inherently

614
00:34:15,719 --> 00:34:21,239
know as the more that you design. I think on

615
00:34:21,360 --> 00:34:24,400
the one end of the scale. So I guess when

616
00:34:24,400 --> 00:34:28,760
you start putting boxes and arrows and other shapes on

617
00:34:28,800 --> 00:34:33,760
a page, you're starting to limit what people are going

618
00:34:33,800 --> 00:34:38,599
to imagine from that design. And so I think that

619
00:34:39,639 --> 00:34:42,400
you've got to be really careful about am I at

620
00:34:42,400 --> 00:34:46,960
the stage where I want people to start imagining interacting

621
00:34:47,039 --> 00:34:51,559
with this, or am I still really trying to immerse

622
00:34:51,599 --> 00:34:55,599
in the space and think about what are their priorities.

623
00:34:54,960 --> 00:34:56,400
Speaker 3: And the tasks and the flow.

624
00:34:56,920 --> 00:35:00,119
Speaker 4: So I think I don't mean this to be a

625
00:35:00,159 --> 00:35:02,760
cop out, but it's really about when you're at the

626
00:35:02,800 --> 00:35:05,159
stage where you, as a designer are trying to get

627
00:35:05,159 --> 00:35:08,360
a feel for the interactions and the flow and whether

628
00:35:09,599 --> 00:35:11,639
this map that you've sort of planned out in your

629
00:35:11,679 --> 00:35:15,519
head or in a Figma file or whatever actually makes

630
00:35:15,559 --> 00:35:17,199
sense when you use it.

631
00:35:17,239 --> 00:35:18,960
Speaker 3: And it's also because it's.

632
00:35:18,880 --> 00:35:23,719
Speaker 4: You know, designing code and in design tools or sketching

633
00:35:23,880 --> 00:35:25,880
is both for you and also the people that you're

634
00:35:25,880 --> 00:35:28,679
trying to communicate it to. And the part of the

635
00:35:28,760 --> 00:35:32,760
job of a designer is to help people imagine what

636
00:35:32,840 --> 00:35:35,679
this end result might feel like. It's not just what

637
00:35:35,719 --> 00:35:37,559
it looks like, it's what it's going to feel like

638
00:35:37,679 --> 00:35:40,199
to use. And so I think that's when you want

639
00:35:40,239 --> 00:35:45,519
to move into into code, and you know, not every

640
00:35:45,559 --> 00:35:49,280
designer is really comfortable with that. You can create great

641
00:35:49,320 --> 00:35:54,000
prototypes using other tools. But for designers that can code,

642
00:35:54,039 --> 00:35:57,639
they know when to hop in to a text editor

643
00:35:57,719 --> 00:36:01,800
and start developing their work. And some of them that

644
00:36:01,960 --> 00:36:04,679
do this a lot, they might have presets set up,

645
00:36:04,719 --> 00:36:06,599
they might use particular.

646
00:36:07,800 --> 00:36:09,519
Speaker 3: Tools that they're very familiar with.

647
00:36:10,599 --> 00:36:15,000
Speaker 4: I getthub our design system was primer, and so if

648
00:36:15,039 --> 00:36:17,559
you're working at a company with a design sist, you

649
00:36:17,599 --> 00:36:20,119
might want to pull that in so that you can

650
00:36:21,159 --> 00:36:25,679
get closer to the production like quality result.

651
00:36:25,800 --> 00:36:30,599
Speaker 2: Basically, sure, because adjust a position of design only knowing

652
00:36:30,639 --> 00:36:33,960
that the application is invariably interactive, Like you can go

653
00:36:34,039 --> 00:36:37,599
to Cody and not enough design and you have a mess.

654
00:36:38,000 --> 00:36:40,360
But if you think too statically, it's not how the

655
00:36:40,400 --> 00:36:43,400
code actually works. So there's some crossover there. That's the

656
00:36:43,480 --> 00:36:44,119
right point.

657
00:36:44,239 --> 00:36:48,039
Speaker 4: Yeah, And I think that that makes me think about

658
00:36:48,079 --> 00:36:51,880
something that I see both developers and designers struggling with.

659
00:36:52,320 --> 00:36:53,719
Speaker 3: Or I don't know.

660
00:36:53,880 --> 00:36:57,840
Speaker 4: Actually, to be fair, it's not always the individual contributors,

661
00:36:57,880 --> 00:37:02,400
it's sometimes their bosses. Is the idea that it's okay

662
00:37:02,440 --> 00:37:06,239
to throw away code or throw away a design. I

663
00:37:06,280 --> 00:37:12,199
think experimentation is really really valuable. I think that design

664
00:37:12,559 --> 00:37:18,079
can de risk the end result, but because you can more,

665
00:37:18,559 --> 00:37:21,039
I think it's perceived that it's cheaper to throw away

666
00:37:21,079 --> 00:37:23,320
design than throw away something that's built.

667
00:37:24,719 --> 00:37:24,960
Speaker 3: Yeah.

668
00:37:25,239 --> 00:37:26,000
Speaker 1: I tend to agree.

669
00:37:26,000 --> 00:37:28,239
Speaker 2: It's pretty normal for you to iterate on designs, but

670
00:37:28,280 --> 00:37:30,599
it's not that normal to iterate on code. It's like

671
00:37:30,639 --> 00:37:33,599
the moment you've checked it in, it's kind of permanent.

672
00:37:33,960 --> 00:37:36,159
Speaker 1: No, I don't agree with that. I don't agree. I

673
00:37:36,159 --> 00:37:37,960
mean one of the reasons you use a system like

674
00:37:38,039 --> 00:37:40,199
GitHub is so that, oh, that didn't work. Let's go

675
00:37:40,280 --> 00:37:43,159
back to this, to this commit and start from there

676
00:37:43,239 --> 00:37:45,280
and keep it on the branch. Yeah. I want to

677
00:37:45,280 --> 00:37:48,519
talk about primer, but first I need to ask you

678
00:37:48,559 --> 00:37:51,719
this question. You're obviously a design expert, and you go

679
00:37:51,800 --> 00:37:54,920
into companies and you're talking about design and a meeting

680
00:37:55,119 --> 00:37:59,880
and you know, Bob from backups says, hey, I got

681
00:37:59,880 --> 00:38:02,840
it design that I did in you know, Figma or whatever.

682
00:38:03,320 --> 00:38:07,719
Let's use this and it sucks. How do you gently

683
00:38:08,719 --> 00:38:10,880
tell that person to go pound sand?

684
00:38:13,800 --> 00:38:17,760
Speaker 4: So is Bob a designer or is he's like a

685
00:38:17,800 --> 00:38:18,599
product manager?

686
00:38:18,800 --> 00:38:21,920
Speaker 1: It's like an it guy he fixes the printers, you know, Yeah,

687
00:38:21,960 --> 00:38:24,920
and he's got this idea for a design and he's

688
00:38:25,000 --> 00:38:26,320
trying to impress you or whatever.

689
00:38:27,159 --> 00:38:31,800
Speaker 4: Okay, So first off, I think that this happens all

690
00:38:31,840 --> 00:38:34,559
the time with designers, and you have to learn how

691
00:38:34,599 --> 00:38:36,320
to respond to these moments.

692
00:38:36,559 --> 00:38:38,840
Speaker 3: Yeah, And what.

693
00:38:38,760 --> 00:38:40,920
Speaker 4: I would say, and I had to learn myself, is

694
00:38:41,599 --> 00:38:49,000
approach those situations with curiosity versus like rage and seeing

695
00:38:49,000 --> 00:38:50,920
you read I have to explain.

696
00:38:51,360 --> 00:38:54,800
Speaker 1: You have to explain why it's not a good design, right.

697
00:38:54,760 --> 00:38:57,840
Speaker 3: Well, not actually try and understand why they think it

698
00:38:57,960 --> 00:38:59,599
is a good design, Okay, Like.

699
00:38:59,519 --> 00:39:03,000
Speaker 4: What problem are they thinking they are solving with this thing?

700
00:39:03,679 --> 00:39:07,000
And then because that helps you understand the intent and

701
00:39:07,039 --> 00:39:10,599
what their motivations were, and that puts you in a

702
00:39:10,599 --> 00:39:14,159
better position to then ask follow up questions that hopefully

703
00:39:14,280 --> 00:39:18,719
also get them to realize that think it through. Maybe

704
00:39:18,719 --> 00:39:22,840
this isn't the best results, So like why, so why.

705
00:39:22,679 --> 00:39:23,320
Speaker 3: Did you go with this?

706
00:39:23,480 --> 00:39:26,400
Speaker 1: What if it's just over the top, like a flaming

707
00:39:26,519 --> 00:39:31,239
logo or something, you know, just like something ridiculous marquee, Yeah,

708
00:39:31,440 --> 00:39:38,840
justly ridiculous that belongs in the nineties. I mean, yeah,

709
00:39:38,880 --> 00:39:40,679
that's that's a good effort.

710
00:39:40,800 --> 00:39:44,559
Speaker 4: But I think you want to you want to do

711
00:39:44,599 --> 00:39:47,519
the yes and response. It depends is if this person

712
00:39:47,559 --> 00:39:51,800
has got a lot of clout in the in the room,

713
00:39:51,960 --> 00:39:54,880
who's the most important person in the room type situation,

714
00:39:55,440 --> 00:39:57,800
I think you can you can probably be a bit

715
00:39:57,880 --> 00:39:58,559
more direct.

716
00:39:58,800 --> 00:40:00,880
Speaker 3: And then the other things that you can use to.

717
00:40:02,480 --> 00:40:06,599
Speaker 4: Propose that that solution may not work is like, if

718
00:40:06,599 --> 00:40:09,280
you have a brand, Like even if you don't actually

719
00:40:09,280 --> 00:40:11,800
have a design system or a brand guide, you can say, hey,

720
00:40:11,840 --> 00:40:13,920
I don't feel like this is going to be cohesive

721
00:40:14,119 --> 00:40:15,280
with our design language.

722
00:40:15,280 --> 00:40:16,639
Speaker 3: If we look at what exists.

723
00:40:17,119 --> 00:40:19,960
Speaker 4: You can also I'm taken this like seriously, and now

724
00:40:20,000 --> 00:40:21,800
I'm wondering if you would just like let's have a

725
00:40:21,880 --> 00:40:22,400
laugh with this.

726
00:40:23,679 --> 00:40:28,320
Speaker 2: No, No, you're clearly right, Diana, Like, yeah, there was

727
00:40:28,360 --> 00:40:30,679
a reason they presented that, And you've got to get

728
00:40:30,760 --> 00:40:33,840
to the core reason because right, probably their example isn't

729
00:40:33,840 --> 00:40:35,119
resonating particularly well.

730
00:40:35,199 --> 00:40:37,079
Speaker 1: Yeah, but they may they may have a good reason

731
00:40:37,119 --> 00:40:38,239
for doing it. Yeah.

732
00:40:38,320 --> 00:40:40,760
Speaker 4: Yeah, And you can use as a designer, you know

733
00:40:40,840 --> 00:40:45,599
you have the ammunition you have against this design is

734
00:40:45,719 --> 00:40:49,760
like what is written down as as the guidelines for

735
00:40:49,800 --> 00:40:52,519
your brand and for the product brand and the design system.

736
00:40:52,559 --> 00:40:56,000
If you have one, you have the user data, like

737
00:40:56,119 --> 00:40:59,559
what insights do you have either from metrics or from

738
00:40:59,599 --> 00:41:02,920
interview with users, so that you know, like you know,

739
00:41:03,280 --> 00:41:07,199
turning the conversation into what is right for the customer

740
00:41:07,280 --> 00:41:10,480
and not making it about your design versus design it

741
00:41:10,599 --> 00:41:11,440
really helps.

742
00:41:12,079 --> 00:41:15,599
Speaker 1: Yeah, all right, let's talk about Primer. Tell at first,

743
00:41:15,679 --> 00:41:17,239
I've heard of it, so tell me what it is.

744
00:41:17,519 --> 00:41:20,960
Speaker 4: It is a it's a design system. It's gitthrb's design system.

745
00:41:21,079 --> 00:41:24,800
It's what we use to design and build are UI.

746
00:41:26,000 --> 00:41:33,840
It includes everything from design tokens, a CSS framework, to

747
00:41:35,280 --> 00:41:42,039
view components which is the Rails components solution and React components,

748
00:41:42,119 --> 00:41:46,280
and things like octacons which is our icon system, and

749
00:41:46,320 --> 00:41:48,960
all of the you know, tooling and other bits and

750
00:41:49,000 --> 00:41:50,800
bobs that help run the whole system.

751
00:41:50,920 --> 00:41:51,719
Speaker 1: And fonts too.

752
00:41:51,760 --> 00:41:55,800
Speaker 4: I imagine we use system fonts for the most part,

753
00:41:55,880 --> 00:41:59,559
but actually, to be fair, yes, in our brand, our

754
00:41:59,599 --> 00:42:05,320
Primer brand system, we use Mona sands and Hubot sands,

755
00:42:05,480 --> 00:42:08,920
which is which are our variable fonts that are you

756
00:42:09,000 --> 00:42:16,719
designed with in collaboration with a font foundry i think,

757
00:42:17,480 --> 00:42:21,920
but customized and designed with in collaboration with GitHub designers,

758
00:42:22,480 --> 00:42:28,639
and so they're used on our marketing websites, homepage, feature pages,

759
00:42:28,679 --> 00:42:29,360
that type of thing.

760
00:42:29,639 --> 00:42:34,119
Speaker 1: Cool design systems. I'm thinking of things like material right,

761
00:42:34,199 --> 00:42:37,039
So it's it's along those lines in terms of you

762
00:42:37,079 --> 00:42:38,559
know what the design.

763
00:42:38,320 --> 00:42:41,760
Speaker 3: System is, Yes, for sure. Yeah, it's a.

764
00:42:43,400 --> 00:42:47,559
Speaker 4: It contains literal code components that you can pull into

765
00:42:47,639 --> 00:42:52,800
your application, as well as guidelines on how to use

766
00:42:52,840 --> 00:42:58,239
those components, UY components in combination with each other.

767
00:42:59,039 --> 00:42:59,920
Speaker 1: What do you think about BOOTS.

768
00:43:00,320 --> 00:43:06,719
Speaker 4: I think that it's helped the community think about design

769
00:43:06,800 --> 00:43:10,119
systems and thinking more systematically about what we used to

770
00:43:10,119 --> 00:43:17,039
call star guides and or CSS frameworks. I think that

771
00:43:17,280 --> 00:43:22,119
it is. It was the most widely used I think

772
00:43:22,599 --> 00:43:24,840
UI framework for a very very long time. I'm not

773
00:43:24,840 --> 00:43:28,159
sure if it still is because I know there's things

774
00:43:28,199 --> 00:43:30,679
like Tailwind has become very popular.

775
00:43:32,400 --> 00:43:34,079
Speaker 3: But yeah, I used to work with.

776
00:43:34,159 --> 00:43:37,280
Speaker 4: Mdo who was one of the creators. He used to

777
00:43:37,280 --> 00:43:41,679
work at GitHub, and I think it's great that it exists.

778
00:43:41,760 --> 00:43:45,559
I haven't used it a ton because they I preferred

779
00:43:45,599 --> 00:43:52,199
a different technique for UI called often called functional CSS,

780
00:43:52,280 --> 00:43:56,559
which is sort of similar to Tailwind, although they're doing

781
00:43:56,599 --> 00:44:02,599
some other stuff now. So yeah, so I think that

782
00:44:02,679 --> 00:44:05,400
it's glad that it's exists and it's moved the industry forward,

783
00:44:05,480 --> 00:44:09,920
but I think it doesn't take out the need to

784
00:44:10,119 --> 00:44:13,840
understand CSS or front ends and javascripts.

785
00:44:14,159 --> 00:44:18,079
Speaker 1: Yeah, no, I agree. What I liked about it and

786
00:44:18,119 --> 00:44:21,000
what I still like about it is the standardization of

787
00:44:21,079 --> 00:44:26,039
class names so that people can easily create their own

788
00:44:26,079 --> 00:44:29,119
themes and they obviously there's a big marketplace for them.

789
00:44:29,119 --> 00:44:31,519
Some are free and some are for sale. But just

790
00:44:31,559 --> 00:44:36,440
by you know, changing out your Bootstrap men's CSS file,

791
00:44:37,800 --> 00:44:41,159
you know, everything can just completely change. And I kind

792
00:44:41,159 --> 00:44:45,639
of liked that about it, And I wonder if you've

793
00:44:45,760 --> 00:44:50,559
used some of those ideas in putting Primer together or

794
00:44:50,840 --> 00:44:53,519
did you have anything to do with Primer. Was this

795
00:44:53,800 --> 00:44:54,880
something that you worked on?

796
00:44:55,159 --> 00:45:02,199
Speaker 4: Yeah, yes, yeah, I liked the prim team about I

797
00:45:02,280 --> 00:45:07,519
think it. I started working on GitHub's CSS and Primer

798
00:45:07,800 --> 00:45:10,440
pretty much from when I started.

799
00:45:10,800 --> 00:45:12,920
Speaker 1: Sorry I'm looking right at it was right in your

800
00:45:12,960 --> 00:45:14,320
bio and I missed out. I'm sorry.

801
00:45:14,719 --> 00:45:18,960
Speaker 4: Yeah, so yeah, that's something I worked on for about

802
00:45:19,239 --> 00:45:21,559
I think it must have been about six years of

803
00:45:21,639 --> 00:45:26,360
my time at GitHub. It was just me and one

804
00:45:26,400 --> 00:45:33,360
other designer developer called John Rohan. Shout out to him,

805
00:45:34,000 --> 00:45:37,679
and so they had been developing primer before I joined.

806
00:45:38,760 --> 00:45:44,679
Marcado or Mdo as his username is on the internets, who,

807
00:45:45,159 --> 00:45:47,039
as we just discussed, was one of the founders of

808
00:45:47,079 --> 00:45:52,920
Bootstrap open sourced primer in twenty fifteen, about six months

809
00:45:53,079 --> 00:45:55,360
before I joined. And one of the reasons I joined

810
00:45:55,400 --> 00:45:58,840
GitHub actually because I was already working in design systems

811
00:45:58,920 --> 00:46:02,639
and I was really excited to see a company opening

812
00:46:03,159 --> 00:46:07,559
like open sourcing their company design system because it helped

813
00:46:07,559 --> 00:46:12,719
me learn what that meant when you're actually working on

814
00:46:12,760 --> 00:46:18,159
a product. Because things like Bootstrap, and there's other things

815
00:46:18,199 --> 00:46:21,280
like suit CSS and based CSS and stuff that were

816
00:46:21,280 --> 00:46:26,000
out the time, were agnostic to the product that they

817
00:46:26,000 --> 00:46:29,599
were used for. And while that was that's really helpful.

818
00:46:29,840 --> 00:46:32,840
It's a good way to think about working on a

819
00:46:32,920 --> 00:46:36,440
product and its design system because it helps you come

820
00:46:36,519 --> 00:46:39,440
up with a more robust solution. If you're thinking, what

821
00:46:39,599 --> 00:46:42,840
if this was an open source system and anyone could

822
00:46:42,960 --> 00:46:45,559
use it, how would I make this part How this

823
00:46:45,800 --> 00:46:51,159
make this pattern really reusable and intuitive? But you still,

824
00:46:51,199 --> 00:46:53,599
when you're working on a particular product like GitHub, you

825
00:46:53,639 --> 00:46:57,320
still have to, you know, make the system a little

826
00:46:57,400 --> 00:47:00,519
biased to that to actually support what the product needs.

827
00:47:01,199 --> 00:47:06,159
So so yeah, I am so I'm sure that mdo

828
00:47:06,280 --> 00:47:10,440
when he joined Influence Primer. But then it, yeah, was

829
00:47:10,519 --> 00:47:13,360
and I did work with him sometimes.

830
00:47:13,440 --> 00:47:15,679
Speaker 3: I also we also had.

831
00:47:17,000 --> 00:47:20,320
Speaker 4: I was a little bit bullish, I think when I

832
00:47:20,360 --> 00:47:22,920
was younger and didn't sort of go, oh my gosh,

833
00:47:23,000 --> 00:47:27,280
it's mark Otto, I should like just agree with everything.

834
00:47:27,400 --> 00:47:29,800
I was like, no, I think this way is better.

835
00:47:30,400 --> 00:47:33,199
And so we would have some like heated debates, but

836
00:47:33,360 --> 00:47:36,760
actually I think we both ended up really valuing that

837
00:47:37,360 --> 00:47:41,559
and I think you know that leads you to a

838
00:47:41,559 --> 00:47:44,119
better result if you have to sort of, you know,

839
00:47:45,079 --> 00:47:48,800
defend and explain why you think a particular approach was

840
00:47:48,840 --> 00:47:51,320
the right approach. And I, you know, I wasn't always

841
00:47:51,400 --> 00:47:54,639
right and he wasn't always right, but it was great

842
00:47:54,679 --> 00:47:57,719
to Yeah, it was a great experience.

843
00:47:57,880 --> 00:47:59,960
Speaker 1: That's a great spirit of learning though, you know, when

844
00:48:00,079 --> 00:48:03,679
you feel comfortable enough to you know, not be intimidated

845
00:48:03,920 --> 00:48:06,840
to the point where you can't express your ideas, that's

846
00:48:06,880 --> 00:48:09,199
a great working relationship that, you know, and I'm sure

847
00:48:09,199 --> 00:48:10,440
her respects you a lot for that.

848
00:48:10,679 --> 00:48:11,079
Speaker 3: I hope.

849
00:48:11,119 --> 00:48:19,039
Speaker 2: So this progression for GitHub's front end and so forth

850
00:48:19,119 --> 00:48:23,400
to react, is that just a componentization made sense? Like

851
00:48:23,480 --> 00:48:26,119
why do you land there when there's all these other

852
00:48:26,559 --> 00:48:27,920
web framework approaches.

853
00:48:28,119 --> 00:48:31,320
Speaker 4: Yeah, I mean it was quite a journey to actually

854
00:48:31,400 --> 00:48:33,039
land there, to be honest.

855
00:48:33,760 --> 00:48:36,360
Speaker 2: I like, is it worth it? That's a lot of work.

856
00:48:36,599 --> 00:48:40,599
Speaker 4: I mean, I don't think the stories ended there yet,

857
00:48:40,920 --> 00:48:44,679
so I can't tell you, but I can talk to

858
00:48:44,840 --> 00:48:47,119
a bit to the transition and how we got there,

859
00:48:47,599 --> 00:48:51,480
because I do think that is an interesting learning experience.

860
00:48:53,320 --> 00:48:57,440
So when I joined GETTHRB, I had just left Etsy

861
00:48:58,639 --> 00:49:03,639
where they had just started to work with React, and

862
00:49:03,679 --> 00:49:08,519
I things like CSS and JS frameworks, which I also

863
00:49:08,599 --> 00:49:13,159
know the community got pretty divided over. Things like styled

864
00:49:13,280 --> 00:49:20,639
components and emotion were coming out. Another popular part of

865
00:49:21,079 --> 00:49:25,320
that sort of systematic approach this library called style System,

866
00:49:25,960 --> 00:49:31,360
which was actually created by my husband before we were married.

867
00:49:31,480 --> 00:49:36,760
We just both apparently liked design systems anyway. That gave

868
00:49:36,840 --> 00:49:40,400
you kind of system props or what we now started

869
00:49:40,440 --> 00:49:45,760
to call variables or like tokens that you could bring

870
00:49:45,840 --> 00:49:51,039
into your components and styles, and so instead of identifying

871
00:49:51,119 --> 00:49:53,400
things a bit like you do with SAS, so you've

872
00:49:53,400 --> 00:49:56,559
got a SaaS variable. And now we've finally got CSS

873
00:49:56,679 --> 00:49:59,800
variables and they're supported everywhere. So a lot of people

874
00:49:59,840 --> 00:50:02,760
move being back to that. But that to me was

875
00:50:02,800 --> 00:50:05,320
when things clicked. I was like, Okay, I can see

876
00:50:05,360 --> 00:50:09,599
how we can build these components and do it systematically

877
00:50:09,599 --> 00:50:12,840
because we can share the system styles through something like

878
00:50:13,400 --> 00:50:17,360
style System. And so the thing that I particularly got

879
00:50:17,440 --> 00:50:20,800
excited about with React components is thinking of everything as

880
00:50:20,800 --> 00:50:21,960
a component.

881
00:50:21,639 --> 00:50:22,159
Speaker 3: Which is.

882
00:50:24,320 --> 00:50:26,679
Speaker 4: There's a whole blog post I think they wrote on

883
00:50:26,800 --> 00:50:32,519
thinking and React, but thinking in components and thinking about

884
00:50:32,679 --> 00:50:34,920
pulling this block up and being able to you know,

885
00:50:35,239 --> 00:50:39,960
place it somewhere else and have all the presentational code

886
00:50:40,199 --> 00:50:43,280
in that one component. Something about that felt really really

887
00:50:43,280 --> 00:50:47,599
good as opposed to, like, you know, working with CSS

888
00:50:47,599 --> 00:50:51,760
a chain. If you end up you can only you

889
00:50:51,760 --> 00:50:55,480
could use techniques like them if you've fhart of that block,

890
00:50:55,519 --> 00:51:01,519
element modifier or utilities, which where you would actually use

891
00:51:01,599 --> 00:51:09,199
important for good reasons to make those classes immutable. That

892
00:51:09,199 --> 00:51:12,280
wouldn't That would give you sort of a sort of

893
00:51:12,320 --> 00:51:15,360
some scope, but not really because it's still CSS. So

894
00:51:15,679 --> 00:51:19,920
what you saw with these with components is being able

895
00:51:19,960 --> 00:51:23,119
to encapsulate all the styles and all the stuff that

896
00:51:23,239 --> 00:51:26,840
is controlling the presentation and not have it leak over

897
00:51:26,920 --> 00:51:30,639
everything else. Right, And so that's why I was when

898
00:51:30,679 --> 00:51:33,480
I went to get heub, I was like, we need components.

899
00:51:34,079 --> 00:51:36,639
Actually didn't really care what they were builtn I was

900
00:51:36,679 --> 00:51:38,239
just like, we need components.

901
00:51:39,840 --> 00:51:42,679
Speaker 2: So and it's just that level of encapsulation that this

902
00:51:43,360 --> 00:51:45,719
one style doesn't leak across all of these things that

903
00:51:45,760 --> 00:51:48,159
it's sitting in a block and a wrapper or sometime

904
00:51:48,239 --> 00:51:51,079
that says this is related to menuing or this is

905
00:51:51,159 --> 00:51:52,280
related to images.

906
00:51:52,800 --> 00:51:55,079
Speaker 4: Yeah, yeah, absolutely. Do you want me to talk a

907
00:51:55,119 --> 00:51:57,719
little bit about how things evolved to gethub.

908
00:51:57,639 --> 00:52:00,480
Speaker 2: Yeah, No, that's exactly what I'm fascinated about. See how

909
00:52:00,480 --> 00:52:02,960
you get into trouble, right, You started with CSS and

910
00:52:03,000 --> 00:52:05,199
you're just trying to get those wrappers around it, so

911
00:52:05,599 --> 00:52:08,280
you get to view components and then that kind of

912
00:52:08,360 --> 00:52:09,079
leads to react.

913
00:52:09,559 --> 00:52:14,519
Speaker 4: It was actually not quite that linear, so so yes,

914
00:52:16,840 --> 00:52:23,639
CSS and using techniques like immutable utility class CSS, class

915
00:52:23,719 --> 00:52:29,679
selectors and and then using frameworks like them and SaaS

916
00:52:29,760 --> 00:52:31,719
variables and stuff like that, that helped.

917
00:52:31,760 --> 00:52:33,159
Speaker 3: And that was a great that it was a.

918
00:52:33,119 --> 00:52:36,519
Speaker 4: Really great way to introduce a systematic approach because we

919
00:52:36,599 --> 00:52:41,320
could update the Y without touching tons of markup and

920
00:52:41,400 --> 00:52:45,599
sort of blowing everything up. But we started to you know,

921
00:52:45,679 --> 00:52:49,360
get HERB grew from you know, being a place to

922
00:52:49,400 --> 00:52:52,519
sort of host and collaborate on code, and now it's

923
00:52:52,559 --> 00:52:58,599
got you know, we've got actions and security features and

924
00:52:58,760 --> 00:52:59,800
all those co pilots.

925
00:53:00,079 --> 00:53:00,159
Speaker 2: Like.

926
00:53:00,199 --> 00:53:02,360
Speaker 4: It was starting to grow while I was there and

927
00:53:02,440 --> 00:53:06,760
becoming difficult to really maintain, and we just couldn't get

928
00:53:06,760 --> 00:53:10,599
far enough with CSS alone. So we worked with some

929
00:53:10,639 --> 00:53:13,679
of the what was called the Web Systems team to

930
00:53:13,840 --> 00:53:19,760
explore components solutions, and so we definitely explored things like

931
00:53:20,840 --> 00:53:27,159
web components and they may have explored some other frameworks.

932
00:53:27,360 --> 00:53:32,239
React was an obvious one to explore because it was

933
00:53:32,639 --> 00:53:36,480
significantly growing in popularity. A lot of companies had already

934
00:53:37,039 --> 00:53:40,360
moved to community using that. So it's like a bit

935
00:53:40,480 --> 00:53:44,360
like you know, choosing an open source library, like does

936
00:53:44,400 --> 00:53:47,199
it have legs? Like are the community using it? Is

937
00:53:47,239 --> 00:53:48,679
it going to keep growing? Is it going to be

938
00:53:48,719 --> 00:53:49,800
there in five minutes?

939
00:53:50,239 --> 00:53:53,239
Speaker 2: Well, and again putting on your leadership had it's like

940
00:53:53,320 --> 00:53:54,719
can I hier devs that know how.

941
00:53:54,559 --> 00:53:56,559
Speaker 3: To use this exactly? Yeah?

942
00:53:56,679 --> 00:53:58,360
Speaker 2: Do I have the resources that are needed?

943
00:53:58,679 --> 00:53:58,920
Speaker 3: Yeah?

944
00:53:59,000 --> 00:54:05,320
Speaker 4: So we started to sort of do these experiments and

945
00:54:05,360 --> 00:54:08,079
then at some point I was just like I'm just

946
00:54:08,119 --> 00:54:12,119
going to put up like a prototype of what this

947
00:54:12,199 --> 00:54:15,400
could look like in React, and like, how I'm thinking

948
00:54:15,400 --> 00:54:20,400
about this and I'm not particularly good at JavaScript, but

949
00:54:20,719 --> 00:54:24,360
you know, no enough to.

950
00:54:24,880 --> 00:54:31,440
Speaker 2: We'll work in JavaScript and we all cause problems for others.

951
00:54:33,360 --> 00:54:37,400
Speaker 1: I do as much JavaScript as absolutely necessary, no more.

952
00:54:38,320 --> 00:54:41,960
Speaker 4: Yeah, well, the you know it's it was enough to

953
00:54:42,039 --> 00:54:44,480
be able to say this is what a component library

954
00:54:44,480 --> 00:54:47,840
could look like with using React. And I did a

955
00:54:47,880 --> 00:54:50,360
couple a couple of different techniques for how we could

956
00:54:50,800 --> 00:54:53,480
use it with CSS, so one with like a j

957
00:54:53,760 --> 00:54:58,320
CSS and JS solution and one of pulling in the

958
00:54:58,360 --> 00:55:03,559
class names from CSS. And then from there that started

959
00:55:03,559 --> 00:55:07,519
to get some legs and then we started building. We

960
00:55:07,599 --> 00:55:11,280
hired a full time engineer on the design systems team

961
00:55:11,639 --> 00:55:15,639
and they started to develop out the library, and more

962
00:55:15,679 --> 00:55:19,840
and more teams were starting to experiment with products that

963
00:55:19,920 --> 00:55:24,639
they were building in Reacting and as kind of experiments.

964
00:55:25,320 --> 00:55:30,119
And then during that time an engineer at get Hub

965
00:55:30,159 --> 00:55:35,280
called Joel Hawksgley had been working a lot in the

966
00:55:35,280 --> 00:55:37,559
front end and seeing what we were exploring with Reacting,

967
00:55:37,679 --> 00:55:42,960
came up with few Components, which is a Rails solution

968
00:55:43,320 --> 00:55:47,400
for components because as you might know, like was built

969
00:55:47,400 --> 00:55:52,760
in Ruby and rails, and so he ended up joining

970
00:55:52,800 --> 00:55:56,239
the team, which was which was great because even though

971
00:55:56,280 --> 00:55:59,079
we weren't sure what the future of get Her front

972
00:55:59,159 --> 00:56:02,119
end was, what we kind of knew is that we

973
00:56:02,159 --> 00:56:07,000
really needed to be building components instead of views, and

974
00:56:07,079 --> 00:56:10,679
so regardless of what we ended up using, view, components

975
00:56:10,679 --> 00:56:16,119
would at least be teaching engineers to thinking components. And

976
00:56:17,000 --> 00:56:21,159
so later on we ended up having a team ship

977
00:56:21,280 --> 00:56:26,639
a production app in React using Primer React components, and

978
00:56:26,679 --> 00:56:29,639
that was I think end of twenty twenty and that

979
00:56:29,880 --> 00:56:32,079
was or beginning of twenty twenty one, and that was

980
00:56:32,159 --> 00:56:37,639
the projects feature, and so that was exciting because it

981
00:56:37,639 --> 00:56:42,760
was getting tested in production like this is like not

982
00:56:42,840 --> 00:56:45,199
a hobby pro check, this is like for real now.

983
00:56:45,800 --> 00:56:52,280
And over time, the engineering orgue decided to thankfully move forward.

984
00:56:52,320 --> 00:56:55,559
I'm saying thankfully move forwards with React because for me

985
00:56:55,639 --> 00:56:59,599
it was more that, yes, this is well supported by

986
00:56:59,599 --> 00:57:03,440
the commune, but also it was really difficult trying to

987
00:57:03,480 --> 00:57:10,039
maintain like two systems, and so now we're now few components,

988
00:57:10,159 --> 00:57:14,559
is sort of going into sort of Katilo, and we've

989
00:57:14,559 --> 00:57:16,159
still got a lot of you I built with it,

990
00:57:16,239 --> 00:57:20,840
and it served a great stepping stone in moving to components,

991
00:57:21,280 --> 00:57:26,719
but now we're we're the future we believe is using

992
00:57:26,880 --> 00:57:29,519
React and so that's what teams are moving for and

993
00:57:30,199 --> 00:57:33,320
that's where we've invested our time and things like accessibility

994
00:57:33,360 --> 00:57:34,159
and stuff like that.

995
00:57:34,559 --> 00:57:36,400
Speaker 2: Do you know it makes a lot of sense?

996
00:57:36,719 --> 00:57:39,280
Speaker 1: Yeah, So do you want to talk a little bit

997
00:57:39,320 --> 00:57:44,360
about I know, Richard, we have always end our shows

998
00:57:44,440 --> 00:57:48,159
talking about AI, don't we We hate it because all

999
00:57:48,239 --> 00:57:51,360
of our shows lately have been about AI A llo overwhelming.

1000
00:57:51,760 --> 00:57:53,480
But for coding, you know, it kind of makes a

1001
00:57:53,480 --> 00:57:57,480
lot of sense. And what do you think the design

1002
00:57:58,679 --> 00:58:03,639
story is? We're with Jenny I going forward. You are

1003
00:58:03,639 --> 00:58:04,400
you bullish on that?

1004
00:58:05,199 --> 00:58:05,480
Speaker 3: Yeah?

1005
00:58:05,639 --> 00:58:09,639
Speaker 4: I'm I mean, look, I've been working at GitHub as

1006
00:58:09,679 --> 00:58:14,119
this has evolved for developers, and I've seen you know,

1007
00:58:14,239 --> 00:58:20,239
numerous design tools popping up and it's I mix. Honestly,

1008
00:58:20,320 --> 00:58:23,199
I'm excited to work with it because, if you think

1009
00:58:23,199 --> 00:58:25,960
about it from a designer's point of view, we've got

1010
00:58:26,000 --> 00:58:30,320
something new to design for which hasn't happened at this

1011
00:58:30,480 --> 00:58:34,480
scale for a while. Like the iPhone was like sorry

1012
00:58:34,559 --> 00:58:37,719
if you're sort of Windows are Android users, but like

1013
00:58:37,960 --> 00:58:40,599
that was like a really big moment when we're like oh,

1014
00:58:41,039 --> 00:58:45,239
you know, like mobile first design and you know, touch interaction,

1015
00:58:45,519 --> 00:58:49,679
touch screens and all those sorts of like haptics and things.

1016
00:58:49,920 --> 00:58:53,440
That was really exciting. So this is exciting from the

1017
00:58:53,480 --> 00:58:56,400
point of view of like there's new stuff happening and

1018
00:58:56,519 --> 00:58:59,199
problems that we don't know how to solve yet. So

1019
00:59:00,079 --> 00:59:07,320
I think it's funny though, because early days of jen

1020
00:59:07,400 --> 00:59:10,800
Ai and sort of the chat gbts and chat Ui

1021
00:59:10,880 --> 00:59:15,320
sort of coming out, there was definitely a school of

1022
00:59:15,400 --> 00:59:20,159
thought that didn't feel that we really needed designers for

1023
00:59:20,199 --> 00:59:21,320
this work, that this.

1024
00:59:21,440 --> 00:59:23,199
Speaker 3: Is we just need more engineers.

1025
00:59:23,760 --> 00:59:26,679
Speaker 4: And I think what has happened over time is and

1026
00:59:26,880 --> 00:59:29,800
certainly very much lately if you talk to anyone trying

1027
00:59:29,800 --> 00:59:34,119
to recruit designers, is we've realized that AI and Genei

1028
00:59:34,239 --> 00:59:41,079
specifically is really creating a mass evolution in user interaction design.

1029
00:59:41,480 --> 00:59:46,000
It's not taking UI away, and that although the sort

1030
00:59:46,000 --> 00:59:52,559
of chat interface is very much dominating a lot of

1031
00:59:52,599 --> 00:59:56,239
that those interactions, that's not going to probably be the

1032
00:59:56,280 --> 00:59:59,800
only type of UI that you need when you d

1033
01:00:00,079 --> 01:00:02,719
AI into to the mix. And we're certainly starting to

1034
01:00:02,760 --> 01:00:09,239
see that with things like agents, right, Yes, And so

1035
01:00:09,320 --> 01:00:13,800
I think now design is really important. It's an incredibly

1036
01:00:13,840 --> 01:00:19,119
important part of the stack, and it's going to be

1037
01:00:19,159 --> 01:00:22,960
about designing for intent and figuring out how to carry

1038
01:00:23,000 --> 01:00:28,519
that intent from those direct interactions in the UI, threw

1039
01:00:28,719 --> 01:00:33,280
into how we train models and then the end result.

1040
01:00:33,559 --> 01:00:35,199
Speaker 3: So I think it's really interesting.

1041
01:00:35,519 --> 01:00:38,199
Speaker 1: I just want to close the show by talking a

1042
01:00:38,199 --> 01:00:41,400
little bit about my experiences with using chat GPT to

1043
01:00:41,480 --> 01:00:45,880
do CSS. And at first, you know, last year even

1044
01:00:46,159 --> 01:00:49,559
it wasn't good. It wasn't good at figuring stuff out,

1045
01:00:50,239 --> 01:00:52,880
and it's gotten better recently. I don't know if you've

1046
01:00:52,880 --> 01:00:56,719
noticed this, but it's gotten better at you know, you

1047
01:00:56,760 --> 01:00:59,719
wouldn't say, you know, make me a design, but what

1048
01:00:59,800 --> 01:01:02,159
I would say is, hey, why isn't this working? Why

1049
01:01:02,280 --> 01:01:06,480
is there like a space above this element that I

1050
01:01:06,519 --> 01:01:09,960
can't figure out? Right? And then you give it? Could

1051
01:01:10,039 --> 01:01:12,800
I give it the CSS? I give it the markup,

1052
01:01:12,880 --> 01:01:17,559
and I actually take a snapshot of you know, the

1053
01:01:17,559 --> 01:01:23,000
browser tools, the source so it can actually see, for

1054
01:01:23,119 --> 01:01:25,599
lack of a better word, what's going on. And it's

1055
01:01:25,639 --> 01:01:28,639
been really good at solving CSS problems lately for me.

1056
01:01:28,719 --> 01:01:30,079
I don't know what's your experiences.

1057
01:01:30,239 --> 01:01:33,119
Speaker 4: Yeah, I mean I've been tending to use co pilot

1058
01:01:33,320 --> 01:01:38,199
for obvious reasons. I think I think I in my

1059
01:01:39,079 --> 01:01:42,400
in my head, I think I'll use chat GPT if

1060
01:01:42,440 --> 01:01:49,159
I want more like general knowledge or writing tasks or

1061
01:01:49,320 --> 01:01:54,320
I've definitely used it for working on talks or checking

1062
01:01:55,440 --> 01:01:58,639
fact checking, but then going and checking the sources.

1063
01:01:59,280 --> 01:02:00,760
Speaker 1: Fact checking fact checker.

1064
01:02:01,159 --> 01:02:06,360
Speaker 4: Yeah exactly, but it can help you sometimes get in

1065
01:02:06,480 --> 01:02:11,599
the right direction. So yeah, I've been also using Copilot

1066
01:02:12,239 --> 01:02:15,840
for that type of thing, and I think, yeah, things

1067
01:02:15,880 --> 01:02:19,159
are probably getting better because there's a lot of also

1068
01:02:19,199 --> 01:02:23,239
a lot of tools that are coming out where it's

1069
01:02:23,280 --> 01:02:27,000
working with a pre defined framework and so it's able

1070
01:02:27,039 --> 01:02:31,039
to give much better responses if you are just using

1071
01:02:31,159 --> 01:02:34,679
like a reacts framework or something.

1072
01:02:34,440 --> 01:02:38,079
Speaker 1: Like that, so you get hub. Copilot uses open AI,

1073
01:02:38,920 --> 01:02:41,679
so it's the and it can also use Claude.

1074
01:02:41,360 --> 01:02:43,599
Speaker 3: I think right too, Yeah, yeah you can.

1075
01:02:44,320 --> 01:02:45,719
Speaker 1: Do you prefer Claude for coding?

1076
01:02:45,920 --> 01:02:49,519
Speaker 3: I find that that is it depends.

1077
01:02:49,639 --> 01:02:53,960
Speaker 4: I mean there's like Sonnet for is like pretty that's

1078
01:02:54,000 --> 01:02:58,119
the new hotness, right, Yeah, it's actually amazing like how

1079
01:03:00,880 --> 01:03:03,280
these models have just been coming out faster and faster,

1080
01:03:03,360 --> 01:03:05,400
Like the gaps between when their releases is.

1081
01:03:05,360 --> 01:03:06,079
Speaker 1: Getting the time.

1082
01:03:07,880 --> 01:03:14,119
Speaker 4: Yeah, probably, but yeah, I think it's and then you

1083
01:03:14,199 --> 01:03:17,199
can you can use there's this I don't know if

1084
01:03:17,199 --> 01:03:19,159
you've used GI HERB models, but you can sort of

1085
01:03:19,280 --> 01:03:22,280
compare like models against each other so you can figure

1086
01:03:22,320 --> 01:03:25,119
out like which is the best one one to use.

1087
01:03:25,880 --> 01:03:28,199
I think that's something that's getting really interesting, is like

1088
01:03:28,239 --> 01:03:32,960
how much do we guide the user on which is

1089
01:03:33,000 --> 01:03:36,320
the right model to use versus pick it for them?

1090
01:03:36,400 --> 01:03:38,280
Speaker 3: So yeah, it's an interesting Well you.

1091
01:03:38,199 --> 01:03:40,440
Speaker 1: Can ask gpt at the best model to use it.

1092
01:03:41,880 --> 01:03:44,840
Speaker 3: I wonder what it will say.

1093
01:03:44,960 --> 01:03:46,960
Speaker 1: All right, well, we're just about out of time. Is

1094
01:03:46,960 --> 01:03:49,159
there anything else last minute that you want to mention

1095
01:03:49,239 --> 01:03:50,119
before we wrap it up?

1096
01:03:52,000 --> 01:03:53,800
Speaker 4: Yeah, I'm in between jobs, nest, so I don't have

1097
01:03:53,840 --> 01:03:55,320
like a last minute. Let me think for a.

1098
01:03:55,239 --> 01:03:58,960
Speaker 1: Second's a musician? I see a telecaster and a rolling

1099
01:03:59,079 --> 01:04:01,639
V drum set behind you. Who's the musician?

1100
01:04:02,239 --> 01:04:06,079
Speaker 4: I am the musician, so that's my I'm more of

1101
01:04:06,079 --> 01:04:10,000
a drama than a guitarist. I've had that kit for

1102
01:04:10,039 --> 01:04:12,880
probably about twelve years, so maybe I should upgrade it.

1103
01:04:13,159 --> 01:04:15,880
But it's Yeah, it's a rolling with Meshad, so it's

1104
01:04:15,920 --> 01:04:18,000
pretty nice. It makes me feel like a better drama

1105
01:04:18,039 --> 01:04:18,599
than I can't.

1106
01:04:18,639 --> 01:04:20,639
Speaker 1: The first K was a roll of the drum kit

1107
01:04:20,719 --> 01:04:22,639
with I really I loved it.

1108
01:04:22,880 --> 01:04:25,519
Speaker 4: Yeah, I had like an acoustic kit, but I can't

1109
01:04:25,559 --> 01:04:26,679
have an acoustic kit.

1110
01:04:26,840 --> 01:04:31,360
Speaker 1: Yeah, yeah, and I don't you're in the way of

1111
01:04:31,400 --> 01:04:33,519
the Telly. But I see that it's a Teley headstock.

1112
01:04:33,679 --> 01:04:35,280
Oh that is cool looking.

1113
01:04:35,440 --> 01:04:38,039
Speaker 4: It is a it's a Japanese remake and I think

1114
01:04:38,039 --> 01:04:40,800
it's a nineteen seventy nine telecaster.

1115
01:04:42,559 --> 01:04:45,880
Speaker 3: It's got these beautiful flowers on it. Yeah.

1116
01:04:46,360 --> 01:04:48,639
Speaker 1: And it is that your husband that plays that or

1117
01:04:48,679 --> 01:04:49,480
do you play that too?

1118
01:04:49,719 --> 01:04:52,480
Speaker 4: I play that too, but not very well yet. I've

1119
01:04:52,559 --> 01:04:55,599
I've dabbled in playing a guitar here and there. And

1120
01:04:55,639 --> 01:05:00,679
that was my midlife crisis by maybe not quite a

1121
01:05:00,760 --> 01:05:04,719
midlife yeah, but it was just like pre midlife crisis.

1122
01:05:05,079 --> 01:05:07,480
Speaker 1: You're welcome to have a crisis at any age.

1123
01:05:09,079 --> 01:05:10,280
Speaker 3: But it's it's nice.

1124
01:05:10,320 --> 01:05:13,880
Speaker 4: It lets me, you know, doodle rounds and sort of

1125
01:05:14,360 --> 01:05:15,360
sing and play a bit.

1126
01:05:15,480 --> 01:05:20,159
Speaker 1: So yeah, great, all right, well, wow, what a great

1127
01:05:20,599 --> 01:05:25,559
talk this has been. Thank you very much, Broccolini me

1128
01:05:25,800 --> 01:05:30,679
aka Diana Mounter, thanks for all this, and we'll talk

1129
01:05:30,719 --> 01:05:49,519
to you next time on dot net rocks.

1130
01:05:53,760 --> 01:05:56,440
Speaker 5: Dot net Rocks is brought to you by Franklin's Net

1131
01:05:56,559 --> 01:06:00,519
and produced by Pop Studios, a full service audio, video

1132
01:06:00,599 --> 01:06:04,679
and post production facility located physically in New London, Connecticut,

1133
01:06:04,920 --> 01:06:09,719
and of course in the cloud online at pwop dot com.

1134
01:06:09,920 --> 01:06:12,039
Visit our website at d O T N E T

1135
01:06:12,280 --> 01:06:16,320
R O c k S dot com for RSS feeds, downloads,

1136
01:06:16,440 --> 01:06:20,159
mobile apps, comments, and access to the full archives going

1137
01:06:20,159 --> 01:06:23,559
back to show number one, recorded in September two thousand

1138
01:06:23,599 --> 01:06:26,239
and two. And make sure you check out our sponsors.

1139
01:06:26,400 --> 01:06:29,440
They keep us in business. Now go write some code.

1140
01:06:29,760 --> 01:06:35,360
See you next time. You got j middle Vans and

