How to Add Visual Indicators Easily to Salesforce
Did you know that Salesforce has standard visual indicators available that can be displayed through a simple formula field? These eye-catching images allow users to quickly understand data at first glance as compared to text fields. As Edward Tufte is famously quoted “above all else show the data.”
Take the example below. A green, yellow, or red traffic light can be displayed to highlight the level of risk at an account.
First, simply create a Picklist field called Risk Level with values of High, Medium and Low. Next, create a formula Text field called Risk. Place the If statement below into the formula field:
IF( ISPICKVAL(Risk_Level__c, "Low"), IMAGE("/img/samples/light_green.gif", "Green"),
IF (ISPICKVAL(Risk_Level__c, "Medium"), IMAGE("/img/samples/light_yellow.gif", "Yellow"),
IMAGE("/img/samples/light_red.gif", "Red")
))
Now, when a value is selected for Risk Level, it will update the traffic light image automatically. Make sure to set the set the default value of Risk Level to Low if you would like this to be the standard for all Accounts when added to the page layout.
To take it a step further, if you are interested in increasing the size of the image, you can simply add in the pixel sizes with the below formula and resulting image:
IF( ISPICKVAL(Risk_Level__c, "Low"), IMAGE("/img/samples/light_green.gif", "Green", 30 , 60),
IF (ISPICKVAL(Risk_Level__c, "Medium"), IMAGE("/img/samples/light_yellow.gif", "Yellow", 30 , 60),
IMAGE("/img/samples/light_red.gif", "Red", 30 , 60)
))
Other standard images include a green, yellow or red flag to indicate priority, a green, yellow or red square which can signify Opportunity or Case age, and 5 stars to indicate a rating or score per the below. Keep in mind that these images can be utilized in reports too! Share your image use cases in the comments section!
IMAGE( CASE(Rating__c, 1, "/img/samples/stars_100.gif", 2, "/img/samples/stars_200.gif", 3, "/img/samples/stars_300.gif", 4, "/img/samples/stars_400.gif", 5, "/img/samples/stars_500.gif", "/img/samples/stars_000.gif"), "rating")
