The product designer’s dilemma: Visual design matters more than we think, now what?
Your visual designs aren’t capturing your learnings and your team doesn’t understand your process. We don’t need to be visual design gurus, but it's keeping us from being effective at our jobs.
Thank you, early subscribers of Detach Instance
Before we get to this week’s install on the first of three skills to advance your design career, thank you so much to the early day subscribers of Detach Instance. You stuck with me these past few weeks, overlooking the lack of chairs and single lightbulb hanging from the ceiling. I hope you’re enjoying the freshly painted walls and new About page. Please, make yourself at home. If you haven’t yet, reply to any of my emails and introduce yourself. I’d love to know who you are and what you’re looking forward to in Detach Instance. I read and respond to every message. Look forward to talking to you soon.
Now onto the programming…
You are a problem solver. By understanding what makes people tick, you design elegant and intuitive experiences. Your job as a product designer includes 1) conducting design thinking, and 2) physically designing the software. To fulfill this second job, you’ve learned the basics of visual design. You wouldn’t jump to set brand colors, but given a color palette, you know when to use which colors. You’d prefer to use a design system, but if you had to, you could compose a screen given some time. Your full design process consists of translating your design thinking takeaways into UI.
And that’s where the dilemma starts to set in.
Despite the vault of learnings you’ve collected from your user interviews and competitive analyses, your team can’t see how your design thinking feeds into the UI you’ve delivered. All of your efforts have been reduced to three screens of UI. To further complicate matters, it feels like those three screens don’t even belong to you. Every seeing person in the room has become a visual owner. Our lifetimes of experiencing the world around us have given us the credentials to also be a decision maker in the final designs.
This dilemma is the product of two factors:
your visual designs aren’t capturing your learnings, and
your team doesn’t understand your visual design process
The result is compounding. After losing control in your domain expertise, the trust your team has in you, and thus your autonomy, fades away. Visual design matters more than we think it does.
We don’t need to be visual design gurus, but we do need to be effective at our jobs. Being on the good side of visual design requires us to not only have the adequate skills, but also a smart strategy and positive environment.
Sit in the captain’s seat within the Figma frame
Have you ever been advised not to edit Figma live during a review? The fear is that if you become someone else’s Figma hands, you go from designer to Figma technician. Whether you edit Figma live or not is up to you, but most importantly in your Figma files, you are the captain that makes the final visual call.
As captain, you listen to what others have to say before making your decision. Make too many decisions that people don’t agree with and expect mutiny. Hearing what people are reacting to, rather than their diagnoses, can help you identify what of your visual design skills to work on. You’ll know your skills have met the bar when you and your team are able to discuss next order topics like product implications and technical implementation without distraction. Here’s what these reactions might sound like and how to interpret them:
“Why isn’t the spacing equal above and below this element?” → Your team is distracted by visual bugs. Review how to create a rhythmic layout with grids, negative space, and alignment. Make it a habit to use your tools like Figma auto layout, styles, and components.
“How do I get to this other screen? Can’t we just put everything on the same page? ” → Your team doesn’t understand how your designs works. Cross check that you’re using design components the way they’re intended to be used. Build animated prototypes to better illustrate the experience.
“Can you add some icons and make that element bigger?” → Your team doesn’t like the way something looks. Review how to create hierarchy on a page, especially through typography and contrast. Review that you’re achieving the right style and tone through shape, color, and imagery.
Stay on brand beyond the Figma frame
Say you’re looking to buy a pair of shoes with a specific style. You find two locations, a shoe store and a convenience store, that each sell a pair of these shoes at the same price. From which store do you buy the shoes? Without overthinking it, you probably choose the shoe store. Even if the shoes are the same, you trust the shoe store, over the convenience store, to sell good shoes.
If you think of yourself as a store and your designs as shoes that you’re selling, you want to be seen as a shoe store, not a convenience store. Your teammates are more likely to trust your visual design decisions if you exhibit good design in the way you work. Here’s how you might apply this:
Design your Figma files to be easily traversable by your teammates → Organize and document your file with sections, labels, and annotations
Design your docs and longer Slack messages to be scannable and easy to understand → Use formatting tools like bullet points and visual anchors like emojis and images
Find strategic opportunities to offer your visual design skills → Fix an outdated component or help a teammate create an asset that otherwise wouldn’t have been made
Be a broken Yoda record everywhere else
Design evangelization, over skill building, comes in handy with folks who struggle to understand how visual design can be used to solve problems. Human brains are great at picking up patterns. The more consistent the messaging, the easier it is for people to form associations, like one between visual design and problem solving. Mantras and phrases are particularly sticky and easy to remember. Here are a few ways you can evangelize visual design:
Reframe vague or prescriptive visual design requests with problem-solution statements → In response to the request “make it pop”, try “It sounds like we want to get more people to click on this by catching their attention. Does that match what you’re thinking?”
Celebrate successful design case studies → To advocate simplifying a primary product flow, try “Turbotax gained market share by turning a painful experience, like filing taxes, into a painless one”
Be ready to recite and define common design laws → To advocate design polish, try “Let’s use the aesthetics-usability law to our advantage. We can make our product seem more usable but making it beautiful”
Being stuck in the product designer’s dilemma sucks. Once you’re in that pickle of micromanagement and lost trust, it’s hard to get out and likely to cause stress and burnout. The good news is that we can avoid it. Remember that while part of it is skill building, the other large part is aligning your perceptions with your team’s. With a little effort and strategy in and outside the Figma frame, we can design dilemma-free.
A final note before we leave off for the week, some of you might be thinking with the rise of amazing technology and tools like GPT-4, the task of visual design will be replaced by AI—some of it already has! I don’t have a crystal ball, but my hunch is that once everyone can start making UI, the expectations from what a designer can do with visuals will increase. So, let’s keep our eyes sharp.
I always wondered if the time I put in to set up the Figma file was worth it. This was the validation I needed haha — thanks for writing this!