My old school solid UI mock-up for Pillars of Eternity

[Lychnidos]

You can use Fraps or some other screen capture software.

[Grotesque]

 

 

The spell/ability UI section depending on selected class:  Fighter, WIzard and Chanter

 

 

The dark blue gems depict the number of prepared chants (3/4 in this case) with the second prepared chant being the active one.

Three invocations of level one are available for casting in this case

Edited February 11, 2015 by Grotesque

[Rostere]

This is really super awesome and good looking. Obsidian should obtain your .psd files or what you've got and look at them to do something like this in-game.

[Grotesque]

 

Small changes to the layout.  Money counter, cancel and select all buttons new positioning, more effects added  to chants selection buttons.

 

 

I like the money counter next to the Inventory button and the select all button  under the portraits but the new position of the cancel button does not feel right. What would be best is a new button on the left side. Any ideas?

 

Now I am working on a mock-up for an "Edit chants" scroll and a smooth transition to the grimoire when selecting next character from the chanter's  "Edit chants" UI.

Edited February 13, 2015 by Grotesque

[Rostere]

Frankly I feel this has reached the point where the most important objective at the moment is getting someone from OE to look that this seriously or get someone to sign up to mod this ASAP.

 

Call it a luxury problem, but seeing this awesome mock-up UI and then playing with the default "minimalistic" UI is going to bother me slightly.

[Falkon Swiftblade]

yeah I like this version the best so far from what I've seen. Just some minor thing's to tweak on Obsidians end, and I think it's pretty solid (no pun intended!)

[Adam Brennecke]

Looks cool! The next challenge and suggestion would do a mockup at 1280x720 and 2560x1440 to see what it looks at low/high resolution. (We also do a 4:3 low res, but I forget the dimensions Kaz uses.) You might encounter some interesting problems. 

 

We won't be doing anything this substantial for our solid UI. It could be a couple of weeks of programming to implement this.

 

Thanks for sharing!

[Grotesque]

Looks cool! The next challenge and suggestion would do a mockup at 1280x720 and 2560x1440 to see what it looks at low/high resolution. (We also do a 4:3 low res, but I forget the dimensions Kaz uses.) You might encounter some interesting problems. 

 

We won't be doing anything this substantial for our solid UI. It could be a couple of weeks of programming to implement this.

 

Thanks for sharing!

 

 

I'll do a 4:3 monitor mockup and rearrange all the elements at 1440x1080 resolution

[Rostere]

Okay. Then we need to mod it in. Or else all of these mockups would have been in vain

[Grotesque]

Okay. Then we need to mod it in. Or else all of these mockups would have been in vain

 

In vain?   Pillars of Eternity 2?

[Veevoir]

We won't be doing anything this substantial for our solid UI. It could be a couple of weeks of programming to implement this.

 

Thanks for sharing!

 

Possible future patch? This is a really well thought interface which also carries a very strong IE vibe Kaz's interface lacks.

[Rostere]

You know. The most important thing for me is really the large-size portraits on the right like in IWD, BG and BG2.

[Zack Fair]

 

Okay. Then we need to mod it in. Or else all of these mockups would have been in vain

 

In vain?   Pillars of Eternity 2?

 

If they wanted an UI like this, they would have made an UI like this. I think they won't use this neither in PoE1 nor in PoE2. Which is a shame.

Edited February 13, 2015 by Zack Fair

[Stun]

We won't be doing anything this substantial for our solid UI. It could be a couple of weeks of programming to implement this.

That's it? A couple weeks?

 

Do it.

[Ineth]

Because it's neither as quickly accessible nor does it feel natural and comfortable. Also, it doesn't address the screen view problem that many people tend to complain about (right click on an enemy....and suddenly a giant radial menu pops up blocking your view of the world....right in the middle, even!)

I can't stand Wheel HUDs. In both ToEE and Planescape Torment I found myself constantly wrestling with them.

 

Oh, don't remind me of that torment (pun intended)...

 

1. Open the radial menu and select a spell or ability.

2. D'OH, realize the radial menu now also covers the intended target of the spell/ability.

