What feels like eons ago, I cut my design teeth in branding and advertising. Branding was–and still is–a hallowed concept to me. The tenets I learned in branding all those years ago are still present in the design systems I guide today. Both tap into the building blocks we know and love–colors, typography, and spacing. However, Product Design as a practice has a different set of rules by which to abide.
In a Brand, one may speak of primary and secondary colors, for example, and in Product Design as well those concepts hold. The curveball, though, is in the application of these concepts. Branding says, “Our primary color is our main color,” to convey feeling. Think of Louboutin Red: how it is deep and sensuous. Seeing it on the bottom of a shoe instantly connects the elegance and luxury that Louboutin wants to embody.
But what about Product Design? Product Design says, “Our primary color is our main color” to convey purpose. It is most evident in using one color as the primary color for interactive elements. The purpose of the color is to guide the user through the experience toward their (and the business’s!) goals.
Psychologically speaking, this is a good practice: a Product Designer wants to connect the feeling of the Brand with the success of an interaction. However, this practice does not play out so simply as always using the Brand's primary color as the Product Design's primary color.
Remember that Louboutin Red? Well, it is all fine and good to use it in Product Design until you get to–gasp, error states. And sure, the immediate response may be, “Just make your error state a color other than red,” or more inclusively, “You should not be depending on color alone to communicate,” but from a visual user perspective, the color red–especially in the Product Design context–is synonymous with “error.” Changing the color would not undo user psychology, and you should add the icon or additional enhancements for users with color blindness regardless!
I’m not picking on the color red, as I sit here typing on a computer issued by a company whose primary color is–you guessed it–red (to convey action and energy!). In the Product Design department at iSeatz, we sit at the crossroads of Brand and Product Design with our platform daily. The purpose of our designs is to be flexible enough for any Brand metaphorically to walk through our door and walk out with a loyalty platform applied lovingly to their Brand. And yet, the need to map Product Design principles within that design sometimes brings us into conflict with Brand.
A few potholes we’ve had to address: an instance where a Brand did NOT use its primary color as its primary interactive color on its website; another case where a Brand’s primary color was inaccessible with white text, and my favorite, a challenge where a Brand consisted entirely of various shades of gray.
How did we reconcile these issues? As cheesy as it sounds, it was communication. We work hard to let our clients (and especially their internal teams) know that we’re not here to redesign their Brand, we’re here to ensure that their Brand is applied expertly to their platform.
If they do not use the Brand's primary color for the primary interactive color, we ask why (the answer: better color contrast!). If they use a color that is not accessible, we offer web-shade options that appear close to the brand color and achieve accessibility; we also encourage them to do the same on their websites. For our ultimate challenge with the shades of gray, we talked about the power of color and how it communicates in Product Design, and we also took a lesson in evolving the platform components to communicate their purpose devoid of the crutch of color.
The relationship between Brand and Product Design does not have to be a battle for which practice reigns supreme over users’ psychology. Instead, they should work in concert, two unique instruments following the music outlined for them. As long as each respects the techniques of the other, the music flows freely. And while working in concert sometimes means breaking the rules and doing a jazz riff, regardless, it should result in harmony and a beautiful experience.
Want to get more insights and updates from iSeatz? Sign up for our newsletter!
You can also learn more about iSeatz by reaching out to marketing@iseatz.com.