Take the 2-minute tour ×
User Experience Stack Exchange is a question and answer site for user experience researchers and experts. It's 100% free, no registration required.

I'm designing an interface for a financial company and am not crazy about the placement of our buttons in some of our wireframes.

Current Wireframe

Essentially, the links in the left sidebar are for "smaller" actions: email the company CEO, set my status with the company, view contacts with company...

The dark grey buttons are giving me some heartburn. These are the buttons which should afford a more "ultimate" action on the entirety of the company they are looking at. While the smaller actions are about changing minor settings, the grey buttons determine how the user will ultimately act upon the business. It's as heavy a commitment as clicking "finalize purchase" on an ecommerce site.

Anyway, I'm thinking they need a more strategic location, just like how Google Apps have a brightly saturated button in the upper right corner. However, I can't decide the best place to put this so the user doesn't miss it.

share|improve this question
    
Could you make the wireframe a bit more specific? - It is a bit hard to visualize the impact of the various actions this way. –  Danny Varod Mar 28 '12 at 18:32
    
Understandable. Let me see what I can do. –  ajkochanowicz Mar 28 '12 at 18:50
    
Could you add a few of the actions too? (Of both types) –  Danny Varod Mar 28 '12 at 18:59
    
Unfortunately I'm constrained by an NDA from doing that, but I can tell you generally what they do, which is described in the original question. –  ajkochanowicz Mar 28 '12 at 19:01
add comment

1 Answer

up vote 2 down vote accepted

My current issue with this design is that when I first saw this layout I thought the grey parts were table headings or styling's to just act as differentiators. They dont really grab the eye since most of the time my eye would be focused on the content on the right. My recommendation would be to have these heavy buttons or call to action buttons to be located at the right of the screen in strategic locations such that the content leads the user on to them.

I had posted a similar response in this question

Which of the following options best draws attention to the “buy tickets” action without detracting from the surrounding visual hierarchy?

If you had just one major heavy button then I would recommended putting it on the right since it would stand out and the person would read from left to right and his eye would rest on the right most area last but since you have three buttons you could stagger them out with relation to the content like this mockup here

mockup

download bmml source – Wireframes created with Balsamiq Mockups

However if you have only single action buttons,then check out these articles on insights on best practices for call to action buttons

  1. Call to Action Buttons: A Survey of Best Practices

  2. “Call To Action” Buttons: Guidelines, Best Practices And Examples

If you must use the layout you specified,move your button to enter image description here

The reason being that your logo will most likely be colorful and having a colorful logo and button in the same line will cause the eye to jump around. Having it lower in the second column will make it easier for the person to notice as he scans from left to right and you dont have distracting elements on the left

share|improve this answer
    
Thanks for this detailed answer! I think I've read about every CTA document on the planet, there are just a lot of tradeoffs with this particular problem. For example, the button will likely be far from the "golden triangle" so I don't want users to miss it. –  ajkochanowicz Mar 28 '12 at 18:56
    
I'm thinking the grey area outlined here might serve as a useful area. cdn.dropmark.com/24776/8a83af69acc31ee0aab601bdc4ba75d112b6821f/… I don't want it to be too low, as I fear that would fall out of the user's focus. –  ajkochanowicz Mar 28 '12 at 19:00
    
hongkiat.com seems to be down. Google does have a cached version of the day before yesterday. –  Marjan Venema Mar 28 '12 at 19:01
    
@ajkochanowicz see my updated response to the layout you suggested –  Mervin Johnsingh Mar 28 '12 at 19:10
    
Thanks, @MFrank2012 –  ajkochanowicz Mar 28 '12 at 20:14
add comment

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

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