3. Hastily move mouse to the screen edge to scroll the viewport, to make the target visible again.

4. D'OH, scrolled too far, target is now completely outside the viewport. Carefully move mouse to the opposite screen edge to correct.

5. Move the mouse back to the action and finally issue the spell.

 

Not that again please.

Edited February 13, 2015 by Ineth

[Shallow]

I'm generally not that big on U style UIs, but the later mockups in this thread have been fantastic, love it. I'm not even saying it looks like a great UI compared to the PoE UI (which is downright horrible, I mean why would you go and put a log there?), I'm saying it looks like a great UI overall, on its own two feet. Definitely hope something like this gets modded in soon after release.

 

btw: You might want to update the OP with some more recent pictures.

Edited February 13, 2015 by Shallow

[Pipyui]

I didn't even want a skeuomorphic UI before I found this thread.  Very nicely done, Grotesque! Top marks!

[Stun]

Oh, don't remind me of that torment (pun intended)...

 

1. Open the radial menu and select a spell or ability.

2. D'OH, realize the radial menu now also covers the intended target of the spell/ability.

3. Hastily move mouse to the screen edge to scroll the viewport, to make the target visible again.

4. D'OH, scrolled too far, target is now completely outside the viewport. Carefully move mouse to the opposite screen edge to correct.

5. Move the mouse back to the action and finally issue the spell.

 

Not that again please.

And in ToEE it was even worse, since some spells and items were complex and they had extra branches of clickable choices in the radial menu.

 

For example, sometimes you found yourself in a situation like this:

 

 

^Look at that. This was supposed to be a solution to 'screen hogging' panel-themed UIs that were the standard RPG fare back in the day. Yet it could (and often did) take up the whole screen during tense combat. And for an otherwise stunningly beautiful game like ToEE? Good God.

Edited February 13, 2015 by Stun

[Grotesque]

 

 

btw: You might want to update the OP with some more recent pictures.

 

 

But I can't edit the original post

[illathid]

 

 

 

btw: You might want to update the OP with some more recent pictures.

 

 

But I can't edit the original post

 

 

Obsidian's awful forum software strike again! :D

[Falkon Swiftblade]

 

Oh, don't remind me of that torment (pun intended)...

 

1. Open the radial menu and select a spell or ability.

2. D'OH, realize the radial menu now also covers the intended target of the spell/ability.

3. Hastily move mouse to the screen edge to scroll the viewport, to make the target visible again.

4. D'OH, scrolled too far, target is now completely outside the viewport. Carefully move mouse to the opposite screen edge to correct.

5. Move the mouse back to the action and finally issue the spell.

 

Not that again please.

And in ToEE it was even worse, since some spells and items were complex and they had extra branches of clickable choices in the radial menu.

 

For example, sometimes you found yourself in a situation like this:

 

 

^Look at that. This was supposed to be a solution to 'screen hogging' panel-themed UIs that were the standard RPG fare back in the day. Yet it could (and often did) take up the whole screen during tense combat. And for an otherwise stunningly beautiful game like ToEE? Good God.

 

 

I think the only problem with that way was too much text, it would be way quicker to keep the icons and go from bigger icon to the smaller one to select it and whammo! Actually maybe more similar to how a mac's toolbar is when you hover over it, and you can actually make it bigger or smaller too. Also I'd dim them out when not highlighted, similar to the background of the text.

[Grotesque]

 

 

 

 

1440x1080  (4:3)

 

 

 

 

 

 

 

 

Edited February 14, 2015 by Grotesque

[Grotesque]

Would someone  post a link(s) to a screenshot made at 2560x1440 resolution fo the next mockup?

 

The more screenshots, the better

[Falkon Swiftblade]

i think these are promising, the only thing is with the one with the combat log going into the screen that would obviously be counter productive for fighting because you can't click on the playable area, so maybe it only goes up to max 30% of the screen real estate? I think it would be OK if it didn't take up the whole width of the screen, it could be either right or left side normal sized.

[Grotesque]

combat log is for checking it from time to time in special circumstances.

 

pause game ---> increase log size----> read log------> collapse log------> unpause game