21. Making Your Visual Designs Work Harder For You (feat. Kelley Gordon, Digital Design Lead at NN/g)
34:42 Share

This is the Nielsen Norman Group UX Podcast. I'm Therese Fessenden. There's this common myth about visual design that it's a purely aesthetic endeavor. But if you pull back the curtain and see the work that goes into these visuals, you'll often find a lot more than just a good color palette. So to explore this topic in more detail, I spoke with the mastermind behind a lot of our digital design these days, Kelly Gordon.

Kelly is the digital design lead at NNG, but before NNG, she was a UX designer at IBM. Fun fact, she also has a few pending US patents related to search rules, communicating users' tone, and a cognitive information assistant. In this episode, we talk about her journey to UX design, what has helped her grow as a designer, and we break down what visual design really entails. ♪

So I don't actually know the story of how you got into visual design and UX as a whole. So I would love to hear a little bit about how you got into this field. Sure. So I actually went to school for graphic design. I originally thought I wanted to do architecture because my grandfather was a practicing architect in India. And I just always thought that was really cool. I kind of grew up around that. But I had a friend in school who,

And this is actually in high school. He was a little bit ahead of me. And he was in the graphic design program at NC State. And he was like, I know you and I think you'll love graphic design way more than architecture. So I went for it. He nudged me in that direction. And NC State actually like kind of has an emphasis more on user experience for their design program. So

That's kind of how I fell into it. As far as the visual design side of it goes, I would say that was definitely a development later in my career. So yeah, I mean, I guess we would say that it was a nudge from a friend who got me into this whole mess to begin with. Nice. So I would love to dig into this because

You've mentioned that there is technically a moment at which you started looking into visual design. And that is not necessarily a divergence from UX, but that it is a bit different. So I would love for you to kind of describe in your words or based on your understanding what

What exactly is the difference between these two things or how are they related to each other? Because obviously they are related, but a little different. Yeah, so that's a really great question, Therese. And I feel like, you know, I've been in it a while, but I'm still asking myself that same thing. So for me, UX is obviously, you know, how are users...

completing tasks or doing things in a service, in an app, in a flow, how are their needs being met. Whereas visual design is a lot of like how things look and how

people feel and I've learned that it's not just colors and it's not just like, oh, this button has rounded corners or this has a stroke and this doesn't and our font is like this. Those are all very important pieces of visual design.

But it's really how do you make your visual design work well and work hard in a design? So it's not just something that's sitting on the page, making it look pretty, but it's really making it kind of work for the user so that it makes it easier to use. Yeah, I can totally see that relationship. Like you've got

the visual design as like the means by which you achieve a user experience. And so when you're doing a design for a user experience, you might have certain intentions, certain functionalities, certain

certain outcomes that you might want for your user. But visual design is how you get to those. Is that seem fair? I would think so. That's a good summary, I think, of how I think of it. So yeah, that's great. Okay. Yeah. So visual design is exciting for me. I also kind of had a similar route where

I started my own career in like information science and understanding the relationship between research and the ultimate design you put out. But visual design kind of came as like the how, like the how I would be contributing into this field of UX. And so I did a lot of like proof of concepts and putting together like palettes and brand guides. And that was all fun. It

At the time I knew I really wanted to go into research but other people find that maybe they start out in a different area and they want to go into visual design because it's it's fun. It's hands-on like you get to actually see stuff materialize. Now I'm wondering like how that sort of realization came to you like this is what I want to do. Um, well, I think it came to me when I was first working in my first job out of college and um

I was working on kind of like a very complex file management, content management system. And I realized that designs that I did that weren't as carefully considered in terms of how they looked didn't sell as well than when they did have very considered visuals with the UX. So...

That became like kind of an eye opener of, okay, obviously visuals are helping in a way that otherwise I wouldn't be able to get as much support from stakeholders or good feedback from users when we did research with it, testing. So, yeah.

That's kind of when I first realized like, oh, there is something here and I want to actually kind of utilize that knowledge insight that I've learned. So, yeah, that whole experience of learning.

of seeing how much farther something goes when it, when it looks good, you know, is what kind of made me be like, okay, this is definitely worth pursuing and learning and pushing myself in to get the skills that I need to get so that I feel confident in what I'm designing and putting out there. Yeah. And I love what you said there too, because I feel like when we see a good design, like something that's visually just

it's there, like, you know, it's got all the good qualities it needs. It's hard to describe in words how that feels and how much you feel a connection to whatever it is that's been designed or how you can sort of envision it living in the real world. Like I'm thinking of when you present things to stakeholders, like visuals do go a long way. So even though like, of course, as a UX professional, I'm like,

