Author Topic: top panel dockables  (Read 9323 times)

Offline blurymind

  • Sr. Member
  • ****
  • Posts: 262
  • Karma: +2/-0
    • blog
top panel dockables
« on: August 15, 2011, 09:33:46 pm »
I know the top panel is a pretty new thing. Not sure if it will stay for sure, but I really like it. However I feel that if mypaint could dock some of the items in the right panel to the top, it would be able to use its space more efficiently- letting the artist to completely hide the right panel for the most of the time. Here is the mockup:




orr http://imageshack.us/photo/my-images/21/selection002v.jpg/

for the colors- instead of single vs double click- it can be right click vs left click. Most tablets have a stylus button anyway... or even just hover vs single click
> and also if you want to save even more space this same theory can be applied to the brush icons that I added on top- instead of showing 6 recent brushes- it can show only the current one. Hovering over it can display the 6 recent ones. Clicking on it can call the brushes list dock


the top right icons dont have to change actually- they serve as mini task manager for mypaint- toggling docks on and off
« Last Edit: August 15, 2011, 09:46:54 pm by blurymind »
http://imovethings.blogspot.com
my website. I do 2d and 3d animation, concept art and storyboards

Offline Ryan

  • Jr. Member
  • **
  • Posts: 104
  • Karma: +2/-0
Re: top panel dockables
« Reply #1 on: August 18, 2011, 02:00:01 am »
I agree that docks on the side of apps can be an annoyance if you want certain things to be open and easily accessible all the time. This is especially so on a Cintiq 21 inch (not widescreen) which I have. If you are doing a landscape the format space of the canvas is all wrong.
« Last Edit: August 18, 2011, 02:12:49 am by Ryan »

Offline Ryan

  • Jr. Member
  • **
  • Posts: 104
  • Karma: +2/-0
Re: top panel dockables
« Reply #2 on: August 18, 2011, 02:26:47 am »
The top panel also needs to be totally configurable so we can have whatever we want on there like removing save file etc. I'm kind of assuming this is something that will eventually come.

Offline blurymind

  • Sr. Member
  • ****
  • Posts: 262
  • Karma: +2/-0
    • blog
Re: top panel dockables
« Reply #3 on: August 19, 2011, 08:54:57 am »
the  most notable annoyance of the right panel to me is the lack of horizontal space in the brush size and opacity sliders and also lack of preview as you change those.

I know that many people use keyboard shortcuts for that reason. However, the keyboard is something that I would like to completely omit from my work flow- it interrupts the drawing process.. Keyboard is also bad for tablet devices.


So if we could move those sliders to the top panel and even have it customisable, I am sure that it will mean the world to  others too. More horizontal space for the slider= better control of the brush size. More horizontal space for the slider in the right panel=less canvas screen estate, because it resizes the whole panel
 
http://imovethings.blogspot.com
my website. I do 2d and 3d animation, concept art and storyboards

Offline achadwick

  • Administrator
  • Full Member
  • *****
  • Posts: 245
  • Karma: +9/-0
  • MyPaint developer and Mypaint-testing PPA owner
Re: top panel dockables
« Reply #4 on: August 19, 2011, 05:19:36 pm »
I like the idea of colour history combined with a chooser for a new colour of some sort on the top toolbar. Quick brush selector and history too, maybe. gtk.MenuToolButton maybe: they'd look a bit like the back button's ▼ on some browsers, and the button doesn't launch the menu but launches some other action.

I want to distil out some proper modes for interacting with the canvas too, and have buttons for those. At the moment everything's handled in the drawing motion handler and depends on which two-handed chord of modifier keys and buttons you press. I want buttons like

  • Freehand drawing (pencil or brush icon)
  • Line drawing (connected or disconnected lines)
  • Frame manipulation (picture frame icon)
  • Zoom, pan, free rotate (magnifier, hand, "something else" icons)
  • Others? that's six or seven right there...

and to make some of them "spring loaded", i.e. go back to the last drawing mode, probably Freehand, when you perform the action, or driven temporarily off the keyboard chords we all loveknow and use.


