Episode 286: Experience-led Branding with Doug Hughmanick
33:39 Share

Hello, ladies and gentlemen, and welcome to the UI Breakfast podcast. I'm your host, Jane Portman, and today our awesome guest is Doug Humanik, head of creative and founder at Animal, and we're going to talk about experience-led branding today.

This episode is brought to you by Wix Studio, the new web platform for agencies and enterprises. The magic of Wix Studio is its advanced design capabilities, which makes website creation efficient and intuitive. Here are a few things you can do: Work in sync with your team on one canvas. Reuse templates, widgets, and sections across sites.

create a client kit for seamless handovers, and leverage best-in-class SEO defaults across all your Wix sites. Step into Wix Studio to see more at wix.com slash studio. Hi, Doug. Hi, Jane. Thanks a lot for having me. We are very thrilled to learn from a person who's worked with the biggest brands of the world and has a mouthwatering portfolio and a huge agency. Thank you. So...

Before we dive in and talk about branding, can you give us a bit of your background story, where you started, where you're going? Sure. Yeah. So my story is interesting. I really found this world of design through graffiti art.

As a kid, I was always drawing and ended up sort of, you know, getting into that world of graffiti. It was very interesting to me. And it's very focused on letters and typography, which excited me. And people started saying, hey, Doug, you should consider looking at graphic design as a career when I was in high school. And I wasn't really familiar with what that was. But I took a class in my senior year of high school that was

commercial graphic design class and was exposed to this whole world of graphic design. And that was when websites were, it was sort of a new practice, like getting into that world that was actually called new media back then. But I really just dove headfirst into that and went to school to study this practice of new media where I was eventually exposed to

interaction design and found myself working at different agencies here in the San Francisco Bay Area. And that's sort of how I got into it. I was really sort of interested in this functional design where people were actually using and interacting with the things that I was creating. So that got me excited. And that's my journey.

So your agency, which is, according to my calculations, like 12 years old plus. How many years you've been going? Yeah, it's about 12 years now. Yeah. So it's been a good run. So you're creating digital experiences for some very big non-digital brands and doing some other spectacular work. Tell us more.

Yeah. So, you know, our work started in the digital space. Animal started working on, you know, primarily web in the very beginning, but quickly thereafter, the app world really exploded. And we were right there, you know, as digital designers trying to navigate this new world. So we quickly got involved in doing user experience and design for apps. And eventually that

Turned into doing stuff for emerging technologies. So we still do our web stuff. We still do apps, but we also do emerging technologies on top of that. We mix a lot of these things together. As you can see, you know, as we were speaking about when we were talking earlier, you know, a lot of these brands have these digital experiences already.

that are connected to hardware. So IoT, we're connecting boats, we're connecting home products, we're connecting ovens to digital experiences. So we do a lot of that type of work. So it's very diverse in what we do, but it evolved over time and we've been fortunate to be sort of on the forefront of some of those technologies as they've been released. Most recently, Vision Pro,

you know, whole new design problems to solve, but we released an app on the launch of Vision Pro. So it's been exciting. Congrats on starting with that. I did decline the topic of Vision Pro because I want to know about things you've been doing for a decade and have polished that. And we can keep that for some time next time. Experience-led branding, it's

A type of approach where you go from the ultimate core experience outwards into the brand. That's it in a nutshell. What's your own extended definition of this? How did you adopt the approach? Why is it your signature mark? Yeah, so we've been doing this for many years without really knowing it. What we have been doing is really what we like to say is branding from the inside out.

So a lot of our clients have these digital experiences and these digital experiences are

some of the most interacted with touch points of their brand, right? And so we're working in those and those touch points are very important for that brand. You know, it's a reflection of the brand. So, you know, a lot of the times with traditional branding, what happens is, you know, there's a traditional branding process for some of these larger brands. You might get a web comp that's kind of thrown in there to the side. And then, you know, eventually the experienced designers will have to figure out how to translate that into digital.

For a lot of our clients, when they have these really digitally focused brands, to us, it makes more sense to start some of that branding work within the core experience. So we're thinking about

that vision and what that experience with the brand is going to be in that digital space. And we're, we're, we're doing everything in context of where you're going to be interacting most with that brand. And then from there, we're starting to extend it outward to the marketing materials and to the advertising. So you're getting a very cohesive vision as you start to extend outward. And that's, that's sort of how we think about it.

