New Armor Paint Interface/Look

[Wario-Ametrano]

I want to propose my idea of an armor paint interface, I made this illustration where in addition to giving a more elegant and professional look, I also added some suggestions. -A indicator of the color in use on the color id icon, perhaps by right clicking on the icon you can clean the color without entering the color id window. -the connected textures at the bottom of the bar would be a tool that optimizes resources, if you delete the unused material you also delete the textures it is made of, so as not to have unused textures taking up space. -The layers in this way are more useful and tidy, they are organized very similar to the old versions of armor paint and I'm sure they are more comfortable. -the texture window integrated with the central window at the bottom to have more space of the materials in use of the layers. -I also added a new gizmo that I attach here in the files Gizmo Prototype.zip

[MathemanFlo]

I have a few questions/comments

1. The indicator is a super cool idea.
2. Mask icon for a layer: it would be a preview of the final mask that is applied to the layer, right? By double clicking on it it is shown in the the 2d view and if only one mask is used it can be selected to paint on it?
3. Sliders: I see that there is currently an ux issue: You can not click on the slider to enable manual editing without changing the slider's value. Blender behaves a bit different: It only changes the slider position on dragging. I.e. by clicking you don't change the slider's value.
4. I really like the idea of a contrast color for visual feedback.
5. On the one hand I really like the idea of having much more space for textures, on the other hand the vertical space is very precious. Currently the bottom bar can be minimized most of the time because neither the browser, nor the script or the console are needed while painting/creating materials. But in general I like your idea. Maybe there could be an option to customize the UI. Maybe a context menu that is activated on right click on the tab with the option to move to the sidebar/bottom bar?

[Wario-Ametrano]

yes if you click on the layer you can draw and you can go to 2d, the strip below the layer is the selected layer and that black square is the mask, but I would add one more thing that can be useful, if the mouse is over the level preview square for two seconds a preview window appears, this can be a very useful thing because many times you go to the 2d window just to check the changes, making a preview window it saves you from changing to 2d mode and the work becomes faster, moreover you avoid bugs because you don't always have to change to 2d and 3d and allows you to have smaller levels as in the image because you can control the level better. Yes an option in the sidebar to move it to the bottom bar could be an idea but I would prefer it to be fixed at the bottom with the possibility of moving it to the side, it is more important to have more space for materials and layers than to have textures side.

[Wario-Ametrano]

yes I know you can do this now but I don't like how this preview thing looks like now

[luboslenco]

Pushed some initial tweaks, more to follow. Moved the tabs so we can get a feel for it. Eventually the tab layout will be customizable. The bottom bar can also be hidden via a keyboard shortcut. Please feel welcome to throw in more ideas.

[MathemanFlo]

I tried it and I love it (even though I have to override my muscle memory to move the mouse to the bottom now). I have some small suggestions.

• [x] @Wario-Ametrano's tab order is better than the current one. Script and console are probably used only rarely by most people. Maybe there could even be an option to hide them in the future.
• [x] This is more a question/idea: For example the swatches have a button Tools... that reveals a small menu to more tools. Now the width is no issue anymore. Maybe it is a good idea to get rid of the button.
• [x] The textures, meshes and swatches tab could also support exporting. While textures and meshes can be exported in their context menu, swatches can not.
  4. The groups and masks in the layers tab could give a stronger visual feedback that they belong together. Currently it looks like I think it would help the user to either indent them more, to make them smaller or to draw a line below an expanded group or layer with masks.
• [x] Hovering the 2D View button previews the last imported texture. I'm not sure whether this was the case before but I think it is unintentional. --> #1077

[Wario-Ametrano]

Hi, I have other ideas for armor paint, I drew a more minimal icon next to the color id to indicate the color used, I hope you like this one more. 1.In the fill window I have inserted the wireframe option, I think it is useful to have it there since it is used in the fill window, it makes everything more intuitive. 2.When I save a project in armor paint the software stops giving me the feeling that it is about to close, the first few times I did not understand that when armor paint was performing a save it did so, I believe that inserting an animation as soon as it is saved that warns that the saving is in progress is a functional idea, just a simple animation like the one of the three dots I made. 2.This is the main problem of this post, the lower bar, the minimal look does not allow to distinguish the lower bar from the side ones, I guess that you don't like the edges so I thought of an alternative solution, put some strips verticals that have two functions, the first function creates a visual detachment from the lower bar to the side ones, the second function is that it makes everything more orderly, all the elements in the lower bar are aligned with the vertical stripes, this makes everything clearer elegant and precise.The vertical stripes are the same size as the side buttons on the left, if you think that the elements are too far from each other because they are aligned with the stripes you can make the stripes thinner, the size is not important but it is important that the first strip on the left and last strip on the right are dark to visually detach the lower bar from the side bars. simple and consistent with the layers sidebar stripes, let me know what you think. Now you will have noticed that under the icon of the colo picker there is another icon, I want to talk about that other icon as soon as I have created other gifs to explain you better.

