I don't think the mock-ups hurt but I don't think we should become so fixated with making a perfect mock-up. The layout is more important...
BTW - I do want a UI that's bright pink with yellow dots.
And here's what I meant about clothes designers... Note they've not coloured everything in, all they've done is provide guidance on that part ... the critical part for them is the form and function.
The point is that by making the layout just 'work' - it should just work regardless of the colour scheme that's laid over the top - it could be the BG1 colour scheme, it could be the BG2 colour scheme, it could be the SOD colour scheme... it could be bright pink with yellow dots... regardless of the colour scheme it sill just 'works'.
But it's the same concept - you can see where the joins are, you can see where the hood fits, you can see how the jeans work, you can see how big the cuffs are in relation to the sleeves. You can see there are some horrible fringe-y bits at the top of the sleeves. All of these things combine to give the layout. Effectively, it's a map of how to build the designed clothes.
The colours aren't part of the layout. So what colour the cuffs or the shirt or the jeans are doesn't matter for the layout.
But they are important, and they have provided guidance, in the form of colour swatches and fabric samples. Will those blues be the final colours used... maybe or maybe not. But it's guidance only. The designers vision, together with the guidance creates the final product - a horrible double denim combo with a hood and nasty fringe-y bits.
Now we come to computers... when it comes to the UI everything is done in boxes - whether the graphic within is a shield, or text, or pink, or black, or blue, or a portrait, or a backpack - it's still a box.
Here's a screenshot of what the inventory screen in BG1EE looks like from a UI perspective. It's all boxes.
All those yellow boxes represent the same thing as the artist's sketch. They are a map of the layout. The colour of the contents don't matter - the position and function AT THIS STAGE is the key thing.
I think it's faulty to equate art style with color scheme. It's quite a bit more, actually. Art style incorporates concerns like how certain materials behave and how structures are shaped. There are functional layouts that will work well with one art style and look ugly with another one, no matter how much you try to force it.
Both BG1 and SoD have very "boxy" art styles that work with pretty much anything you throw at them, as long as it's made up of straight lines. BG2 on the other hand has a much more organic, eccentric look to it that loses its charm when you try to force too many standardized shapes and systematically arranged lines into it. You need to take this into consideration when designing a UI for all BG games, or it won't be aesthetically pleasing in some of them.
I'm not saying it's impossible to make a layout that fits both (or all three) games, in fact, quite the contrary, the original games had such a layout, and so did the original UIs of the EEs, to a somewhat lesser extent. But in my opinion placing functionality first and giving visual design secondary consideration didn't work out for the 2.0 UI. You need to take special care when approaching a task as sensitive as this is.
I think the crux is that we already have the art theme, so we have to test our layout against the art to know if it works. Rather like the clothes designer being given a particular kind of material with a pattern and being told to design something that works for it - they may design something the cut of which just doesn't work with the fall of the material or the particular shade of colour in the pattern, but they wont know that until they've sewn it up...
I think we have a layout that certainly works in BG2 and SoD, possibly BG too...
Also, for example if I haven't worked with real artwork of the original combat stat icons and realized they look bad while big enough for containing larger fonts, I wouldn't be forced to look for alternate solutions like the concept of separate icons and boxes for values. I agree with Adul that at least in this perticular case it is important to consider layout with art simultaneously. I'm not fan of the approach "take this layout to the artist to make it look good, period." I'd rather say how I envision the art too.
I think you've made my point in a roundabout way ...
There are functional layouts that will work well with one art style and look ugly with another one, no matter how much you try to force it.
The UIs for BG1EE, BGSOD, BG2EE are 90%+ the same currently - they have been since v2.0.
This is a line by line comparison of BG1EE UI vs BG2EE UI - where you see blue it means it is an exact match line by line for ~18k lines of code.
So our limiting factor here is that we need to have one UI layout for all three games. If we design for one game only then we might make something that doesn't work in another.
I don't disagree with that, I just disagree with the rigid approach of only taking functional layout into consideration until the art team takes over. I think mockups that show actual artwork from the games can be helpful to determine if you got the layout "right".
I do agree with Dee that one should focus on the interface first, and the art later, and his gray layout screens help taking the focus away from the art. That said, those gray boxes are sometimes too abstract that they do not properly portray the look and feel of the interface.
For a new game, yes, you first consider "What information do I want to bring across where?" and then "How do I best lay this info out on the screen?" (while keeping in mind to leave enough space to be filled with art later on, and once you got that, you work on an art style that fits around the interface.
But the look and feel of the art style is what a lot of people annoyed about the 2.0 interface, whereas the information provided was generally pretty close to desirable already, so I do think that the art style is important here.
I also do think that the arrows indicating improvements and downgrades should be of a consistent color between the different skins, as they're not so much part of the skin, but indicators. I don't want: BG1: Green = better, Red = worse. SOD: Red = better, Blue = worse. BG2: Yellow = better, Green = worse.
Nope, I'd highly prefer picking colors and using those colors in all three interfaces, so I do personally think those arrows should be green and red. Perhaps slightly less bright at the center, but those colors nonetheless.
That said, it does require us to keep in mind that it's not just the one skin we're working with. Right now we're using the BG2 art for the inventory screen, so you have to keep in mind, it shouldn't just look good in this BG2 art style, but also in the blue art style from BG1 and the black art style for SOD. (That one of those art styles is not to your liking at all, is something you should put aside for this topic.)
I don't disagree with that, I just disagree with the rigid approach of only taking functional layout into consideration until the art team takes over. I think mockups that show actual artwork from the games can be helpful to determine if you got the layout "right".
In which case, we need to do mock-ups for all three games each time. Saying it works in BG2 isn't enough... we have to look at it in BG2, BG1 and SOD.
We can spend the time to make lots of pretty pictures in each game's style or we can make grey boxes, add guidance (for BG2 we want this to look something like this, BG1 should look like this, and SOD should look like that) and turn it into an abstract.
Another example, if I am making a cake, I will follow a recipe - it shows me how to build the cake step by step - how much of each ingredient to use, when to put them in, how to mix them, how long to bake it for... I don't look at a picture of a cake and try to make it based purely on the picture. Similarly, we need to give the feedback as a recipe on how to build the UI with the functions we want, how they work, and where we want them. Just giving them the finished picture makes it much harder for them to build it.
We can spend the time to make lots or pretty pictures in each game's style or we can make grey boxes, add guidance (for BG2 we want this to look something like this, BG1 should look like this, and SOD should look like that) and turn it into an abstract.
But how do you want to add such guidance if you don't know how it would look?
Guidance can come in many forms... It can be pictures, small generic mock-ups, little ideas... all sorts. Effectively, swatches of our intentions, if you will...
EG
Item comparisons - each line should have a triangle at the front of it indicating if it is 'better' or 'worse'. The triangle should be coloured green or red to indicate the type of change that occurs when equipping the item. The triangles should be styled in the relevant games art style.
I don't even think we need the arrows to differentiate in color, only in the direction they point in. Up is positive, down is negative. Pretty easy and distinguishable at first glance, methinks.
It's ultimately like when I did the mockup with squiggles on it (remember that - it was probably 15 pages ago or something).... I did the squiggles because I can't draw ornamentation. I'm not a graphics artist. I'm pretty sure I even said that when I posted it.
But after I posted it, I was pulled up because somebody didn't want squiggles on their UI. Even though I had explained why the squiggles were there.
By having 'specific elements' be they colours, ornamentation, styles, whatever, the mock-ups are judged on those styles - whether we like it or not. It doesn't hurt to do mock-ups but they shouldn't be our goal.
We need to give the UI guys a UI map of how we want the UI built... they aren't building it for BG1, BG2 or SOD - they are building it for all 3 at the same time. So it needs to be abstract.
People like the art style of BG1. They like the art style of BG2. They may/may not like the art style of SOD.
We aren't here to discuss the art styles, we are here to discuss the UI - its elements, its functions and what we want from it.
In which case, we need to do mock-ups for all three games each time. Saying it works in BG2 isn't enough... we have to look at it in BG2, BG1 and SOD.
We don't really "need" all three (or four including blue stone) mockups for each iteration. I think every time someone has a new idea they like and want to do a mockup of, they can decide for themselves what style (or lack of style) they want to use for it.
It's not like your idea is suddenly invalid because you used the wrong graphics.
I personally like to preview UI changes with BG2 art, because I think BG2 is probably the most sensitive to art-layout incompatibility issues.
But as I said, everyone's free to do what they want.
I don't even think we need the arrows to differentiate in color, only in the direction they point in. Up is positive, down is negative. Pretty easy and distinguishable at first glance, methinks.
Its the same problem with +/-, AC/THAC0 going up is a negative, down is a positive, Damage going up is a positive, down is a negative. This is why I like the current method where it just displays final values in green/red if its better/worse, with no reference to the amount or direction of the change.
The UI / coding people are a different team within Beamdog than the art guys. They might work cross-functionally and advise/support each other, but at the end of the day the UI/coding people will do the UI/coding, and the art guys will do the art.
You might get a few oddities (like you @Pecca , that can do both )
The teams are separate... and as I said right at the beginning, is that there is a time for art and it's not at the start or middle of the process, it is at the end once we have functional UI suggestions that work regardless of the art, not because of it.
The teams are separate... and as I said right at the beginning, is that there is a time for art and it's not at the start or middle of the process, it is at the end once we have functional UI suggestions that work regardless of the art, not because of it.
And we're trying to point out, that in this case, it's not an optimal approach.
Comments
BTW - I do want a UI that's bright pink with yellow dots.
And here's what I meant about clothes designers... Note they've not coloured everything in, all they've done is provide guidance on that part ... the critical part for them is the form and function.
*Starts making pink and yellow graphics*
The colours aren't part of the layout. So what colour the cuffs or the shirt or the jeans are doesn't matter for the layout.
But they are important, and they have provided guidance, in the form of colour swatches and fabric samples. Will those blues be the final colours used... maybe or maybe not. But it's guidance only. The designers vision, together with the guidance creates the final product - a horrible double denim combo with a hood and nasty fringe-y bits.
Now we come to computers... when it comes to the UI everything is done in boxes - whether the graphic within is a shield, or text, or pink, or black, or blue, or a portrait, or a backpack - it's still a box.
Here's a screenshot of what the inventory screen in BG1EE looks like from a UI perspective. It's all boxes.
All those yellow boxes represent the same thing as the artist's sketch. They are a map of the layout. The colour of the contents don't matter - the position and function AT THIS STAGE is the key thing.
Both BG1 and SoD have very "boxy" art styles that work with pretty much anything you throw at them, as long as it's made up of straight lines. BG2 on the other hand has a much more organic, eccentric look to it that loses its charm when you try to force too many standardized shapes and systematically arranged lines into it. You need to take this into consideration when designing a UI for all BG games, or it won't be aesthetically pleasing in some of them.
I'm not saying it's impossible to make a layout that fits both (or all three) games, in fact, quite the contrary, the original games had such a layout, and so did the original UIs of the EEs, to a somewhat lesser extent. But in my opinion placing functionality first and giving visual design secondary consideration didn't work out for the 2.0 UI. You need to take special care when approaching a task as sensitive as this is.
I think we have a layout that certainly works in BG2 and SoD, possibly BG too...
The icons obviously aren't the right shade
I think you've made my point in a roundabout way ...
The UIs for BG1EE, BGSOD, BG2EE are 90%+ the same currently - they have been since v2.0.
This is a line by line comparison of BG1EE UI vs BG2EE UI - where you see blue it means it is an exact match line by line for ~18k lines of code.
So our limiting factor here is that we need to have one UI layout for all three games. If we design for one game only then we might make something that doesn't work in another.
For a new game, yes, you first consider "What information do I want to bring across where?" and then "How do I best lay this info out on the screen?" (while keeping in mind to leave enough space to be filled with art later on, and once you got that, you work on an art style that fits around the interface.
But the look and feel of the art style is what a lot of people annoyed about the 2.0 interface, whereas the information provided was generally pretty close to desirable already, so I do think that the art style is important here.
I also do think that the arrows indicating improvements and downgrades should be of a consistent color between the different skins, as they're not so much part of the skin, but indicators. I don't want:
BG1: Green = better, Red = worse.
SOD: Red = better, Blue = worse.
BG2: Yellow = better, Green = worse.
Nope, I'd highly prefer picking colors and using those colors in all three interfaces, so I do personally think those arrows should be green and red. Perhaps slightly less bright at the center, but those colors nonetheless.
That said, it does require us to keep in mind that it's not just the one skin we're working with. Right now we're using the BG2 art for the inventory screen, so you have to keep in mind, it shouldn't just look good in this BG2 art style, but also in the blue art style from BG1 and the black art style for SOD. (That one of those art styles is not to your liking at all, is something you should put aside for this topic.)
We can spend the time to make lots of pretty pictures in each game's style or we can make grey boxes, add guidance (for BG2 we want this to look something like this, BG1 should look like this, and SOD should look like that) and turn it into an abstract.
Another example, if I am making a cake, I will follow a recipe - it shows me how to build the cake step by step - how much of each ingredient to use, when to put them in, how to mix them, how long to bake it for... I don't look at a picture of a cake and try to make it based purely on the picture.
Similarly, we need to give the feedback as a recipe on how to build the UI with the functions we want, how they work, and where we want them. Just giving them the finished picture makes it much harder for them to build it.
BTW: guidance - GUI dance
Sure, there's a chance that if something works in BG2, it may not work in BG1 or in SOD.
However, there's a (imho bigger) chance that if something works in those gray examples, it may not work in one or more of the actual games.
EG
Item comparisons - each line should have a triangle at the front of it indicating if it is 'better' or 'worse'. The triangle should be coloured green or red to indicate the type of change that occurs when equipping the item. The triangles should be styled in the relevant games art style.
Job done.
But after I posted it, I was pulled up because somebody didn't want squiggles on their UI. Even though I had explained why the squiggles were there.
By having 'specific elements' be they colours, ornamentation, styles, whatever, the mock-ups are judged on those styles - whether we like it or not. It doesn't hurt to do mock-ups but they shouldn't be our goal.
We need to give the UI guys a UI map of how we want the UI built... they aren't building it for BG1, BG2 or SOD - they are building it for all 3 at the same time. So it needs to be abstract.
People like the art style of BG1. They like the art style of BG2. They may/may not like the art style of SOD.
We aren't here to discuss the art styles, we are here to discuss the UI - its elements, its functions and what we want from it.
It's not like your idea is suddenly invalid because you used the wrong graphics.
I personally like to preview UI changes with BG2 art, because I think BG2 is probably the most sensitive to art-layout incompatibility issues.
But as I said, everyone's free to do what they want.
(Within the boundaries of the law.)
This is why I like the current method where it just displays final values in green/red if its better/worse, with no reference to the amount or direction of the change.
Here's my recipe - I'm a bit nervous because it looks quite complicated.
The UI / coding people are a different team within Beamdog than the art guys. They might work cross-functionally and advise/support each other, but at the end of the day the UI/coding people will do the UI/coding, and the art guys will do the art.
You might get a few oddities (like you @Pecca , that can do both
(The correct answer is here.)
The teams are separate... and as I said right at the beginning, is that there is a time for art and it's not at the start or middle of the process, it is at the end once we have functional UI suggestions that work regardless of the art, not because of it.