UI/HUD Ideas, Sketches, fun-stuff :3

Discussion in 'Art Gallery' started by Unspecified, Oct 1, 2014.

Watchers:
This thread is being watched by 4 users.
  1. Unspecified

    Unspecified Active Member Senior Member

    Local Time:
    10:21 PM
    In-Game HUD 0.1-0.3
    1hud-tw.jpg 2-hud-tw.jpg 3-hud-tw.jpg
    Just did a fast sketch on a in-game UI/HUD idea, nothing serious, just for funsies :3
    Hope this can flame up some ideas or something :3
    (Credit: Used Icons from the "We need Buttons!!! Buttons!" post, credits to all of them and so on :3)

    In-Game HUD 0.5
    5-hud-tw.jpg
    ZMGLOB! just another design! Did it based on Keramory idea (his suggestion reminded me of Blade&Souls Summoner and Force Master, they use a similar MP system called Chi (i think)).
    Last edited: Oct 3, 2014
    azuretre, calmchaos and Cerberuspaw like this.
  2. Aryth

    Aryth Developer Senior Member Indiegogo Backer

    Local Time:
    3:21 PM
    That's pretty good, actually. XD
  3. calmchaos

    calmchaos Moderator Staff Member Senior Member

    Local Time:
    3:21 PM
    I love everything about v0.1 except that you don't have the F1, F2, 1, 2, 3, etc on the skill bar.
    Is that the mana cost that you have there? Because, if it is, I personally don't think that's necessary. Learning when and how to use your skills is important in every game, so I think you can just replace that with the key #s.

    v0.2 feels kind of bulky. The perfectionist in me does like the lined up spacings though, but the staggering in the first one was excellent.
  4. Xarandele

    Xarandele Well-Known Member Senior Member

    Local Time:
    1:21 PM
    Pretty good, I have decided to go with an earlier idea about the HP/MP/EXP bar area however, your version one concept for the hotkey bar is pretty much how it will be on that part however, but will be situated in the left corner with a few less buttons.

    This is moreso for space constraints to the screen and not clogging it with a ton of things.

    As far as the numbers on the icons which I assume is the MP cost of the skills, that part can be done with a mouseover pop up that shows you information on the skill itself.

    I am going to have all the miscellaneous menu buttons be a little more space concious as well but will be somewhat similiar to what you have in the corner there but in a horizontal fashion.

    The party menu is something I will greatly keep in mind though, however it may need some modified work to fit the theme we've been working with so far.

    I do like the map look you've made, I'll see about implementing it in some fashion as I start work up on my end again, which should be sometime soon as I've been really busy up until recently when it started to die down.
  5. Unspecified

    Unspecified Active Member Senior Member

    Local Time:
    10:21 PM
    ok, ty for the feedback all and so on :3 HUD o.3 is now up. (The size may be little big but it's because the image was so small and I want you to see some of the details :3) If someone could maybe send me a better in game picture without the HUD/UI, it would be appreciated <3
  6. Xarandele

    Xarandele Well-Known Member Senior Member

    Local Time:
    1:21 PM
    Just so you know as far as the main game hud goes, I've pretty much got all that set up.

    However, what would be extremely helpful if you would like to do it would be a layout design for the guild menu, as well as the Member Address Menu.

    Just remember that it has to fit the hexagonal theme.
    It would also be helpful if you can make icons to put inside of these specific menu's to dictate what they are from an image point of view. (I've had a bit of trouble making a guild system icon)

    I can do further modifications to the style on my end, but making the icons themselves takes a while.
  7. Keramory

    Keramory Guest

    Local Time:
    1:21 PM
    I actually love the idea of HP being a %. Makes it seem more "digital" in a hack and slash world...like .hack.
    Also it makes it a pain in the butt for casual players to try and guess if they can survive the next attack or not. And Good! No one should know exactly when they'll die in battle!

    I would propose just as a fun idea to think about...to make it even further...taking MP/SP out as a number pool. For example as it stands, say a wavemaster has 1200 mp and a random spell costs 350.

    Instead, again...just an idea...much like say Infamous, there are a bunch of blue hexagons connected for MP/SP...and obviously mage classes would have more hexagons or their spells/abilities would cost less hexagons per spell.

    I'd prefer it because .hack annoyed me with its sp/mp confusions and I think 3 bars or calling it different things for different classes is just silly.

    Also, you can even keep the MP/SP number pool but like the HP bar as %, the hexagon UI could hide the actual numbers, and parts of the hexagon or they can be based off numbers as well. People like hidden numbers, makes the game feel more complex when its really not. FFXI was...so bloody famous for that.


    Aryth and Siegfre would probably kill me for the extra work but...I got excited about the idea for a minute :p
    You bastards named us after a random element, I'm gonna make us look like bloody chemestry!
    Infamous example:
    http://www.cheatcc.com/imagesps3/infamous_000c.jpg
    Last edited by a moderator: Oct 2, 2014
  8. Pompeii

    Pompeii Active Member Senior Member

    Local Time:
    4:21 PM
    The first design is definitely my favorite. I do, however, like that the other two designs have the keys marked on the buttons. I completely agree with calmchaos, I would use the key numbers instead of the spell costs and just gray out the buttons when you can't use them. Players would learn to judge how much MP spells used up with practice.

    Clean UI is so important and I love Keramory's example from Infamous! If the HUD/UI has too many numbers, it tends to be distracting. Infamous Has an arc, a tiny arrow, one word, a bunch of circles, and a really basic mini-map. It's simple and effective and never distracts you from the gameplay. Using hexagons as the MP/SP gauge (like what Infamous does) is such a cool idea. It is tough to make such a simple HUD in a game like this, but I love that the thought is on the table.
  9. Keramory

    Keramory Guest

    Local Time:
    1:21 PM
    I...attempted to draw out the UI on paper since im at work...
    didn't end well. Turns out making those damn hexagons need and perfect doesn't work out too well.
    As my art poorly would show...the Mana Hexagons would be connected by a mana stream look and be glowing to show theres magic in them. The ones used up would be greyed out and have no connection to them.

    Also, since we're talking about me still trying to cope with our element name after all these years...
    you could also do siegfre's dream of...
    A COMBO SYSTEM!!!
    Best of it...you can throw hexagons in that shit.
    Knight uses Thrust of Justice!
    ONE HEXAGON
    Wavemaster uses Gust of Truth!
    ANOTHER HEXAGON AND IT CONNECTS!
    Runemaster uses Blast of Fury!
    THE HEXAGON CONNECTS AGAIN! COMBO POOOWWWEER BLLAASSSTTT
    Different color hexagons create a different kind of combo (power up, an attack, ect)

    Also, speaking of Hexagons...
    A HEXAGON SKILL TREE!!! Just like FFX with their sphere tree.
    BUT WITH HEXAGONS!

    HEXAGONS! YOU GET HEXAGONS! YOU GET HEXAGONS! YOU ALL GET HEXAGONS!!!
  10. Jabn

    Jabn Active Member Senior Member

    Local Time:
    10:21 AM
    I have found what the new design for the characters should be ......
    New character design?

    [​IMG]
  11. Pompeii

    Pompeii Active Member Senior Member

    Local Time:
    4:21 PM
    Oh my God, I love you guys. I laughed so much. :)

    So I tried whipping up a quick set of HP and MP bars with hexagons in an Infamous type fashion. The bars (squiggles) will fill from left to right to indicate the precise amount of HP/MP. The hexagons would fill every time two sides of the squiggle filled and would represent some larger amount of HP/MP like 20.
    IB_HUD_02.png
  12. Jabn

    Jabn Active Member Senior Member

    Local Time:
    10:21 AM
    Damn, I really think that could look amazing ...
    calmchaos likes this.
  13. Unspecified

    Unspecified Active Member Senior Member

    Local Time:
    10:21 PM
    Ah okidorki :3 If you have some samples I can look at so I can keep to your theme, would be nice if you could send/show :3
    It'll be easier to make icons and so on C:
  14. Xarandele

    Xarandele Well-Known Member Senior Member

    Local Time:
    1:21 PM
    Refer to the Xarandele's Big Bangin UI Update Thread.
  15. Unspecified

    Unspecified Active Member Senior Member

    Local Time:
    10:21 PM
    ha, okidorki :3 ty
  16. Siegfre
    • Staff / Administrator

    Siegfre [IridiumBased] President Staff Member

    Local Time:
    1:21 PM
    I like a lot of the ideas in this thread, the designs are looking great.

    In particular I think sticking with percentages for bars is the way to go. This would go really well with potions, and effects that specifically affect a certain percentage of your health/stamina/sp.

    Blade and Soul's combo display is good primarily due to the fact that it shows you what you need to do only and exactly when you need to do it. You do three standard attacks, and the display shows you your two combo options, and what key needs to be pressed to execute each one. Then it disappears, no need to clutter the screen with unnecessary information.

    I'm not sure that the SP hexagons are necessary, as that makes the SP essentially just charges. And if it is to just be charges, why not just place a small number and icon next to the health bar indicating the remaining charges? I think charges may be a good way to handle SP, although it's essentially the same system as before just scaled down to make it more interesting.

    As for the UI's themselves. I think the different varieties are great way to see the pros and cons of different approaches.
  17. Ovan

    Ovan Active Member Senior Member

    Local Time:
    4:21 PM
    Really like this in game UI/HUD. Looks very professional even if it isn't meant to be serious.
  18. Raleigh

    Raleigh Active Member Senior Member

    Local Time:
    4:21 PM
    These are looking really cool. The brightness of it is giving me a feeling of TERA, which is awesome. I would definitely like seeing these or something like these in the game. ;)
  19. NiuWang

    NiuWang Well-Known Member Senior Member Backer

    Local Time:
    1:21 PM
    Looks suprisingly good.

Share This Page

  • Facebook