GIMP Overhaul Proposal: Adwaita Mode
Before | After |
---|---|
Hello, GIMP developers! I bring a style proposal for GIMP. Recently I saw how unfairly people were bashing GIMP for it's UI/UX, I decided to spend a little time experimenting on how this software can be improved. My goal was to follow the GNOME Human Interface Design Guidelines and creating a stunning new Adwaita mode that's all about revamping the interface without compromising on functionality. Since it's different to how things are in GIMP now, I call it Adwaita mode, that should be an experimental way of showing how this application may look like in the future and taking solid working ideas in the "stable interface".
New Look and Feel:
-
Redesigned icons, modern colors, and improved spacing for a sleek and user-friendly experience on any device.
-
Utilizing space efficiently by switching to floating panels for tools and options. The tools are a floating panel on the bottom of the screen. Some of them have a dropdown with "subtools". Tools options are also a floating panel, on the right part of the screen. By default some tools use default state like general Selection button, but when we pick a specific tool, we will have it on this tool panel.
-
Icon buttons instead of checkboxes for a cleaner interface(On the tool options we can see Selection Shape, Selection Mode, Locking Selection Aspect Ratio, Selecting All, Selecting None, Antialiasing, Feather Edges and Rounded edges. When we click on those that needs a value, a popup appears. We don't have checkbox anymore since 0 is the same as uncheked. Color picker is shown on this Tool Options panel only if the tool is associated with color (e.g brush has a colorpicker, eraser don't)). Tool-specific options displayed on-demand via popups
-
Organized Tools Panel: Segmented into six parts based on functionality and user frequency. More used are on the center and the sides, less used are in between.
My suggestion is to merge tools that have very similar sense and options.
Main Tool Panel Segments:
- Main Functions: Drawing, Eraser, Fill/Gradient, Distortion.
- Text & Shapes: Text, Shapes, Outlines.
- Image Manipulation: Stamp, Finger, Transformation, Cropping, Magic Wand.
- Enhancement: Sharpness/Blur, Lightening/Darkening.
- Selection & Navigation: Pipette, Selection options, Move + Magnifier.
- Undo & Redo.
Enhanced Features:
- Layer Interaction: Layer effects now expand like folders, with the ability to drag and drop effects between layers. Hiding old blending mode to emphasize that it's depreceated. There is also a count of how many effects are applied and an icon and a text if it's expanded of what effects there are. We can lock the layer without having to expand it or close it. We can drag and drop effects from one layer to the other.
- Color Management: Improved color tab with dropdown for text field formats(HEX/RGB/HSL) and easy transparency adjustment.
- Ruler Simplification: Streamlined ruler interface for better usability.
- Distinctive Areas: Clearly defined areas with backgrounds, borders, and utility elements for a more organized workspace.
Unsorted changes:
- In the toolbar we can change scale(100%), px, scale 1:1, scale to fit, name of the chosen layer, it's visibility and lock status. Also coordinates of cursor.
- Opened image in GIMP now has a shadow.
- All tabs as always can move using(or mimicking) libpanel library https://gitlab.gnome.org/GNOME/libpanel
- On HeaderBar in menu I got rid of Help and moved it with app settings to a hamburger right to window controls so now menu is strictly for manipulating files.
- Tabs with opened images now have a counter.
Additional Proposals:
- New cursor indicators for Free Transform operations.
Rotate | Scale | Move |
---|---|---|
- Ensure Ctrl+Shift+Z for Redo works seamlessly.
- When using select, before if we clicked on image, it would just remove existing selections. now it would ask user to create selection with exact size/position. If a user wishes to deselect, they choose deselect all in Tool settings floating panel or clicks outside image
- Introduction of a vector-based shape tool for creating persistent layers that will work like Selection.
Actionable Steps that do not require full rewrites and breaking compatibility:
- Refresh the icon set with modern Adwaita.
- Use Adwaita colors.
- Adjust element spacing and sizing for better usability and aesthetics.
In my design I targetted XGA devices but in theory it would work on a tablet flawlessly since the widget I propose to use hides itself on small screens.
Inspirations: Photoshop, Photopea, Krita, Inkscape, Figma, RNote, Drawing, Errands, Glaxnimate.
If you have any questions or need more details, please reach out!
Update: 03/18/24 - Added example of editing properties and multi-window mode Update: 03/28/24 - Made panels wider in multi-window mode, changed tool options popover look, added a tooltip, changed wording in the mention of libpanel