BTW, total aside: anyone fancy a menu button on the right hand side of the toolbar to save vertical space? More recent Firefox versions do this and it's a good way of Fitt's Law-ing the hell out of the top left corner in fullscreen mode (when you elect to not have the toolbar hide, that is). So... hide the menu bar and a menu button appears, saving a line of screen space.

Offline blurymind

  • Sr. Member
  • ****
  • Posts: 262
  • Karma: +2/-0
    • blog
Re: top panel dockables
« Reply #5 on: August 19, 2011, 07:30:06 pm »
thank you.. and I also want to say that I really appreciate what you have done to the panel this far.  :)

well for panning, 99% of the time, wacom tablet users just click and hold the button of the stylus (mid mouse click). I find that to be much better than switching to a pan tool. Perhaps for other tablet brand users it would be nice to have a pan button that lets you pan the canvas. A zoom in- out slider would be very useful. Also moving the brush sliders to the top and giving them more horizontal space.

Frame manipulation (toggle frame on/off) would also be a very useful button to have!
Ultimately these buttons should be removable from the top panel somehow- that panel would be very nice if it has the ability to be customizable- especially on smaller screens..

The hide-top-panel button is a good idea too!Especially for people who have a tablet with lots of express keys set to call docks such as the brush chooser and the color sampler.

A recent brush drop down menu  in that top panel would completely change the way I use mypaint. I will always have the right panel hidden. And will only refer to it when I need to use a completely new brush (not in my recent history) or when I need to create a new layer.  ;D

 If you have the color/brush buttons in the top panel be able to do two things depending on wether you hover over them or click on them, it will be intuitive to new users and also give a dual function to that button. Hovering would show and let you choose recently used brush/color, whilst clicking(tapping)  would call the full dock that gives you full control. The |> button is a good idea for being able to keep the recent stuff constantly open, but will introduce the problem of having to click on a very small area of the screen- again people with small tablet device screens wouldnt like that.Why not even have it configurable in options- do you want hover vs click, or click vs double click..
This of course introduces the idea of Dynamic buttons in mypaint- buttons with dual function.Thats how we can call them in the options window.

I imagine that recent colour and recent brush drop down list to behave like a right click menu- clicking anywhere outside of it would cancel it. Clicking on it would select a recent brush/colour.


In my opinion a good GUI design for artistic software  holds two ideas:
- aggressively save screen estate by being flexible ( horizontal space is precious)
- does not demand much focus or attention from the user. (lots and lots of small buttons, anything with a high learning curve- this makes gimp feel like too much work for a doodle). So if one button can do two things- it saves screen estate for that slider, and is as big as you have it now- which is perfect.

I can almost imagine mypaint even autohide that pesky right panel for me- so all thats left is the giant canvas and our powerful thin top panel

ON the top Panel's customisation:
 Autodesk maya is a nice example, where there is a flexible top panel known as the SHELF. In maya you can add anything in the menus to the Shelf, by ctrl+clicking on said item.
Tutorial- Create Custom Shelves in Maya
To change the order of items in the Shelf or remove items, the user can open a simple Shelf editor (in the options window?). Maybe we can take that example only for the customisation of the top panel in mypaint. (no need for shelf tabs and editing a shelf item fanciness)
« Last Edit: August 19, 2011, 08:28:26 pm by blurymind »
http://imovethings.blogspot.com
my website. I do 2d and 3d animation, concept art and storyboards

Offline blurymind

  • Sr. Member
  • ****
  • Posts: 262
  • Karma: +2/-0
    • blog
Re: top panel dockables
« Reply #6 on: August 25, 2011, 11:18:05 pm »
hi,
I made a more consistent and simplified mockup of this idea that follows the same click vs double click principle but makes it clearer:

http://imageshack.us/f/692/mockupver3.jpg/

