3

This is a problem that I had in several places in various web apps that I built. I'm asking about one specific case because it's simple and clean. I have this page:

enter image description here

It's a project, called "Come Together" and has two campaigns, "New" and "New 2". That's the most important part of a project, the campaigns. But also, the project has some other pages of data. You can think of them as sub-pages. In that screenshot I'm displaying it as a tab: "Members".

I'd rather have a link to a different page that displays members. Do you think that's a better alternative? If so, what would be a good way to display those links? It's only one right now, in some other sections of the app is up to 6 or 7. I don't want to have links on the toolbar for it, it doesn't feel like they belong.

  • The tabs make sense, it keeps related content together. But you should remove the breadcrumbs. If you highlight Projects in the top menu it should be clear where you are. – jazZRo Apr 15 '15 at 7:19
  • @jazZRo I disagree about the tabs, I'd rather have other pages for displaying sub information and the breadcrumbs help knowing where you are on that hierarchy. For example, they help you get back to a Project when you are editing it or adding a campaign. – pupeno Apr 15 '15 at 8:25
  • I agree with you: Since it's sub-information, your problem is solely with UI real estate. You have not much going on to the righthand side. Why not move a link out there? – Jedi Commymullah Apr 21 '15 at 23:56
1

In campaign management tools it is common to see tabbed navigation. In your case it makes sense to have the tab members under the project, if these members belong to the project. But you lose the ability to consistently apply the breadcrumb for sub-pages and campaigns since these the H1 of the page will always be the Project Name.

You could experiment with an alternative layout introducing a vertical left hand side menu with all the sub-pages of the Project. So the IA would go sth like:

  • .1 Project Landing page
  • .1.1 Campaigns
  • .1.2 Members
  • .1.3 Subpage
  • .1.N Subpage

In this IA, the .1 page would be an aggregation page emphasising campaigns but also possibly providing additional entry points to the rest of the subpages (e.g. a members block). This would work if there is a limited number of campaigns per project.

You could also consider allowing direct access (shortcuts) from: Buzz / Projects to the internal campaign pages e.g. Buzz / Projects / Project Name / Campaign Name

If the Project itself has no data (it is an empty container of its subpages and campaigns) the proposed architecture would still work but would create the following usability issue. When the user selects a Project Name he is re-direced to .1.1 to see the Campaigns of the Project. In this case, the UI language should also adapt to sth like:

Left hand side nav bar: Instead of a link "Project Come Together" it could read "In Project Come Together" and be a plain label only.

0

You’ve got quite a bit of unused real estate. I would skinny-up the campaign list and make it the main column and create a right-hand column with the an h2 title ”Members” listing the top ten most popular/active/last-logged-in (whatever) members and have a link that says “Show all” at the bottom of the list.

This should be relatively short and leave another slot below it for additional related content, like sharing tools or cross-promotion.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.