armory3d
New Armor Paint Interface/Look
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
I have a few questions/comments
- The indicator is a super cool idea.
- 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?
- 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.
- I really like the idea of a contrast color for visual feedback.
- 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?
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.
yes I know you can do this now but I don't like how this preview thing looks like now
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.
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.~~
- 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~~
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.
- It's an excellent idea.
- Color id icon: The rectangle is less subtle compared to the circle. It is clearer in my opinion.
- 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. - 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. - 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.
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
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.
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.
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.
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.
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.
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.
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
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.
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
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.
@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.
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.
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.
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)
@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
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
- Browser
- Textures
- Swatches
- Fonts
- Meshes
- Script
- Console
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.
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
I'll be honest ... I don't think this is a good idea. especially it looks strange on other tabs
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