yeah looks are great but we need to make sure it works looks are also part of whether it works like whether it's perceived a certain way exactly yeah and that's kind of like what we were talking about before how it's like the intersection of ux and visual design it's like they go hand in hand and you need those both as well as many other aspects of design to create a good experience but for me personally that's kind of like my sweet spot so yeah

Yeah. Now I'm curious if you have like a design mentor or some sort of role model that, you know, really played a huge role in how you became a designer. Sure. Yeah. I've had lots of mentors. And I think learning from people that are

at the same point in the career as well as further in your career is just invaluable experience to have. So I've had lots of mentors and I've had to have the people say like, people push me and say, "Nope, it's bad. Like just go back to the drawing field and do it over again." And I needed those words to be like, "Okay, you're right. That was terrible. I didn't put enough effort in that. Let me try this again."

And like for me, I just need that person, that mentor, that person who's going to push me and say, I know you can do better because I've seen your work. So let's keep on working towards that. So, yeah, I think mentors are especially important when you're like very young in your career. But.

Even when you've been in your position or your role for a long time, I think sometimes you can feel stuck and you need somebody to give you like that little extra push to get through, you know, problems that you're facing as well as just like feeling stuck in the design, you know, get some fresh eyes on it. So, yeah, I definitely think mentors are super helpful and everybody should have one.

Yeah. And I think about mentors in a couple of ways. And I like how you brought up that point of

There are peers, right? There are people who are kind of at the same level or at the same stage of their career as you are. And we shouldn't necessarily look to them as not a candidate for mentor because in a way they can teach you a lot about their own respective experiences, maybe things that they know that you don't know and vice versa. Like you can have this kind of give and take relationship with a mentor. Exactly. Yeah.

I know we traditionally think of it as somebody who's like higher up of, you know, somebody that you aspire to be or has a lot of insight or maybe has a lot of push or pull in politically within the company or something like that. But I think you can get just as much out of a relationship that is even peer to peer. So.

Yeah, that's a great point. You kind of bring that up. Yeah. You mentioned that there were times people would look at your designs and have something to say. What mistakes or lessons did you have to learn as a designer? What were some of the challenges that you had to overcome that are particularly memorable? Ah,

Well, let's see. Starting off, I mean, even in college, when you're learning things and you're just like have no idea what's going on, what looks good, what doesn't, what functions well. I've had so many college professors would be like, well...

it's lacking some things here. And, you know, I'd be like, yeah, I totally agree. I have no idea what to do next. But then, you know, so I think it's just like not making your visuals work hard enough, you know, is a big thing I had to learn where it's not like this idea of it looks pretty. I mean, that's important and that has a lot of

impact on perception and even getting people to like, you know, their first gut reaction to things and stuff like that. But I think not making your visuals work hard enough is like one of the biggest mistakes people make with visual design.

So, you know, this color means this thing. So use this color in that same way everywhere, you know, or I don't know, let's think of other things like this color means red. I mean, this this color red means, you know, it's a signal of saying, you know, watch out, air alert, whatever.

So make sure you're only using red for that color or something like that. So I think just like, you know, making it more than just pretty was my, the biggest thing I've, I've kind of had to learn and really push for, especially when you're like doing user testing. Cause, uh, there are all sorts of things that you hear when you're, when you're testing visuals. Um, yeah.

All sorts of things that are helpful and not helpful. So, you know, what somebody says is pretty may not be pretty to your manager or may not be pretty to your user or may not be pretty to the person who has the purse strings in the company to make it happen. So I think there's just lots of, you know, just make it work harder than just being pretty because you've got to have a kind of a rationale for why something

Why are we doing something? And I feel like, I feel like visual designers typically get like a bad rap or like kind of seem like less than everybody else because sometimes a lot of the times we are saying like, well, it just looks pretty this way. But like,

it needs to be more than just pretty. Like it needs to have a function to why we're doing that. So yeah, what we're, I think that's like my very long winded response to that, but. No, that's a great response, but yeah. So it, so having more to it, to your visual design than just, Oh, this is a nice color palette. Like actually thinking through what that color palette means. What is it communicating? What are some of the maybe, um,

underlying meanings that people are carrying with them. If they have some preconceived ideas of what red means, then not trying to force fit something that won't necessarily work. So yeah, I think that there can be a lot more to visual design than making things pretty. That's certainly one of the things, but there's a lot more that goes into it. And I guess the other thing that makes me a bit sad too is

