My users are to pick out a view of data for tables and graphs through a button panel, but I suspect this one button might be too confusing.

enter image description here

Now, actually using the control panel feels very easy, and I've gotten positive feedback. But, the Fi button near the top right is where my problem lies.

No has 5 sub buttons, Se has 4, Dk has 2. Fi has none buttons as it only has 1 sub area in the database I'll be pulling data from further down the development.

I'm considering my options and conclude that i could add a button called Fi1 and let the Fi button just be a header like the other ones, but then, clicking the Fi to select all the children, just like how the other ones work, seem really redundant, It's just one child! but it does conform to a consistent behavior.

I could leave it like it is, but then I'm not sure if users are going to think that Fi is empty and there's no point in clicking it.

The results from clicking any of these buttons are hidden behind an apply button, so I'm not sure if the user would discover the Fi content on her own.

I guess I'm just looking for opinions or any examples of similar situations and how those were solved. Ideally I would do an A/B testing, but we don't have the capacity to go test

  • Can I select multiple buttons e.g. UK and PT and No.4 and No.5 ?
    – Mervin
    Jun 22, 2015 at 16:41
  • What do the sub-buttons (No1, No2, etc.) represent? Are they regions of each country? If so, is it common knowledge to the users of this application that Finland has no regions? Upon initial review of the screens, I did think that Finland was empty or unavailable, but that is a very uninformed reaction.
    – Andy
    Jun 22, 2015 at 21:07
  • @Andy Yes, they are regions, and their abbreviation is common knowledge to my users. They wouldn't have access to this if they didn't know these terms.
    – NachoDawg
    Jun 23, 2015 at 7:32
  • Is it possible to select the whole country? That is, is "No" a button too, or just "No1" etc. Sep 21, 2015 at 9:36

2 Answers 2


I'd suggest to be more direct.

  • start by explaining abbreviations. While they're obvious, always consider the user doesn't know about them

  • with those abbreviations explained, use them to create sets. So NO will include all sub sets of Norway. And similarly, since Finland set ISN'T EMPTY, you need to create a sub-set for Finland as well

  • now, keep this in mind: Norway (NO), Sweden (SE), DENMARK (DK) and Finland (FI) is an informational block (where are you going to perform the action) and NO, SE, DK, FI are informational blocks as well. This is, narrowing the space where teh action will happen. And "N0 1, No 2 [...], FI 1" are actions. Since you want people to CLICK (not drag, not swipe, not hover but CLICK), the most direct element your users will expect to have available is... a button. So, make completely sure your element is unmistakably and without a shadow of a doubt, a button.

I did a quick mockup for you:

enter image description here

Now, as you can see, the buttons are clearly buttons: they have material properties, they have height, they have a 3D like behavior. However, I also included something else: color. Why did I do this? Because I have no idea what your button's text will be like. But assuming it's like your sample, I grouped them by shades so your users can easily scan the information and notice the sub sets at first sight

Hope that helps!


Add the subfield under fi, it looks like it's empty now, and thats a reason not to click it, so one might mis the option.

Mind by the way that shades are no best practice to indicate if something is selected or not, use an selected icon or bold font, because it's sometimes hard for certain color blindnesses to see shades of the same color.

The panel looks clear to me, but I have no clue wat EC or GFS is, maybe your targettet people now these abbreviations, but if there is any chance they won't provide the full name or add an information icon they can click if they don't know it.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

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