This is a bit of an opinion question, so I'll understand if it will be closed.

We're designing a web-based dashboard with several tabs, one of which is the dashboard's snapshot page / welcome page. The purpose of this snapshot page is to present the users with a large amount of information about their recent activity and performance, and provide them with various links to act upon. One of the models in this page is the notification snapshot model, which unlike the fully expanded notification center tab should be brief and concise.

I'm exploring several options to present the users with information about the notifications by using color (green for increased figures, red for decreased etc). However, by introducing color in the notification text I can no longer use the text to include a link to the detailed notification page. I am therefore forced to include a "view" button or something along that line to allow navigation to the detailed view.

I see three options:

  1. Keep the colored text and add a "view" button.
  2. Let go of including conditional coloring of the notification text, and including a link to the detailed view.
  3. Hybrid mode - add a headline text row (with a link) and the colored desription below - at the cost of larger items in a real-estate hungry page.


Any thoughts on the pros and cons of each, or better ideas on how to achieve a concise design?

Thank you.

2 Answers 2


The requirements are:

  1. Brief and concise, to catch the sense in a fast way
  2. Minimal, as it's not the full notification view
  3. Clickable to reveal the details

I think you should be less wordy and focus user on the important information only. Offer # isn't for humans, it's for computer. Highlight the numbers only and make them readable with monospaced font. Red/green triangles are the good way both to catch users' attention and convey the qualitative info.

enter image description here

  • We decided to let go of the "detailed view" of the notifications (because we don't have much more to say) and just concentrate on concicely providing the user with the most information we can - so your suggested solution would be great and we'll try including something like that.
    – Gil Tov Ly
    Apr 21, 2015 at 12:02
  • @GilTovLy please pay attention, placing the most recent price near the triangle is much better. In this way users will see trend (up or down) and current price immediatelly. Previous price is less important info, you could fade it compared to the actual price and remove or reverse the arrow, too. So users will read it like "Up and $0.9 now, was $0.8", instead of more long "Up and changed from $0.8, now $0.9" Apr 21, 2015 at 12:31

In my opinion. I think you should use following three altogether:

  1. Conditional Coloring
  2. View Details Link 3- Link all text or box to the details as well without giving them default coloring of links.


  1. User can better/quicker understand with conditional coloring
  2. View link does not acquire much real estate but it will make user think that there is a detailed version of it and how to see it.
  3. User behavior is some time to click the heading or content will save users time to find "View Details" link and it is easier for everyone to click on a larger portion.

I hope that helps.


Your Answer

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

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