Wiki source code of Create Layout 9.x (2017)
Last modified by Vincent Massol on 2024/11/19 16:14
Show last authors
| author | version | line-number | content |
|---|---|---|---|
| 1 | {{toc/}} | ||
| 2 | |||
| 3 | (% class="row" %) | ||
| 4 | ((( | ||
| 5 | (% class="col-xs-12 col-sm-6" %) | ||
| 6 | ((( | ||
| 7 | = Hypothesis = | ||
| 8 | |||
| 9 | * (H1) When creating a new page, users think first at the page type (so it should be presented first) | ||
| 10 | * (H2) New-time users will test multiple templates, while the long-term users usually create black pages | ||
| 11 | |||
| 12 | = Constraints = | ||
| 13 | |||
| 14 | * Consistency between 'Create page' and [['Create wiki'>>Improvements.CreateImprovements]] steps | ||
| 15 | * Consistency with [['Move, Copy, Rename'>>Proposal.NestedMove]] steps | ||
| 16 | ))) | ||
| 17 | |||
| 18 | (% class="col-xs-12 col-sm-6" %) | ||
| 19 | ((( | ||
| 20 | [[[[image:PlaygroundUserMovement.png||style="border:1px solid silver; max-width:400px;"]]>>attach:MouseFlowMovemenet2.png]] | ||
| 21 | ))) | ||
| 22 | ))) | ||
| 23 | |||
| 24 | = Variants = | ||
| 25 | |||
| 26 | == Current == | ||
| 27 | |||
| 28 | * 'Templates' in a separate column | ||
| 29 | * Consistent with 'Create wiki' 2 columns layout + 'Template' positioning | ||
| 30 | * Consistent with 'Move/Copy' 2 columns layout | ||
| 31 | |||
| 32 | (% class="row" %) | ||
| 33 | ((( | ||
| 34 | (% class="col-xs-12 col-sm-6" %) | ||
| 35 | ((( | ||
| 36 | {{gallery}} | ||
| 37 | image:before.png | ||
| 38 | {{/gallery}} | ||
| 39 | ))) | ||
| 40 | |||
| 41 | (% class="col-xs-12 col-sm-6" %) | ||
| 42 | ((( | ||
| 43 | |||
| 44 | ))) | ||
| 45 | ))) | ||
| 46 | |||
| 47 | == A2: Type, Position, Title == | ||
| 48 | |||
| 49 | * According to H1, having Type as first item to fill | ||
| 50 | * (-) Harder to long-time users to fill in the Page Title | ||
| 51 | * (-) The 'Create' button can get below the fold (less visible) | ||
| 52 | * (+) Vertical alignment | ||
| 53 | |||
| 54 | (% class="row" %) | ||
| 55 | ((( | ||
| 56 | (% class="col-xs-12 col-sm-6" %) | ||
| 57 | ((( | ||
| 58 | {{gallery}} | ||
| 59 | image:Koel_Create_A2_Simple.png | ||
| 60 | image:Koel_Create_A2.png | ||
| 61 | {{/gallery}} | ||
| 62 | ))) | ||
| 63 | |||
| 64 | (% class="col-xs-12 col-sm-6" %) | ||
| 65 | ((( | ||
| 66 | |||
| 67 | ))) | ||
| 68 | ))) | ||
| 69 | |||
| 70 | == A3: Title, Position, Type == | ||
| 71 | |||
| 72 | * (+) Implementation: Keeps the locationPicker macro | ||
| 73 | * It's the current version, just in 1 column | ||
| 74 | |||
| 75 | (% class="row" %) | ||
| 76 | ((( | ||
| 77 | (% class="col-xs-12 col-sm-6" %) | ||
| 78 | ((( | ||
| 79 | {{gallery}} | ||
| 80 | image:Koel_Create_A3.png | ||
| 81 | {{/gallery}} | ||
| 82 | ))) | ||
| 83 | |||
| 84 | (% class="col-xs-12 col-sm-6" %) | ||
| 85 | ((( | ||
| 86 | {{gallery}} | ||
| 87 | image:A3_Addmore_inside.png | ||
| 88 | image:A3_Addmore_outside.png | ||
| 89 | image:A3_Addmore_icon.png | ||
| 90 | {{/gallery}} | ||
| 91 | |||
| 92 | 'Add more templates' location | ||
| 93 | ))) | ||
| 94 | ))) | ||
| 95 | |||
| 96 | == A4: Title, Type, Position == | ||
| 97 | |||
| 98 | * (+) Title and Type, being the most changed are displayed first | ||
| 99 | * (+) Location since it can be influenced by Type, is displayed after Type | ||
| 100 | * (+) Location displays constraints from Title and Type, so it summarize them (advanced users can overwrite) | ||
| 101 | * (-) Implementation: Breaks the locationPicker macro (that groups Title + Location and is reused in several other places) | ||
| 102 | |||
| 103 | (% class="row" %) | ||
| 104 | ((( | ||
| 105 | (% class="col-xs-12 col-sm-6" %) | ||
| 106 | ((( | ||
| 107 | {{gallery}} | ||
| 108 | image:Koel_Create_A4.png | ||
| 109 | image:Koel_Create_A4_Addmore.png | ||
| 110 | {{/gallery}} | ||
| 111 | ))) | ||
| 112 | |||
| 113 | (% class="col-xs-12 col-sm-6" %) | ||
| 114 | ((( | ||
| 115 | {{gallery}} | ||
| 116 | image:A4.png | ||
| 117 | image:A4_Scroll.png | ||
| 118 | image:A4_NoResults.png | ||
| 119 | {{/gallery}} | ||
| 120 | |||
| 121 | 'Add more templates' location | ||
| 122 | ))) | ||
| 123 | ))) | ||
| 124 | |||
| 125 | == A5: Type on 2 columns == | ||
| 126 | |||
| 127 | (% class="row" %) | ||
| 128 | ((( | ||
| 129 | (% class="col-xs-12 col-sm-6" %) | ||
| 130 | ((( | ||
| 131 | {{gallery}} | ||
| 132 | image:A5_Sandbox.png | ||
| 133 | image:A5_Blog.png | ||
| 134 | {{/gallery}} | ||
| 135 | ))) | ||
| 136 | |||
| 137 | (% class="col-xs-12 col-sm-6" %) | ||
| 138 | ((( | ||
| 139 | {{gallery}} | ||
| 140 | image:A5_2.png | ||
| 141 | image:A5_3_Simple.png | ||
| 142 | image:A5_3_Advanced.png | ||
| 143 | {{/gallery}} | ||
| 144 | ))) | ||
| 145 | ))) |