(Rewritten) Rethinking GIMP in the Modern UI
This post has been completely rewritten since its original posting here on the forums. Though many of the ideas are the same in principle, they have evolved substantially thanks to comments from participants here in the forums.
HOW THIS BEGAN
Discussions in the comments section of my recent post Windows 8/RT App Spotlight, Part 2 have reminded me just how unfortunate those on Windows devices without GIMP, Photoshop, or Paint.net are, especially if they are on Windows RT devices like Microsoft's Surface RT.
That got me thinking. How would a complex piece of software like GIMP run in the modern UI? How would the UI be required to bend to properly service the user while still retaining the majority of its functionality? There have been many different interfaces used for image editing apps on various platforms, but none of them really jive well with the feel of the Modern UI.
While my own mockups are far from perfect, they get me thinking that even complex pieces of software like GIMP aren't impossible in such a design language. It just takes a bit of thinking, reorganising, and some creative UI decisions.
SO HOW WOULD IT WORK?
That's a great question, and one I feel is best answered with some images. I'm far from being the greatest artist in my own home, and even further from being the greatest artist here on The Verge forums, but hopefully the mockups will be adequate enough to convey my thoughts.
Basic Controls
There are two essential sections critical to any high-powered image manipulation program: specifically the toolbox and the ability to use and manipulate layers. In the images below, I've brought to life a potential design of a simple toolbox and a very simple layers pane.
Toolbox
The toolbox is set-up in such a way that allows it to be large enough for touch input, but also allow for the top and bottom panes to be visible without obscuring the tools in any way.
Additionally, small hint arrows are present on the UI showing that more feature panes are available to the user--features like colour options and filters could be stored away in these other menus and accessed via a swipe gesture or the press of one of the hint arrows. Additional tools can be melded into groups (selection, transformation, filling, etc.) and could be accessed with a long press and drag.
Layers Pane
The layers pane is clean and neat simply because it doesn't need to be cluttered. Layer options like visibility, opacity, layer masking, and layer modes would be accessible via a long press--as would layer actions like merge and flatten.
THAT'S NICE AND ALL, BUT WHERE ARE MY TOOL SETTINGS?
Swipe up from the bottom or right click anywhere in the app and you will be greeted by the top and bottom panes.
Here They Are!
Tool settings for the active tool will appear on the bottom pane alongside the colour palette. In the example below, settings for the Text Tool are shown and, like with the toolbox, additional tool settings can be reached by swiping or pressing the hint arrows. To minimise the need to swipe through menus, the most accessed tool settings will be present on the "main page" of tool settings, with secondary settings on additional pages.
Vanishing Panes are a Pain in the Ah---Isn't That Nice?
Additionally, the two buttons on either side of the bottom pane can be tapped to bring up the toolbox pane (left button) and layers pane (right button) or long-pressed to keep those panes open by "pinning" them. When a menu has been "pinned" open, it will be made apparent by a faint blue glow.
WHAT ELSE YOU GOT?
Not much at the moment, but new ideas are constantly swimming through my head and many awesome people here have helped to spur new ideas in these mockups. Had I any programming talent, I would get started on an application like this myself, but I just don't have it.
So those are my quick ideas for how GIMP could be turned into a Windows 8/RT app in the Modern UI. What ideas do you have for the UI of image editing programs in Windows 8 and Windows RT?






There are 28 Comments. Load 'Em Up. Show speed reading tips and settings
Shortcuts to mastering the comment thread. Use wisely.
C - Next Comment
X - Mark as Read
R - Reply
Z - Mark Read & Next
Shift + C - Previous
Shift + A - Mark All Read
Comment Settings
Live comment alert: Hide it!
Comments for this post are closed.