Episode 434

Natalya Shelburne on Design Engineering

Natalya Shelburne is out guest to talk about her work at the New York Times, the importance of job titles, design engineering, design systems, and 2020 hot takes and soapboxes: childcare in the pandemic, education, and conferences.

Tags

, , , , ,

Natalya Shelburne

Web // Twitter

Front End Developer, The New York Times

Audio Player

Time Jump Links
  • 01:52 What's design engineering?
  • 07:40 Generalists vs specialist
  • 14:45 Sponsor: WooCommerce
  • 16:59 Does corporate culture set us up for this?
  • 22:25 Building systems for content at the New York Times
  • 29:37 The growth of design systems
  • 33:30 Sponsor: Framer
  • 34:47 Design Systems mapped to a technology
  • 40:22 Parenting during COVID-19

Episode Sponsors

Job Mentions

Check out all jobs over on the Job Board. If you'd like to post a job, you can do that here, and have it mentioned on ShopTalk for a small additional charge.

Transcript

[Banjo music]

MANTRA: Just Build Websites!

Dave Rupert: Hey there, Shop-o-maniacs. You're listening to another episode of the ShopTalk Show. A podcast all about front-end Web design and development. I'm Dave Rupert and with me is Chris Coyier.

Chris Coyier: Hey!

Dave: Hey, Chris.

Chris: I'm doing great. In fact, I don't know if you've read anything that I've written in the last year. Some of my stuff that's been bouncing around in my head so much and that I've done talks and essays about is what's going on in the world of front-end development just from my perspective and how wide that world has gotten, how much more responsibility there is and how weird it is but also cool it is and confusing it is and all that. There's some more we can talk about too because a lot of times I focus on just the front-end dev code part of it, too.

But of course, it has to do with back-end development too. Then I often don't talk about the design aspects of it, which I'm probably leaving out a little bit too much there. We have a guest that I think can help bridge some of that gap and talk about some of that as well as ten other fascinating things. I'm so excited to have her on. It's Natalya Shelburne. Hey, Natalya.

00:01:36

Natalya Shelburne: Hi! Excited to be here.

Chris: Hey. Yeah, thanks. [Laughter] Sorry. I didn't mean to blindside you with that intro, but you have a book out that's kind of on this subject with some co-authors, right? Maybe we can start with the book. Do you want to do the book thing?

Natalya: Yeah. If you haven't had too much spare time in 2020 to read, you may be unaware that there's a new book called Design Engineering and it's published by InVision and it's all about, I would say, not the gap but the intersection of design and engineering because, as we all know, we're constantly working together and trying to figure it out.

Chris: Yes!

Natalya: And maybe even stepping on each other's toes.

Chris: Yes! Oh, there's just so much to go here. Just the title even, Design Engineering, what's that? Does that term come up at work?

Natalya: I have to say, the credit for the title goes to Aarron Walter. He is an amazing writer. You probably have heard of his stuff like Designing for Motion and just is a legend in the field.

When we started this project, he and I had this conversation at Design Exchange in Sydney. I'm just like, "We've got to name this thing, this work that's happening right there between design and engineering and the hybrid and everything. We've got to do better." I absolutely agree. We've got to do better than unicorn because the fact that everyone knows what I mean when I say that just further supports the fact that there is work being done and we need a name for it.

Chris: I know what you mean, I think. I have my own guess at what a unicorn means. That gets thrown around a lot. What do you mean by it and why is it a problem?

00:03:20

Natalya: I don't think -- I actually love when somebody calls me a mythical creature who can just sprinkle magic on their team and is like, "You're just going to make stuff happen and it's going to be good. Just come on in. This bottleneck weird process-breaking stuff, we'll just put you in and it'll disappear magically." That sounds really, really cool until it's time for--

Chris: You should charge accordingly.

Natalya: Precisely. How do you promote a unicorn? How do you train a new unicorn? We've just decided you need more unicorn skills.

Dave: I want to be a level 2 senior unicorn.

Natalya: Yeah.

Chris: [Laughter]

Dave: Applying.

Natalya: I'm not against the term. I think it's really cool and cute. I love identifying as a unicorn in my spare time, but not at work. At work, I want a real title with a career progression and recognition of the value that I bring to the team because if you don't really recognize what this work is, if you don't name it, if you don't look at it and examine what are the skills involved, you can't really throw those.

Chris: You can't replicate it.

Natalya: Yeah.

Chris: Yeah.

Natalya: You just end up kind of being like, "Well, I guess it's just some innate magical thing, and then, when this person left, it disappeared and we don't know what to do. I guess we could just try sitting new people next to each other again and hope it works again."

Obviously, it doesn't work. Even if it did on a small scale, it just won't work if you just try to get lucky over and over and again.

Chris: What are we talking about, the work? We're talking about somebody who is, say, a visual designer who has got a great vision or whatever with their team of what some digital product looks like but they don't have the complete skill set to pull off their vision, right? Then developers get involved who can look at that design, think about it, talk about it, and figure out how it's going to be translated into code and stuff. Those people need to work together, right? Somebody needs to--I don't know--wrangle them?

Natalya: You just identified hot take number one today.

Chris: Okay.

Dave: [Laughter]

Natalya: Unicorns aren't limited to design and engineering.

Chris: Okay.

Natalya: I think that's just the ego and hubris of the people involved here that we've just even claimed it. There are unicorn people who are between product and engineering. There are unicorns all over your team who are able to bridge between disciplines and the many people working together with different skill sets. We have these people doing this bridging work all over the place.

I think kind of a consequence of a lack of respect for design or a pigeonholing engineers into this, like, "You just execute," and these artificial binaries we've kind of adopted in the industry that we can't quite shake off these early stereotypes that have created this idea of, like, "Well, there's just this chasm between these two disciplines for whatever reason.

