Graphic Design Stack Exchange is a question and answer site for Graphic Design professionals, students, and enthusiasts. It only takes a minute to sign up.
Sign up to join this community
My app has this kind of design in the ideal, normal use case:
but, in case the user creates two or three nested folders with a long folder name, like in this structure:
it quickly becomes problematic:
I can of course widen the box but that doesn't seem the best solution:
Therefore, I need some guidance on what can be the best way to sort out the problem of long folder names. Thank you!
You can use a chevron << to the left of the folder navigation breadcrumb in case there is no room for all of the folder names. Push the parent folder names to the left giving priority to the child on the far right.
However for very long names, you can set a standard maximum length for the characters that should be displayed for each folder name(giving priority to the child too) when there is no room between the breadcrumb and actions/controls to the right, use an Ellipsis ... to signify the adjustment.
You can also chop off some characters on the child incase it is very long or you want to leave enough space between the breadcrumb and the actions.
In case the user wants to navigate back uptop, they can click on the chevron to reveal the parent names. It can be a dropdown or horizontal scroll for the folder names.
