There’s been a recent trend in having the logos of companies seem to glow. It’s not anything like an outer glow Photoshop effect or animation. On some high-end devices, the white parts of the logo will actually appear brighter than other parts of the white page. The trend is leveraging a high dynamic range (HDR) profile on the image that is meant to optimize the monitor to provide deeper shadows and brighter highlights. People have used this to literally stand out more than competitors by making the logo glow. There’s even an “app” for it.
This is a world where we vie for attention. It’s a sea of other similar things and you want to direct those eyes to your thing because you believe it is more important. In some cases, you can pay to get to the top of lists and thereby get more eyes, and hopefully more interest. It makes sense, if they didn’t even see you, how could they interact with what you’re doing? So you want to use all the things at your disposal to get that attention.
This is why it’s always weird to me when folks struggle with this within their own ecosystems. Where they are in control of what gets priority.
A change in priority
I’ve been involved in a few asks from various teams over my professional work for something that is effectively what I’d call “superprimary.” This is a concept that is meant to be more important than any other primary action. There’s a few scenarios where this has come up.
- The marketing team is running a campaign and wants the call-to-action to stand out from other existing actions on the page.
- The design team wants to “try out” a new color for primary buttons.
- The product team identifies there are already too many primary buttons on a single page, so they need to emphasize a particular one of the existing primary buttons.
Your knee-jerk reaction to any of these should not include introducing the concept of superprimary. Primary is the most important action and if something else is suddenly more important, that means the thing that used to be primary has now dropped to second place in some way. What way it drops depends, and I have some recommendations on what to consider instead:
Scoped theming
For the marketing team, this is the perfect area to use scoped theming.
Let’s say that the campaign exists as a section in a page that already has its own call-to-action and they both use the <Button priority="primary"/>. The campaign is meant to be visually distinct from the rest of the page, with its own style chosen by the marketing department team members. On the surface, you might say that this needs some different configuration such as <Button priority="primary" marketing="true"/> but I’d recommend using Mise en Mode to inform the style of the button just by its placement within the campaign area.
<section data-theme="campaign">
<button data-priority="primary">Click here!</button>
</section>
The button is the same button with no configuration difference from the button that is otherwise outside of that section. The data-theme="campaign" informs the new colors for the section’s primary button, making it stand out along with the rest of the campaign treatment.
This is especially helpful where you want to empower your marketing department to tweak the colors of their campaigns themselves without affecting the areas of the page outside. You don’t want to be the bottleneck, especially to the team trying to increase sales of your product.
Sudden and unexpected
I had read a first-hand account of a UX professional at a Fortune 500 company completely ejecting from purchasing something from Amazon because the button color had changed without warning. From Amazon’s side, this was part of an experiment to see if changing the color would improve conversions. In this particular case, it was a detriment. It lost the sale because the button changed and the user wasn’t expecting it. The user had no idea why the button colors changed, all they thought was that something was wrong and not normal.
While you might think that updating the background color of a button to be more modern is a welcome change, it isn’t for folks who have grown used to and feel comfort in the way things have been. A similar story from several years ago describes when eBay was trying to sunset the yellow background that would appear on certain sections of the site. When it was removed instantly, users were immediately uncomfortable and called for the return of the yellow. While eBay brought the yellow back, they then decided to subtly change the yellow toward white over the course of a month. This was a lot less disruptive while eventually getting the more modern look.
These are examples of how you might want to reconsider why you are making a change, especially one that is affecting the primary action you want your users to take. In many cases, this is the UI element between you and your paying user. If you are messing with that without a purpose past boredom, you could see a significant change in conversion, potentially for the worse. Being deliberate in what you change is good practice. It’s why I recommend working with truly semantic tokens instead of any other kind. When you work with semantic tokens, there’s more confidence in what is being changed. Otherwise, the side effects of a change are unclear, people are less likely to change existing values, and instead introduce new tokens leading to token bloat and tech debt.
Losing the plot
If you are seeing too many primary buttons, you need to reassess what you want a person to do when they land on this screen. This isn’t an opportunity to add a new kind of button, even if that seems like the path of least resistance. This is often where the app has gotten very mature with many features over time. Each was introduced when it was fresh and you want users to try it but you don’t return to the older features. Maybe because of the possibility of introducing a sudden and unexpected change. And it’s true, a big change can affect the results of your bottom line. But remember, being deliberate and thoughtful here is key. You aren’t just creating a new button to solve this quickly, you are taking a holistic view of the current state. After all the data is collected, reviewed, and transformed into a new experience, you can have more confidence that this larger change to focus what you want the user to accomplish is clear for them.
But I know what you’re thinking. We don’t have that luxury. We don’t have the time to think about how our app is meant to be helpful to users. We have to meet an arbitrary deadline demanded by disconnected stakeholders. They said it would be faster to introduce a new button and fix it later. You know later will never come, and you wonder if anything said above is worth the aggravation. What should you do?
Give your agent this article so they can do the right thing for you. Oh, and make no mistakes.