0

I am currently designing an Android app that allows users to browser a product database. The database has a defined tree structures with inner nodes representing product categories and leaf nodes representing single products.

I have two separate views for leaf nodes and inner nodes (the inner node displays all direct child nodes, while the leaf node has some more product details).

Now I need to add some sort of hint or clue for to user to distinguish (when viewing an inner node/product category view) whether each entry is another sub-category or a single product.

The subcategories are represented as a GridView with each item showing a representative image and a caption below.

Are there any established hints for this sort of distinction? All I can think of is something like the folder icon vs. some other icon distinction in desktop file managers, but that does not seem sensible here...

Improve this question
1
  • I'd suggest using the same icon/illustration but package it differently. Maybe the product icon inside of a square/box for representing the group. It's best to use icons which have very similar visual cues when they just differ in communicating the amount of the same thing.
    – AndroidHustle
    Mar 24, 2014 at 11:27

1 Answer 1

Reset to default
-1

How about using breadcrumbs in the action bar?

http://developer.android.com/reference/android/app/FragmentBreadCrumbs.html

EDIT: Breadcrumbs in the action bar can let the user know where they are and where they have come from and if they have anywhere else to go. In this case, I thought that maybe showing the breadcrumbs can let the user know where the are based on the naming conventions. For example:

  • Necklaces>Gold Necklaces>18" Infinity with Ruby
  • Necklaces>Gold Necklaces>Infinity Necklaces

If the grid view contains both products and categories, this suggestion won't work. However, like I said in the posts below you can use visual cues to differentiate. You can also standardize the wording to give clues (like the two examples above.). Hope this clarifies...

Improve this answer
5
  • I am not sure what breadcrumbs would accomplish here, but maybe you could elaborate what you mean. My problem is not in clarifying where the user currently is but in where clicking on an item will lead her, i.e. if clicking will lead to sub category or to a single product. From what I understand, breadcrumbs are always related to where you came from, not where you are going...?
    – david.mihola
    Mar 24, 2014 at 13:09
  • Ah, understood. Isn't the representative image of a product different enough than the product images to make it clear? I agree then with @AndroidHustle that a visual cue would be enough. I worked on an app with products and the category images were very generic, on a white background, all similarly sized, nothing branded. We even discussed using cartoon images to differentiate, but it turns out users can tell the difference if you keep the category/subcategory icons very similar.
    – Rae
    Mar 24, 2014 at 18:54
  • @Rae: Thanks for writing again! Well, I am afraid the product pictures arent particularly good and in some cases the picture for a category may even be the same as for a single product (with the single product being one of several package sizes of the same product type). I am currently leaning towards doing something like the stack effect in this SO question: stackoverflow.com/questions/14678624/… - also, I agree: I think the app wouldn't be confusing even if there was no clue at all, but I was asked to add something...
    – david.mihola
    Mar 25, 2014 at 21:40
  • I would definitely not use the same picture for a product and the category... very confusing, even with the visual differentiation. I'm not sure what the product is or how many you have, but maybe they need to rethink making a "category" out of something whose members are just different sizes of the same thing. Does it really add value to the app or does it create one more unnecessary step in navigation?
    – Rae
    Mar 26, 2014 at 9:11
  • @Rae: Since I don't have any influence on the actual product database that I get the pictures from I am stuck with using what I get from there. I agree with you though, that there should be different pictures for categories and products. In any case, I used the "picture stack" effect from the link I posted above and I think it's as good as any hint, given the pictures provided...
    – david.mihola
    Mar 31, 2014 at 7:30

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

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