If you’ve ever designed any kind of app you will have undoubtedly come across the Dashboard. Popular on Dribbble, usually accompanied by lots of nice looking stats and charts, it can be tricky to know what exactly needs to go on one of these mysterious pages.
The hardest part — as always — is being faced with the blank piece of paper/document/artboard. This is where you need to somehow get across potentially a lot of information in a clear, intuitive way.
For me, there is only 1 way to figure out the mess that’s in my head: write a list.
Now I’m a huge fan of writing lists, I genuinely get a little jolt of excitement when it’s time for a bit of list writing.
Heck, I’ve even written a list of the lists I have to write.
(Actually, that’s a lie. I don’t think I have ever done that).
The best way to figure out a complex problem is to first see all the factors down in front of you. So when you start your dashboard design, ask yourself: “What is every feature this person could possibly want on their dashboard?” And go nuts, write everything down even it if seems small and insignificant, this is about clearing your mind so you can easily focus and prioritise in the next step.
Sort it out
Now you’ve got everything down (doesn’t that feel better already?) you can go ahead and sort this list in any way that makes sense for you. I sort using 3 headings:
- Must have. The most basic functions your app needs in order to work.
- Nice to Have. Functions that would be good to include but aren’t a part of your core service
- Don’t need. You can launch your product without these. But would be nice to keep a record of for Phase 2.
You can use Trello if you like things to be nice and neat or just good old fashioned pen and paper. Whichever you feel more comfortable with.
“But I need all these features!” I hear you cry.
If you’re struggling to narrow down your list of Must Have’s it’s important to take a step back and re-confirm your immediate goals.
It can be very tempting to offer everything to everyone but in technology, simplicity is almost always better. Stripping out functionality now doesn’t mean you can’t add it in the future.
So narrow down your list and decide what needs to be obvious and accessible at all times and what can either be hidden or just not as prominent.
The customisable dashboard
Sometimes you’ll find that one dashboard layout won’t suit every user no matter how hard you try. In these cases, you have two options depending on the amount of customisation you think they’ll need.
Remember: Customisation for the sake of it is not a good idea. It’s your job to come up with sleek, intuitive solutions — not theirs.
The WordPress Route
WordPress is a great example of a customisable Dashboard. You can display a big welcome message and simply drag and drop all your widgets to create a dashboard that suits you. Perfect for people who will be using your app for multiple tasks that need to take different priorities.
The Panda Route
If you have users that can easily be grouped into categories that have similar needs you can do something similar to Panda where you provide alternate dashboard layouts for different groups. This is great for giving people a customised experience without them having to spend their time manually changing everything. It also gives the option to create a fully customised experience if they so wish.
Finding the right layout
So hopefully now you’ve got a pretty good idea of what needs to be featured on your main dashboard. The next step is to quickly sketch out some potential layouts.
Don’t worry if you can’t draw — this really isn’t a drawing exercise. In fact, I think the messier the better as it stops you from getting too attached to a certain design
This is the kind of quality sketch I produce for my designs (and it pains me to show this, so much so I put it at an angle to make myself feel better).
(It’s also a good way to make sure nobody can come in and steal your work — who other than me could decipher what this is all about?!)
I’m not going to dictate how many sketches you need to do for this. Just go with what feels right — whether you hit the nail on the head with the first layout or the 50th, you decide how far you want to take this step.
This is also the part where looking for inspiration comes in handy. But remember, we’re not looking for the most beautiful dashboard designs, we’re looking for the most usable. Which ones can you instantly understand what is happening and which ones take a bit more work to decipher?
I try to stay clear from Dribbble or similar here, as it’s infinitely more useful to be able to interact yourself with an app rather than viewing an image of an image on someone’s screen… that’s at an angle.
There must be at least a handful of apps that you use either daily or longer — maybe without even noticing. Think Twitter Analytics, Facebook Company pages, Harvest, Nusii, almost anything you have to log in for will have a dashboard.
I hereby give you permission to spend some time playing around with these apps, deciding for yourself which are a joy to use and try to figure out why you like them. It might not look like you’re working, but if anybody asks I’ll tell ‘em!
A few points to bear in mind when designing your dashboard
- Like any UI work, always keep your audience in the forefront of your mind when designing.
- Don’t pad up your dashboard with non-essential features. Think about what the user needs to know and make sure they know it.
- Don’t forget mobile. Users may need to check their dashboard while they’re out and about. Make sure they can.
- Gather feedback and actually watch people use your dashboard. This will give a good idea about areas you need to work on.
- Don’t forget your empty states. What will your dashboard look like before it has been populated with any data? How will you show users around?
I’d love to hear your thoughts on dashboard designs. Any that you particularly enjoy using? Any that just don’t do the job properly?