It's like, yes, design and engineering come from things from a different mental model of how stuff should work and there is a translation that should happen between those two, but it shouldn't take a mythical creature to be able to do it. There are skills. It's a solvable problem. it's just, we haven't yet matured to solve it at scale.

Chris: A unicorn might be someone who just has skills as a bridge. Is a unicorn a bridge then?

Natalya: I mean to mix metaphors, really, I would just say let's raise our expectations and not call someone a mythical creature when they can do two things. Let's reserve that for the person who can come in and knock it out of the park on lots of different things.

Names matter and when you call someone a mythical creature who can collaborate well, that kind of sets a weird, like, "Oh, well, you don't have to actually be able to collaborate well. That's reserved for mythical creatures."

Dave: Yeah.

Natalya: It's kind of like this idea, like, words matter and they set a precedent and the expectations you have of people will shape reality.

Dave: That's an interesting cultural point. Calling somebody a unicorn, it's sort of like adding this burden, this expectation on them that they can solve all weird discrepancies between two different disciplines, or whatever.

Natalya: And it's handy wavy. It's like, yeah, you can just do that. Yeah.

Dave: The magic does that. That person does that and they'll figure it out until they leave the company.

Natalya: Mm-hmm.

Dave: In a blaze of glory.

Chris: [Laughter]

Dave: I just read this book called Range by, I think, David Epstein is the name of the author. It's kind of a celebration of the generalist. Do you think that is kind of also maybe in the wheelhouse here, somebody who has multiple disciplines or has been exposed to different, I guess duties in a company or an organization?

00:08:05

Natalya: I guess to give you kind of background of why I'm talking about this so passionately is, my master's degree is in talent development and creativity. Essentially, what that is, I spent my graduate studies learning about how do people acquire mastery in any discipline, especially in the realm of creative, so divergent thinking. It's a big mix of psychology and education.

For me, when I see these things happening in tech, it just sets off this lightbulb of, like, "Oh, I know this! I know this!" When you're saying the generalist, there's this myth, both in education and it follows us all the way into the workforce that you can be good at math or art but not both.

Dave: Mm-hmm.

Natalya: All the research and science says, actually, if you're pretty good at one, you're probably going to be pretty good at the other. Do you put your time into those things or not?

Chris: Hmm.

Natalya: That binary between, look, you just either get to be logical or creative. They're like, "No. Really creative people can be very logical at the same time. Those are not at odds." But the myth persists.

What is the idea of a generalist? To me, it just seems like someone who has deliberately practiced their skills across a spectrum and has not siloed themselves into one. It's not a judgment call to say specialist versus generalist. It's, follow your own innate, like, who do you want to be? What do you want to learn? What do you want to pursue?

What I try to speak out against are the arbitrary barriers that we've inherited or created ourselves that we don't examine because, if left unexamined, an arbitrary barrier can absolutely derail your entire career, can squash a curiosity. It can have you specialize in something you might not even like just because you think that's where you're supposed to be.

Chris: Oof.

Natalya: I feel like, in a field of people that are so creative and imaginative and so good at building world-changing stuff, that seems like a silly thing to accept without really looking into it.

Dave: Nah, that's a great -- because I feel very much the same. I am a developer. I feel like I self-identify as a developer. But by no means am I just this committed neckbeard, "I want to code all the time." You know it's like I'm more interested in the exploration and building things.

Natalya: Mm-hmm.

Dave: Maybe I have to do some design. Maybe I have to do some development or even business crud. All that stuff mixes together. It's a slurry of stuff that makes things.

Chris: How do we best talk about it, then? How do you? Is there a title that would make more sense for you, Dave?

Dave: Oh, yeah. I'm curious in this design engineering idea because Brad Frost is somebody I think of - Design Systems, Brad Frost. His job title is a designer but I guarantee you, right this very minute while we're recording this podcast, he's writing React components.

Natalya: Mm-hmm.

Dave: But he considers himself a designer because he found [laughter] in his world of ad--whatever--working in ad agencies, he just was like, "If I call myself a designer, people start listening to me because they think I have the ideas," or whatever. That's an interesting--

Chris: Isn't he freelance too, though? Does that mean that he has to write really careful emails to those clients to make sure that he's presenting his work in the best possible--? That's a different skillset too, isn't it, because he probably doesn't have a project manager since he's such a small -- he's a team of one or it's him and his brother or whatever?

Dave: Yeah.

Chris: I don't know. What do you call it? I don't know. Let's just agree to never say unicorn again.

00:11:44

Natalya: I mean in your spare time just not -- in your hiring practices. That's all I'm looking for.

Chris: In your hiring practice.

Natalya: Yeah.

Chris: Yeah. Yeah. Yeah.

Chris: I also want to eliminate design helper from the lexicon.

Chris: [Snickers]

Dave: [Laughter] That's a no for me. No.

Chris: My week, I spent one day all in Figma, almost all day because I wanted to scope out -- I was wireframing, but we have such a nice little design system in Figma--shout out to Claire. Good job--where you can just drag stuff in. It's almost easier to use our real components than it is to make a box. Anyway, I was in Figma. I was defining gradients. I was having fun in there scoping stuff out. I felt like a designer that day, but I had a big meeting the next day, so I spent it all in Notion, getting meeting notes together, because I was responsible for sharing some information, so that was going on.

I did one whole day coding because we changed up our Prettier config and we needed a new Git user in order to commit the code that was on Git but not have it look like Chris Coyier changed 752,000 files. That felt pretty … stuff, so I need a new title too - Everything Doer Level 4.

