Do you foresee using this component for all our site pages? I know we'll probably want to use it on the dashboard for sure, given the multitude of different items we are trying to display for the user. I can start sketching/mocking some ideas up from scratch unless you have mocks/wires you have already started for reference.

Let me know. Thanks!

@mkiang3051 - Yeah, we need to assume this can live and may live on other pages on the site and could be 2 or 20 links.

@ineedsubstance @joshkimmell @poofichu @scottnath
Some quick mocks in mobile. Desktop would have this showing a side-nav, while it would function as a dropdown nav on smaller screens.

I may try to mock an example of this in desktop too.

I wonder if a side-nav on a desktop would make sense to the user since only a portion of the content would be changing, not the whole page. This is nav is really only relevant to this table if that makes sense, not all the content on the page. Would like to see how that looks, though.

I also worry about hiding the options in a drop down. If a user isn't aware of the other available content, would the user use that dropdown to explore? I wonder if there are any mobile specific gestures or affordances we could use to indicate there is more related content.

Maybe it's making this nav feel more visually connected to the content.

Hmm - those are good questions. Can you clarify what you mean by a portion of the content that would be switching, not the whole page? Examples would be great since I haven't touched or been as close to this CMS content as you have.
To be honest, I was having a difficult time coming up with a really compelling example for use of a secondary nav with how our items are currently structured within the context of the main nav we currently have - since you've done a lot more thinking around the structure of the CMS, I'd like to hear what you've envisioned.

For example, we've kind of avoided the issue of having to filter out all content being in one table by having content type cards that a user will be taking action on. I was hard pressed to think of a content example where we would need a secondary nav without a solid use case. The example I had mocked up was only within the Article content type. So users would have physically used the Article content type card to navigate to the page I mocked up - so they should already know where they are on the site.
You are right about wanting to provide more of a visual affordance for the user so they know of their secondary nav options ... maybe we can label the secondary menu as being expandable? Or have a first use animation where the menu is already expanded, but then contracts?
What also makes creating a visual affordance a little difficult is that we don't want to have a redundant or confusing call out on mobile that may confuse the user with our menu button in the upper right hand side of the global header. It may help if we have breadcrumbs to help orient users and separate the global nav and secondary nav menus, but are we still going to have breadcrumbs? (Not sure if you are still working on them at the moment)

I can do a bit more thinking on this. But if you have any examples of where we'd definitely be using a secondary nav, that can definitely help me visualize this a bit. Of course, don't feel obligated to reply to this if your vacation starts tomorrow! Mine starts too, so we can always touch base when we get back (depending on our Punchcard deadline).

@mkiang3051

When you look at the comp below, the sub-nav (MY LATEST, THE TEAM, NEEDS APPROVAL) would update the date in the table below the nav only. So that sub-nav control a set of data, not the entire page. Does that make sense?

The dashboard is the use case.

Yes, breadcrumbs is still a thing we want to do.

I've always liked how Apple did the sub-nav on their product pages. Ex. http://www.apple.com/mac/

It's something I was trying on WOX but didn't work.

@ineedsubstance
Ok cool, thanks for the clarification. We just want secondary nav design for navigating through a sub-section of data on a page, AKA content specific toggles. Roger that.

I'll try to sketch up and come up with a few more ideas by week's end, before we "let go" of our Punchcard duties.

EDIT:
I'm going to create

1. A pattern for a true, secondary nav that a user may use to navigate across content within a page/section of our site
2. A navigation pattern for toggling between sub-items on a page

@mkiang3051 - for this story, you just need to do 2.

If we feel like we need 1., we need to create a story for it.

@ineedsubstance
I took some time and came up with a possible pattern for both items 1 and 2 above.

1. In the first example, it's kind of like Apple's secondary nav. Instead of pictograms, we have text. But the concept is the same where you have an arrow to press to see more secondary nav options. As you also mentioned, not sure we actually have a use case for a true secondary nav, but we could still use this for the toggling.

2. In this second example I used our dashboard use case; the user would be able to either see all the toggle-able items presented, or see that they would need to swipe across to see more of the sections. I got this idea from the Google Play store. I think it looks nice and simple, but I'm not sure if it's the most people-friendly if they aren't familiar with mobile patterns.

In both cases, a user can immediately see more of what's available to select/toggle through without having to click on a dropdown icon/button. Let me know your thoughts!

1. Secondary nav for the whole site

2. Secondary nav that toggles items/sections on a page

@mkiang3051 - These look good, thanks for working on them. So let's focus on 2 since that is what this story is about. I like this approach but have a few thoughts/questions:

1. I think this might need some affordance on the right showing the user that there are more options beyond these 3. That could mean an arrow like you did in the first example, or a shadow of some kind or another indicator.

2. We need to think about what happens if a user picks a nav item that is not currently shown (far to the right). Would that nav item stay there to indicate to the user what data they are seeing? Would the title change?

3. Should we treat this more like a filter or option? So by default, we show data that the user is working on, but have a way to toggle or switch to data that the whole team is working on, or data that you are working on that needs approval? So we are really filtering by author and status. Maybe?? Just a thought.

@ineedsubstance
My thoughts:

1. I've added another mock with a pretty crappy visual rendering of using a fade out gradient (couldn't really figure out how to do this in sketch) with an arrow to indicate that there are more options off the immediate screen (see wireframe 1). We can definitely add an arrow and work on how we want to display it visually.

2. In this original design, I was thinking that the nav item selected would stay highlighted and on screen, serving as an "unofficial" title. And the items would sort of "rotate" through as the user scrolls and selects different options (see wireframe 2). This may be savvy and simple, but could be too unstable an affordance for those not well-versed with mobile patterns.
   Alternatively we could have that menu there, and then have an official sub-section title above or below the nav (see wireframe 3).

3. Hmm this is a good question. How complicated do we want to make it? I could see perhaps toggling between My Latest and My Team as being on the same level, with perhaps the ability to filter by status. That does make things a bit more complicated though.
   Alternatively we could also just keep everything as sections to filter through on the same, high level (kind of like what we have in our mocks).

Wireframe 1

Wireframe 2

Wireframe 3

@ineedsubstance
Do we need anymore work on this? Or are we ok to wrap this up? If you need anything else, I can work on it a bit today as well.

@mkiang3051 - yeah, I think these are heading in the right direction. Since we are moving on from this, we are good for now.