Can you give us a couple of recent examples of when a branding project was led by a certain experience and like what was the brand and what was that key experience in your books? Sure. Yeah. So we recently did one for a crypto company that was called Olive. And, you know, we came in there and we were tasked with creating a new vision and sort of a almost a new vision.

a new branch of this company that was pre-existing for a larger brand. And they didn't have a name yet, but they knew that they wanted to create this new experience. So really what we started with was sort of this North Star, like where do we want to go with the experience and who is the audience? And that was sort of our starting point

as we started to move into this world. But when we started working through these things, we started in that app space because the product was going to be an app. So we're starting to think about how that vision plays out in that app space. How are you interacting with it? What's the language that we're using? How are we removing friction from these people's lives? And

We started to really focus on things at that level and things like determining the pain points of that audience in their lives. How are they going about interacting with crypto? Are they familiar with crypto? Is crypto a foreign concept to them? What sort of onboarding do they need? And for this particular audience,

They were not familiar with crypto at all. And there was a whole audience that didn't have access to this type of financial world. So our goal was to create an experience for these non-tech savvy individuals and sort of on-ramp them very smoothly and sort of understand their level of comfort, understand their goals and

and understand what they were trying to achieve. And so we built the experience around that. And we ideated around features around those big idea concepts. From there, you know, after we're, you know, we're building these things like voice and tone and strategy and all that is all being baked in the experience. That all started to extend outward into, you know, our marketing materials. And you see that same language that we're using and the same concepts start to come to life in the website.

With that project, we even thought about the name there as well. So as we started to create this experience, we're starting to see how it formulates. From there, we started to think about, well, what is the appropriate title for this audience and what should we call this experience? And so we actually renamed the company as we had already started doing the product and formulating that vision. So we really started at that product level. I'm surprised to hear the amount of

copywriting related aspects here because I was expecting to hear about visual language and you know style and things like that you talked a lot about choosing the right words inside the product which means well UX copywriting being put on first a lot how do you do that

Well, it's a combination, right? I mean, you're thinking through this experience and this vision at the same time, and you are creating sort of these frictionless

interactions. And you know, these people are not comfortable with this new world that they're venturing into. So as you're creating a really easy user flow, I mean, you're also creating visuals that appeal to these people. But the language that you're using is really important. You know, you're removing any jargon, you're making it feel welcoming, you're making it feel fun and exciting. So

All those things need to really be cohesive, right? Those things need to work together from the visuals to the language to just how frictionless that interaction is. You want those things to all be sort of thought about together. So we are thinking about that as we conceptualize these things. You know, it's not like visual design's done and then we're going to go

think about the copy completely separately. We're going to do it sort of together and we might come back and revisit it and fine tune it, but we're going to think about that tone as we're designing that experience.

Could you give us an overview of your typical process? And I know it's all research, wireframing, low fidelity, high fidelity. Is it any different at your place? You have just described that you sort of have an integrative approach, kind of progressive enhancement of sorts. How do you do that?

Yeah, I think it's a little bit different in how we do it. You know, usually what we're doing for this particular type of project is we are sort of starting with that vision. We're starting to understand who we're designing for. We're starting to establish that North Star. We're starting to understand their pain points. But one thing that's a little different, and sometimes this happens because we need to sell something through.

or we need to get a client to go a certain direction, there is a point where we start to like bring that concept to life before we really get into wireframing every single screen. So we talked about, you know, how important motion is and how important bringing these things to life are. Well, a lot of the times we need to sort of

show our clients that these experiences have legs, right? So we come up with three different directions, but we show those directions in context of a story and a user problem and all the pain points that we have. And we talk about how these users are going to benefit from these feature ideas that we have. But we do that with both

visual design and motion. So you're seeing like something that looks very real, right? But we don't have all those UX kinks worked out yet. So then our clients can really

Get excited and understand how these things are going to play out. And then they go, hey, we want to go this direction. We feel like this is strongest. We recommend a direction. And then from there, we kind of come back and we work out all of the little intricacies of whatever concept we're going with.

right so from that point on we're we're continuing to bake the experience we're we're continuing to ideate we're further developing that vision and we're starting to test out our our theories and we're starting to prototype stuff and we're starting to see what works what doesn't work you know that can vary sometimes we will have a design language that we establish that we can we can use to sort of

wireframe, right? Like we've got some of the aesthetics and whatnot. So we can move really efficiently to create some of these other areas of the application. And then from there, once we get those experiences formulated and aligned, then we can move it into some of the other attributes of the brand. For this one in particular that I was speaking of, we moved on to