Natalya: I would just say it's really interesting. Again, I'm a career switcher into tech. I come from the nonprofit world. I taught painting, art, design, and these things, these conversations don't even really happen in this way, like, how would we call ourselves? Am I a painting teacher or a design teacher? You teach art. Whatever.

Don't worry about it. Why are we talking about this? This is just such a waste of time. You're going to be given a million things you don't even know how to do. Figure it out because it's a nonprofit and it's all your job.

This idea of siloing yourself, actually, to an outside -- I guess I'm not that outside anymore but I still identify as a career switcher into tech.

Chris: Mm-hmm.

Natalya: We are much more multidisciplinary than our tech discipline allows us to be. I feel like the more our companies scale or the longer you go in a career, you can't really switch between career ladders. Go switch from being an engineer to a designer. Good luck. No, you have to commit and go for it. You're just going to become a sharper, sharper point over time.

I feel like you have to fight to become more and more multidisciplinary, and that's strange because that's, again, at odds with how humans are wired up. We're meant to be curious. We're meant to try to waste our time on side projects and silly pursuits to just exercise our creativity. I feel like, again, it's a cultural kind of reflection of the culture that we all feel this tightening around us with but, actually, I can be a developer and a designer, depending on the day. It still feels a little odd. Yeah.

00:14:40

[Banjo music starts]

Chris: This episode of ShopTalk Show is brought to you in part by WooSesh. That's woosesh.com. It's a conference all about WooCommerce, which is of course the big, excellent e-commerce plugin for your WordPress sites. It powers tons of e-commerce on the Web.

You know who uses it? I use it. I use it on CSS-Tricks to power our MVP memberships and we sell our posters through it. I've been just having a wonderful time learning again about the world of e-commerce and selling things online. It's been going great for us.

I'm so interested in this conference because it's all about that. There's a State of the Woo, which is the WooCommerce team telling us what's going on with WooCommerce, what can we expect, what's happening, because it's such an actively developed piece of software. That's so cool.

A lot of these sessions and, again, this is a free conference coming up October 13th and 14th. I'm recording this for the ShopTalk Show that drops October 12th, so this is, like, tomorrow. If you're listening to this right as ShopTalk Show drops, get in on this.

There are sessions for improving your store. There's a section here on smooth checkout tips and understanding sales tax challenges, which has been changing lately, and about optimizing your WooCommerce sites and ajaxing your WooCommerce website, all these things that you can do to make your site better, which is so directly tied to how much money you make. WooCommerce is a way to monetize websites and sell things, virtual things, real-world things, scheduling things. It's just super powerful e-commerce software. I love it and it's so cool.

Conferences that are focused so tightly around one technology are often my favorite conferences because everybody is there for the same reason. Anybody that you talk to understands where you're coming from and what kind of technology you're using. That's so great. Again, that's woosesh.com and it's totally free, so you should go.

[Banjo music stops]

00:16:59

Dave: Does corporate culture set this up in some way? I think of a product manager or somebody who is like, "Oh, I need a developer to make the develop-y thing," you know, or fix a bug or something. They kind of have an expectation of what they want.

Sometimes, companies are organized entirely based on these roles. There's an engineering department. There's a product design arm and those have two different funding mechanisms, and then different management trees and all that. Even one is CapEx and is OpEx spending. Does the corporate culture only geared to produce these specialists and it's not welcoming to generalists?

Natalya: You're just like hot take number two. [Laughter]

Dave: Okay. I'm going through the hot takes.

Natalya: We, as individuals, exist in an ecosystem, right? I feel like for developers, designers, we're like, "I can just do anything. I'm an individual and I can do anything. I have this magical machine, this computer in front of me."

You hear the message, "You can disrupt the world. You can change the world as an individual." Don't forget you're part of an ecosystem and you exist in a system that has incentives, it has rewards for certain behaviors, and it has structures that you exist in.

I will scream this from the rooftops. An individual cannot overcome a structural or organizational problem. You will burn yourself out trying to do that. Recognizing where you are is just as important as recognizing who you are and what you can do.

To give you an example of that, it's one of the favorite questions I like to ask when people talk about, "Well, collaboration. Just sitting next to each other." It's like, great. You have a designer and an engineer sitting next to each other. They're right here. Their monitors are touching. They're just right next to each other.

Chris: [Laughter]

Natalya: And they disagree. How far do they have to escalate it up the chain before there's an intersection and someone can resolve it or--

Dave: In my experience, God himself has to intervene.

[Laughter]

Natalya: Yeah, or is it the loudest, meanest--

Dave: Oh, that's a good one.

Natalya: --steamrolliest person that gets their way?

Dave: Yeah. Yeah, let's do that one.

Natalya: Then you're like, you will just reinforce the behavior. You have just reinforced how it's going to work.

Chris: Okay.

Dave: The sneakiest. The person who is like, "Yeah, yeah, yeah, and then they do it their way."

Natalya: Backchanneliest, secret meetings.

Dave: Backchanneliest.

Natalya: I mean I don't know. However it works. It's again -- to me, my background is in psychology, too. It's just like people are really predictable. The saddest thing you can do is pick up Psychology 101 and realize -- you're just going, like, "Oh, my god. That's me. That's my coworkers. That's everybody. Oh, my god." [Laughter] And this is the first book in a whole series?

Chris: Mm-hmm.

Natalya: Essentially, it's true, though. It's realizing that you have to look at your organization, the structure, society as a whole, and realize that it's an ecosystem and, as much as you think you can do everything alone, it's just not how it works.

Chris: Isn't it outside an organization too? For the record, titles for me, just because -- whatever. I'm not trying to do another hot take, but they haven't mattered a ton in my career. I've been at tiny little companies and I feel like I can sell myself in what I do okay. I've never really had a title that meant anything that important to me.