[MathemanFlo]

1. It's an excellent idea.
2. Color id icon: The rectangle is less subtle compared to the circle. It is clearer in my opinion.
3. Missing feedback: That's totally true. It is not clear to me when saving or loading a file is finished. Most programs have some kind of a status bar to indicate these things (e.g. Blender has one). I really like this minimal approach as it doesn't waste any height and doesn't add more clutter to the ui. Maybe there could be a visual color coding system: Red for errors, blue for information, green for sucess, yellow for warnings. Currently errors are reported in the console and show up like this (I changed the cloud url to something invalid to provoke an error): I think one could merge these two concepts to an unified one. E.g. align the console to the right and show the status information there. It is not a bad thing to have them in the console as well. Also it is visually unpleasent how errors are reported at the moment. A tab should not change its width and shift the other tabs to the right.
4. I made a screenshot that contains lots of materials on the bottom and on the right to see how it looks at the moment. I think it is not that bad but clearly there could be a visual separation. The invisible border is also active in the sense that it can be used to change the sidebar's width. The vertical strips you suggest feel a bit uncommon to me and make me think that there is a vertical alignment/hierarchy.
5. While thinking about the UI I realized one thing. Previously the right bar contained assets (node based like materials, brushed, particles and non node based textures, meshes, fonts and swatches) that are part of the project. The bottom bar Browser was a Browser for external assets that could be loaded into the project. By loading them they appeared at the right sidebar. By changing the UI it lost that clarity. Loading a texture by Browser does not give you this visual feedback anymore because the change is invisible (you can not see textures tab and the browser in parallel). Also the bottom bar contains external assets (Browser) and project assets (other tabs) now. I don't know whether it is necessary but maybe there could be a visual distinction between these two.

[Wario-Ametrano]

The lower bar must be visually detached from the side bars, if you don't like my idea of vertical stripes I can propose another idea more similar to my first idea.In this case I have created diagonal stripes that are always matched to the theme stripes on the layer bar. But compared to vertical stripes, diagonal stripes have the advantage that the elements (materials, textures ...) do not have to be aligned with the stripes. I like this idea of diagonal stripes better than to the vertical stripes, in any case I hope that luboslenco chooses one of my ideas for the look of the bottom bar

[Wario-Ametrano]

Hello, in recent days I have mentioned the tool that is located under the picker, that tool is a tool as an idea similar to the magic wand of photoshop.One of the things that wastes my time and is more frustrating is to search for objects in the list of objects above the layers, search for objects in the list when a mesh is composed of a few objects is a quick and easy thing but when a mesh is composed of 20 or 30 objects search every time in the list becomes frustrating and wastes a lot of time. I propose this tool that as the magic wand of photoshop selects parts of the image this tool hides and shows only what is selected.In the first gif the magic wand is in selection mode so only the object you click on remains and the others are hidden.In the second gif the tool is in deselect mode so the object you click on is hidden.

[Wario-Ametrano]

in this other gif instead you can select more objects by holding down the shift key and clicking on the object.then you press the hide button and hide the selected objects.in the gif the tool is in deselect mode but this possibility to choose more objects should also work in select mode.the reset button is used to return all visible objects.

[Wario-Ametrano]

this is the window of the magic wand. -the hide button hides objects when several objects are selected at the same time by holding down the shift key. -The reset button makes all objects visible again. -Then there is the select and deselect menu to choose the mode. -and then there is the objects and materials menu to choose whether to select objects according to different materials or if they are different objects, this menu is useful for meshes with objects of different materials.

[MathemanFlo]

Based on the issue described by @Wario-Ametrano I have yet another additional idea. The Object and Filter drop down in the Layer panel could get a filter search bar to speed up selection. Just like it is the case for the search menu for nodes.

[Wario-Ametrano]