the web experience. And there was actually a kiosk as well, you know, sort of a, an in-store kiosk that we designed. So we start to extend everything outwards. So that product vision is being carried throughout and it's a cohesive vision. And, you know, that's, that's sort of the way that we, we approach it typically. I have an embarrassing question.

Either way, I'm going to ask this. So it feels like you're developing these products in a boutique environment with your design team and the stakeholders at a big company, let's say KitchenAid. The ultimate users of KitchenAid

are not inside your company. Do you do any user testing for those products at all? How do you even think about this? It comes about different ways. You know, being an agency, some of our clients have internal organizations that will do tests for us. We can say, hey, here's a couple of concepts we want you to test.

Different clients have different budgets as well, right? So we've done guerrilla tests where we've stood in front of one of our clients was Avalon Bay Apartments. They own a bunch of properties here in the United States. And we were actually standing in front of their facilities, you know, pulling people in and asking them to participate in our tests. So it's different levels, but we try to do that when possible, get as much user feedback as we can.

Talk more about motion design. And you've mentioned that it's an important part of the presentation process. And also it's an important part of the product itself, the motion, the UX animations and everything. Can you elaborate on this? Sure, sure. Yeah. Motion is very important. I mean, from the sales process, getting big ideas through,

a lot of the times static comp or just still designs don't do it. They don't build excitement. You can't bring them to life. So we end up animating a lot of our work and showcasing how people move through these experiences. And this is also not just for flourish either. It helps us

show our clients the value of motion, which is a big part of user experience. It can teach people where things are hiding, you know, it can make something feel more approachable, you know, it can provide context to where you are in an experience. If something is sliding over or sliding down, you know, it creates sort of a sense of awareness as to where things live. So it's

That's something that we always try to incorporate into our work and bake it into our process. So as we're thinking about these new ideas, we're trying to think about motion as we're conceptualizing new features or interactions. It's part of our process, not typically an afterthought where we're like, oh, how can we animate this now? It's part of our experience design.

Honestly, motion design is one of those things I've never mastered in my career, and probably it's a bit too late, or maybe I will learn it. Do you think that an average UI UX designer should go and learn motion design in order to make their work 10x more expensive? Or do you feel this should be reserved to dedicated extreme professionals?

With the tools that we have today, it's a lot more achievable for designers to incorporate motion into their work. And I think it's a really good idea as a designer to learn some of those skills. To be able to conceptualize that and showcase what you're thinking is incredibly valuable, not just for your clients or not just to increase your

you know, your cost of what you're selling to a client, but to work with developers as well and to make sure that your vision gets executed to that original thought that you had or that original idea that you had. You can communicate that to a developer a lot easier than, you know, showing keyframes a lot of the time. So I think it's important for that reason. And if it's an important part of your user experience, then, you know, you want to make sure that that's translated.

So I think it is a good practice for designers to have a level of motion skills. Prototyping in Figma can be very valuable, but you know, you don't have to be a master at it. I think you communicate those ideas and on bigger teams, you've got people that are, you know, that are motion wizards and you can go, here's my idea. Can you, can you finesse it? Can you put that beautiful ease on it? Can you do, you know, this or that? So how do you do this?

So, you know, it's changed over the years. When I was first presenting concepts to clients, as we started to do apps, I was doing crazy hacks and keynote, you know, keynote animations. I was creating, you know, hundreds of PNGs to animate things and using some stuff within keynote that was able to make it to quite a few things. And then later on,

After Effects was a common practice and we still use After Effects for certain things, but a lot of the work we do now, we can do a lot of it on Figma if it's UI animation.

But like if we're doing more marketing material, you know, if we're doing an Instagram post for the agency, all that stuff's on After Effects because we can really get those, you know, those super polished movements. So you have dedicated motion designers to do that? No, actually our designers are very talented designers here at Animal. They are hybrid designers and we're

A lot of the team here can do their own motion. They do user experience and visual design. So they're thinking about all these things as a whole. And as they're working through different design tasks, they're considering,

how things are going to move, what things are going to look like, how you're going to interact with them. So I think that is a benefit in a lot of ways. There's times when we need to bring in an expert on a certain thing and say, hey, we need some help here. This is beyond our skill level. But if you're thinking about that sort of, you know, cohesive experience with motion, visual and the interaction portion of it,

