Dealing with an issue the selected tab. I feel the removing the stroke under the white (selected) tab is awkward with the text beneath it. Does the subtle stroke help on the selected state?
Top option for me. The stroke does help enforce the bar for the "Guest: Sam Greensburg" portion, but it's not really needed in my opinion. I've got another idea though, will post a rebound.
I WILL TELL YOU! i think best practice (if there is one) is to emulate tabbed file folders, which would not have the line. that's just my personal preference as a user, i like the connectedness and association. but i totally understand the whitespace weirdness.
This is only a suggestion of another way to help unify the tab and bar below and still maintain some separation with their contents.
I added a subtle gradient to the "Guest" bar and then extended up slightly into the "History" tab which fades to white at the top. Also added a subtle highlight to the bar to give it a bit more separation from the "Payments" tab.
This could be too much detail for the rest of the UI, so you make the call.
6 Responses
Pro
TJ Taylor
Dealing with an issue the selected tab. I feel the removing the stroke under the white (selected) tab is awkward with the text beneath it. Does the subtle stroke help on the selected state?
What's the best practice here?
over 1 year ago
Pro
Phil Coffman
Top option for me. The stroke does help enforce the bar for the "Guest: Sam Greensburg" portion, but it's not really needed in my opinion. I've got another idea though, will post a rebound.
over 1 year ago
Pro
Trent Walton
Knee jerk reaction- I like the stroke-less / top version. It's just plain clearer which tab I'm working in.
over 1 year ago
I WILL TELL YOU! i think best practice (if there is one) is to emulate tabbed file folders, which would not have the line. that's just my personal preference as a user, i like the connectedness and association. but i totally understand the whitespace weirdness.
over 1 year ago
Rebound
Tab
by Phil Coffman
This is only a suggestion of another way to help unify the tab and bar below and still maintain some separation with their contents.
I added a subtle gradient to the "Guest" bar and then extended up slightly into the "History" tab which fades to white at the top. Also added a subtle highlight to the bar to give it a bit more separation from the "Payments" tab.
This could be too much detail for the rest of the UI, so you make the call.
over 1 year ago
Pro
TJ Taylor
Thanks for the feedback my friends!
over 1 year ago