Krita UI Icons - To be proposed

Following the Krita UI redesign discussion thread

I was presented to this site:

I wanted to do a UI mock up but I ended up changing some icons and regulating most icons to the grid. Some just overlapping them are you able to see the differences. Also cleaned up some messy topology.

I thought before I send them to be proposed officially just check what people think to see if they need some touching up or not. I do like the current icons I do not aim to rebrand them or anything just make all of them seem more part of a single consistent krita identity while also enhancing some readability through the way if possible.

Toolbar icons:
01

02

03

04

05 05_original

06

07

08

09

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

32

33

34

35

How does it feel?

The new icons are:

  • Caligraphy
  • Freehand Brush Tool (new + corrected)
  • Polyline Tool
  • Multi brush Tool
  • Colorize Mask Editing Tool
  • Assistant Tool

I will keep checking out more icons and post them here.

2 Likes

I think the current freehand brush is good icon. it is less ambiguous and literally a brush. Same with multi brush. I like the calligraphy and assistant icons you have made. They can be improved a bit. Like the assistant can be a pair or set square/ T square or french curve ruler.

2 Likes

These are good, and I agree the original topology could be better :wink:.

It’s hard for me to really comment on the specifics of these without presenting some icons of my own, but I will say:

  • Polyline tool looks a bit like a ‘G’, perhaps it could more look like an unclosed Polygon tool? (I also feel the two tools could be easily combined into one tool, but that’s not for this topic.)
  • I feel the Bezier tools need to have connection between top and bottom segments, more for realism than anything else. The bottom curve could also be more rounded perhaps?
  • Multibrush tool could have brush tips at the end of each stroke, so the ‘brush’ feature is implied in the icon. Otherwise it could just look like a fancy ‘crop’ tool :wink:
    *Colourise tool is a hard icon to convey simply. I understand what you’ve done already, maybe an incorporation of the fill tool icon would be suitable since they’re pretty related?
  • The Assistant tool could possibly implement some grids or ruler marks in the icon, since a lot of the assistants involve grids?

All-in-all this is a great start! For future iterations, it might help to number the icons/ create a grid so it’s easier for us to talk about specific icons, but I assume after this most of the icon batches will be smaller!

2 Likes

I agree. But since all other painting icons show what is the result of usage of that tool, the brush tool is the only one that uses another object to convey its usage result. But I guess it does not justify a change then.

Now that you say it it actually does :V

I will try and push that. it breaks the break line consitency but I see what you mean. I pondered over it a while.

But having lots of brushes is just sooo ugly. I choose simple lines for 2 reasons. it would show kinda the dynamic result of a line. it is not regular like other tools but if you do any squigly line you end up with a suastica. and if you increase the brush count it feel more like a star than a mirrored tool.

I could try that out. that happens on other tools too. like the color picker and the mouse arrow.

A Ruler is a bad idea as it is a finite number of blocks. I changed it because the other one did not make even divisions so the ruler becomes wonky there is only so much space and not to mention that much detail only makes much less readability when you scale it down. I never quite understood what the other icon even is. I opted by a simplified support that “helps” create the square. I know this is details but I used the same language for the transform tool to indicate it is a use node that helps the square. maybe I should increase the distance to it so it does not feel like they are together.

I have one remark about gradient icon, it’s the only one with shading, all other are binary white/black

Maybe something like this one (that may be improved I think) would be more consistency with other:
https://material.io/resources/icons/?icon=gradient&style=baseline
(mmh… preview is not the icon I want to show, but link will higlight the gradient icon :wink: )

Grum999

1 Like

that is quite the nice idea. I did kill the gradient info in there if you look. I made like vertical scan lines that seperate the 2 theme colors. 22 to 79 black.


I can try and make a gradient of only those 2 colors like that one and see how it compares.

ah yes, if you can made one, it could be interesting to see the result and compare :wink:

Grum999

Gradients

18 18_blocks

1 Like

Polyline

10_2

1 Like

Result is good, but:

  • Outer box line width might be a little bit greater (width for inner black box borders can stay as actually set)
  • It seems that ‘black’ color used for gradient is a dark grey and not a transparency

That’s possible to test? :slight_smile:

Grum999

Bezier Curve Tool + Bezier Curve Selection Tool
11 32

2 Likes

@Grum999
Like this? And yes the Gradient goes from 79 black to 22 black in order to not go more white or black than the actual theme. There is no transparency on either. You can swap your color theme now and check how the gradient color shifts.

18_stairs 18_blocks

Yes, this one sounds good for me :slight_smile:
After maybe other won’t like this version and will prefer the previous one, but I like it :wink:

Concerning the black in grey, sorry, my english is not very good and I shouldn’t use ‘gradient’ term to talk about it.
I was talking about that:

Who provides this result:
gradient2

But I prefer the bigger border width.
But with transparency instead of grey color :grimacing:

Grum999

but that means the black and white would shift. currently it reacts like this and it was what i was going for too.
icon_gradient

So it would show up like this:
18_blocks gradient_black_2

With Alpha it swaps sides according to the Theme:
gradient_white gradient_black
is that okay?

@EyeOdin there are two icons needed, a light version and a dark version, there is no problem making one with one side transparent and the other one with the other side transparent, I guess.

That’s why I as thinking about for final result, what you show me is perfect :+1:

It seems in fact I didn’t understood how the final icons is used :sweat_smile:
For me I was thinking about one version white + transparency for black theme, and one version black grey + transparency for light theme

Grum999

1 Like

Multibrush? I am still testing out ideas.
multibrush_test

I agree with @raghukamath, the original freehand brush is a good icon, and probably doesn’t require changes.

Ok I see your point :sweat_smile:, what about 3 prongs? Or would that be inconsistent…

That would be a good idea!

Gradient looks good :+1:

Something with that radial symmetry would be nice…

Assistant Tool
23 assistant_test

I like this one :slight_smile:

Grum999