But I had a roommate who was exactly the opposite. He worked at an ad agency. It was a big ad agency. There were lots of people at it, you know, hundreds, thousands.

He would bounce around jobs sometimes. When he would get a title change to a better title because it was accompanied by a raise, a promotion, or whatever, that was really meaningful and not only really meaningful at that job because, cool, high five, more money, up the ladder. It mattered when he would move jobs too because it meant he could move from that title to that same title somewhere else or similar.

That other company understood what that title meant. There was meaning across companies.

00:21:15

Natalya: I have to tell an anecdote of why I'm like, "Titles are important. Flat hierarchies don't work for me."

I really, really hate how many times I would have a cool, techie conversation with someone and there'd be this moment where you could see a shift in their eyes and be like, "Whoa, you're really smart." And they'd say that out loud, like catching themselves off guard almost.

Chris: Hmm.

Natalya: Not even realizing that's not a compliment and that means, like, right before this moment, you had some not so good assumption about me. It's like I could tell the intent was good. I could tell, like, something was crunching, some cogs were moving in the brain, but it's just like, "Man, a title just cuts down the time between," like, we can just get to work. I can just start, where I don't have to be like, "Let me go through my entire history. Here's my YouTube. Here are all the talks." We can just get to work.

Chris: Yeah.

Natalya: Again, part of why I'm against unicorns too, it's like, it's real cute but are you going to be like, "Yes, we have brought in an expert unicorn to help us with"? You'd be like, "I don't know." It cuts down the time to just getting to work and I super appreciate that, personally.

Chris: Speaking of getting to work. You're at the Times, the New York Times, four years, two elections. It's been a while, huh? Some of your perspective is from that, right? You can't help it. That's the world you live in. How is that going?

Natalya: I cannot believe it's been four years. It feels like it was just yesterday that a young me was like, "It's October. We're about to get a woman president." [Laughter] 2016 is going to be bright.

But, no, it's been a really interesting time because it has not been four years at the same team or at the same company. We've grown a lot. We've changed a lot.

I have been on teams where we are prototyping new ideas. I've been on the core product. I feel like I've gotten to work with so many different people and so many parts at the Times.

It's been really, really cool, but I can sum it up one way. When we were still going into the office, it would be like, "We're sitting in a cool conference room talking about our Jira tickets." Then right outside, because I was working in the newsroom, would be a giant TV with all the headlines running. I'd just be like, "I can't. I can't pay attention."

Chris: [Loud gasp]

Natalya: [Laughter] Did you all see what happened? Oh, my god.

Dave: [Laughter]

Natalya: It's been definitely an interesting ride where you really cannot unsubscribe from anything.

Dave: Do you think this design engineering role helps with the speed of news? I imagine somebody who is capable in multiple disciplines, or knowledgeable, can eliminate a lot of back and forth or throwing over the fence. I think in your book you call it kind of a handshake model, not a handoff model.

I feel like a lot of people I know who work in news orgs tend to be kind of multidisciplinary and they know how to make a chart and they know how to give it the right data and make it the right chart that tells the right story or something like that. Do you think this sort of hybrid role or unicorn role is necessary for or helps, I guess, news organizations?

00:24:40

Natalya: That's a big question, but the handshake process, actually, too, was Adekunle's chapter, which was just really fantastic. I've just got to give him credit because he's awesome.

My title is Software Engineer, and it's very standard, so I'm not a design engineer but in terms of my reputation and the teams that I've worked in, it's very much like we need a front-front-end engineer, even though on paper there is no distinction yet. I would love to say that I have the title that I wrote the book about, but it's more of looking to the future. Look at the work that I'm doing.

Dave: Hey. Stake the claim.

Natalya: Yeah.

Dave: I remember when content strategy came out and it was like, "What is this?"

Natalya: Mm-hmm.

Dave: We call it words or whatever. [Laughter] I just was like, "I don't see why this is a thing." But now, fast forward five, ten years or whatever. I'm like, "We need to hire a content person to figure these things out because there's a mess and it needs to be cleaned up by somebody who does content really well."

You said front-front-end person, so do you see design engineering kind of fitting more on the front of the front-end? Is that--?

Natalya: Um, you know, I would say that's also a complicated answer. It's really whatever team you're a part of, it feels like everybody has their own definition, so I definitely, by no means, want to say that my own anecdotal experience should transfer to everything. But in terms of the work that I do, I work very closely with designers and product people. For example, the newsletters that the New York Times sends out, I was tech lead on that, which actually is a team of all women, which I'm really super excited about.

Chris: Wow.

Natalya: It just happened. It was a beautiful, like, "Wow. Did it just happen? It did."

It was a team of all women and we built a design system for all of the newsletters. We took down the creation of a new newsletter from, like, man, it took like a month to spool one up to get everything, all the legacy stuff together--

Chris: [Loud gasp]

Natalya: --to two minutes.

Dave: Wow.

Natalya: Where you just click on it, which was very timely for the Coronavirus newsletter, which you can't just take a month to spool up critical information for people. That I'm really proud of.

But the work that I do is working with design and engineering and it's basically exactly what I say in the book. My background in design and my understanding of the medium of coding and software, seeing the decisions a designer makes and being able to translate them into code more effectively without losing those design decisions or just not seeing them or not understanding them exactly in the right way, being literally able to translate them into the medium has really served me well and it has been, for my projects and products and the teams that I've been on, it's been really awesome not only for kind of like the good vibes and everybody feeling good, but also for actually getting stuff to market faster.

Chris: Wow. I feel like I need to hear more about this newsletter design system creation process thing. Did it start at--? I mean, how are they authored? Did you make a fancy CMS for them?

00:27:59

Natalya: Well, man, there is just so much technology, really exciting technology at the New York Times. We're hiring.

Chris: Mm-hmm.

