1

I have a feeling this answer will depend on everyone's opinions and which design spec they follow. However, maybe it will give me a broader perspective.

I have a "panel" (as best as I can describe). It so happens to contain tabs in this instance, but may not always. It sits in my sidebar, but again, should be able to sit anywhere.

It's similar to the gaming.youtube.com example attached with the suggested/comments tabs and pane.

What is this called in GUI? A panel?

I tend to think so but then I see lots of examples of panels like this which are kind of like cards: http://foundation.zurb.com/sites/docs/v/5.5.3/components/panels.html

But is this just one example of a panel which has the fundamentals of: "Panels are often used to section window (browser window in my case) contents to ease visual organization."

gaming.youtube.com

Improve this question
5
  • I agree that panel is the best word to name what you are describing. But I would call that specific panel in the sidebar of your screenshot a "playlist". Particularly because it has that autoplay toggle which means it will play each video one by one.
    – Cave Johnson
    May 23, 2017 at 6:29
  • Yeah I agree with the playlist. The playlist is also only 1 tab though, the other tab is comments. So to combine both of those components into one, lets say its called "playlist-comments" you'd get playlist-comments-panel. Panel being the most important part of the name I want to get correct.
    – Rhys
    May 23, 2017 at 6:35
  • I think "panel" would be good. However I think it might be a good idea to use a more general name. Like "video-sidebar-panel". That way if you add or remove tabs later, you don't have to change the name of the panel. I would put a more specific name on each individual tab. Like "playlist-tab" or "comments-tab".
    – Cave Johnson
    May 23, 2017 at 6:53
  • Yeah absolutely, totally agree with making it generic, was just a quick example above. Cheers!
    – Rhys
    May 23, 2017 at 6:55
  • @Rhys Just wondering in your design system/library whether you have the concept of nested panels. If so, then what's the difference between a panel and a container from your perspective?
    – Michael Lai ♦
    May 23, 2017 at 9:14

1 Answer 1

Reset to default
1

"Tabbed panel" distinguishes it from non-tabbed panels, accordion panels, etc.

Improve this answer
1
  • Thanks! Only thing I'm not sure about is putting tab in the name. Panel contains the tab and panes. If in the gaming.youtube they drop the comments (or in my case the need to have tabs) then I am left with tab in the component name. Having said that, if there was a specific component which handled tabs in a panel for you to pull in I can see that working. If you decided to drop the tabs in that instance, you would have to change component, rather than edit in my instance, which is fine too. My question was more referring to the "panel" part of the ui but thanks for the input!
    – Rhys
    May 24, 2017 at 4:51

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.