Jump to content
Dante Unbound: Share Bug Reports and Feedback Here! ×

Diji's Ui Enhancement Concepts/mockups


diji
 Share

Recommended Posts

Hiya everyone! Welcome to my thread where I'm just going to put out some ideas and concept images/mockups for UI enhancement. I'll probably add to it for a while until I get bored or something. :D

 

First off, I'd like to thank Azzel for his thread which inspired me to give it a go myself.

If anyone has suggestions, criticisms, or whatever, I'm completely open to them!

 

The intent of the concept is:

a) Easy to find specific items (in particular mod cards)

b) Intuitive sorting/filtering for menus that are generally occupied by a lot of stuff (friends, weapons, mods)

c) Less clicking where possible (page numbers.. *glare*)

d) Easily accommodates expansion (new weapon types, warframes, abilities)

 

The original post is here.

 

Mockups:

Solar map with planet list and party info (thanks to rhoenix for suggesting the list could be minimised when not needed):

k1WXzail.jpg

These features would remain consistent through to the individual planet views, so you can quick jump between planets using the list and see your party info without backing out to the solar map. Also thanks to Onihikage for suggesting that hovering over a person's vote on their party frame should show the mission info, left clicking would vote it (without shifting your view), and right clicking would shift your view to that planet.

 

Contacts + chat popups:

rl6Q9Ctl.png

 

Arsenal:

vAOEI05l.jpg

 

Equip menu (primary weapon, but all would follow the same layout to maintain consistency):

xYYBzhnl.png

Edited by diji
Link to comment
Share on other sites

Heya, I did a rough concept of a list view for the mod menu:

XYT45uBl.png

I forgot the "price" sorting header but it is very rough. :P

 

What do you think? Is this something many players would want? Is it even useful?

If so I'll do some further work on it and rework the grid view to accommodate switching between grid and list views.

Edited by diji
Link to comment
Share on other sites

Hi all! I did a few menu mockups, nothing flashy (I'm not very good with Photoshop). Once I have more time I'll get around to polishing up my previous concepts and working them into a proper mockup. I've been doing these at 1280x800 as that seems to be what the UI is currently designed for. With more space I could fit in stats and such for the arsenal menu.

 

Edit: Forgive inaccuracies in the contacts, I was really tired when I was filling it with fake friends. :P

 

Solar map:

eTGKJ5El.jpg

 

Alternative map, with an easy-navigation sidebar:

KsJ8DoEl.jpg

 

Chat and contacts:

rl6Q9Ctl.png

 

Arsenal menu:

vAOEI05l.jpg

Edited by diji
Link to comment
Share on other sites

i like you thoughts on the solar system.

 

And the arsenal... see for your self.

 

http://www7.pic-upload.de/22.04.13/if1vvkuvwyu3.jpg

 

this is what i was working on. XD

Looks really cool! I was wondering whether I should label the buttons or just keep symbols, since it's pretty much a preference thing.

With symbols you save a bunch of space, but then again, at such a low res I couldn't really fit anything useful into the space.

I was wondering if a "slide out" stats list would work, like a button you can press next to any equipped item and it would show the stats (and obscure your warframe's model). But in the end, that one click can just be used to click to go to the equip or modify menus where I can fit more stats anyway.

 

I also wondered if I should rename RIFLE and PISTOL to PRIMARY and SECONDARY to address the fact that there are shotguns and stuff, but I decided to just stick with the current labels.

Link to comment
Share on other sites

Excellent job, all around.  I like all the proposed changes you've shown so far - for the navigation section, simply allowing collapsable menus would allow someone to show or hide it as the player wishes.

 

EDIT: made last sentence make more sense

Edited by rhoenix
Link to comment
Share on other sites

Excellent job, all around.  I like all the proposed changes you've shown so far - for the navigation section, simply allowing collapsable menus would allow someone to show or hide it as they wishes.

Oh! Can't believe I didn't think of that!

And thanks for the compliments. :]

 

Edit: Made a mockup for one of the item equip menus (oops, forgot to make a change before I uploaded):

jT8VcSfl.jpg

 

I think I'll edit the original post with these mockups and give the rough concepts a linked post for posterity.

Edited by diji
Link to comment
Share on other sites

Putting the original concepts here, so I can put the newer, cooler mockups in the OP.

These are just very basic concept images, I want to get them fleshed out fully and incorporate useful features before I go ahead and make a super-snazzy mockup using actual cards and such. I also intend to work on some more menus, with an aim to have them all match/integrate visually while remaining functional for their respective uses.

And of course, if anyone has suggestions, criticisms, or whatever, I'm completely open to them!

 

The intent of the following concept are:

a) Easy to find a specific card, or a certain type of card

b) Intuitive sorting/filtering

c) Less clicking (page numbers.. *glare*)

