Feature #15880
closed
Consistent, global button/menu to add new content
100%
Description
Currently, Redmine has at least three different UI concepts for adding new content:
- To create an issue, the tab "New issue" is used.
- To create a wiki page, you have to reference that page first in another page and then click on the (red) link.
- To create most other content (news, messages, etc.) the links at the top right (
divwith CSS classcontextual) are used.
In my opinion, the last option makes most sense, and I would be in favour of getting rid of the "New issue" tab, and adding a "New issue" link in div.contextual within the issues section instead. To be consistent, I would also add a "New wiki page" link in the wiki section.
Now, I understand that tracking issues is the main purpose of Redmine and adding new issues should be as easy as possible. So it is understandable why we have the "New issue" tab today. However, instead of the tab, I would propose a new tab at the very left that could be labeled "Add", or "New", or simply " + ". Hovering over this tab would open a drop down menu with options like "Add issue", "Add wiki page", "Add news" (maybe also "Add Milestone"), etc. And of course, there would be a hook in this menu, so that plugins can use the mechanism, too.
I have that on my personal to do list for Planio and I'd like to see this in Redmine as well, so I will submit the patch once I have it.
Meanwhile, what do others think about this?
Files
Related issues
Updated by Ivan Cenov about 10 years ago
About adding wiki pages.
Now, when adding an wiki page, it is known which wiki page is is its parent. How do you plan to deal with this?
Updated by Jan from Planio www.plan.io about 10 years ago
Ivan Cenov wrote:
Now, when adding an wiki page, it is known which wiki page is is its parent. How do you plan to deal with this?
You can actually add wiki pages without specifying a parent, just try /projects/<your project>/wiki/<something>. You could even select the parent from a dropdown if you like, but it is not mandatory. What you need though is a name, but that could be added as an additional field in the new wiki page form...
Updated by Jan from Planio www.plan.io about 10 years ago
- Related to Patch #15905: Button to add new wiki page added
Updated by Jan from Planio www.plan.io about 10 years ago
- Related to Patch #6427: Create CSS to support child and nested menus added
Updated by Jan from Planio www.plan.io about 10 years ago
- File 0001-bugfix-like-top-level-menu-nodes-child-nodes-should-.patch added
- File 0002-introduce-virtual-MenuNodes-which-are-characterized-.patch added
- File 0003-style-nested-menus-as-drop-downs-on-hover-in-all-thr.patch added
- File 0004-add-virtual-menu-at-the-beginning-of-the-project-men.patch added
- File 0005-move-New-issue-menu-item-to-the-new-object-menu-and-.patch added
- File 0006-add-a-New-issue-link-to-contextual-area-of-issues-li.patch added
- File 0007-add-link-and-a-new-action-to-add-a-new-wiki-page-to-.patch added
- File 0008-keep-the-new-object-drop-down-open-when-the-sign-was.patch added
- File new_object_menu.png new_object_menu.png added
- Target version changed from Unplanned backlogs to Candidate for next major release
Here is a series of patches that solves this issue (in my opinion) against current trunk. Tests are included.
But here's a nice screenshot first:
- Patch 0001 fixes a bug in the menu manager where child nodes in a menu would get rendered even if the user wasn't authorized to view them
- Patch 0002 introduces "virtual menu nodes" which are characterized by having a blank url. they will only be rendered if the user is authorized to see at least one of its children. they render as links which do nothing when clicked.
- Patch 0003 adds stylesheets for nested child menus in all three themes, this supersedes #6427 which had only styles for the main theme
- Patch 0004 adds a virtual menu at the beginning of the project menu containing menu items for creating issue categories, versions, news, documents, and files
- Patch 0005 moves the "New issue" menu item to the new object (virtual) menu and highlights the "Issues" tab on "new" and "create"
- Patch 0006 adds a "New issue" link to contextual area of issues list for consistency with other areas
- Patch 0007 adds link and a "new" action to add a new wiki page to "new object" menu and to contextual area of wiki section, this supersedes #15905
- Patch 0008 keeps the "new object" drop down open when the + sign was clicked (for touch displays where
:hoverdoes not exist)
By the way - this feature is already live on some Planio accounts, you can try it out and play with it at https://berlin.redmine.ug/ for instance.
I had the opportunity to speak with some Redmine users at our first Redmine User Group meeting and the feedback was positive, so I am marking this very boldly as candidate for next major release ;-)
Updated by Jan from Planio www.plan.io about 10 years ago
- Status changed from New to Needs feedback
- % Done changed from 0 to 100
Updated by Jan from Planio www.plan.io about 10 years ago
- Related to Feature #10773: Support Nesting Menus added
Updated by Jan from Planio www.plan.io about 10 years ago
- Related to Feature #6984: Configure order/position and visbility of tabs in menu added
Updated by Jan Niggemann (redmine.org team member) almost 10 years ago
- Status changed from Needs feedback to New
This looks very interesting, every UI improvement makes it easier for our users.
I re-set this to new, please test and merge this.
Updated by Jan from Planio www.plan.io over 9 years ago
Jan Niggemann (redmine.org team member) wrote:
I re-set this to new, please test and merge this.
Oh, I only saw this comment now. Sorry for not responding earlier. Not sure who it was directed to.
I think, I don't have commit rights, so I'd be more than happy if anyone who does would take on merging this in.
Updated by Mischa The Evil over 9 years ago
- Assignee set to Mischa The Evil
At first, Jan (from Planio): thanks for sharing your work on this matter. I think I agree with Jan Niggeman that this UI/UX change looks like a good one...
I'll review this feature and the patch series thoroughly for the rest of this week. I'll report back upcoming weekend.
Updated by Go MAEDA over 8 years ago
- Related to Feature #6204: Make the "New issue" menu item optional added
Updated by Go MAEDA over 8 years ago
jan jan (from Planio), it is very interesting.
Could you please share new patches compatible with latest trunk?
Updated by Jan from Planio www.plan.io over 8 years ago
Go MAEDA wrote:
jan jan (from Planio), it is very interesting.
Could you please share new patches compatible with latest trunk?
Sure. Do we have consensus that we want this committed into trunk, though? If not, I'd rather wait until we do before I rebase them. I think it would be more efficient this way...
If you want to have a look at it first, I'd suggest you apply them to the then-current trunk when I submitted them or create a demo account at Planio where this runs in production for ~2 years now.
Updated by Jan from Planio www.plan.io over 8 years ago
Mischa The Evil: are you still reviewing this btw, or should I remove you as assignee?
Updated by Go MAEDA over 8 years ago
- Target version changed from Candidate for next major release to 3.3.0
Jan from Planio www.plan.io wrote:
If you want to have a look at it first, I'd suggest you apply them to the then-current trunk when I submitted them or create a demo account at Planio where this runs in production for ~2 years now.
I tried out the new add button on Planio's site and felt that it was extremely user-friendly. I think it would be really great if we could deliver this feature on Redmine 3.3.0.
To spark up some discussion, I am setting the target version to 3.3.0.
Updated by Go MAEDA over 8 years ago
- Has duplicate Feature #6658: Location of "New Issue" menu item added
Updated by Jan from Planio www.plan.io over 8 years ago
Go MAEDA wrote:
To spark up some discussion, I am setting the target version to 3.3.0.
That sounds great to me. Let's wait for some other contributors to voice their opinion. If everyone wants this for 3.3.0, I will be happy to rebase it and prepare for a merge.
Updated by budo kaiman over 8 years ago
I'm not a contributor, but I like the patch (especially for new wiki page button). +1 from me.
Updated by Go MAEDA over 8 years ago
- Related to Feature #5536: Simplify Wiki Page creation ("Add Page" link) added
Updated by Tobias Fischer about 8 years ago
I haven't tried the patch yet or used plan.io to test it, but in my case, "normal" users would just see a single "New Issue" dropdown entry when clicking the "+" icon in the menu as they are not allowed to create new milestones or categories and wiki is disabled for the project. I wouldn't call this an improvement over the current UX design in my situation...
Updated by Tobias Fischer about 8 years ago
Let me add another point to the discussion: I understand that UX improvements are important and this might look good, but the "New Issue" tab has always been a very prominent step for non-tech users to quickly report bugs / feature requests / etc and many third-party-themes highlight this tab as well. I have mixed feelings about hiding this menu item, also in terms of accessibility...
Updated by Jan from Planio www.plan.io about 8 years ago
Tobias Fischer wrote:
I haven't tried the patch yet or used plan.io to test it
Try it, maybe you'll think about it differently ;-)
but in my case, "normal" users would just see a single "New Issue" dropdown entry when clicking the "+" icon in the menu
No need to click as it will open on hover already. It's thus just a different move with the cursor when compared to the old "new issue" tab – no additional "click work" required.
as they are not allowed to create new milestones or categories and wiki is disabled for the project. I wouldn't call this an improvement over the current UX design in my situation...
Maybe not an improvement in this situation, but it doesn't make UX worse in my opinion, either. For other cases (where users do have more permissions, which is the default, btw.) it will certainly make creating content more consistent.
Updated by Marius BĂLTEANU about 8 years ago
I tried this feature on plan.io and it's great.
Jan from Planio www.plan.io wrote:
Tobias Fischer wrote:
but in my case, "normal" users would just see a single "New Issue" dropdown entry when clicking the "+" icon in the menu
No need to click as it will open on hover already. It's thus just a different move with the cursor when compared to the old "new issue" tab – no additional "click work" required.
For the case described by Tobias, I think that a minor improvement is to have the "new issue" action also for click on "+" icon. In this way, the users can add a new issue from one click, without the additional small steps (hovering and selecting the New issue from the dropdown).
Updated by Tobias Fischer about 8 years ago
Marius Balteanu wrote:
For the case described by Tobias, I think that a minor improvement is to have the "new issue" action also for click on "+" icon. In this way, the users can add a new issue from one click, without the additional small steps (hovering and selecting the New issue from the dropdown).
This could be a way to solve the issue.
But still, I'd say this is bad UI/UX as there is just a "+" sign and the user has to figure out by himself, what's behind it.
Also bad UX in terms of accessibility.
Andy ideas how to solve this?
And what about support for third-party themes which use a vertical nav menu? Would the HTML structure still allow for such a design change?
Updated by Go MAEDA about 8 years ago
- Related to Feature #8357: create new wiki page from an additional "new"-link added
Updated by Go MAEDA about 8 years ago
- Related to Feature #12469: Alternate New Issue invocation added
Updated by Sebastian Paluch about 8 years ago
The "+" button is OK but I would not remove "New Issue" from the menu, at least not yet. Our users are very used to it and such change would make a lot of concern. I would recommend to keep "New Issue" in few places until everyone gets used to. At the same time #6658 sould be implemented.
Updated by Anonymous about 8 years ago
When implementing any major UI changes, it's generally a safe idea to create the new UI code and set it as default, with an associated option in the UI configuration to "revert to old behaviour".. Wouldn't that solve a number of [potential] issues?
At the same time, I agree with Tobias' opinion above: using an icon in a word-based UI is generally a bad idea.. If it were an icon-base interface, then it might be different, but in the current instance words are definitely a better fit.
Updated by Go MAEDA almost 8 years ago
- Assignee deleted (
Mischa The Evil)
As "New issue" menu item was removed in r15344, this feature is really needed for usability reasons. Please consider implementing this.
Updated by Go MAEDA almost 8 years ago
Updated by the fury almost 8 years ago
Tobias Fischer wrote:
Marius Balteanu wrote:
For the case described by Tobias, I think that a minor improvement is to have the "new issue" action also for click on "+" icon. In this way, the users can add a new issue from one click, without the additional small steps (hovering and selecting the New issue from the dropdown).
This could be a way to solve the issue.
But still, I'd say this is bad UI/UX as there is just a "+" sign and the user has to figure out by himself, what's behind it.Also bad UX in terms of accessibility.
Andy ideas how to solve this?And what about support for third-party themes which use a vertical nav menu? Would the HTML structure still allow for such a design change?
Speaking of vertical nav menus, how would this "add new" menu work when on mobile devices, with the responsive stuff?
If it's a separate popup/hover menu of its own, then on touchscreen devices, the first touch would open the menu, so it would still be two actions to start a new issue. Unless there's some kind of special case that overrides that for touch.
If it just spills everything out onto the hamburger menu, then still two actions.
But anything else then starts taking up valuable real estate.
Updated by Jean-Philippe Lang almost 8 years ago
- Assignee set to Jan from Planio www.plan.io
- Target version deleted (
3.3.0)
People have mixed feelings about this new "Add" menu. I'm not going to add this to 3.3.0 but most of the work is done: "New issue" tab is removed (but I guess I have to provide a way to restore it anyway), and the "New wiki page" action is implemented.
I wanted to commit all the changes needed to the menu manager but they need to be rebased (not applying cleanly and tests not passing). Jan, if can rebase patches 002 and 003, I will commit them.
Updated by Go MAEDA almost 8 years ago
Jean-Philippe Lang wrote:
"New issue" tab is removed (but I guess I have to provide a way to restore it anyway)
I strongly agree.
I think "New issue" tab should be placed in project menu if this new "Add" button is not implemented.
Updated by Go MAEDA almost 8 years ago
- Target version set to 3.4.0
Setting target version to 3.4.0 so that we continue working on this. :)
Updated by Jan from Planio www.plan.io almost 8 years ago
- File 0001-introduce-virtual-MenuNodes-which-are-characterized-.patch 0001-introduce-virtual-MenuNodes-which-are-characterized-.patch added
- File 0002-style-nested-menus-as-drop-downs-on-hover-in-all-thr.patch 0002-style-nested-menus-as-drop-downs-on-hover-in-all-thr.patch added
- File 0003-add-virtual-menu-at-the-beginning-of-the-project-men.patch 0003-add-virtual-menu-at-the-beginning-of-the-project-men.patch added
- File 0004-keep-the-new-object-drop-down-open-when-the-sign-was.patch 0004-keep-the-new-object-drop-down-open-when-the-sign-was.patch added
- File 0005-move-New-issue-menu-item-to-the-new-object-menu-and-.patch 0005-move-New-issue-menu-item-to-the-new-object-menu-and-.patch added
- File 0006-add-link-to-add-a-new-wiki-page-to-new-object-menu.patch 0006-add-link-to-add-a-new-wiki-page-to-new-object-menu.patch added
- Assignee deleted (
Jan from Planio www.plan.io)
I have rebased the patch series (minus the things already committed by Jean-Philippe) on the current trunk.
Ready to be committed :-)
Updated by Jan from Planio www.plan.io almost 8 years ago
- File deleted (
0002-introduce-virtual-MenuNodes-which-are-characterized-.patch)
Updated by Jan from Planio www.plan.io almost 8 years ago
- File deleted (
0003-style-nested-menus-as-drop-downs-on-hover-in-all-thr.patch)
Updated by Jan from Planio www.plan.io almost 8 years ago
- File deleted (
0001-bugfix-like-top-level-menu-nodes-child-nodes-should-.patch)
Updated by Jan from Planio www.plan.io almost 8 years ago
- File deleted (
0004-add-virtual-menu-at-the-beginning-of-the-project-men.patch)
Updated by Jan from Planio www.plan.io almost 8 years ago
- File deleted (
0005-move-New-issue-menu-item-to-the-new-object-menu-and-.patch)
Updated by Jan from Planio www.plan.io almost 8 years ago
- File deleted (
0006-add-a-New-issue-link-to-contextual-area-of-issues-li.patch)
Updated by Jan from Planio www.plan.io almost 8 years ago
- File deleted (
0007-add-link-and-a-new-action-to-add-a-new-wiki-page-to-.patch)
Updated by Jan from Planio www.plan.io almost 8 years ago
- File deleted (
0008-keep-the-new-object-drop-down-open-when-the-sign-was.patch)
Updated by Go MAEDA almost 8 years ago
- File new-add-button-20160606.png new-add-button-20160606.png added
- File new-add-button-20160606.mp4 new-add-button-20160606.mp4 added
- Assignee set to Jean-Philippe Lang
- Target version changed from 3.4.0 to 3.3.0
Thanks Jan for working on this. I tried out this patch.
It is a awesome feature. We can access every "Add" screen from everywhere by one click. I am sure that UX of Redmine is significantly improved by this feature. Probably I will never enable 'Display the "New issue" tab' setting introduced by #6204 if this feature get implemented.
@Jean-Phillipe, please reconsider include this feature in 3.3.0. I am setting target version to 3.3.0 again.
screenshot:
Updated by Jan from Planio www.plan.io almost 8 years ago
Tobias Fischer wrote:
Also bad UX in terms of accessibility.
Andy ideas how to solve this?
Btw., I have moved the access keys to the (always visible) "new issue" link within the "+" menu. This way, the Ctrl+Alt+7 shortcut will work even if the "New issue" tab is disabled in the settings.
Furthermore, the "+" menu is designed to work on devices with a mouse (on hover) as well as on devices with a touchscreen (on click).
Updated by Jan from Planio www.plan.io almost 8 years ago
the fury wrote:
Speaking of vertical nav menus, how would this "add new" menu work when on mobile devices, with the responsive stuff?
The "+" menu does not show in the responsive menu (yet). However, with the "New issue" tab being optional, I would say that already committing the "+" menu is an improvement even without a responsive version for it since it doesn't remove anything. It just doesn't add anything for the responsive mode. It would be great to add responsive support at a later point in time if anyone has a good idea.
Updated by Jan from Planio www.plan.io almost 8 years ago
- File Overview - My project - Redmine 2016-06-06 15-59-27.png Overview - My project - Redmine 2016-06-06 15-59-27.png added
Tobias Fischer wrote:
And what about support for third-party themes which use a vertical nav menu?
I am not aware of any currently-supported themes with vertical project nav. The only one I can remember is Pixel Cookers, but that is not compatible with current Redmine. The project menu is already broken (even without my patches) and would require fixing, see screenshot.
Would the HTML structure still allow for such a design change?
Yes, definitely. By the way, sub menus are not a new feature. They have been existing in menu manager for about 6 years since #4250. They were simply not used in Redmine's stock menu. Any themes implementing a vertical nav would probably need one or two lines changed in their CSS.
Updated by Go MAEDA almost 8 years ago
I am really glad that Jan's patches are merged into trunk.
I suggest making a small change to "+" button. "This patch" (15880-add-link-to-new-issue.diff) adds link to /issues/new page to plus button. Users can access to the page quickly like conventional "New issue" tab, only by clicking "+" button.
In current implementation, clicking "+" button triggers toggleNewObjectDropdown() but it seems not working as expected.
Updated by Go MAEDA almost 8 years ago
Go MAEDA wrote:
I suggest making a small change to "+" button. "This patch" (15880-add-link-to-new-issue.diff) adds link to /issues/new page to plus button. Users can access to the page quickly like conventional "New issue" tab, only by clicking "+" button.
Comparison of steps to access "/issues/new" page:
Current implementation:
1. Move cursor to "+". Dropdown menu shows up.
2. Move cursor to "New issue" menu item.
3. Click left button of a mouse.
After the patch (15880-add-link-to-new-issue.diff) applied:
1. Move cursor to "+".
2. Click left button of a mouse.
Updated by Toshi MARUYAMA almost 8 years ago
- Related to Patch #23040: Japanese translation update (r15509) added
Updated by Jean-Philippe Lang almost 8 years ago
- Status changed from New to Closed
- Resolution set to Fixed
Go MAEDA wrote:
I suggest making a small change to "+" button. "This patch" (15880-add-link-to-new-issue.diff) adds link to /issues/new page to plus button. Users can access to the page quickly like conventional "New issue" tab, only by clicking "+" button.
The click on the "+" displays the menu, which is required for touch devices as explained by Jan. Clicking on the "+" should not link to a particular menu item IMHO.
Current implementation:
1. Move cursor to "+". Dropdown menu shows up.
2. Move cursor to "New issue" menu item.
3. Click left button of a mouse.
Yes, that's why I'm not really convinced of this new menu item. Anyway, it's merged into 3.3, with a setting to choose whether to use the new "+" (default), the old "New issue" tab or nothing.
I'm closing this issue, please submit any improvements/changes in a separate issue for 3.3.1.
Updated by Sebastian Paluch almost 8 years ago
Jean-Philippe Lang wrote:
Yes, that's why I'm not really convinced of this new menu item. Anyway, it's merged into 3.3, with a setting to choose whether to use the new "+" (default), the old "New issue" tab or nothing.
Can we get a setting to show both "+" and "New issue" tab? It would be easier to introduce this menu change to users and give them a time before turning "New issue" tab to learn/adjust.
Updated by Anonymous almost 8 years ago
What about a split button with a "current page default" and a drop-down menu in one?
Working from the current behaviour in 3.3, the primary idea is to change the current "+" button to a dynamic button, showing "New <type>" based on the currently viewed page. So, while viewing the "Issues" page, this would be "New Issue", "Roadmap" would be "New Version", etc. The right-side of the split button would be a small area with a down arrow, which would open the drop-down menu with all the current options.
This would provide consistent and predictable behaviour across all platforms regardless of input type or screen size, and it would make keyboard navigation easier while tabbing through links on the current page (yes, some people still use that on web pages).
I'm no Ruby guru, but I do love working with HTML/JS.. So I should be able to get the latest version up and running on my side and make a patch for this idea, if need be?
[edit] My apologies, I only noticed after my comment that this issue had been closed... I'm at work at the moment, so unless someone else likes this idea and beats me to it, as soon as I get a chance I'll make a patch for the changes I proposed and open a new ticket for discussion.
Updated by Robert Schneider almost 8 years ago
Redmine administrator Greeff: That is a good idea! I also thought about something like this, but without thinking about a solution: It's very likely that I'd like to create a new version if I'm in the version section - and less likely that I then would like to create a new wiki page. If this not already considered in an own ticket you should create a new one. It may goes into version 3.3.0 to make the global button more attractive straight from the beginning.
Updated by Jan from Planio www.plan.io almost 8 years ago
Yes, please create a new ticket for this. This one has been closed and it's not likely many will see the discussion here.
Updated by Rupesh J almost 8 years ago
Hi,
With Display "+" menu settings,
The + is visible in the project page.. But when I click on that + nothing happens.. The menu is not shown..
Using the latest commit in master.
I checked in both Chrome (Version 51.0.2704.84 m) and Firefox (47.0).
Thanks.
Updated by Jan from Planio www.plan.io almost 8 years ago
Could you please post a little more about your environment? See Submissions for info on what to include. Please also mention your theme and where exactly this situation happens. You mention the "project page", do you mean /projects?
Thanks!
Updated by Tobias Fischer almost 8 years ago
Jan from Planio www.plan.io wrote:
Tobias Fischer wrote:
And what about support for third-party themes which use a vertical nav menu?
I am not aware of any currently-supported themes with vertical project nav.
The "Highrise" theme for example (optionally) uses vertical navigation:
http://www.redmine.org/projects/redmine/wiki/Theme_List#Highrise-theme
https://www.redminecrm.com/pages/highrise-theme
The theme is under active maintenance so I think they will figure out a way to go with the new + button...
Updated by Toshi MARUYAMA over 7 years ago
- Related to Defect #24000: z-index children menu should be greater than content added
Updated by Go MAEDA almost 6 years ago
- Related to Feature #4157: UI tweaks for end user to easily get to New Issue added
Updated by Go MAEDA over 5 years ago
- Related to Patch #13234: Create a new wiki page link for laymans added