LPE Croncers Fillet/Chamfer - UI/UX suggestions and Redesign
- [ ] 1 Add icons to chafer type and method + clean up of UI - [x] 2 Add Icon for enabling and disabling Chamfer/fillet to edit paths pane - [x] 3 Change the name of LPE **[DONE]** - [x] 4 Add ability to edit multiple radiuses at once On Canvas UI **[DONE]** - [x] 5 New on canvas UI handles - [ ] 6 Hide on canvas UI until selected or Hower - [ ] 7 show helpers and hide some on canvas UI while changing radius (HOLDING and DRAGGING)/ knot ## 1 Add icons to chafer type and method + clean up of UI - move % in to unit box - reorder icons - move unimportant settings in to advance section #### Why: - its communicate visually what is going to happen - no need for translation of texts #### Mockup: ![image](/uploads/a050cce9c2f53ad8f217c7d3e70f0ab9/image.png) ![VirtualBoxVM_wXdEIgp8X6](/uploads/4a23124594f6a8544560fd2489ad330a/VirtualBoxVM_wXdEIgp8X6.gif) #### glade and svgs https://gitlab.com/inkscape/ux/-/issues/3#note_1022417853 ## 2 Add Icon for enabling and disabling Chamfer/fillet to edit paths pane l This would add or remove LPE on to selected stroke. 1. select shape 2. press icon it would add LPE Fillet/Chamfer 3. also open LPE panel 4. you can add Fillet/Chamfer 5. if you want to disable Fillet/Chamfer you would click the icon again and it would delete LPE from the shape Why: - Would make the feature more discoverable Mockup: ![image](/uploads/8c6dbd1972ffe951b8a7fed4292aae95/image.png) ## 3 Change the name of LPE **[DONE]** I was also thinking to change the name of LPE from fillet/chamfer to something more user-friendly My ideas: - **corners** - corner tool - round corners - bevel - bevel corners ## 4 Add ability to edit multiple radiuses at once On Canvas UI **[DONE]** How it should work : 1. select nodes you want to add a fillet 2. drag radius controller 3. all nodes will change to the same fillet and radius (according to settings in UI in % or units) how it works in motion: ![2019-11-06_15-44-47](/uploads/4bdb3ae9434050da85624a74306d003e/2019-11-06_15-44-47.mp4) How it should look: ![image](/uploads/4ed991172d3941aa2fe80db27ea5a922/image.png) ## 5 New on canvas UI handels After running into some UX problems with on canvas UI. Mainly that cornre hnades itersect with geometry knots. @jabiertxof and I come up with few new design solutions: #### 1. Triangles ![image](/uploads/de52769e8d2aedc1b270ef159a576c89/image.png) #### 2. Triangles with a small offset from nodes (for easier shifting of the position of nodes) ![image](/uploads/f03503571c8757f06e848237cf597231/image.png) #### 3. Triangles rotate 90 degrees ![image](/uploads/a1d224f5ebe2ed10e1dbde9668445e3d/image.png) #### 4. Offset circle ![image](/uploads/51a1b751c7667a094c7ff9a22d4ff54e/image.png) ## 6 Hide on canvas UI until selected or Hower For cleaner look hide knots that you are not editing ![image](/uploads/18c865ee64de7e406fd03ff179ab20b4/image.png) ## 7 show helpers and hide some on canvas UI while changing radius (HOLDING and DRAGGING)/ knot for cleaner look and UX few options: ![image](/uploads/905f979a314090b77fe9ef9026ec46ae/image.png) ![image](/uploads/f67523f301d436fe45b9a7d3471a7fb4/image.png) ![image](/uploads/8f54b954c9da562cae2d695dd6cb17b0/image.png) ![image](/uploads/151a1cf8b4e9c82dde707adbd4c64dd1/image.png) ![image](/uploads/9163f897fb530bedfea54610feddb8fe/image.png)
issue