Natalya: No, uh -- [laughter]. One of the things that we try to do is make sure that the workflow of editorial layer and internal client and what they want, like, we are there to serve their journalistic mission however it's best. And so, we have to work with that.

The part that we were really working on, on our team, is, like, uh, okay, how do you make a bunch of React components that then compile into a cool email, depending on mix and matching components? Anybody writing a new newsletter can just say, "I want a heading, some content like this, this, this, and this, and I want to Lego block it together, and I want to just schedule a send."

For us, it was really just getting out of the way, adopting all of the old legacy template-based, like old, you know, "Oh, we'll just do this one quick one. It's one-off. Don't worry about it," and then, ten years later, it's still in use.

We took everything, tidied it all up, and put a little bow on it so that 80% of our newsletters were being sent out through this cool generator. Then, the last 20%, we could just be like, "Let's just put all our love and care into making these the best ones because these are the flagship ones we really care about." That's cool.

Chris: Yeah. Yeah, that's wonderful. Thanks for that. Design system is a big part of that. Kind of no wonder that you're -- I don't know. Let's talk design systems. You live in that world a bit and we're a big part of this recent Clarity Conference, yeah? Gina's thing, right? That one.

Natalya: Yep. [Laughter]

Chris: I think that's right. [Laughter] Fantastic. It seems like that's been growing and growing and growing and the world is more and more interested in design systems. Perhaps it's comparable to the growth of content strategy like Dave mentioned. It was a little abstract five years ago and now is like, "We need design systems people."

Natalya: Yeah. I mean I see it. You can call it design systems. What I've found, if anybody is wondering about, like, "How do I get adoptions?" just call it modern front-end practices. [Laughter]

Chris: Ooh!

Natalya: This is just what everyone else is doing now and it's working well. There's a pattern of kind of workflows, governance, and kind of component libraries, all that stuff. There's a pattern emerging of what this is and companies that embrace it and invest in it tend to be doing better than companies that are like, "That's a nice to have in the future. That's future talk."

If anybody is really trying to get that adoption, just call it that because it almost feels like nobody had to argue for version control, like, "Let me get some adoption." Really? No, it's just a good thing. It works. Let's do that.

Chris: Hmm. Yeah. You have to be a little tricky about it, still, perhaps. Yeah, I don't know. Maybe that's not the correct characterization, but I remember listening to a Dan Mall talk recently where he had the same sentiment, like, don't pitch it as, "Hi, company. Can we work on your design system?" You kind of let the design system come along for the ride with some other initiative. Like, "You want this project done? Well, as a part of that, we're going to build it like a design system."

Natalya: Yeah.

Chris: Kind of a ship it.

Natalya: That's exactly it. It's not like you're sneaking it in. It's more like you're just doing it the modern way and then be like, "Yeah, I'd like that. I'd like the modern way of working on it."

Chris: [Laughter]

Natalya: Yeah. Great!

Chris: Cool.

Natalya: It's a design system surprise. You own one now.

Chris: like with responsive design is kind of an assumption these days. You want a website design; we're not going to sit down and talk about whether we're going to do it responsively or not. You just are.

Natalya: Yeah. You've just got it.

Dave: Is there a shift, though, that has to happen? You know, "We snuck it in. We snuck the design system into the newsletter. Good job, us." But now, 200 newsletters are using the design system and now you need a governance layer, almost this whole from a service to a product or--what was it--a product to a service?

That shift has to happen at some point? Is that hard for you or companies you've experienced?

Natalya: Well, I would say it didn't just happen and I definitely didn't sneak it in. It was a team of amazing people all working together towards the common goal of, like, this is how it's going to work. This is how it's going to work on the engineering side. This is how it's going to be designed on the design side, very consistent, like we agreed on the constraints and editorial was very much lockstep like, "Okay, that's how we build a newsletter." It was very much a coordinated effort and that's why it worked.

If you don't have somebody gatekeeping or saying, like, "I really like the status quo. It's really working for me to be bespoke," or "I don't really want to do this." If you don't have somebody fighting you, it's actually such a better way to work that it'll work.

I would say odds are if it's just failing to take off where you are, it might be that there's just not enough of an executive champion or somebody who can kind of say, like, "Hey, look. You're just blocking this whole thing from happening. Maybe you're not the right fit for the team." Right? That might just be. It might be just like a people problem, not a design system problem.

You can't pitch design systems to someone who is like, "I don't want to do them." [Laughter] There's no amount of being like, "But look at these beautiful style guides," to somebody who is like, "I am not interested in that."

00:33:34

[Banjo music starts]

Chris: This episode of ShopTalk Show is brought to you by Framer. That's framer.com/shoptalk. Go there. Sign up for free or get 20% off any paid plan. That's very generous. Thank you, Framer.

When you've spent hours designing something beautiful for the Web, the last thing you want to hear is, "Uh, sorry. Uh, we can't build this." You know? Uh. Uh.

What you need is a tool that bridges the gap between design and development. Framer can be that bridge. It's a browser-based prototyping tool that enables designers to use code-backed components and dynamic transitions to visually express ideas. When the time comes that you, perhaps as the designer, are giving it to a developer, the developer can jump in and easily inspect the elements, get the CSS or the JSX right from there.

Custom animations custom-built with Magic Motion. It's powered by Framer Motion, which is an open-source library that's awesome, that you should check out, for React. It all comes with a complete, clean code, which can be taken right from Framer and you can move it right into production. It's the gap. Framer is the bridge.

Sign up for free or get 20% off any paid plan by visiting framer.com/shoptalk. That's framer.com/shoptalk.

[Banjo music stops]

00:35:03

