When I said custom search I did mean a saved custom search. So since everybody got these widey-wide widescreens it would maybe make sense to just add the left meny from the manifest overview page to the edit ticket-views as well. Maybe with a option to hide/unhide it.

That would make a lot of sense for us.

Other than that. I'm going to order a kensington mouse and try your cool mouse-trick. :-)

D4003 / D4004 give us enough technical groundwork to at least take a stab at this once we figure out the UI.

I'll work on the UI tomorrow, finishing up cards tonight.

Okay, took a pass at some new ideas and looking for feedback. Not sure if it would work everywhere but I think it's the most useful version I've put together.

{F24886}

Based on suggestions by @epriestley I created this https://gist.github.com/4130970 And it works perfectly for me.
It just adds the sidemenu from the maniphest overview to the edit and detail view as well

Here's how far I've gotten with this:

{F25818}

On mobile, my thinking is:

• The current application crumb ("Paste" in the screenshot) turns into just an icon for mobile.
• The filter options menu (list icon in the screenshot) stays around. When you click this, there's a dropdown like in your mock.
• The current filter crumb ("All Pastes") goes away, since it's duplicated in the dropdown and we don't have space for it. On desktop, I think it's useful enough to keep around.
• Other crumb(s) stick around.
• The "Create Object" button becomes a green "+" icon (maybe with a dropdown).

So we end up with something like this when resizing the interface:

{F25820}

The breadcrumbs also replace this goofy thing:

{F25824}

The menu is now a dropdown off the "list icon" button in the crumbs, and the content is always visible. Removing the Application menu (D4033) allows us to get rid of the phone variant as well.

This simplifies mobile layouts a lot; we can just hide the side menu in all cases rather than making it slide around and animate.

Do you have thoughts on this? Design-wise, I think the outstanding stuff is:

• I've separated the crumbs with a simple border, but it should probably be somewhere between that (since they're more buttoney now) and the ">" from the original mock. Maybe just a border shaped more like ">"? I deviated from the ">" partly out of laziness and partly because I think we can indicate the more-buttoney-state of where I ended up more clearly with a different approach.
• We should probably have a "V" dropdown triangle on the list thing.
• We should do an app icon treatment for crumbs, to replace the treatment in the app menu? So we can put an anchor, etc., in the crumbs instead of a generic globe?

Overall I think this is going to be a big step forward.