Yes, your idea can be an extra tool very useful, but the magic wand tool is an indispensable tool. When you have 20 or 30 objects you do not remember the name of all the objects, so having a visual tool like the magic wand is indispensable. Sometimes I also forget that I have selected a color id, when you have many objects is difficult to remember everything also for this reason the notification of the color id is important. Anyway I saw that you have put the wireframe option in the fill window, I'm glad you liked that idea, actually having the option on the top bar is more intuitive and practical. I still have a lot of other ideas for armor paint but before I propose other ideas I want to wait for luboslenco to tell me his opinion about the ideas I proposed until now, so if he has doubts we can talk about it.

[MathemanFlo]

I agree with you, it is no replacement for your idea but an addition to it. Your idea only inspired me to the proposed idea.

[Wario-Ametrano]

yes I understood that it was an addition to my idea, and I agree with you, adding a search filter would be useful, even blendere has a search filter, I add that you could add a search filter also for the levels, when you have many levels is much more convenient to search for them with a filter

[Wario-Ametrano]

This is my idea of how layers and masks could look like, I already wrote this idea in another post but I'm writing it here to get all the ideas on here.Add an arrow with the name of the layer type, below the name of the main layer.I think this way you have more space for the name of the main layer and it is also clearer which layers you are using.

[MathemanFlo]

I refer to 95c78f4ae3bf9046e6fdc39651d7540b0249161d It's a clean and easy solution - [x] but the order is wrong in my opinion. The black line is left of the scroll bar. done

[Wario-Ametrano]

I'm sorry but I don't like this solution, lines are fine if lines are on all bars and windows as in my first image here on this page. Applying a line to divide only one space as in your image is ugly, it gives the idea of something improvised, it's not coherent. I hope you don't take offense to my opinion but a professional look must be clean, coherent and homogeneous.

[MathemanFlo]

@Wario-Ametrano

• How would it look like if there are multiple layers having masks and everything is expanded? Since there is no indent anymore is it easy to see the hierarchy?
• How would it look like if a layer or mask is selected? Is there an additional border to indicate that?
• Is it correct that the small triangle is the button to expand/collapse? Isn't it a bit small, especially if ArmorPaint is used on a touch device?

This is my idea of how layers and masks could look like, I already wrote this idea in another post but I'm writing it here to get all the ideas on here.Add an arrow with the name of the layer type, below the name of the main layer.I think this way you have more space for the name of the main layer and it is also clearer which layers you are using.

[Wario-Ametrano]

I appreciated your questions, my idea was focused only on the idea of how to display the layers of the masks with a different icon.As for touch devices, I admit I have not considered them.However I appreciated your questions and I have created an alternative and complete version following your advice and your questions. Under the square of the layer there's a line that if it turns blue it means that the layer is selected, I moved the layers of the masks to make easier to understand the hierarchy and I made clearer how it should work and how it looks with more layers and masks.In the second image I simply show a layer without masks, it doesn't have the blue line that makes sense only if the layer has masks and it doesn't have any icon for layers and masks.I hope you like this idea, if you have more questions I'm always glad to talk.

[Wario-Ametrano]

I already said that I don't like the solution of the line of separation of the lower bar chosen by luboslenco,it's approximate, improvised and horrible to see. I don't want to offend and I respect the work of luboslenco and armor paint is my favorite 3d painting software, but when I don't like something I have no problem to say it. There are not only my ideas I know, but I hope that a more elegant solution will be found than a line made badly in a few minutes. I propose another idea to separate the lower bar, I'm honest I don't like this idea but it's still better than a line, I think the best and most functional solution is the vertical stripes because they separate and make everything more orderly, the diagonal stripes are nice but they are not the best solution, my last proposal is simply to give a darker color to a part of the lower bar, it's not very elegant but it's better than a line.

[AlexKiryanov]

Hello everybody! Hello Lubos and Florian))) The first thing I want to say. Changing the bottom of the interface is a very good decision! Thanks to everyone who participates in this. But. Can I write my suggestions too? First, I think you can make these stripes in the layer window darker to make the separation more pronounced. And it would be great if the layers with the masks were smaller than the layers for painting. This will be more structured. And you can immediately understand which layers mean what.

What do you think about it? Thanks again to you all)

[MathemanFlo]

@luboslenco you already fixed the order issue of border line and scroll bar. - [x] Unfortunately it is almost impossible to scroll by mouse without changing the width of the right side bar because the space between scrollbar and border is so tiny done