d) Easily accommodates expansion (new weapon types, warframes, abilities)

 

zpwZRj5l.png

With regards to the tabs, I lumped weapons together, as it would easily accommodate new types of mods (in case they split rifle mods from snipers, for exampe). It could easily be adapted so that each weapon type has its own tab, however.

Just realised I forgot "melee" in the filter drop down, but you get the idea. ;)

 

HSDtIfDl.png

The card shown above is an example of a weapon mod. If it were a warframe, the "type" would simply show which frame it belongs to. For a fusion core, the rarity might be a good thing to put (or leave blank).

Regarding the mod level bar, it might be better suited to show up when a mod is hovered over, to reduce clutter. I do think we need a way to find partially levelled mods without clicking everything though. :P

Also, the "stacked card" thing might be a bit too much, so the duplicate amounts would suffice.

 

Edit: Just had a thought: Hovering over the "equipped" icon could show you what it's equipped on.

Clicking the card would bring up an option with the usual fuse option, but also an option to unequip it from whatever it's currently attached to.

 

Next up I'll try tackle the equip menu. Once that's done I'll show you guys how I envision the fusion menu integrating with the two of them.

 

Edit: Rough concept of a mod list (alternate view to card-grid)

Link to comment
Share on other sites

Excellent ideas all around. I love the idea of stacking mods, and the list view. The planetary view, while elegant, is definitely too clunky, and when one planet is in front of another or behind the sun, it can be nigh impossible to click.

 

As for a global view while in a party, I would say that it is definitely essential to finding another planet, but perhaps you could implement the system list within the planetary view, for quick switching between planets without having to either path your way around the system trying to find it or back out to the global view. An alternative voting solution would be to just have a list of the missions being voted on displayed directly below the indicator that currently displays "Waiting on x votes... (xx)" For example:

 

Waiting on 1 vote... (38)

Venus: Kiliken (player, player)

Pluto: Acheron (player)

 

Hovering over the text of a line would display the mission info, and left-clicking would add your vote to that planet, while right-clicking would go to the planet the mission is based around. What do you think?

Edited by Onihikage
Link to comment
Share on other sites

Excellent ideas all around. I love the idea of stacking mods, and the list view. The planetary view, while elegant, is definitely too clunky, and when one planet is in front of another or behind the sun, it can be nigh impossible to click.

 

As for a global view while in a party, I would say that it is definitely essential to finding another planet, but perhaps you could implement the system list within the planetary view, for quick switching between planets without having to either path your way around the system trying to find it or back out to the global view. An alternative voting solution would be to just have a list of the missions being voted on displayed directly below the indicator that currently displays "Waiting on x votes... (xx)" For example:

 

Waiting on 1 vote... (38)

Venus: Kiliken (player, player)

Pluto: Acheron (player)

 

Hovering over the text of a line would display the mission info, and left-clicking would add your vote to that planet, while right-clicking would go to the planet the mission is based around. What do you think?

I forgot to mention it, but the solar map, planet list, and party list features were meant to carry over to the individual planet views, so you could still quick jump using the planet list, or click the "diji is voting for War (Mars) to jump your view there. I just didn't make a mockup since it's pretty much exactly the same aside from showing missions, and since the missions are labelled I didn't see the need to make another list for those in particular.

 

But yeah, great idea with the "left click to vote, right click to shift view" thing. I'll put that up there with credits for you. :D

Link to comment
Share on other sites

I was about to post a new thread about UI and looks like you beat me to it ! :D

I think you addressed most of the nasty things about the current UI and especially Search bar ! That would be the holy grail ! T_T

 

Let me add to your post by evoking some "bugs" that the current UI has:

 

- In the arsenal where you assign mods to weapons (little wrench icon): In 1280x720 resolution you can't read the description of a mod. When you hover over it, the description gets "cropped" and you can only see the name and maybe 1st sentence of description. This problem is fixed in higher resolutions. Would be nice if it was visible in lower ones as well.

 

- When fusing (button Fusion clicked) and then changing layout (clicking Name or Rarity) the fusion stops. Why ? Now I have to stay on same sort option to fuse whereas it would be easier to be able to switch from one to another.

 

- A noob mistake that was made on the interface and I'm gonna be a bit harsh on this one is the lack of secondary sort !!! The sorting should be done in this order: Name, Type, Rating. Meaning that once you sort my name, there needs to be a secondary sort on the type to separate sentinel and Warframe mods with same name and then also on the Rating so that mods with higher level stay on top. Right now the sorting is all done on one category and the rest is placed randomly on the window (or following some Mod_ID they have in their database). Of course, if we sort by rating, the secondary sort should be name and then type, if we sort my type we should then sort by name and at last by rating.

 

Here are some examples:

 

http://cloud-2.steampowered.com/ugc/867217316844896068/9F9E15EAEC3D036828A330693E44C9FEB7E13546/

 