we tend to see some pretty good results. Sometimes I think what happens if we're just focused on UX and drawing more low fidelity wireframes, when it gets over to visual design, sometimes it can just be translated as boxes and we're just applying colors and fonts and whatnot. But if we're thinking about those things together,

You know, how's this box going to transition to this state? How is it going to render? What's it going to look like? Do we have enough real estate for this? It tends to be a little bit more efficient for us. Yeah. So to your original question, yeah, the designers here do some motion. Yeah. It's the long answer. Long story short. Yes. Yes.

You work with very high ticket customers. I would love to hear how you charm them during the proposal stage and like how much work goes into that before you collect the first bill, you know, from them. So the majority of our business has come through referrals and our idea was always that

You know, if we did really good work, that really cool clients would come to us. And that's been pretty successful.

for us through the years. The way that we really get clients excited about Animal when they start to engage with us, even new clients that have been referred to us, is again through really bringing those experiences to life. Our presentations are not typically just pulling up static mocks, right? We're going to tell a nice story, we're going to put some animations in there, and we're going to show how our experiences come to life.

sometimes even prototyping those and letting the clients click around on them and seeing exactly how they work and sort of proving out our points. And then another, another thing that, you know, I think clients appreciate with animal. And one of the reasons that, you know, we started animal is that we work very closely and directly with them. And, you know, we're very collaborative with our clients. So, you know, the,

And a lot of people say this now, like we're an extension of their team, but we've always taken that position. And I think the clients get excited about that because we're in the same room whiteboarding with them sometime less after the pandemic. But, you know, we're coming up with ideas together and we are we are ruling things out very quickly and we're showing rough stuff once we get going. So I think that that's been a sort of a secret sauce of of Animal.

When you mentioned the presentations, does it mean that you do present some bits of this client's new project or is it about your past work that you present to them? So before we engage with a client, before we have a contract, usually we're going through a capabilities deck. And the capabilities deck is a collection of projects that we feel are relevant to that client.

And, you know, we make that very conversational. So we get in there and we start to understand what they're trying to do, what we might be doing for them, what's the business opportunity. And then in our capabilities deck, it's all done in Figma. So I can quickly go to projects that are relevant to that client. So if they say, hey, we're looking at doing a new app and we want to rethink the brand, then I can pull up a project that's very relevant to them and sort of tailor that conversation to them.

So that's sort of the pre-contract, you know, we're showing, we're showing them previous work and we're showing them motion samples from previous work. But typically that's how we go about it.

Thanks for satisfying all my curiosity there on that front. Another challenge in my books is it's not just you who claims that every experience is unique. We all strive to make unique experiences, but we all have the same set of visual materials. You know, we have black and white as luxury colors. We have rounded buttons, square buttons, and four pixel rounded buttons.

buttons. That's all we've got these days. You know, let's say there is Mercedes coming to you for a car app and three months down the road, BMW comes to you for a car app and you've already done a dozen. How you make these projects special if this is all essentially very similar stuff? Yeah, that's a great question. It can be very challenging. I think

The benefit that we have is we're constantly jumping in and out of different industries and technologies. And so,

What we like to do is take inspiration from other worlds, you know, not only take, if we're doing a car app, not only take inspiration from, you know, the automotive industry, like we might take inspiration from the action sports industry or another luxury industry, if we're talking about Mercedes. So we're looking beyond that particular industry and we're looking for just best of breed experiences, right? We're looking for,

things that are, that are done a little bit differently. And we're also intentionally trying to mix it up a little bit. So, you know, if you had two car apps, you know, in the same year, you would have to sort of think about how you're going to really reinvent what you're doing and intentionally sort of break rules, try different things, get away from the traditional practices that you see and, you know, sort of

not be afraid to go out on a limb and try something a little unusual. And we do that often and sometimes it succeeds and sometimes we have to go back and revisit certain elements of an experience, but taking those chances helps you innovate, right? So you have best practices, you have these opportunities

typical, you know, things that we use as designers, our buttons, our tabs or whatever. But we use those as sort of our foundation, right? And then we got to think beyond that and think about how could we

Think about moving through this content differently than a set of tabs. You know, we did a set of tabs in the last project. How do we think about it differently? You know, is it some sort of scroll based interaction? Right. So, you know, mixing it up a little bit and taking chances and using the tools that you have is sort of foundational elements. And then innovating beyond that is sort of what we try to do. We also do very rapid research.