[AlexKiryanov]

I agree with @MathemanFlo. I have to aim to move the slider.

[MathemanFlo]

Now I have used the new bottom bar quite some time and would like to propse yet another reordering of the tabs. I realized that the most used tabs are Browser and Textures, followed by Swatches and Fonts. Meshes is hardly used because the mesh is usually not changed in a project. Therefore I propose the order

1. Browser
2. Textures
3. Swatches
4. Fonts
5. Meshes
6. Script
7. Console

[AlexKiryanov]

Well, there is some logic in this. Agree.)

[paolohuesp]

I do not know if it is the right place to put this here but I would like to suggest this, if it could be changed in the file tab group all the import options (texture, envmap ...) in a single option and unfold to the side likewise with those of reimport and export and correct the shortcuts and put them in capital letters as indicated in the image, also remove the ellipsis ".." in the different options.

[Wario-Ametrano]

I made an alternative version of armor paint with vertical stripes and all objects aligned, I also changed the color and size of the text marker. Vertical stripes are customizable by changing the Contex color. I uploaded the files to github and hopefully that lubsolenco accepts this version, I think it is more beautiful and original. If this version is accepted I will make other changes and improve other things.

https://user-images.githubusercontent.com/86927539/131710769-3e03a01b-fb7d-47bc-8eed-948608e4d251.mp4

[AlexKiryanov]

I'll be honest ... I don't think this is a good idea. especially it looks strange on other tabs

[Wario-Ametrano]

I think mine is a good idea, the look on the other tabs is very simple and cool, in the future you can also position the meshes horizontally like the materials and align them with the vertical stripes, I'll be honest too, the look of armor paint as of now it's confused and untreated, it's my opinion I respect your opinion but you can't tell me that the current version is better than this because it's not true

[Saibot-MK]

I really like this version with vertical stripes, very cool,it needs to be improved but it is more beautiful than the current version

[AlexKiryanov]

beautiful does not mean usability. I do not argue that there is something in these vertical lines. but. (as I said before) in other tabs it looks strange. maybe they will only be added to the window with materials? but I'm not sure. I can make a video about it. ask the people about it. as they say in disputes, truth is born.

[Wario-Ametrano]

The first function of this vertical stripes system is usability not beauty, dividing each element into rows makes everything more immediate and orderly.My opinion is not that the other tabs look strange, you simply have to organize them in a more orderly way and precise. I made some images on the concept of how I think the other tabs will have to be in the future following this system of vertical stripes. I have inspired myself to linux file manager spacemanfm which for sure is not a file manager that focuses only on beauty, the fact that this system is also beautiful to look at is a secondary function. In the images there are some examples, the mesh tab should have icons for each object, for example I used a cube.

[AlexKiryanov]

Hi Yes. this is how it looks better now. agree. but I'm still not 100 percent sure.

[ikonnow]

I do not know if it is the right place to put this here but I would like to suggest this, if it could be changed in the file tab group all the import options (texture, envmap ...) in a single option and unfold to the side likewise with those of reimport and export and correct the shortcuts and put them in capital letters as indicated in the image, also remove the ellipsis ".." in the different options.

super good idea, especially since this concentrates user interaction and at the same time avoids the confusion / disorientation due to too many options standing among each other. These folded / combined options should be introduced globally!

[ikonnow]

Hi Yes. this is how it looks better now. agree. but I'm still not 100 percent sure.

i'm not convinced of the zebra look either, it definitely makes sense for excel spreadsheets to make it easier to read information, but not for a painting and texturing tool, where the main focus should be on the most detailed thumbnail display possible and not the mass display of text based information.

If then one should concentrate here just on that and offer extended display possibilities, without text button, tiles button, scaling of the thumbnails slider. In addition, with mouse hover a larger detail representation would be great!

[Saibot-MK]

I like this new look also because it is combined with the horizontal stripes look of the layers window, if you think vertical stripes are zebra-like, even the horizontal ones are zebra-like and then we have to remove the layer stripes too, it is true that armor paint is a painting software but it is also true that in any software the order and intuitiveness of the tools is important.I think this look with vertical stripes is neater and more professional

[AlexKiryanov]

