Welcome to another episode of Web Joy. I'm excited to have Jenny with us today. Jenny, say hi to the
listeners. Hey, Eddie. Nice to be here and excited and thanks for having me.
Well, it's my pleasure. Thanks for, for coming and joining us. If you don't mind, just give us a general overview, right? Who you are, what you do, where you work, those just kind of high level details.
Yeah, so hi, nice to meet everyone. I'm Jenny. I'm one of the lead designers at Atlassian, and I've been leading Atlassian design system for the past three. and I started as a web designer so many, many years ago, just like designing, developing, and it's kind of nice that like the industry's evolved into systems and stuff. So I feel like all these hybrids have kind of found a home in design systems.
That's awesome. Well, very cool. So that's interesting, right? You started out as a web designer, you know, now kind of looking at design systems and stuff like that. So kind of how did you get involved in tech? Right? What was that first thing that said, Hey, this web stuff, I'd like to work with that. And then kind of what did that journey look like? Right? How did you get from web designer to leading design systems at ala?
When I was in college, actually, they didn't really have any kind of web design courses and I had already started delving into H M C S S and making basically like Sailor Moon fan sites on, you know, like on Zoom and like AOL and all, and then Geo Cities and stuff. And so I really wanted to learn a lot about like, not, not only like web design, but like just creating and crafting. And bring it to life.
So that's why it was like super interesting cause I like to customize and, and like code and bring it to life. So only thing I could major in in college was computer science. That's the closest thing. And then like I remember during one summer, I just. Took the design, like the design one class and I just was just like super amazed and like I think I learned Illustrator in that class and then it led into the flash class and all that stuff. So I kind of like started doing it on the side.
And so it seems like my hobby kind of became my career, which is really cool cuz I start taking on internships and stuff just to do web design. And funnily enough, when I graduated, like I didn't know what to do cuz I was like, oh, I have computer science degree, what should I do? So I actually applied for a QA job, uh, which is funny. At Lockheed Martin, I was actually there for almost seven years. Oh, wow.
Uh, and instead of a QA job, they saw my internship, um, and, uh, kind of like resume history. And they've realized I was more of a web designer. So I actually, uh, created internet sites and a bunch of other web design sites, uh, internally for Lockheed for many, many years. And then from there, kind of went on to some startups and then Shutterfly and kept jumping between like design and development, joined a front end team.
And then when I was at Udacity, I was a their first front end design engineer and it was really cool because I think I had left Shutterfly cuz I was a front end developer there and I was just like, oh, I missed design so much cuz I was just strictly coding emails and just coding, landing pages and stuff there. And I was like, I really need to be in a role that. lets me, you know, explore both at times.
And so that startup Udacity was really awesome cuz they were basically like, we embraced generalists and they very much like entertained the idea of having hybrids on the team. So, uh, that we were one of the two UX engineers there and it was around there that we kind of fell into like rebranding Udacity. We built a front end framework for. And around that time is when, you know, the buzzword design system started buzzing and we're like, oh, actually we're like building a design system.
That's where it kind of led, led from.
So I love that you're doing Sailor Moon , you know, like fan sites. I actually back in the day, did like Final Fantasy fan site. Definitely is not well designed in any yes phrase of the word . But uh, it had some fun final fantasy music playing in the background. Like C midi files,
right? MIDI files. Exactly. animated Kiss banners flashing . Eddie: That's awesome. And yeah, I think mine was so stunt Geo Cities. So definitely fun when is like, yeah. You know, you got into it just by doing a fan site for something that you love and always just like right click and just like exploring. Inspecting the code.
Yeah, yeah, absolutely. That was like, you would find someone's website that did something really cool and then you're like, oh sweet, I want that. So you right click it, you look at it, you copy it and yeah. Piece it over into
yours. Yeah, for sure. Extending everything. I think it's funny cuz I think. People who like us, that have been around, we have like coded layouts all the way from like, I like frames to like tables, to like, you know, Daves to all the way to grids. It's
kind of funny. Yeah, it's definitely evolved right from like really painful. To like less painful to now actually, like with flex box and Flex Grid and stuff, it's like, oh my gosh. Like . Yeah. Yeah. What could we have done 20 years ago if we had this
? Jennie: I still remember when we had to make rounded corners on tables, you had to like export like the rounded corner in that tiny, you know, that tiny corner and put that as the image and then have that repor repeated row background, and then have spacers. Oh my. Yeah. Memories . Yeah. Oh my gosh, that's so funny.
I actually just recently had a podcast with Miriam Isaac, who was a designer, and we were talking about design back in the day, and she was talking about, yeah, that you basically had to make these rounded corners, right? And then you had these, like you had to do the background color. Yeah. Like you couldn't have transparency, so you had these weird like triangles in the corner to like make your round.
Corner and yeah, like the spacers, like you said, you'd have like what a two pixel width image that you then are like, okay, repeat this horizontally, , or, you know, repeat this vertically to like create these fancy borders.
Yeah. I think it's like really funny how we had to have those kind of workarounds, but I, I think it actually contributed to making me super, like, detail-oriented and like looking at the pixel. You know, because I kind of like, it's part of my, my job now where we're like really inspecting and looking at everything super deeply.
No, definitely. Right. To break it down to like, what's the smallest piece here? If you have this thing, what kind of repetition exists that you can kind of, let's shrink this down to 10 pixels and just repeat those 10 pixels and like, it makes a pattern, I guess it's like pattern making in a way.
Yeah. It is breaking down everything to like modules and building blocks. Right. Just like for, for systems. Yeah.
That's awesome. Yeah, it's, it's so funny, like you said, I think a lot of people who do UX engineering, I don't have many design skills in my mind and my body and my brain. So like I understand design aesthetics, but I'm really bad at like, Coming up with stuff when it's an empty page. But so I really value people who actually are like true UX engineers where they actually have like full design skills and engineering skills. I think it's really interesting, like you were talking about how.
Companies didn't really know what to do with that at first. Like it was kind of like, okay, you do this job or that job and like you said, there was a lot of bouncing back and
forth. There's a little bit of pigeonholing too back then. I feel like, ah, there was like one point where I remember my manager was like, you have to choose one or the other. In one role and I was like, I can't, you can't make me, I can't choose . Eddie: I love the both . So do you think when you were working right in a job that had to do one type of thing, were you doing the other like as a hobby on the side to keep up the skills and kind of work out that passion?
What did that look like for you? Hmm. That's a good question. I feel like, I think I'm. Kind of doing extra work back then on the side, but then it just seemed like the stuff that, if it's not the actual work, you're kind. Translating for the other parts. So for example, like if I were like a Shutterfly as a friend and developer, but then I still was like the translator between design and engineering, you know? So I was still, I feel like still applying skills there in that way.
And then now it's kind of like, if you think about it, I, I transitioned from engineer, so I, I was coding for like, I don't know, 15 years or so, and I haven't coded in two years, which is kind of scary . But like now I've transitioned to a design role, right? And so sometimes I'm like, oh, I really, I might be a little bit behind on engineering and stuff, but I just see it as like chances to, like if I can't do both, cuz it's not like right now my role is not officially doing both.
because I'm in a, like the team is like full of hybrids and like the stuff that we're working on is so interconnected. I don't miss coding. I just basically can oversee it, but, and I have a whole team of engineers that can do all the coding instead. Right. So I'm kind of like seeing it as like you basically can flex. Your muscles and whichever skill that you want to focus on.
And so I guess right now in my career, I'm just like, oh, I really want to explore the design side again and really focus on that. And if I need to jump back to engineering, I can, but it's just focused a little bit differently
right now. Nice. No, that's awesome. So I guess what. Is it right that keeps you excited and interested in working in the UX engineering space? Right. To be balancing, I guess, what is it about design and engineering and, and maybe the way that they work together that kind of keeps you feeling like, yeah, this is where you want to be, this is what you want to be doing.
It's like a constant, it's not a problem, but it's just a constant challenge that all teams. Because you know, whenever we have the full team, we do definitely have design and engineering and even our team is a design system team. Even before when I first came, they were a little bit siloed and also had, we still have like challenges to work out and through. And so I feel like it's always interesting because there's always someone or the other side to teach.
, you know, so whichever side there is, there's always some, a teaching moment that we can all learn together and grow together. And I think, um, our team is especially evolved because like we had a lot, a whole bunch of engineers and a very few designers, and now I feel like they're closer because of the wave. We've kind of emphasized like us. Like pairing and like really doing handshakes instead handoffs because everything is so interconnected.
So even if say like the engineering team needs to look into something, we always have at least a design representative there. And so, and it's the same way, vice versa. There's never like a soul led, like craft led siloed kind of initiative. Everything is really cross craft and we're very intentional about that. And I think that's, Teams thrive when the design designers and engineers are like really working and collaborating well. So I feel.
This space is super interesting cuz there's millions of teams that are having the same problem. And like, once they hit that magic kind of like point, I feel like there's always this like, ah, I didn't realize things could be this way, or I didn't realize, you know, I could pair with an engineer or designer, you know, that way. And I, I feel like it creates different hybrids. So it's like a lot of people think hybrids are designers and engineers.
I have content designers who are also engineers or I have engineers that are interested in content, you know, and or design, right? And so it's like a big mix. I feel like as, as they speak into cross the kind of their like sole paths and just like interject, they can see that they actually can become better designers or better engineers by learning about the other craft and having more empathy.
Yeah, I definitely, like you said, having people made up of hybrid skills. I think something else that's really taken off lightly in the engineering space is where engineers will switch between being managers and being individual contributors. And so they'll go and they'll be a manager for several years, right? Yeah. And then they'll shift back into being an individual contributor and like the things that they learn while being a manager makes them a better individual contributor. I agree.
design has the same. Yeah. So I think, like you said, all of that, like mixing and melting of skills just makes people have more, be able to do more in their individual positions. Mm-hmm. , and it just brings. So much more value. I think it's definitely really cool.
More empathy, better communication, work more effectively together, cuz you understand the other side a little bit
more. Exactly. Yeah, I love that. In this podcast we like to talk about what brings people joy. Obviously we've started to tiptoe into these waters cuz it is what you do. But, um, what is it that brings you joy and you know, that you'd like to talk about today?
I have been thinking a lot lately about, like myself as a designer and engineer, and now we're on design systems teams, so we're building the tools for other designers and engineers to work better and more effectively. Right. And so I've been really thinking about like, Them being in the flow. It brings me joy when the things that we provide are helping them be more effective and be better designers and engineers, for example.
So that's like my wish and like my goal all the time is like to build things to make them in the zone, in the flow. Cuz it's like, isn't it such a good feeling when you're like a designer engineer and you have a system in place, or if you have like, you know, whatever personal processes in place and like you get a problem to solve and you're just.
Super in the zone focused and you're like coding or you're just like, really, like designing all these and or, or exploring all these things and like you're just not disturbed by like the tools or, or the processes that you are in, you know? So like, it feels super, I remember feeling super good. That feels joy, right? Like that makes me feel like a great designer, a great engineer. And I feel like I would love to get other designers with engineers feeling that same feeling.
That's awesome. I love that. Yeah, because nothing breaks flow more than like, Something that's small. Little details. . Yeah. Right? Yeah. Something that, yeah, especially something that's broken, right? It's like your framework, your tooling or your components and you like, you put it there and it doesn't quite do what it needs to do, right? Yeah. Like it just doesn't quite fit. Um, like a puzzle piece that's just off and you're like, You've gotta be kidding me. Like
. Jennie: It's super fun to think about that and put ourselves in their shoes cuz it's like very super little detailed things that maybe not, might not be a big deal, might actually be really delightful for like, for them in their workflow. Cuz that's what we're trying to do. We're trying to like keep them in their workflow to do the best work they can and be in that flow in that state. Nice. Absolutely. Well, that's one thing that we've been talking about.
My job is that we don't have a lot of whimsy in our website and app right now. Mm-hmm. . And so it was like, well, how do we start getting more like little animations or whimsy or things like that? And it's like, well, we don't have the bandwidth to like, have every front end engineer focusing on adding whimsy. Like we need to actually build things that are useful. Mm-hmm. to our users.
And so one thing we were talking about, I was like, well, what if we find ways right to add variation in whimsy into components that we're building out? And then just like allow those to be selected by different attributes. So when the developer is like using the component, they can be like, oh, let's give this little like flourish one or flourish two or something, you know?
And. It allows it to stay true to the design language, but also allows it to be more engaging and a little bit more alive, so it's not so static.
I actually think about that Atlassian because we're, we're expanding in terms of brand and personality, so I feel like ways that you can kind of do that is by having strong principles and values in place. And so for example, like we have design principles and one of them is to be bold and optimistic and practical with a wink. So that little practical with the wink part, I feel like is the little whimsical stuff. And it kind of like shows up in different ways.
It could be through the ui, it could be through the content and the way they're expressing the words, and then that, that what you're speaking. For about the components, like we're thinking about evolving the parts in our system. Cuz right now our system's 10 years old, so it's a little bit old and we need to evolve it to be a little more flexible. So to do that, we're thinking about really evolving them to be a little bit more composable and configurable.
And it's in that configurable part where I see like product teams being able to like express themselves a little bit more, whether it be through like expression, through like design tokens and a little bit of theming, allowing the brands to be a little bit more personalized. Like Confluence is like an editor, so it may be a little bit more personalized. And then there's like, you know, Trello is like more of a fun brand.
Let them do a little bit more fun stuff and they have a little bit more micro animations. And then there's like other tools and products that we have are more like less personality. So we are saying those are less flexible, you know, so those are more like, oh, they all look the same, they're very Atlassian and stuff like that. So we kind of have this spectrum of that whimsy that, that you're kind of talking about through different.
Yeah, definitely. Well, and I think that's interesting, right? When you get to be working at a company with so many different products, like you have to be able to account for that as opposed to companies that just have one or two products and they can be like, these things are pretty similar. Maybe they just have different color schemes or something, but that they, yeah. The rest.
But when you have, to your point, right, a text editor that needs to be a lot more customizable and then, you know, just very different kind of brands and tools and kind of expectations that the users have. I guess, how do you all approach that, right, to build a design system that. Is encompasses everything that you need, but is also flexible, I guess, what do you keep in your mind to kind of try to keep that balance?
Mm-hmm. , that's exactly why I mentioned that we are evolving in the system. So we have a new vision and strategy for the next three to five years, and it's really brilliant building a little bit of new infrastructure under the hood. Um, some design tokens, some primitives and stuff to enable and we're moving from this like kind of enforcing previous. Everything was very like, super glued together and stuck in a way, kind of stuck in the past ca and kind of thing.
So now it's like we're trying to be more open and empowering and stuff. So our new design system principles is one of the, the principles are foundational, harmonious, and empowering for everyone. So it's like foundational. We want everything to be this base set, high quality, you know, accessible, performant, everything that should be table. That everyone can build upon. Harmonious means we want everything to work together as a family.
So that means a family of, could be Atlassian family of brands, but we also want all the components to be more composable. And you know, we're, we're abstracting primitives out to like help people be able to compose their own specific product specific patterns. Cuz we can't build every pattern for every product. And then the last one is, yeah, sure. Talking about empowering for everyone. So we're trying to make the system self-serve, you know, really high quality, accurate documentation.
Ha offer things like advocacy to like start teaching and, uh, upskilling everyone. And also just like make the system as intuitive and self-serve as it can be. So it can empower more than just designers and engineers to more. So like project managers or maybe just even someone who wants to change roles and learn how to like code or design and stuff. So we're trying to empower everyone. So we're moving from a enforced kind of older system to a newer, more open empowering design
system. We're doing something similar. So at Glassdoor, you know, we've had Glassdoor for a while and we've started to incorporate in our kind. Business side of things where employers log in, like interfacing with Indeed. So now we've got the Glassdoor brand and we've got the Indeed brand, um, cuz we're owned by the same parent company. Mm-hmm. And now we just bought Fishbowl. Right. Which is an anonymous social network. And so that has to get integrated.
And so you've got kind of three brands now and we're looking and saying, well, How do we operate right as the new glass door that isn't just the standard traditional glass door of several years ago. And so that's actually, we're creating a new design system and component library from scratch starting this year realizing that, hey, we need to be more adaptable. We need to be able to hit different use cases. Yeah, so I love that. Both of our companies are kind of in similar moments right now.
We're like, all right, how do we grow to have design systems that meet the company of today?
Mm-hmm. so much scale, so much expansion. So much complexity. Yeah. A lot of
stuff. Balance, exactly. Mm-hmm. Jenny, thank you so much for joining us today. It's just been a pleasure to chat and get to know you, your story, and kind of hear how design systems excite you.