Chris: I don't have nearly as much experience as you two do, but the design system thing is a little easier to pull off when you're talking specifically about a website and that website is using Vue or React or Web components or something because then the components that get built map to the technology. You're like, "Here's a card," and it's represented as a card both as a design document and mentally and in the code. There's like this one to one across the whole tech stack.

But then I think of a newsletter and I'm super sure that your newsletters aren't React. Maybe they are, but that would be weird.

Natalya: They totally are until they get magically unicorned into an email. [Laughter]

Chris: Are they really? Oh, my gosh!

Natalya: It's very complicated. Please don't ask me about it.

Chris: [Laughter]

Natalya: I've archived all that knowledge at this point.

Chris: Okay, but that's cool. So, you found a way to make it one to one until the last minute, and then it just gets turned into an email, and then it gets sent out. But mentally, it still works that way that the design system kind of maps to code that is a component?

Natalya: Yeah, and that's, I guess, hot take number three. You've got it.

Chris: Hmm.

Natalya: A big reason of why I'm a designer who works in code is because I very much believe that the medium really affects the decisions you make. When you're working with React, you're more likely to work, like, start thinking about things in components and pieces and states and things like that where you understand what the medium wants you to do.

When you're working exclusively in, like, Figmo or some prototype, like whatever button is easier to reach, that's the one you're going to reach for more. Just being aware of that, kind of the influence on your work and your decisions based on the tool you've chosen to embrace for getting your ideas out there is huge. I like that you brought that up.

Chris: Yeah, nice. I would love to -- gosh. I want to look behind the scenes. Don't you, to see what it's like?

Dave: Well, no. I think, a lot of times on the show, we say, "Oh, the tool you choose doesn't matter because the output is what matters." You know? I think there are these invisible kind of artifacts from the technology you choose that show up in how you build it.

I like Nuxt specifically in Vue. I like Vue for a lot of reasons, but I like Nuxt because it comes with this concept of pages. You build pages. Pages build your whole application. I like that, but maybe I need to think without them, or maybe when you think without them, you're not thinking of the whole entire product. I don't know.

Natalya: I absolutely embrace the idea. Coming from an art background, I'm going to see it through that lens. Essentially, it's like, do you choose a paintbrush? Do you use charcoal? Whatever medium you choose to use, it's going to change how you render any kind of visual. It's still you. It's still your artistic eye. It's still your mind kind of making these decisions, but you're going to shift the way you work based on the medium you choose. I absolutely see, whether it's frameworks or programming languages or Sketch or Figma, whatever tool you reach for to get an idea or a concept or something out, I feel like it's kind of like this back and forth, like, I both decide which tool to reach for but then the tool definitely influences how that idea comes out as well.

I feel like just being aware of that is kind of neat because the work is very creative. I feel programming is creative. Design is creative. I think we all get along because we're all about patterns. There is just so much more overlap than there is of a kind of complete opposite end disconnect. I think just considering why you reach for the tools you reach for is a cool way to get to know how you like to work, what about your work intrigues you, and how to choose the next tool you might be interested in.

Chris: I love that. I like the art connection, too. The paintbrushes is such an obvious one. If all you have is this collection of thick paintbrushes, you're going to make thick lines when you paint, probably, or it'll be hard to do anything else.

Natalya: Yeah.

Chris: Then if somebody asks you, "I thought our design direction was thin lines?" You're going to be like, "All I've got are these thick brushes." The tools in front of me are--

Dave: I only do chunky.

Chris: [Laughter]

Natalya: Somebody comes in and it's just like, "Look. I've got this stick and it's got some hair on it. We've got this colorful goop. We're going to make a whole renaissance scene here with that." It just sounds impossible.

It's like, you know, nobody is coming in. Painting is broken. CSS isn't broken. It's just a complex tool that you can use to do a lot of things. I feel like the metaphor really holds up.

If you're drawing with a pencil, it's a lot easier to draw lines than to try to make planes and shading and all that stuff. It absolutely influences the decisions you make.

Chris: Fantastic. Maybe we'll switch gears a little bit here. Why not? We only have so much time. We've got to hit all the hot takes. We've only had three so far. That feels a little low.

Natalya: There are so many more.

Chris: [Laughter] That feels like a little low, so Dave's printer just went off. That's an important thing to talk about. Did one of the kids decide to print some coloring book pages?

Dave: Yeah, I think we're getting some coloring pages. A couple unicorns, so whatever. Hey.

Chris: Yeah, so we're all parents here.

Natalya: Mm-hmm.

Chris: Of young children, so how has that been? Aren't you in New York, too?

Natalya: Mm-hmm. [Laughter]

Chris: Yeah. [Laughter]

Natalya: Mm-hmm.

Chris: Which is a little different than how it hit out here in the middle of the woods.

Natalya: Yeah.

Chris: [Laughter]

00:41:05

Natalya: I'm not going to give you the full, like, unloading that I'm going to do on my therapist one day. Just the surface level of it is, you know, I've been talking about childcare at conferences or having a remote option at conferences or kind of saying flexible work, remote hours, not just as a moral thing but just as a, like, think about the people we're missing because now they're just right blow that threshold of able to access or able to contribute or able to be part of it.

Chris: Yeah.

Natalya: 2020 has just shoved a whole bunch of new people over that threshold where suddenly they're on the other side suddenly having to consider this, like, "Oh, no." [Laughter] This is literally impossible for one person to accomplish or two people to accomplish. The expectations are horrible. I'm being asked to choose between my child's wellbeing or my ability to have a job, which is tied together - all these things.

Everybody is going through this terrible time and it's really revealed a lot of the disappointment of, like, well, we choose to disrupt so many things but not any of the things that seemed to make life good. [Laughter] We just kind of skipped over that because we got free lunch and we're like, this is the height of technology, right? We get free lunch and ping-pong.