I do not know if it is the right place to put this here but I would like to suggest this, if it could be changed in the file tab group all the import options (texture, envmap ...) in a single option and unfold to the side likewise with those of reimport and export and correct the shortcuts and put them in capital letters as indicated in the image, also remove the ellipsis ".." in the different options.

Cool idea)

[Saibot-MK]

yes I know that the topic of vertical stripes is hot but I wanted to propose an alternative idea for the swatches tab, the swatches icon is too similar to the texture one, if there will be vertical stripes there will be more space between one icon and the other, I propose to use a different shape to distinguish the swatches from the textures and make better use of the space of the stripes, the look is even more beautiful.I tried to use the triangles because they are simpler but you could also use others geometric shapes

[paolohuesp]

Greetings to all, I would love to show you a proposal for a new interface for armorpaint.

• As you can see, the title bar is attached to the menu bar and thus have more space for the workspace.
• The painting, material and baking tabs change its position to a small collapsible menu. In the viewport also include some information such as the view we are in (perspective, orthographic), the selection of the object that we are painting and the view of the "material mode", and a new gizmo
• The tools would be a floating bar, in the options of the tool it would only be a small box with the number and when clicking it, it would disaggregate a slider, in the case of the angle include a circle and be able to manipulate.
• In the section of the browser tabs, include new buttons such as the one behind, forward, "upload a folder, add to the list and remove from the list" (I did not make an icon for these last three) and separate the content where it is they find the folders and files of the rest of the interface and are not mixed in the same way in the layers and materials, where there are also new icons that replace the buttons with existing text.
• And a new design in the view of the layers, masks and groups To finish a new bar at the bottom that includes some samples of navigation keys and the tool on the left and on the right a little information such as the number of objects in the scene and the version of armorpaint in use.

[Saibot-MK]

Sorry but i don't like your version of the interface, it looks like a mac osx software from the early 2000s, the rounded corners are very early 2000 i don't like them very much, also there is no reason to use a darker background for each window , it makes more sense to make lines to divide the windows is easier to do and more beautiful to see.The flying toolbar looks a lot like that of Agama Materials, I believe that Armor Paint must have its own identity and not copy others software and above all the style of Armor Paint must be simple and minimal, I prefer the one with vertical stripes even if your idea of the buttons is not bad

[paolohuesp]

I understand your point of view, the dark background is to separate the content with the paste of the interface and be more noticeable, that each one has a space, on the tools it was a coincidence but in this way space is saved that remains below the last tool and use it for the tabs (browser ...) or the viewport.

[paolohuesp]

I show you a proposal of how it would look in the current design of the interface some buttons for the layers and materials tabs would also include the brushes and particles tabs with some changes.

[Wario-Ametrano]

Sometimes to find a solution to a problem you have to step back and question yourself and your ideas.I tried to have a different approach with the Armor Paint interface trying to follow the real version more than imposing the my version. This new concept of mine changes many things but keeps the minimal style of armor paint and improves it, I rotated the tabs of the lower window so that it detaches it from the toolbar and I moved the layer window down so that it detaches the window lower from the window of materials used. This version is much more minimal than the real version and revolutionizes some things a bit, but it definitely solves many problems and is easier to realize in reality. I also added the environments window in the layers window, I think that we need to change environments more quickly and have a list. I have slightly increased the brightness of the default environment of ar mor paint because I think it is a bit too dark and also to differentiate it from the windows. In addition to the interface image I have also inserted other images to better explain some things. I am open to new opinions and advice. It is not a perfect version, certainly there these are things that can be improved but I think it is the right compromise between the real version of armor paint and a more beautiful and comfortable version.

[Saibot-MK]

I love this version it's amazing, it's original and minimal it's in the style of Armor Paint, the vertical striped version is cool but this one is so much better

[infinder]

I don't like the one vertical stripe in the layers window behind the eye icon. Otherwise nice.. Also, if Environments tab was in the browser among textures tab, meshes tab etc. it would be more natural and predictable.

[paolohuesp]

I like the color change of the "eye" in the layers tab but not much the vertical bar. A new environment tab is a great idea but it doesn't quite convince me. The change to vertical of the browser tabs I do not like due to the fact that it does not match the order that other tabbed panels already have and in the plugins tab there is something that I do not like.

[Wario-Ametrano]

This is an alternative version more similar to the current version with the 2 pixel blue lines of tabs, the tabs of the lower window a little smaller and the layers window in the current style of armor paint, if you have other ideas how not to hesitate to give your opinion