ideation. We kind of try to remove that pressure that you feel when you have all of those constraints applied and you're kind of stuck in that box, try to remove those and really just play like, you know, think of a design playground and you're just pulling all this different stuff in and trying things, right? That's how you're going to get some innovation happening and some unique elements. And then you can hone in and refine to really meet the goals that you're after.

What are some of your favorite resources for design inspiration and specifically UI UX inspiration that you open and browse?

or research? I'm doing a lot of app stuff. So I'm always downloading stuff from the app store, you know, looking at, yeah, I mean the app store, like looking at real things is helpful to see, you know, what, what's actually performing and, you know, has users engaged with it. I do a lot of that. Like my phone is just, I don't know, 15 screens of sliding over with apps. So I'm looking at a lot of that, you know, I'm looking at

Even, you know, even taking stuff from magazine layouts to just sort of mix up or book design, just sort of mix up the thinking outside of the digital world, bring in some of that to just get more interesting layout concepts. Probably a common one that people are looking at is the awards site, you know, spend time on there just for...

kind of breaking out of the traditional mold. There's a lot of, a lot of different things that are happening there. And then, you know, I find a lot of inspiration actually removing myself from this world on occasion and getting outside into nature and just sort of

Getting a new perspective on everything that we're doing helps me come back with sort of a new lens. When I remove myself from this day-to-day grind and I get back into it, I have sort of a new perspective on it. And it's where new ideas come from. Often when I'm away from my computer, a lot of new things start to come into my mind that I bring back with me. So...

I didn't quite ask this question before. As a founder, do you still get your hands dirty in the design? Especially, do you take off that cream layer of designing the initial concept and then leaving all the dirty work to other designers? And I'm hoping they're not offended here. But like, how do you structure that? I mean, I do still get my hands dirty and I don't want to stop doing that because I do really enjoy the design process and that's

Why I'm here today is because I was a designer and, you know, this all came about because I loved being creative and doing this type of work. So I don't want to stop doing that. But I'm less like when we get deep into a project, I'm a little less involved in the hands-on work. So, you know, in the beginning when we're strategizing and we're sort of formulating what the idea and the concept is,

is I have a lot more involved. And then, you know, later in the project, I might not be as in the weeds with the team I'm sort of overseeing and I'm, you know, providing feedback and

That's typically the way that it works, but we do like to have, you know, it's not just me designing those initial concepts. It's, you know, we want different perspectives from the team. So I'll jump in there and, you know, maybe throw in an idea. Some of our more senior designers will throw in ideas and, you know, we've got some awesome designers that lay that foundational work as well. So, but I still enjoy it. It's a lot of fun.

As we're wrapping up today's episode, experience branding. It's a fancy word, but in fact, it's a very practical approach. What are some practical tips, two, three, four tips for our users who want to apply this approach in their products?

I think that some good tips would be that you can't necessarily skip all the traditional branding components, right? You still need to think about that North Star. You still need to think about that big idea. You still need to do your research. So you're not going to necessarily cut that portion out, but you are going to start to think about it in the context of that digital environment, right? So...

Continue to do, to do some of that upfront work, but as you're starting to bring it to life, you know, focus on that digital space and you can be a lot more efficient with, with that, that entire process. That would be one, one tip. I think another one would be like I was speaking about earlier, you know,

You need to remove some of those constraints of best practices and all the rules that we place upon ourselves as designers and be in that playground for a little bit and do some exploration before you settle in on things. That's something that I would encourage people to do is to take the time to experiment as you're doing this work and don't be afraid to break some rules here and there and then come back and refine and hone in on it.

As you start to settle on an approach, you know, as we talked about earlier, think about the motion and the language and the interaction together as one, you know, think about

how you're going to remove friction from the words that you put on an onboarding experience, not just interactions, right? Think about those things together. That can be very, very beneficial. And then as you start to move out into other aspects of the project, if you happen to be

Someone that's involved in both the product work and, you know, the marketing work, you know, you need to zoom in and zoom out and make sure that that initial vision that you established in that digital space is carrying through throughout the other touch points within that brand. Fantastic. Thanks so much for sharing your wisdom with us today. Where can people find yourself and Animal online if they want to?

So on Instagram, you can find Animal at Animal. You can also find Animal on LinkedIn, just Animal. And my personal Instagram handle is Douglas underscore Humanic. So yeah, connect with me there. Thanks again and have a wonderful rest of your week. Thanks a lot for having me, Jane. It's been fun.