http://cloud-2.steampowered.com/ugc/867217316844889764/7421131B138D1B69E1ADA0AB2853CEE247C0DB2B/

 

@diji : some of the images (solar system) are down. Would be nice if we could see them ! :P

Edited by 101010
Link to comment
Share on other sites

- When fusing (button Fusion clicked) and then changing layout (clicking Name or Rarity) the fusion stops. Why ? Now I have to stay on same sort option to fuse whereas it would be easier to be able to switch from one to another.

 

Yes! That makes looking for a particular mods for fusion really frustrating.

Link to comment
Share on other sites

Relevant to the issue with fusing mods, why not just make it so instead of going to the same "view all mods" screen from a weapon or warframe's equip screen, you could just expand the small list of available mods for that item so you're organizing only the mods for a certain category. If you wanted to organize all mods, you'd click the "Mods" button straight from the Arsenal screen rather than going into a weapon's mods and then clicking that Mods button.

 

I'm sure diji's implementation of a mod equip interface will preclude the issue of sorting entirely, but it's good to include it in the discussion.

Link to comment
Share on other sites

Well not sure. You could still keep the same sorting code if you just changed the interface. I'm speculating it's the "brute" list of what the SQL request returns from the data base. If so, the fix would also be to just change the SQL a little bit adding more "SORT BY" or something (SQL is not my strong part). So it's good to point out that part still needs changing and why not fix it before implementing the new interface ?

 

I really hope mods and devs are keeping an eye on this thread... this design is REALLY what we need and the most logic approach there is (grouping, list view, search <3).

 

EDIT: as I have seen in some other threads, some people said we could use a "Custom" or "Favorites" tab / folder where we could put our own collection of mods. This could be nice for lets say in foundry after the little wrench where you put mods on your weapons / warframes. Maybe add it to the design if you have time ? :3

 

Another idea would be to also show currently equipped mods inside the mods page as well so we can do fusion or assign them to other weapons while they are equipped ! What I mean by that is the following:

 

- Doing fusion on an already equipped mod will unequip it automatically from where it's currently equipped (no more unequipping before fusion). As a bonus it should be re-equipped if the cost < total mod points of the weapon / warframe.

- In arsenal, assigning a mod to a weapon / warframe that is already equipped elsewhere will un-equip it from the old place and equipe it to the new.

 

The point in this being not having to un-equip mods every time when you want to upgrade them or transfer them to some other weapons / warframes and then going to mods page to search for them. Would save a lot of time.

Edited by 101010
Link to comment
Share on other sites

Not sure if its been said before in this thread - Actually show us the difference our mods make!

This UI is shiny and all, but the biggest problem I have with the current UI, is I CANT SEE WHAT MY MODS ARE DOING TO MY WEAPONS AND POWERS. How much is 45% more distance on my charge?

I really, really like to have real numbers.

Link to comment
Share on other sites

The latest update added mod type sorting! Aside from the same sorting options we had before, we now have options to show All, or only Warframe, Primary, Secondary, Melee, or Sentinel mods, or only Fusion Cores. I'm sure the weapon fusion interface could still use work, though, and from what I can tell, the secondary sorting still isn't implemented as a priority list, so mods like Redirection (Warframe) and Redirection (Sentinel) are still mixed up. With the new type selection, though, this is only an issue when viewing all mod types.

Link to comment
Share on other sites

The latest update added mod type sorting! Aside from the same sorting options we had before, we now have options to show All, or only Warframe, Primary, Secondary, Melee, or Sentinel mods, or only Fusion Cores. I'm sure the weapon fusion interface could still use work, though, and from what I can tell, the secondary sorting still isn't implemented as a priority list, so mods like Redirection (Warframe) and Redirection (Sentinel) are still mixed up. With the new type selection, though, this is only an issue when viewing all mod types.

 

As I said here:

 

- A noob mistake that was made on the interface and I'm gonna be a bit harsh on this one is the lack of secondary sort !!! The sorting should be done in this order: Name, Type, Rating. Meaning that once you sort my name, there needs to be a secondary sort on the type to separate sentinel and Warframe mods with same name and then also on the Rating so that mods with higher level stay on top. Right now the sorting is all done on one category and the rest is placed randomly on the window (or following some Mod_ID they have in their database). Of course, if we sort by rating, the secondary sort should be name and then type, if we sort my type we should then sort by name and at last by rating.

 

Here are some examples:

 

http://cloud-2.steampowered.com/ugc/867217316844896068/9F9E15EAEC3D036828A330693E44C9FEB7E13546/

 

http://cloud-2.steampowered.com/ugc/867217316844889764/7421131B138D1B69E1ADA0AB2853CEE247C0DB2B/

 

They still haven't fixed this part.

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share

×
×
  • Create New...