Tableau Mobile Friendly Dashboard
Tableau mobile friendly dashboards are not as tedious as most people think. It does take some time but most of your work is done after creating the standard default dashboard. Although it may not be the most fun part of Tableau it is definitely needed if your users will be looking at your dashboards on their phone or tablet. Follow this guide on how to create mobile friendly dashboards in Tableau so your end users don’t throw their phone at you in disgust.
Enter your email to download the data
Tableau Default Layout
The default layout is the same dashboard layout you normally work in. This layout will be shown on your desktop, tablet or phone if you do not create specific layouts for each. I generally make my default layout around 1200×800 pixels plus or minus 100 pixels depending on how many charts I have on my dashboard. If you pick this layout, you generally have enough room to do what you want and it will also fit nicely on most laptop screens. One thing to stay away from on any devices is horizontal scrolling so try not to make it too wide. For the default layout you will create dashboards like you normally do but if possible, try to use containers and not float as much as possible, this will make things easier when creating the other layouts.
Tableau Desktop Layout
The desktop layout is the easiest one because it is already done! The benefit of creating the default layout as your desktop layout is you don’t have to do anything for this one.
Tableau Tablet Layout
The tablet layout is also really easy especially if you didn’t make your default dashboard very large and used containers. It will shrink some when adding the tablet layout but generally it’s pretty close to the final product already. You will probably have to resize some things or move some floating objects but you shouldn’t have to do much. This is where the containers come in handy because if everything is in containers it will all adjust accordingly.
Tableau Phone Layout
Here is where all the hard work is done, this is obviously the biggest change from the default view. On a phone you have a lot of vertical room and very little horizontal room so you will have to make a lot of adjustments. When you select the phone layout it will stack all your charts on top of each other, even the floating ones so you will have a lot of moving and adjusting to do. You will also find that many charts you built for the default view will not work for the mobile view. Delete charts and creating specific charts for your mobile layout will make the difference between an acceptable dashboard on mobile and an excellent mobile friendly dashboard. Take a little extra time to duplicate and adjust some of the charts so they look better on mobile. You may also have to create charts from scratch just to be used on mobile. You will need to put these charts in the default view and hide them like I did in the video in order for them to be useable in the phone layout view. Below are some tips to help you make more mobile friendly charts for your mobile layout.
- Always lock pan and zoom on maps
- Use sheets as filters instead of quick filters
- Make sure marks are large enough to be touched by a finger not a cursor if using actions
- Simplify and enlarge font on Tooltips
- Shorten titles and may need to reduce font size
- Add some instructional text to give the end users some directions on things like clicking marks or actions
Conclusion
Now that you have all 3 layouts create, you must test it out of all 3 different devices. I would test it out on multiple phones and tablets especially. It always looks slightly different on Tableau Desktop compared to Tableau Online or Server so test it out on as many devices as you can.
Spending the extra time to create these layouts will be greatly appreciated by your end users. Just to be clear I do not create these layouts unless I know my users are looking at it on mobile or I am being asked to do it by the users. I don’t have many clients that use Tableau on mobile devices but the ones that do, this is a very important skill to have.