Sometimes it's a bit of an underrated skill. Like it's, it's a skill and it requires a lot of reading and learning different theories and, and actually practicing to see what works. So, yeah. I, you know, you, you bring that up and,

One of my biggest things was, you know, okay, when I was first learning out this whole idea, like, okay, visual design adds a lot to a design and experience. Obviously, I didn't have those skills, but I wanted to learn them. So one thing was just like, okay, well, practicing in other areas seems to help refine your skills. So I will practice in visual design area and, yeah,

that, you know, a lot of times I would look at examples that I thought were very nice looking and polished and clean, professional, like what did they do that looked, that made it feel that way? What are like, you know, and you're just looking at details, you're looking at color palettes, you're looking at how are they spacing their type out, you know, it might be getting into doing an inspect, inspecting the code and

And seeing like how exactly did they code it to make it work and look right. So I just spent like so much time just looking at other places and other examples how things work to kind of make my skills work.

to where I wanted them to be. And not at all saying my skills are like top, top level, because there's always room to grow. But I think that's just one way I had started to kind of build my skills out a bit more. Yeah. And those skills, just to kind of lay them out there, like,

that's a lot, right? You had a couple of things going on. You have the actual ability to figure out spacing, figure out how you're going to arrange type. And some of that might even be mathematical. So just to kind of debunk some myths there about, oh, visual design is just art. It's not just art. It can also be mathematics. It can also be, like you said, some coding involved where you actually have to have a little bit of knowledge around maybe HTML or CSS so that you can figure out

where or how you're going to spec this out. And if you're going to coordinate or collaborate with a developer, you need to be able to communicate how that style or how this particular element

is going to appear. So yeah, absolutely. Yeah. And a lot of times also, Therese, you know, we may not have a front end designer. I mean, a front end developer that we are working with. So it's, it's, you know, okay, I'm the visual designer. I'm supposed to, I'm responsible for how it looks, but I can design something that's beautiful. And then it actually not get kind of developed in that same way. So like, how do you,

learn those skills as well to give the backend developer changes and tweaks to make it to way it should be. So yeah, there's a lot of kind of like hidden little skills that you have to have with visual design, which I think a lot of times goes unnoticed or unacknowledged from a lot of other designers. Absolutely. Now, just to be clear for those listening, I'm not necessarily saying you have to be a coding expert to be a visual designer because

Yeah, we're not asking you to be the UX unicorn that knows how to do development and design and research and all those things. And if you can do those things, first of all, props to you. But we also recognize that that can often be very impractical, not just from the side of getting...

All of those requisite skills, but also just time wise, it's a lot to do all of those responsibilities. And it can often make it difficult for organizations that are growing. Maybe they did okay at first with like one person, but as the organization grows, you will have people working in their own

areas, right? Their own specialties. But that doesn't mean a visual designer can just dump those skills, right? Those skills are still going to be really valuable. Absolutely. Yeah. Yes. Being a unicorn is not really realistic.

It is not, sadly. Well, I actually wanted to pick your brain about something because through your career growing as a visual designer, there were times that you had to receive feedback, right? And it seems like a lot of those moments of growth had a lot to do with feedback. How...

did you get good at receiving feedback? Because I know for me, sometimes if somebody tells me that this design needs a little work, sometimes I'll make a little pouty face like, but it's good. And then I look at it like, well, yeah, actually, you're right. This could probably be improved. So what do you recommend or what advice would you give to help designers be able to receive this feedback in a way that

that it is not too painful, but at the same time, you know, you can actually do something with it? Yeah, that's a great question. I think it's just a lot of practice.

I ask a lot for people to give me feedback on work that I'm doing. And I try to do it when I think it is my work is at a point, obviously, where it's worth asking for feedback. But so I try to set myself up for success in that way. But, you know, you just have to take a step back and say, OK, my work is not where it should be yet.

That is okay. Like we've learned these things from this conversation. So now how do we make it better? And you have to kind of take yourself out of the equation. Obviously, it does help with some soft skills from the person giving you feedback of, you know, not saying you, you, you, you're like terrible. And I hope you're not working with people like that. But, you know, kind of just,

You just have to say, this is not a reflection of me personally. This is, you know, I'm learning these skills and these are ways for me to improve them. So I would say that's kind of how I've done it. And obviously the doing it a million times has helped kind of make it a bit less tense. So yeah.

Yeah. Yeah, it seems like it's two-part, right? Obviously, you're not responsible for what somebody else tells you, but there is some degree of...

