0

Context I am working on a design where I have containers that hold different types of objects. These objects are used within each other / dependent. We are displaying them as a tree in a table format with columns that have attributes attached to the objects.

If objects in a container are set as public, those objects can be used /referenced in another container. Those objects are being displayed with a referenced icon in the object dedicated attribute column.

Challenge It is not clear enough for the users that the objects that are references, aren't actually sitting in the container, but rather are just things used from somewhere else.

I need to display them in the container that references them because of complicated dependencies, usage between the objects, merging the dependencies between objects, etc so I am thinking to improve as follows:

  • reduce opacity / show a slightly different style for the referenced objects, and
  • offer a toggle that allows user to hide things that are from other containers.

I am not sure this is enough and I was wondering if any of you encountered something similar? Do you have a better solution / pattern that would work for such a use case?

Note: users can filter by attributes, referenced or not, from the table header, but somehow that is not enough.

Current design:enter image description here Possible solution: enter image description here

2
  • 1
    can you post some visuals of your work so far? This forum works best with some tangible UI showing both the larger context and some details of your approach.
    – Mike M
    Sep 30 '20 at 14:33
  • @MikeM Yes, for sure. I added some examples. Hovering on the icon (the middle one) -> shows in the tooltip the name of the parent container
    – Ioana
    Oct 1 '20 at 10:04
1

This reminds me of Google Drive's sharing feature, where a file can have a different owner than you, but are displayed in your drive.

They show this by adding a column with the name of the owner, or "shared by":

enter image description here

Similarly, you could extract this piece of information to a "Enclosing Folder", "Parent Folder" or "Referenced Folder" column and write+link the parent folder name. Additionally, you can introduce a new folder icon to teach the user what a referenced folder looks like since only folders with values under the column "referenced folder" have this new look. After a while, they will make the connection and becomes a learned behavior.

enter image description here

The current implementation may have a few issues. (1) Users are unable to understand uncommon icons without learned behavior. (2) The icon is mixed with other attribute icons, making it less distinguishable.

There are probably other considerations missing here, such as what other attributes the other icons signify, but in general, be direct and descriptive about what you are communicating. An icon and reduced opacity are visual suggestions that can carry hundreds of meanings. A descriptive word tells the user exactly what it is, no need to guess.

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.