I'm developing a UI for a product that will have "Install/Configure" option and "Documentation" on the search of the cards.
However, the UI looks ugly because of the repetitive buttons. Is there any other alternative to sort it out?
User Experience Stack Exchange is a question and answer site for user experience researchers and experts. It only takes a minute to sign up.
Sign up to join this communityI'm developing a UI for a product that will have "Install/Configure" option and "Documentation" on the search of the cards.
However, the UI looks ugly because of the repetitive buttons. Is there any other alternative to sort it out?
One way is to differentiate primary vs secondary buttons. You could keep “Install” as the prominent button and “Documentation” as the secondary link. Something like this:
There's no repetitive action here, unless it is expected that the user will install many products in one visit. Having similar buttons do the same thing to different pieces of content may look ugly (I find that very subjective), but it's very easy to understand what the buttons do.
You can get rid of repeating buttons but that forces you to divide the action into a two-step process where you select your action then select the target product (or the other way around). You're going to lose a lot of people merely by adding this sequential step.
You are going to sacrifice consistency for repetition if you want to take this approach.
The design pattern used is a series of card components in a full page grid layout, which requires each component to be replicated. If you remove the primary and secondary action, it will require creating another section on the page to process the user actions so you will have to redesign the page layout.
Lets say that there is a separate section of the page where the user install or download the product, you still need some indication of their selection (either using a call-to-action or styling of the item to indicate a selection state, and also to potentially cancel it).
There is going to be some breaking of normal design patterns to do this, which means you will have to design other interactions to help create a smoother flow, so you should consider whether there is a good reason to do this, or if there is another strategy that can be applied (such as reducing the prominence of the call-to-action buttons, which would also be counterproductive in some way).
Probably the best thing to do is come up with some variations and test with users to see if the repetition is causing issues with the user experience, so you don't remove one problem and replace it with another.