separation that you need to have between your sense of self as a person, your sense of worth as a person, and the work that you're putting out there. It seems like that's a really important component to staying sane for one, but also being able to use the feedback in a meaningful way. Right. And if you're not getting feedback that you feel is meaningful, then

then you just have to start kind of prying and asking some more questions. Like, could you explain a little bit more about what you mean? You know, or could you elaborate on this point X, Y, and Z and kind of get to a place where it does feel a bit more

tangible or I can actually take these points to better increase my work on how it is. So yeah, so I think you're totally spot on. It's kind of stepping away, but also...

digging in a little bit of how to ask questions or how to respond to them. Yeah. Now, I guess on that same note, if you had to give advice to somebody giving feedback, since often you're working in a group of designers and you're all kind of helping each other to succeed in some way, what advice could you give to the feedback giver? To feedback giver?

So there's a good method here. You guys are going to think like, of course, everybody knows this. But, you know, compliment sandwich a little bit, you know, like, hey, I see you've spent a lot of time working on this.

Well done. Props to you. Here are the things that you could work on. I think and then follow it up with I think this is going to be really great with these changes and even probably things that you'll do continue to do without my feedback. You know, so, so nice and simple makes the person getting the feedback feel, you know, valued and heard and appreciated, which is a huge thing for when you're giving feedback. So, yeah. Yeah.

Yeah, the compliment sandwich is simple, but at the same time, incredibly powerful. And I think it gets a bad rap.

Because it's, and I know that it can often feel, especially if you have strong opinions, the compliment sandwich can sometimes feel ingenuine because maybe in your heart of hearts, you're like, this is awful. But all that said, there is always an opportunity to be objective. And that's the way I look at the compliment sandwich is it's, yes, it can be

soften the blow of difficult feedback. But at the same time, it forces us to be more objective about how we deliver what it is we're criticizing. So I think it serves two purposes. Yeah. Yeah. Well, and it's like, okay,

Okay, I don't like what I'm seeing here, but I'm going to find at least one thing that is good. And from that one thing, that's going to build rapport with whoever is receiving feedback and making them feel like, okay, they can, you know, they can do design even if they're new, you know. So it's like forcing yourself to get out of this constantly critiquing

pattern that I think as designers we have, you know, it's like always what can be better. There's always something better, but also acknowledging the effort that you have spent to do something. So yeah. Compliment sandwich. Yeah.

I know, but also it is useful. It is. It definitely is. So I know this is a shameless plug for one of our one hour talks. It was Sarah Gibbons. She talks about how to structure a design critique. And I think that's also a big, like my, my big takeaway for, for whoever's listening is, is,

do try to structure your design critique. So that way, at least it's not just all opinions, like you actually have specific criteria that you're looking at. So that way, when you do give feedback, it's not about the person. And it's not just about how you feel. But you know, what is it ultimately achieving? What is the design ultimately achieving? Right. And making it very tangible, you know, there's nothing worse than I think, my first job, there was this one stakeholder that just would just

We were like, what are you even telling us right now? We'd, you know, walk away from a conversation where she's giving us feedback and we just like had no idea what she was even saying. I don't even know if like she knew what she was saying, but it was just like make it tangible so that it's easy to digest and I can like actually make changes based on what you're suggesting. Yeah.

So yeah, there you go. Now we've been talking quite a bit about visual designers and growing in this craft and also being able to help other designers grow in this craft. Now there might be folks listening who aren't visual designers at all, right? And maybe are tasked with the responsibility to create something visual. Maybe that's a proof of concept or maybe that

It could be that the visual designer is gone and they need to somehow step in. So are there any tips you could give to people who don't necessarily call themselves visual designers, but find themselves tasked with the responsibility to do some form of visual design? Sure. So a couple of things here I think that is helpful. If the place that you work for has a

you know, style guide, a pattern library, a, you know, some, some type of system to help you design and has a place that stores colors and fonts and sizes and space speckings and all that kind of stuff. Use that because obviously you should not be reinventing the wheel.

But look at designs that other people have designed using those patterns and see how they've put them together. Kind of like kind of do the look at an example and analyze it, break it down. How did how they do it? Why does it look good like that? Use those styles that have already been created. But for people who don't have patterns,

Maybe you work at a smaller place and they don't have this kind of robust system. You can still look at other examples and find what works well and why does it work. But if you honestly have like nothing to go off of, one of your best bets for people who don't know anything about visual designs is so a color palette can vastly improve or change