this also proposes a quick layer switcher entry for the top panel that shows the name of the current active layer, whether its visible or not.. and up and down buttons which basically do the same thing as the menu entries "menu>Layer>next (above current) and next (bellow current)"
Also switching between layers can alternatively be done by scrolling over the active layer name box of the top panel.

Single click on the active layer name in top menu lets you rename that layer (motivating the artist to name the layers) . Double click brings the full layers dialogue... or vice versa. So it still can have the values of a dynamic button.

recalling full docks (color, brush or layers) will just bring them back to their last docked or undocked position
« Last Edit: August 25, 2011, 11:30:52 pm by blurymind »
http://imovethings.blogspot.com
my website. I do 2d and 3d animation, concept art and storyboards

Offline KurtF

  • Newbie
  • *
  • Posts: 26
  • Karma: +0/-0
Re: top panel dockables
« Reply #7 on: August 25, 2011, 11:51:13 pm »
I like the behaviors you're proposing here. It's out of the way for most of you're painting tasks, but can open the full panel when needed.

Good idea.

Offline achadwick

  • Administrator
  • Full Member
  • *****
  • Posts: 245
  • Karma: +9/-0
  • MyPaint developer and Mypaint-testing PPA owner
Re: top panel dockables
« Reply #8 on: August 27, 2011, 01:45:56 am »
New code in git head right now does some of this: we have a menu on the toolbar, although you can turn on a traditional menu bar instead if you prefer it.



Here's the colour menu, with a history of the colours you've drawn with. If you click the current colour indicator, it pops up a normal GTK colour chooser with an OK button right now, but I want to do something fancier if I can.



The brush menubutton works similarly. Click the arrow for a dropdown menu with fancy options, just click on the current brush button if you want to change it.



And here's the quick brush chooser dialog. No OK button: it just closes when you choose a brush.


Offline achadwick

  • Administrator
  • Full Member
  • *****
  • Posts: 245
  • Karma: +9/-0
  • MyPaint developer and Mypaint-testing PPA owner
Re: top panel dockables
« Reply #9 on: August 27, 2011, 02:03:35 am »
I won't be implementing double-click interaction anywhere here because it's hard to do with a stylus. Single click only, but we can just put extra entries in the menus and make them more useful that way. That works.

GTK toolbar icons might be limited to being square. Not sure.

Liking the notion of putting layers up there somehow, but hidden by default. Note that the colour and brush ones show the current object you're using. Inkscape's equivalent layer chooser shows the current layer's name name, but not a preview (it doesn't really have the space). Maybe just the stack icon; maybe a preview and an overlaid number... problem is, layer previews are slow things to make and update.

When you click on the "main" button to the left of the arrow, do you expect to see a simple chooser or a complicated one? I prefer dead simple: we already have windows for manipulating the brush lists and the layer lists in fancy ways. The equivalent dead simple colour chooser is a dumb "point-at-colour → click → receive colour" palette dialog. But need a real palette first and a separate window for populating it... Would people actually use a palette when painting? Should that be the first interface to colour choice people see?

Offline Marand

  • Jr. Member
  • **
  • Posts: 56
  • Karma: +4/-0
Re: top panel dockables
« Reply #10 on: August 27, 2011, 03:58:27 am »
When you click on the "main" button to the left of the arrow, do you expect to see a simple chooser or a complicated one? I prefer dead simple: we already have windows for manipulating the brush lists and the layer lists in fancy ways. The equivalent dead simple colour chooser is a dumb "point-at-colour → click → receive colour" palette dialog. But need a real palette first and a separate window for populating it... Would people actually use a palette when painting? Should that be the first interface to colour choice people see?

First, since it's shorter:  I think a real palette would be great in some form; I'm currently using the scratchpad for that purpose but it's kind of clumsy.

I like having the colour and brush selectors on the toolbar.  With some group reorganisation, I might be able to use it to ditch the brush list most of the time and reclaim some space.  Something feels strange about the behaviour of clicking the colour and brush previews, however.  Maybe it's because of the arrow next to them, but I expected a submenu of some kind to appear.  In fact, I didn't expect different behaviour from clicking the down-arrow instead of clicking the icon itself -- I thought they were linked. 