Right now, I would say my hot take is this. It's just to look around and see the immense creativity and potential possible to actually build a better world. We're actually seeing a lot of it in New York right now. Contrary to popular opinion, it's pretty cool over here now. Things are much better than March and April. I can tell you that.

Chris: Mm-hmm.

Dave: I heard it was a giant anarchist zone. That's what I've been reading on the old news.

Natalya: Well, if you read an article in the New York Times about it, I think the definition of anarchy is that when things all fall apart, people will naturally turn to mutual aid. In that definition, I think it's very much true. People have really been banding together. There's live music in the streets again. There are just so many people, communities coming together to make it really, really good again, especially for kids and everything.

There's just a lot more work to be done. I think we've been able to hide our kids, our lives, our chaos, but we can't hide them. No Zoom background can override the child needing to print something or asking for help with homework. I think it reveals just how much work there is to do.

Dave: I think, quite literally, the first week of the pandemic, it was like -- and I've worked from home forever, so the kids know the deal. But I think the first week, the daughter comes in on a call and yells she has to poop and requires assistance from a parent. You're just like, "Oh, man. Here it is. This is it."

I think it took me until the summer for my mind to shift from, "Okay, this is just, whatever, school is out," to like, "Oh, this is it for a while, until I don't even know." You know? I guess, what sort of systems or--I don't know--tech or an app can solve this problem, surely? What do you think the core needs are for, whatever, parents, working parents, any parents during a pandemic or children?

Natalya: Oh, man. That's like the hot takes 4 through 30 coming up.

Dave: Okay. I have a few on educational software.

Natalya: I'm just going to bullet point through them.

Respect for education. Everybody is screaming you need a CS degree and nothing else to be in tech. I'm like, "How is homeschooling going?" I've got a Master's in Education and, boy, am I glad for that right now. You need all different kinds of education. You need different kinds of people with different kinds of backgrounds because there are so many different expertise to be had.

Valuing education: You can see now, for anybody teaching their kids while trying to work, you realize how hard teachers work. They work super hard and that deserves a lot of respect.

Access to childcare. Man, it is so much harder to get than you'd think. Just accessing it is just like the Holy Grail. Like, finally, I have reliable child care I can count on. It's almost impossible to do well in normal times, not to mention during a pandemic where it's just like, you're actually not allowed to talk to people. Don't even have anybody come near you. How are you supposed to be a person when you can't access these things that can help you just be part of society?

Then, finally, just the idea that anything can be solved through coding. Oh, my god. The number of people I see trying to solve education who are like, "You're a lifelong tech person. You know absolutely nothing about education. Please just talk to a teacher." [Laughter]

Dave: [Laughter]

Natalya: Oh, my god. Please don't. Please don't. Your expertise is not needed. Please stick to what you're good at. You should not disrupt education. It is already -- it does not need you. It needs your support to teachers, your support to the people who have this expertise. Please don't assume. Don't let your ego get in the way. This is not your time to shine. Help the people already doing the work, is just my slogan of 2020. Hot takes all day if I could. [Laughter]

Chris: That's a very good one. That's my favorite new one, you know, that all y'all tech geniuses--

Natalya: It's not to say you're not a tech genius. It's more like, just accept that you have limits and that's cool. That's okay. You would never accept somebody walking into your meeting and telling you how to build your app. You'd be like, "Who is this clown? Get him out of here. They don't know anything about our users, our client, whatever." What makes you so confident that you can walk into a classroom or a teacher or anywhere and say, like, "Here's how you should do schools. No problem."

Chris: "I know what you need."

Natalya: "I've seen kids on social media." No.

Chris: [Laughter]

Dave: [Laughter]

00:47:11

Chris: What happened with all this conference stuff? Your article has a little premonition ability. The title of your article is wonderful. It's "What if childcare was as standard as coffee at conferences?" [Laughter] That'd be nice, wouldn't it?

Natalya: Mm-hmm.

Chris: But then the pandemic came and it made it possible for more people to go to conferences but, in a way, just as hard, right? Because your home life, now you're caring for kids at home where you almost definitely don't have childcare to just disappear into a four-hour Zoom call with meetings or whatever. Did it get better or worse? Is there any reason for any optimism for what we learned?

Natalya: I mean the overwhelming response when I would talk about access to childcare, it's really removing the barriers to access these events. For example, I went to a women tech makers event and I had to be the first person asked for, like, "Hey, actually, I'm still breastfeeding and I need a pumping room with a fridge. Do you have that anywhere in the Google complex?" They're like, "Yes, we got you. Here's a stipend for childcare." I was like, "Great. I can actually attend this thing on a Saturday. This is so incredible," without having to rely on the free labor of somebody else giving up their time for free for me.

There were already these little dominos, little pieces getting -- like we're starting to carve out these places and then this, boom, 2020 happened. It feels like we're just all set back in so many incalculable ways. There are people leaving the workforce in record numbers because they can no longer keep this unsustainable pace up.

For me, the optimism comes from the curtain has been peeled back and we see exactly how desperate it's been this whole time, how reliant on free labor or cheap labor, like undervalued. Not cheap by any means because now we also see how hard people work who are in child care. How much we've been just cobbling together this barely working, barely reliable system to stay afloat and to stay part of the workforce and that we can and should do better for people.

If tech can change the world, let's start with things that really would make a huge difference for anyone who is a caregiver. That would be cool. That I would be like, "Take my money, please. Let's do it."

Chris: How is it in New York? Are people sending their kids to in-person childcare again? Is that starting to happen?

Natalya: Yeah. After seven months of no childcare, and we're in 500 square feet and it has been a very difficult time to be locked up like that with a toddler. But New York has really -- I mean I'm very proud of the work people have here. You go outside. Everybody is wearing a mask and it is taken very seriously here. There are daycares that have been open for essential workers this whole time, and they figured out exactly how to be much more careful. Daycares have reopened as well.

