1

In our case, each container/widget has one primary CTA. Because each widget/container contain important data points related to that widget. User may choose to download the data of the widget.

Problem: We have a layout switcher wherein the user can toggle between table and card, user can apply filters. In most of our widget, the download button is the primary CTA for the user.

What should be the ideal placement for CTA in the container/widget? Should it be placed at the end of the widget? or the widget heading level.

For your reference, a wireframe is added below.

enter image description here

Improve this question

1 Answer 1

Reset to default
1

I assume that for each of the table and card component (and also for the widget), there is already a specified/defined layout and styling for the CTA. So to me that would seem to be the most logical position for the CTA in the container/widget because you are using a consistent design pattern/component.

Of course, there might be reasons why it doesn't make sense to do so, but there isn't any specific information you have provided here to suggest that this is the case. Some particular reasons might include the fact that you have already customized some GUI components, and now you want to conform to the new component rather than revert to the existing component (but you should document this type of information). It could also be that you have analytics information to show that there are some issues with the workflow or locating/understanding the CTA in that particular context so it makes sense to test other design ideas. It can even be as simple as the fact that there is some clash or conflict with existing design system or style guide around layout, spacing or styling that you need to resolve in this way.

As a general principle, some good practices or considerations when it comes to the placement of the CTA are consistency, ease of access/clear placement and visibility for the user, good flow with the rest of the content displayed, and generally being suitable for the action to be performed in terms of labelling and styling.

Improve this answer
2
  • There is no change in CTA. Only the layout will be changed to either card or table format. In some cases, there are charts displayed instead of a card. Certain widgets contain a table with an infinite scroll. On that note, I thought placing the important CTA at the heading level would make sense. Can you elaborate on the second point?
    – NB4
    Mar 15, 2021 at 11:08
  • More elaboration on the second point, which I assume is about where it makes sense to adjust the position.
    – Michael Lai ♦
    Mar 15, 2021 at 23:15

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.