Wiki source code of Idea: Explicit Content Actions

Last modified by Vincent Massol on 2024/02/26 17:54

Hide last authors
Ecaterina Moraru (Valica) 1.2 1 {{toc start="2"/}}
2
Ecaterina Moraru (Valica) 36.2 3 (% class="row" %)
4 (((
5 (% class="col-xs-12 col-sm-6" %)
6 (((
Ecaterina Moraru (Valica) 1.2 7 == Requirement ==
8
Ecaterina Moraru (Valica) 1.4 9 > Implement an option to display action name under icons
Ecaterina Moraru (Valica) 1.2 10
Ecaterina Moraru (Valica) 1.5 11 > Make wheel and 3dots menu more coherent
12
Ecaterina Moraru (Valica) 1.2 13 == Need ==
14
15 * O: Icons are floating in the air, not explicit for newbies that don't understand where to click.
Ecaterina Moraru (Valica) 1.5 16 * O: The user doesn't know what kind of action he will find and the difference of the items under wheel and tree dots menus.
Ecaterina Moraru (Valica) 1.19 17 * O: [[Proposal>>http://d.pr/i/vFDq]]
Ecaterina Moraru (Valica) 1.18 18 * O: Fine on the Search and top navbar icons. Needed adjustment only on content menu
Ecaterina Moraru (Valica) 1.20 19 * O: users don't always understand the meaning of icons (and what the icon designer wanted to mean) + all studies lead to the same conclusion about labels
20 * O: user doesn't know what category of items are contained in the 2 menus
Ecaterina Moraru (Valica) 1.18 21 * The content menu is floating in the air
22 * Problematic wiki concept since people don't know pages can be edited and they are not invited to do it. Adding text to the icon could make them less cryptic and invite users to use them
23 * Some users might not know where to find some actions (between the 2 menus)
24 * Edit mode could adjust the menu and use other/no actions
25 * Edit needs a label
Ecaterina Moraru (Valica) 1.21 26 * O: Search could be expanded. Survey beginner and advanced users about this
Ecaterina Moraru (Valica) 1.2 27
Ecaterina Moraru (Valica) 1.7 28 == Notes ==
29
Ecaterina Moraru (Valica) 1.9 30 * Older versions had the labeled actions, see [[screenshots>>design:Proposal.ActionMenuProposal3||anchor="HContentMenu"]]. The change was done in [[7.2+>>https://jira.xwiki.org/browse/XWIKI-12189]] in the try to simplify and modernise the UI.
Ecaterina Moraru (Valica) 1.22 31 * Investigate what are the usability reasons to delay tooltips
Ecaterina Moraru (Valica) 1.7 32
Ecaterina Moraru (Valica) 1.10 33 == Improvements ==
34
35 * Improve the labels for "Actions" to "Page Actions"
36
Ecaterina Moraru (Valica) 1.2 37 == Solutions ==
38
39 === Solution 1 ===
40
Ecaterina Moraru (Valica) 1.10 41 * Revert the icon-buttons and use labels. Rollback [[XWIKI-12189>>https://jira.xwiki.org/browse/XWIKI-12189]]
Ecaterina Moraru (Valica) 1.15 42 ** {{error}}##-{{/error}} Inconsistencies with the navbar icons (except if we plan to revert those too)
43 ** {{error}}##-{{/error}} Loses the skin modern styling
Ecaterina Moraru (Valica) 1.2 44
45 === Solution 2 ===
46
Ecaterina Moraru (Valica) 1.11 47 * Make configurable the display of buttons
Ecaterina Moraru (Valica) 1.13 48 ** {{error}}##-{{/error}} Harder to test
Ecaterina Moraru (Valica) 1.2 49
50 === Solution 3 ===
51
Ecaterina Moraru (Valica) 1.14 52 * Replace the HTML hints done with the "title" attribute with BS JS [[tooltips>>http://getbootstrap.com/javascript/#tooltips]] (example Watchlist)
Ecaterina Moraru (Valica) 1.13 53 ** {{error}}##-{{/error}} Increase loading times for the JS
54 ** {{success}}##+{{/success}} Faster response time to display hints
Ecaterina Moraru (Valica) 1.14 55
56 ==== Solution 3.1 ====
57
58 * JS that looks at all the title attributes and displays them with the BS JS tooltips (Suggested by Enygma)
Ecaterina Moraru (Valica) 1.25 59 )))
60
Ecaterina Moraru (Valica) 36.2 61 (% class="col-xs-12 col-sm-6" %)
62 (((
Ecaterina Moraru (Valica) 1.26 63 == Proposals ==
Ecaterina Moraru (Valica) 1.25 64
Ecaterina Moraru (Valica) 6.4 65 === Current ===
66
67 [[[[image:before.png||style="border:1px solid #E8E8E8" width="100%"]]>>attach:before.png]]
68
Ecaterina Moraru (Valica) 1.27 69 === Proposal 1: JS Tooltips ===
70
Ecaterina Moraru (Valica) 6.2 71 * The current HTML [["title">>https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/title]] attributes have a delay that is browser dependant
72 * If we want to make the tooltip appear faster we can use the Bootstrap Tooltips
73
Ecaterina Moraru (Valica) 1.28 74 {{gallery}}
Ecaterina Moraru (Valica) 1.29 75 image:tooltips1.png
76 image:tooltips2.png
77 image:tooltips3.png
78 image:tooltips4.png
Ecaterina Moraru (Valica) 1.28 79 {{/gallery}}
Ecaterina Moraru (Valica) 1.25 80
Ecaterina Moraru (Valica) 1.27 81 === Proposal 2: Labeled actions ===
82
Ecaterina Moraru (Valica) 9.2 83 * Provide label for the critical actions "Edit" and "Create"
84 * Combine "Page actions" and "More actions", but make them more explicit by providing categories description
85
86 {{gallery}}
Ecaterina Moraru (Valica) 10.2 87 image:simpleUser.png
88 image:advancedUser.png
89 image:advancedExpanded.png
90 image:moreActions.png
Ecaterina Moraru (Valica) 23.3 91 image:moreActionsSelective.png
Ecaterina Moraru (Valica) 10.2 92 image:gradient.png
93 image:editMode.png
Ecaterina Moraru (Valica) 31.2 94 image:P2_noRightPanels.png
Ecaterina Moraru (Valica) 9.2 95 {{/gallery}}
96
Ecaterina Moraru (Valica) 18.6 97 === Proposal 3: Use Labels instead of Icons ===
98
99 {{gallery}}
Ecaterina Moraru (Valica) 33.2 100 image:P3_0_4.png
Ecaterina Moraru (Valica) 31.4 101 image:P3_0.png
Ecaterina Moraru (Valica) 22.2 102 image:P3_0_1.png
Ecaterina Moraru (Valica) 18.6 103 image:P3_1.png
104 image:P3_2.png
Ecaterina Moraru (Valica) 31.2 105 image:P3_noRightPanels.png
Ecaterina Moraru (Valica) 18.6 106 {{/gallery}}
107
Ecaterina Moraru (Valica) 28.2 108 === Proposal 4: Icons with background ===
109
110 {{gallery}}
111 image:P4_1_bigger.png
Ecaterina Moraru (Valica) 31.2 112 image:P4_noRightPanels.png
Ecaterina Moraru (Valica) 33.3 113 image:P4_noRightPanels_more.png
Ecaterina Moraru (Valica) 34.2 114 image:P4_noRightPanels_manage.png
Ecaterina Moraru (Valica) 28.2 115 {{/gallery}}
Ecaterina Moraru (Valica) 1.25 116 )))
117 )))
Ecaterina Moraru (Valica) 36.7 118
119 (% class="row" %)
120 (((
121 (% class="col-xs-12 col-sm-6" %)
122 (((
123 == Voting ==
Ecaterina Moraru (Valica) 36.8 124
125 We held a multiple channels voting for this issue:
Ecaterina Moraru (Valica) 37.1 126
127 1. (((
128 [[Devs Mailinglist>>http://markmail.org/message/64ruwrwxecd75br5]] (6 votes)
Ecaterina Moraru (Valica) 36.8 129 P2: 3 votes (50%)
130 P4: 3 votes (50%)
Ecaterina Moraru (Valica) 36.10 131 )))
Ecaterina Moraru (Valica) 37.1 132 1. (((
133 [[Users Mailinglist>>http://markmail.org/message/ubjebsao5vtewfkp]] (8 votes)
Ecaterina Moraru (Valica) 36.8 134 P2: 3 votes (37.5%)
135 P4: 5 votes (62.5%)
Ecaterina Moraru (Valica) 36.10 136 )))
Ecaterina Moraru (Valica) 37.1 137 1. (((
138 [[Open Source Designers>>https://discourse.opensourcedesign.net/t/explicit-actions/115]] (9 votes)
Ecaterina Moraru (Valica) 36.8 139 P2: 8 votes (88.9%)
140 P4: 1 vote (11.1%)
Ecaterina Moraru (Valica) 36.10 141 )))
Ecaterina Moraru (Valica) 37.1 142 1. (((
143 [[XWiki SAS>>https://docs.google.com/forms/d/1J68cfuA2TuVKeuNh63P4LUzHVW_G-QTPT-Hqkdo_dzA/viewform?edit_requested=true#responses]] (19 votes)
Ecaterina Moraru (Valica) 36.8 144 P2: 15 votes (83.3%)
145 P4: 3 votes (16.7%)
Ecaterina Moraru (Valica) 36.7 146 )))
Ecaterina Moraru (Valica) 37.1 147 1. (((
148 Total (42 votes)
Ecaterina Moraru (Valica) 36.12 149 P2: 65%
150 P4: 35%
Ecaterina Moraru (Valica) 36.7 151 )))
Ecaterina Moraru (Valica) 36.10 152 )))
Ecaterina Moraru (Valica) 36.12 153 )))

Get Connected