not improve, a experience of a design. So I would say if you have like no color experience, no visual design experience, keep everything monochromatic. So like maybe pick one color, pick a couple other colors within that color spectrum. So you're saying like a dark purple, a light purple, a medium purple, and stick to those three purples. And hopefully, I mean, that should set you up for success there. Yeah.

Because it's like the easiest way to elevate a design if you have no idea how to mix colors, use colors, anything like that. Super easy to because it's like, okay, this is a light, dark and medium shade of this one color. Yeah.

Yeah. Otherwise, I mean, it's really about you just got to practice it out and see, you know, kind of step back. We do this, the squint test a lot. You step back from something squint, you know, what does it look like? What are you seeing? What's coming out to you first? That's kind of giving you a clue at the visual hierarchy of things. And so that can kind of give you an idea of, hey, that's not what I want people to see first. So what do I need to do to change that? Yeah.

So there are a couple little tricks and stuff like that. If you just have no experience with visual design, which is completely fine. We need people like that too. But, you know, those kinds of things might help you kind of get started or fill in the gap until somebody returns or, you know, make something look decent enough to give to a stakeholder or something like that. Yeah, definitely. Monochromatic.

I think that's even becoming like a fashion trend as well, where it's just monochromatic outfits like that. If you are ever unsure how to match things, monochrome is a great, yeah, great approach. Less thought involved, but you still can make it look intentional and put together well.

And I do appreciate that squint test mentioned too, because we have our one of our full day courses, web page UX design, where we actually do the squint test to see like if we're designing a web page, is the button that we really need people to click on actually standing out? Or is it starting to blend into the background? And while it might seem like, you know, a small change that

is, you know, maybe it seems trivial. It's not trivial because visual hierarchy is the order in which we digest the world around us, right? We kind of look at what's most visually obvious and go from there. So yeah, as far as thinking about your designs, working hard enough and working for you, like that's one of the ways that you can do that. Absolutely. Yeah. Yeah. Yeah. Yeah.

Yeah, and I guess this is also another good opportunity for a different shameless plug. But if you are a newcomer to the visual design

field or visual design practice, we also have a full day class visual design fundamentals, which, you know, if we wanted to plug that it is a great opportunity to actually get hands on practice, making designs look aesthetically pleasing. But yeah, Kelly, to kind of close out, I did want to pick your brain about just if you had to give any parting words of wisdom to other designers who are looking to kind of level up, what would you tell them?

I would tell them don't give up.

It's something that takes a lot of experience and finessing with. And a lot of times, there's small little changes to things that make something feel more polished and more put together visually. So it doesn't, you know, it feels like maybe you're just, I'm moving this thing two pixels here and I'm changing this color barely. But those little details add up and do bring a lot of polish.

to a design. So don't give up. You can do it. Look around you, ask for feedback and keep on practicing. You'll get there. Yep.

Yeah. Could not agree more. And if I were to inject one last little piece of advice is never name your file final. I've rarely ever reached that point. So that will be my wisdom for the world. All right. Well, Kelly, thank you so much for your time. If anyone wants to follow you on social media, where could you point them to?

You know, Therese, I don't actually have a professional Twitter or professional Instagram, but shameless plug, follow NNG. So at NNG UX, we definitely have Instagram there. I do a lot of the posts and stuff like that. So yeah.

I guess follow us there. Yes. Yes. Kelly is the mastermind of our NNG Instagram account and is often the mastermind behind a lot of our visuals. So we're really glad to have her as part of our team and do follow us there if you want to see more of her work. Well, Kelly, thank you so much for your time. It's been an absolute pleasure. Yeah. Awesome. Thanks, Therese. I appreciate it. It's been a great talk.

That was Kelly Gordon. You can find her visual creations on our Instagram, at NNGUX. If you want to find her articles and videos, or if you want more UX content in general, you can find all of these at our website, along with some info about upcoming virtual UX conferences. So the next ones are taking place on June 18-24 and July 16-22.

For all of that information, check out www.nngroup.com. That's N-N-G-R-O-U-P dot com. And of course, if you like this show and you want to support our work, the easiest way to do that is to leave a rating and follow or subscribe to our podcast on whatever platform of choice.

This show is hosted and produced by me, Therese Fessenden, and all sound editing and post-production is by Jonas Zellner. Music is by Dresden the Flamingo and Tiny Music. Special thank you to Kelly Gordon for her time on the show. Thanks for listening to this episode of the NNG UX Podcast. That's it for today. Until next time, remember, keep it simple.