New HUD/Interface Suggestions

Discussion in 'Garry's Mod: Flood' started by Dr. Pit Lazarus, Mar 2, 2015.

Thread Status:
Not open for further replies.
  1. Dr. Pit Lazarus

    Dr. Pit Lazarus Angelic Web Developer Gold VIP

    Joined:
    Aug 12, 2014
    Messages:
    463
    Likes Received:
    229
    Main thread for everything HUD and interface related
    ~~~==Updated Information==~~~
    Latest HUD updates will be posted up here.

    spawn menu......................blueprinting
    HUD(health, ammo, etc.).....blueprinting
    Scoreboard....................................???
    Player info(weaps, achieves)............???
    >>LATEST spawn menu
    [​IMG]
    >>old-Horizontal tabs with recolour
    [​IMG]
    >>old-Recoloured original
    [​IMG]


    ~~~==Original Post==~~~
    So I was thinking about making the Q menu a bit more unique and this is what I came up with. The idea is to make the Q menu simple, organised, and user-friendly. I didn't complete all of the tabs as I wanted to check if the community was okay with it before I put too much effort into this. Note that I am welcome to your thoughts and ideas, and this is a rough draft. In case if you are wondering, I used Adobe Illustrator cs6.

    DPL_qmenu_main.png
    Added now playing section at the bottom-left.
    DPL_qmenu_servers.png Adding a Servers tab in the Q menu will free the F4 key that might be used for something else or to toggle the Q menu (instead of holding down the q key the whole time.. just an idea).
    DPL_qmenu_staff.png
    A convenient, organised way for players to check and contact staff.

    As for the main HUD, I have no ideas at this time.
     
    Last edited: Mar 14, 2015
    #1
    • Like Like x 4
  2. Dr. Pit Lazarus

    Dr. Pit Lazarus Angelic Web Developer Gold VIP

    Joined:
    Aug 12, 2014
    Messages:
    463
    Likes Received:
    229
    Your likes are greatly appreciated, but do you guys have any comments on this?
     
    #2
  3. Firedraft

    Firedraft Devine Member Silver VIP

    Joined:
    Nov 21, 2014
    Messages:
    703
    Likes Received:
    120
    More color? Just my opinion
     
    #3
  4. Dr. Pit Lazarus

    Dr. Pit Lazarus Angelic Web Developer Gold VIP

    Joined:
    Aug 12, 2014
    Messages:
    463
    Likes Received:
    229
    That can be done later as it is just aesthetic. What I'm asking is what can be done to improve it. Do the tabs need to be resized/repositioned? Do the tabs need to be merged/separated with other categories? New features in the q menu?
    After you guys approve of the layout, then you may suggest aesthetics and other things.
     
    #4
  5. The Real Slim Shady

    The Real Slim Shady Member

    Joined:
    Feb 28, 2015
    Messages:
    1
    Likes Received:
    0
    Looks much too clunky. Repositioning the tabs to the top and making them smaller would make it much better. Some colour would be nice as well.
     
    #5
  6. Decap

    Decap Super Radman

    Joined:
    Jul 9, 2014
    Messages:
    3,049
    Likes Received:
    881
    I don't like the bold text or the font used. A darker background with a light font like we have here on the forums would look better. Nice addition of the 'Now Playing' tho. The design looks pretty good but could use some tweaks here and there.
     
    #6
  7. Dr. Pit Lazarus

    Dr. Pit Lazarus Angelic Web Developer Gold VIP

    Joined:
    Aug 12, 2014
    Messages:
    463
    Likes Received:
    229
    Adjusted colours, looks more appealing and sleek. Colours for active tab text, unactive tabs text, description text, etc. should be suggested. Fonts are just placeholders, actual fonts should be suggested. After making the horizontal version, the original does look bulky. In favour of horizontal version.

    Recoloured original
    DPL_devinity_qmenu_ecolour1.png
    Horizontal tabs with recolour
    DPL_devinity_qmenu_smhoriztab1.png
     
    #7
    • Like Like x 1
  8. Decap

    Decap Super Radman

    Joined:
    Jul 9, 2014
    Messages:
    3,049
    Likes Received:
    881
    This one looks great. The other one looks good too, but this one gives more space for props and whatnot. Good job Pit!
     
    #8
    • Like Like x 1
  9. Donkie

    Donkie Founder & Senior Developer Platinum VIP

    Joined:
    Jun 2, 2014
    Messages:
    904
    Likes Received:
    661
    Discord:
    Donkie#2878
    Gradients are old, don't use them that prominently.

    Should this cover the whole screen or wot?

    Also try it with this font: http://www.fontsquirrel.com/fonts/arimo

    The colors we use are (RGB):
    Devinity Green™: 148,204,75
    Dark Gray: 40,40,40

    Also I specifically said that we don't need a new Q-Menu at the moment, a HUD has higher priority. I don't understand how you guys can mix up HUD and QMenu and Scoreboard and what not.
     
    Last edited: Mar 7, 2015
    #9
    • Like Like x 1
  10. Dr. Pit Lazarus

    Dr. Pit Lazarus Angelic Web Developer Gold VIP

    Joined:
    Aug 12, 2014
    Messages:
    463
    Likes Received:
    229
    Donkie prefers the vertical layout.
    -Removed gradients, changed font, and fixed colours.
    The Qmenu was the first idea I had in mind. I'm not sure what we want for the HUD. :/
     

    Attached Files:

    #10
  11. Donkie

    Donkie Founder & Senior Developer Platinum VIP

    Joined:
    Jun 2, 2014
    Messages:
    904
    Likes Received:
    661
    Discord:
    Donkie#2878
    Looks a lot better imo
    What's good about the current Q-menu is that it's slightly transparent and doesn't take up much space so you can still see what's going on while having it open. Anything that can be done about that?
    Also the design turned too simple without the gradients, while I don't want you to readd the gradients, perhaps find something else to add?
     
    #11
  12. Dr. Pit Lazarus

    Dr. Pit Lazarus Angelic Web Developer Gold VIP

    Joined:
    Aug 12, 2014
    Messages:
    463
    Likes Received:
    229
    After talking with Donkie about the spawn menu, this is where I stopped at for today. Still need to add design to the right side and the icons may need to have the colour changed. Now I like this layout than the horizontal one. I realized that the horizontal layout may have too much space for props.
    We also need suggestions for the HUD (the main interface in-game; health, ammo, money/cash, phases/timer, etc.). What are ideas/theme are we looking for?
    [​IMG]
    Transparency!! Wooo!!! <(^.^<)<(^.^)>(>^.^)>
     
    #12
    • Like Like x 3
  13. Donkie

    Donkie Founder & Senior Developer Platinum VIP

    Joined:
    Jun 2, 2014
    Messages:
    904
    Likes Received:
    661
    Discord:
    Donkie#2878
    ( ͡° ͜ʖ ͡°)
     
    #13
  14. Decap

    Decap Super Radman

    Joined:
    Jul 9, 2014
    Messages:
    3,049
    Likes Received:
    881
    #14
  15. Dr. Pit Lazarus

    Dr. Pit Lazarus Angelic Web Developer Gold VIP

    Joined:
    Aug 12, 2014
    Messages:
    463
    Likes Received:
    229
    I really don't know what to do for the HUD... so I tried a minimal look. :/

    The bars under the health and ammo deplete correspondent to the amount of hp and ammo in one clip... whatever... I need input.
     

    Attached Files:

    #15
  16. Bayrock

    Bayrock Founder & Developer Staff Member Founder

    Joined:
    Jun 2, 2014
    Messages:
    1,532
    Likes Received:
    661
    Discord:
    Bayrock#2940
    Outstanding effort @Dr. Pit Lazarus. I especially like the spawn menu redesign and think the minimalistic HUD could have some merit.

    Keep it up!
     
    #16
  17. Decap

    Decap Super Radman

    Joined:
    Jul 9, 2014
    Messages:
    3,049
    Likes Received:
    881
    Try the HUD with different colors & fonts, maybe use the one Donkie suggested above?also see about adding a prop limit counter. (ie: 6/16 Props Used) Good job tho, keep it up!
     
    #17
  18. Dr. Pit Lazarus

    Dr. Pit Lazarus Angelic Web Developer Gold VIP

    Joined:
    Aug 12, 2014
    Messages:
    463
    Likes Received:
    229
    The font is set to the one Donkie suggested. Made the HUD even more minimal by hiding unneeded elements such as cash total during battle phase.
    +Added prop counter for battle (total hp percentage and live props/total), expanded the bars, added dark outlines to icons because it blended in with the ground (build), added prop limit status in build.
     

    Attached Files:

    #18
  19. Decap

    Decap Super Radman

    Joined:
    Jul 9, 2014
    Messages:
    3,049
    Likes Received:
    881
    Will that clock next to the timer actually move with the time or is that just an icon? I don't like the color of the box, doesn't go well with the other colors imo.
     
    #19
    • Like Like x 1
  20. Dr. Pit Lazarus

    Dr. Pit Lazarus Angelic Web Developer Gold VIP

    Joined:
    Aug 12, 2014
    Messages:
    463
    Likes Received:
    229
    It can be... it's up to Donkie, I guess. -shrugs-

    HUD
    +Changed colour of prop box icon and speaker
    *Maybe have the timer icon bink on certain intervals, like 1min, 30s, 10s left
    -Might try to get a different layout... :/
    -Does everything have to be arimo font Donkie lol
    SPAWN MENU
    +Added shadow between tool and properties
    +Added indicator for individual prop limit; shows how many props are spawned; when limit reached, text turns red (outline is placeholder)
    +Added colours to icons

    Last attach is a spawn menu comparison for a 1080p resolution screen, may need to be resized. 1080p image by Donkie.
    Does the scoreboard and player info need to be redesigned as well?
     

    Attached Files:

    Last edited: Mar 14, 2015
    #20
    • Like Like x 1
Thread Status:
Not open for further replies.