A dashboard or report is meant to display your data story. We also believe they are meant to be beautiful and to delight your audience. Images can be used to orient your audience to your community and help ground the data in the real people and places the data represents.
Photos of your community are best because they are personable. Finding shots of people who are engaged and active can elevate your dashboard to make it fit in with your community. Do you have a yearly festival or fair you can show case? Make the photos in your dashboard something friendly and recognizable to help show off and represent your community. Also consider the racial and socioeconomic makeup of your community in order to choose the most representative photos.
Photos don't need to be explicitly relevant to the page topic, but they should be symbolic and meaningful. The image should feel like it belongs in the dashboard. If it is a negative topic, such as poverty or disease, don’t choose an image that shows struggle; find one that encourages hope or improvement.
Image size options:
For consistency it is best to pick an aspect ratio to use across all of the images in your project.
Avoid using vertical formatted photos.
Avoid using low resolution images. If your image is very small to begin with, making it larger will make your image look pixelated and blurry.
Once you choose a size to crop your images, stick with that aspect ratio for the rest of your project.
You can use Pixlr to help you edit your photos. It's free!
If you need help cropping images, check out our image cropping tutorial.
Be sure to give credit to the photo if needed by writing a caption or providing a link to the original. You can also make the photo ADA compliant by adding an image description.
Recommendations for image ratios:
Dashboard Header Images: The header images used in dashboards uses a 3:1 aspect ratio. To achieve maximum resolution quality use the image size 2400w x 800h.
Promo Cards: The images inside promo cards use a 2:1 ratio. The optimal size to save these out to is 600w x 300h.
3:1 Ratio Sub header: This can be a great size to use for page header images. When building this image size out, it is best to double the image size to a 1200w x 400h. The app will resize it so the image will fit nicely on your page. This ensures a better looking image on high resolution displays.
2:1 Ratio Sub header: This image size can also be used as page header images. The slightly larger size also works well to break up content inside a page. The pixel size to shoot for is 1200w x 600h
Applying a filter to all of the photos used in your project can help create more visual consistency on your report or dashboard. Photos used in your project will come from vastly different sources with variances in color temperature, hue, saturation, etc. Using a preset filter will start to bring the photos together by applying a consistent color adjustment. Consistent color will bring the photos closer in visual alignment. By no means are filters a must-have, but they can give your project that extra degree of design professionalism.
Ready to learn more? Check out our dashboard style guide!