(I'll get a diff out for this soonish but I want to try to do a cleanup pass on the mess that is AphrontSideNavFilterView / AphrontFilterView first).

I'll mock up some other directions for this tonight. I had tried some of the things you suggested, like the app icon. The main issue there was the double-stacked icon (Phabricator's Eye and Differential's Gear) looked bad, so I simplified the subnav. Between the two we could probably lose the Eye, but then again that might look weird with just an icon on the second level.

Overall, I'd rather make the second navbar a full navbar, and skip the awkward breadcrumbs. It's interesting, but not really needed. There are more interesting things I think we can do when we're not restricted to a linear, progressive nav structure that crumbs would be.

Mostly, I'd like to take what we've laid out here and work it into the frame/nav revamp I'd sketched out below:

{F25837}

This was where I left off on the mobile redesign.

{F25840}

Strawman for discussion, will develop a mobile view of this tonight.

{F25859}

I do like actual breadcrumbs, at least on the Desktop, and some applications are extremely linear/hierarchical (e.g., Diffusion > Repository > /path/to/file, Phame > Blog > Post) but breadcrumbs don't solve a specific problem that we can't solve in other ways, so I'm not particularly attached to them.

On the most recent mock (T1960#19), I'm not quite sure I understand what's going on -- what is the reasoning for are "Active Revisions" and "My Revisions" both appearing in the second nav, and what is "Bag of Holding"? (Is it basically just moving the vertical side nav into a horizontal nav bar?)

I also wonder how much of this problem would be solved by just making the back button more useful more often. Specifically, if commenting was fully ajaxed I think it would nearly always work, which would reduce the need for upward navigation and probably let us get rid of the "prev" button on mobile duplicating the browser's "back" button. I think doing so has no tradeoffs UI-wise, it's just a bit complicated on the backend.

The buttons names are made up, they are just placeholders testing the design.

I do like the idea of getting rid of the sidebar and moving towards a subnav, but I'd want to make sure it worked everywhere first. Diffs are probably the most difficult, but I don't think it's unsolvable. Basically I'm looking at what happens to the product as it continues to grow / add more features and provide an easier way to manage them (app navigation).

++ on comment ajax.

I'm not sure we'd ever have anything to put in the subnav if we treat it as separate navigation buttons. I don't know what we'd put there in the most complex applications (Differential, Manifest, Diffusion) beyond "Application Home" and "Search/List". I think the only other candidate is "Reports", but it's very infrequently used (there's no link anywhere for Differential, even).

We have a few applications where it might make sense, like the Daemon console, which sort of handles two types of things ("Tasks" and "Daemons"). Drydock and Phame also have multiple object types ("Resources" and "Leases", and "Blogs" and "Posts" respectively). However, these cases are pretty rare and I think we do a fairly reasonable job with them now (Phame could be better, but I think it would be best to make it more hierarchical, since Blogs contain Posts).

We used to have more of these (MetaMTA had "Mail" and "Mailing Lists", Files had "Files" and "Macros") but users had a hard time finding the secondary objects because the tabs weren't prominent, using tabs to find secondary objects was uncommon, and the secondary objects weren't very closely related to the primary objects (it's not obvious that image macros live in "Files").

We also have applications which have strong hierarchies -- we have existing breadcrumb elements in Diffusion and Phriction.

My thought was existing sidenavs would just convert to subnavs (with the subheaders being drop down buttons). Basically the sidenav takes up a good bit of space and I'd like to find a better means of representing those links, while hopefully at the same time providing some additional utility. That's where I started with a bit of a mix between the subnav and breadcrumb nav.

Let's do this, can you tell me the 5 apps that are most 'nav' dependent in your opinion and I'll try a few new versions using all of them to see if we can find a good solution. Or if you're completely against ditching the sidenav, that would be good to know as well. I think some views might present a challenge, like diffs, but I can tackle those independently. I already have a decent diff-mock without the sidenav (needs crumbs though).

Sure:

• Maniphest: (Side Nav for Query Filters) Most applications use side nav as "quick filters for search". Maniphest is the most complex of these. There may be arbitrarily many filters (users can add queries) and it's a common use case to switch between several filters (this is less common in applications other than Maniphest, though). Other examples of this type of nav are Differential, Paste, Audit and Pholio.
• Phame: (Side Nav for Multiple Object Types) This application is tricky because it has two types of objects, "blogs" and "posts". Each post belongs to exactly one blog, but we need to support queries against posts without a blog to support "I wrote a post about X but don't remember which blog it's on" and listing of posts which aren't attached to a blog (e.g., because the blog was deleted -- these posts can be moved to other blogs), so we can't have a strict Blog -> Post UI. Other examples of this type of nav are Daemon Console (Tasks, Daemons and Daemon Logs) and Drydock (Resources and Leases) and MetaMTA (sent mail, received mail).
• Settings: (Side Nav for Navigation) This application has a large number of navigational links which don't necessarily group into neat categories very well. Note that this menu may have an arbitrarily large number of groups, with an arbitrarily large number of items in each group (applications can add new panels). Other examples are User Profile and Project Profile.
• Herald: (Side Nav for Everything) This application uses a side nav for all three purposes above. A less extreme example is probably Owners.
• Diffusion: (Side Nav for Views) This application uses a side nav to show different views of an object (History / Browse / Change / Lint). I think this use is fairly unique.

I think I have all the various states mocked out for this. Anything else to look at design wise? Was going to look at cleaning up the sidenav UI if we're keeping it and crumbs.

{F26437}

{F26439}

I'm not blocked -- there will be a bunch of icon/sprite stuff after this lands but I'll get a list together (e.g., slicing 1x and 2x gradients of all the backgrounds and all that kind of thing). I think I should have more stuff up today, I've just been backlogged with a bunch of other stuff (on the plus side, I have a vastly more complete understanding of SSL / TLSv1 + SNI now!)

I have a few more images to slice, but they will all be done here shortly. Not sure gradients benefit from 2x, they seem fine on my retina macbook.

Woah just noticed the retina icons on the remarkup box. Sweet.

Alright, I think this is what we're missing:

• "Phabricator" menu button (left, primary menu)
  • Has wrong icon (already sliced?)
  • Probably needs style tweaks (style recycled from whatever I had before, which I think was an epriestley "design")
• "Application" meuu button (right, primary menu)
  • Has wrong icon (not sliced?)
  • Style as above.
• "Dark Menu" items (items in the Phabricator and Application menus)
  • Need texture graphic.
  • For items which are applications, need application icons (do we already have these?)
  • For items which are not applications, maybe need icons in some cases or other style tweaks (e.g., green for "Create" items?)
  • Maybe general style tweaks, not sure I got all the fonts/padding correct. I also moved "search" relative to the mocks for implementation ease, although I like it in the menu and it's a big pain to move so if you don't haaate it maybe we can leave it there?
  • The Phabricator menu should have "Home" and "Current Application" items shown prominently (first two items under search), I think.
• Breadcrumbs
  • Need gradient graphic.
  • Need ">" polygon graphic (I sliced a rough one out of Photoshop).
  • Need application icons.
  • Button layout on right is currently "actual button" -- I want to retain green on this element but it can blend into the crumbs better.
  • Don't currently have second-level path nav (e.g., "Revisions > Active > D123" doesn't have "Active"). This is a technical problem since we need to build a ton of JS stuff to get it right.
  • Currently no hoverstates, maybe need more graphics/icons?

I think that's everything?

Some of these should be in _Final in the appropriate /images/ folder. I had forgotten to cut up the mobile stuff, will add.

I just upgraded to the newest git-version. The breadcrumbs helps, but it's still lacking compared to just add the sidebar as we did to both ticket view and edit ticket view. usually you want to go back to you custom saved search, not the normal ticket overview.

(As you see from the screenshot we added hours worked, and we've misused priority for a easier drag'n'drop scrum-status. :-)

Thanks @auduny, we'll likely have some sidebar navigation in Maniphest when we update that app.