We're at under 1% infection rate right now, as of today. I keep track of the numbers every single day. We are where we are after a huge amount of work and sacrifice. I have to say, seeing New York -- so I'm in Midtown Manhattan. Seeing New York for months be so empty that I could cross, like going to get some food, I could just cross any avenue I wanted without seeing a single car in the distance, so quite that one time I cheered when heard a honk because that meant there were two cars out there.

Dave: [Laughter]

Chris: [Laughter]

Natalya: Seeing life and creativity return is really, really incredible, and seeing people take it seriously and do it safely is really incredible. That's whether it's with schools, with the remote learning. I won't tell you the nightmare that Zoom for toddlers has been, but we did it, both a parent group and at the school. Technology has been both amazing for bringing everybody together but also a terrible dystopian nightmare because you should not be on Zoom that much. Nobody wants to be in front of a screen that much all day.

Dave: Yeah. I have big feels about that. [Laughter]

Natalya: Yes.

Chris: I hate to say it, but I've done some virtual conferences and I've gotten stuff out of it. It's interesting to see how big the numbers have been. I'm a little less interested, only because I spend so much time on Zoom anyway, that it's hard for me to stomach the idea of, like, well, then take a whole day off of work and just stare at Zoom all day. But it's been working.

People have been eating it up. I feel the anomaly; I feel like the numbers are way higher, that the tech for them has gotten a lot better. It's been kind of cool to see. I'm encouraged by the return, should we beat this thing and get back to reality, that now there can kind of be both. I don't know. We've taken what we've learned from this worse year ever.

00:52:08

Natalya: I feel like there was a moment for me when I had that shift of, like, "Hey, are things going to be back to normal or no?" Like Dave said, "This is it. We've got a new normal. This is me now. We didn't get Star Trek. We got Mad Max, and we're just going to figure this out."

Dave: [Laughter]

Natalya: "This is the future." I sat on my stoop with one of those, like, the only restaurant open for, like, many, many blocks in Manhattan, which is just like the one place to get anything in March, I went out, got myself a cocktail.

Chris: Chipotle.

Natalya: No, it was a local -- it's called Handcraft, a local place on 3rd Avenue.

Chris: Mm-hmm.

Natalya: I got one of those Kool-Aid bottles, like you would have in your lunchbox, but it's full of bourbon.

Chris: Whoa!

Natalya: It was like double cocktail. They were just like, "Look. They're to-go now. That's legal now, so it's cool." I sat on my stoop and just thought about it. I was like, "Oh, my god. This is really stressful." But you know what? This is now a new timeline, new me. I'm just going to drink this cocktail and think about how can we make it good.

For conferences, for example, how can you make a remote conference good? What if you just put aside, "Oh, it's remote. It's not as good as in person." What can the Internet be?

For Clarity, there were games, prizes. They mailed us swag. They had a bingo board. We had chatrooms that really mimicked being in it, you know, like, "Hey. Who are you?" Your one-on-one icebreaker meetings that mimicked being middle school and being on AIM. [Laughter]

Chris: You had one-on-ones? Wow!

Natalya: Oh, my god. It was just so stressful. But we had these icebreakers where they're like, "All right. In just a minute, we'll have some questions for you and you'll be paired with a random person in this room to just talk one-on-one. It was just like -- that was way more interaction than you would get in a normal, like, in-person conference.

Chris: I've heard it given lip service to, like, "I know you're missing the one-on-one connection with people, so we have breakout rooms," or something, and the promise doesn't seem as fulfilled, but a true one-on-one is something else.

Natalya: Big shoutout to Isaac and Nessa, the organizers of Kick-Ass Conferences. They put on a fantastic one where I would just say, like, if you want to see what the medium -- like we're all in. The Web is this thing. It connects people across the world. It's like, time to believe in that yourself and attend a digital conference.

They throw a really great one where, I have to say, even participating in it, I was just like, "Can it really rival being in New Orleans with everyone like we were supposed to be?" I have to say it did.

Chris: Oh, crap. Clarity was supposed to be in New Orleans?

Natalya: 2021, here's hoping. [Laughter]

Chris: That would be awesome.

Dave: I've appreciated -- we should probably wrap up here. I know we've got a hard stop, but I've appreciated just other adaptations too. Hey, a conference doesn't have to be all day.

Natalya: Mm-hmm.

Dave: It can just be three hours. I'm like, yeah, I'll do that because I can do the work I was having to do anyway. I hope it gives birth to more brainstorming and thinking. But on that, I know you have a hard stop and we have a hard stop, so we should wrap it up.

Thank you, Natalya, for coming on the show and sharing about design engineering and all your hot takes. We really appreciate that. For people who are craving more hot takes and want to give you money, how can they do that?

Natalya: Can they give me money? Is this what this show--? [Laughter]

Dave: Hey, if you've got something to sell, we give people an opportunity to … their goods.

Natalya: No, just support your local designer, developer, artist, whoever you've got who is affected by 2020. Check in on people and--I don't know--do a kind deed today because it has been a rough year for everybody. I have to say, I think one of the best silver linings has been the many old connections and new connections that I've made because we have to get through it together.

Dave: Awesome. Well, thanks. Thanks again, and thank you, dear listener, for downloading this in your podcatcher of choice. Be sure to star, heart, favorite it up. That's how people find out about the show. Follow us on Twitter, @ShopTalkShow, for tons of tweets a month.

If you hate your job, head over to ShopTalkShow.com/jobs and get a brand new one because people want to hire people like you.

Chris, do you have anything else you'd like to say?

Chris: ShopTalkShow.com.

More episodes!