The colour selector behaviour I expected is easy to explain:  I thought I'd get a single drop-down with some kind of colour wheel to pick a new colour and a list of previous colours.  Basically, the current dropdown plus the wheel from the colour sampler (including showing selected harmonies).

The brush selector is harder to explain.  I guess I expected the brush selector that popped up from clicking the icon, but formatted more like the nicely done history dropdown, instead of spawning new window.  I really like the look and feel of the dropdowns, and find the new window spawning to be jarring and potentially annoying. (the placement of the windows so far has been inconvenient)


Offline Thrall

  • Newbie
  • *
  • Posts: 5
  • Karma: +0/-0
Re: top panel dockables
« Reply #11 on: August 27, 2011, 11:32:59 am »
Nice! I like what you've done with the recent colours and brushes menu thingies. However, could the buttons be a bit smaller? As it is, you've halved the area taken up by moving the menu bar into a button on the toolbar, then doubled the space again by putting those enormous buttons on there. Maybe it's good to be able to see what the buttons are, but now I know what they are I'd rather they were more compact.

Offline blurymind

  • Sr. Member
  • ****
  • Posts: 262
  • Karma: +2/-0
    • blog
Re: top panel dockables
« Reply #12 on: August 27, 2011, 12:11:42 pm »
this is amazing progress!!  ;D thank you for making this possible.

About double click interaction> yeah, you are right its hard.. but how about these alternatives:
- hover over vs single click
- mid click (stylus button) vs single click (tap)
-single click vs single click with the eraser tip (wont support all styluses though)

can you think of more?  :P
In an ideal world that would be configurable without the need of recompiling it.have it as an option :)
This approach is good because it doesnt ask the users attention to look up text in the menu and is also intuitive. The less attention you ask from the user, the smoother the drawing session gets.

I like the simple brush menu behavior- selecting a brush will also hide it. That is usually the default action I would take after adding the brush to my quicklist. Good idea!

I really really like what you did with the brush menu btw. Moving the brush modes there is a good idea- also saves much space! The only down side to this is that the user wont geet constant feedback as to which brush mode he's in like before.. but thats just a click away now, which aint so bad considering the amount of pixels that you reserved.
The previous was also nicer because it used icons instead of text. I find that icons are easier to find than text- they ask for less attention too.Icons are also bigger- making it easier to click on the right spot. I find that with text menu entries I tend to sometimes click on the wrong mode when i am in a hurry. Square icons are definitely the way to go as they use the space more efficiently than circle ones! Icon + text menu entry is good too. Why not make the brush modes icon+text as well

cant wait to see those sliders!

as for the GTK toolbar icons> you can put them all under One icon that represents the toolbar. That would save loads of space for the sliders.
Hover over> bring drop down menu with icons letting you toggle on and off entries. clicking outside of the menu would hide it. Clicking inside would not hide it- letting the user to toggle and and off multiple items.
Click once> toggle the whole panel on and off (hide/unhide)- this allows for the panel to remember the entries that you have put in it but be able to hide when you dont need it

Mypaint menu> yeah moving the quit to the main menu makes more sense than having it under file
« Last Edit: August 27, 2011, 12:59:26 pm by blurymind »
http://imovethings.blogspot.com
my website. I do 2d and 3d animation, concept art and storyboards

Offline Mazui

  • Sr. Member
  • ****
  • Posts: 327
  • Karma: +2/-0
Re: top panel dockables
« Reply #13 on: August 27, 2011, 12:35:44 pm »
Have you put this in your ppa yet?

Offline blurymind

  • Sr. Member
  • ****
  • Posts: 262
  • Karma: +2/-0
    • blog
Re: top panel dockables
« Reply #14 on: August 28, 2011, 11:09:48 pm »
i cant find it on git :( Cant wait to give it a spin
http://imovethings.blogspot.com
my website. I do 2d and 3d animation, concept art and storyboards