Spectator-UI Ideas

basti1337basti1337 Join Date: 2011-05-13 Member: 98538Members
Hello guys!

In NS2HD's latest videos he talked about spectator-mode feedback from the community and how the spectator system should be improved for the release of NS2 (<a href="http://www.youtube.com/watch?v=v7voaNKd0GM#t=7m10" target="_blank">http://www.youtube.com/watch?v=v7voaNKd0GM#t=7m10</a>). With the current spectator mode it is very hard to always be in the right spot with your camera and the minimap is not always showing what is going on with the tech of both teams and this is very frustrating for your spectators if you are casting a match. I know that, because I have also casted some clanmatches in the past months.

The main missing feature is probably the first person view and a directed camera mode, but beside this I wanted to share some GUI ideas with you.

So I gathered some ideas and made a <u>quick, little</u> sketch to show you:
<img src="http://img593.imageshack.us/img593/5908/spectatorui2.jpg" border="0" class="linked-image" />


Explanation:

-- Top-Menu
Here you can see the players of both teams, player/team resources and the current gametime and map. This is similar to the dota2 top menu where you can see the player hero avatars... I think its the best way to show all informations about the players and the current round you need in a very tiny space.
The players are being displayed by their current role / weapon selection (commanders are referenced by a commandstation or a hive). So when they switch to another role/weapon, the icon will also be changed. You could additionally display their hitpoints with a small (colored) bar below the playerbox. Displaying the playernames is something which I would not do. As you can see there are also some small icons showing the current upgrades of each player. I don't know if these icons are too small but making them bigger would cause them to hide the main player icon. I've also added a death time indicator which is overlaying the player icon.
In the center of the top menu you can see the current gametime (now its placed in the score board which doesn't make much sense) and also the map name. The current teamresources are also shown here. If you want to also add the killstats to this position, I'd say to move the maptime/name to the bottom of the screen and align the res/kills stats in a better way.

-- Tech-Locations
In the bottom right area of the screen you can see the techpoints locations. Its showing all available tech locations of the map at the same time. If there is no hive/commandstation on a specific location the little box is left blank (or you could just hide it). Every built up techpoint has some more indicators on it showing the current hitpoints, the egg/IP count or the chosen tech tree of a hive. Techpoints which are being build are greyed out and the build percentage is also shown.

-- Minimap
With the current minimap there are some problems. You can cycle through three states: no minimap, the minimap in the bottom left corner or the full map in the center of the screen. In my opinion it shouldn't be possible to hide the minimap completely and I also think that the smaller minimap is a little bit too small. So two different toggles should be implemented: one for changing the minimap size and one for hiding the minimap and tech-locations to get a clear screen.

-- Screen resolutions and aspect ratios
While designing a GUI you have to make sure that everything runs well on different screen resolutions and aspect ratios. I know that there are many improvements which can be done to my little sketch, eg. reducing the weight of the tech-locations (size, opacity, colors, saturation) or the minimap. But despite this I think it a good start, because the complete GUI also fits well on screens with a smaller aspect ratio (4:3).


I'd love to know what you think of my ideas and also what you would do in a different and/or better way.

Comments

  • IeptBarakatIeptBarakat The most difficult name to speak ingame. Join Date: 2009-07-10 Member: 68107Members, Constellation, NS2 Playtester, Squad Five Blue, NS2 Map Tester, Reinforced - Diamond, Reinforced - Shadow
    edited March 2012
    I think it looks pretty awesome. It just needs a toggle spectator hud button for times when you want to hide it for some sweet screens. Other than that it gives a great amount of information and displays it so it's easy to read. Names are important for spectating so they would need to be displayed somewhere, like below the icons in a confined space.

    If it could ever be interactive it would be cool if you could press a key and bring up the mouse to click on a box and spectate it immediately, like a tech location or player.
  • AsranielAsraniel Join Date: 2002-06-03 Member: 724Members, Playtest Lead, Forum Moderators, NS2 Playtester, Squad Five Blue, Reinforced - Shadow, WC 2013 - Shadow, Subnautica Playtester, Retired Community Developer
    I think the top bar is quite good.

    The right bar though i'm not so happy with. I don't think you need to list every hive/CC location. Just the number of hives, CCs and RTs for every team would be enough. You can see where they are on the minimap easily enough.
  • swalkswalk Say hello to my little friend. Join Date: 2011-01-20 Member: 78384Members, Squad Five Blue
    Great idea, all that information is very useful to help understand the current situation.
    This should be forwarded to the new UI Artist.
  • WilsonWilson Join Date: 2010-07-26 Member: 72867Members
    I like it, could use Health % of each player as well.
  • basti1337basti1337 Join Date: 2011-05-13 Member: 98538Members
    <!--quoteo(post=1915457:date=Mar 20 2012, 04:57 PM:name=Asraniel)--><div class='quotetop'>QUOTE (Asraniel @ Mar 20 2012, 04:57 PM) <a href="index.php?act=findpost&pid=1915457"><{POST_SNAPBACK}></a></div><div class='quotemain'><!--quotec-->The right bar though i'm not so happy with. I don't think you need to list every hive/CC location. Just the number of hives, CCs and RTs for every team would be enough. You can see where they are on the minimap easily enough.<!--QuoteEnd--></div><!--QuoteEEnd-->

    But you would not be able to see the hitpoints in case of a baserace, so a display for each location is important imo
  • DarkOmenDarkOmen Join Date: 2002-11-05 Member: 7148Members
    edited March 2012
    I like the idea of the right-side tech location indicators, but the particular order that you have the indicators listed in doesn't seem particularly useful to me. How about displaying tech locations on the bottom with the same sorting as per the top bar, as in marines on the left + aliens on the right?

    <!--coloro:#00BFFF--><span style="color:#00BFFF"><!--/coloro-->[CC: <b>Data Core</b>]<!--colorc--></span><!--/colorc--><!--coloro:#696969--><span style="color:#696969"><!--/coloro--> .......... [<b>Crossroads</b>] [<b>Atrium</b>] .......... <!--colorc--></span><!--/colorc--><!--coloro:#FF8C00--><span style="color:#FF8C00"><!--/coloro-->[Hive: <b>Flight Control</b>] [Hive: <b>Sub Access</b>]<!--colorc--></span><!--/colorc-->

    Everything else looks excellent, though I also agree that player names would be important to display. This isn't DOTA where you have one player of each class; we have multiple unique skulks, etc. that must be called by their proper names in order to confer what the team is properly doing. I also agree that some kind of health indicator is also very important. Could we maybe colour the players' images with about a 40%-50% solid colour overlay with hue according to their current health (green > yellow > red, etc.)?

    Very nice work!

    EDIT: Also, the minimap is slightly too small IMO and could be increased in size by about 15% or so.
  • basti1337basti1337 Join Date: 2011-05-13 Member: 98538Members
    <!--quoteo(post=1915589:date=Mar 20 2012, 10:39 PM:name=DarkOmen)--><div class='quotetop'>QUOTE (DarkOmen @ Mar 20 2012, 10:39 PM) <a href="index.php?act=findpost&pid=1915589"><{POST_SNAPBACK}></a></div><div class='quotemain'><!--quotec-->I like the idea of the right-side tech location indicators, but the particular order that you have the indicators listed in doesn't seem particularly useful to me. How about displaying tech locations on the bottom with the same sorting as per the top bar, as in marines on the left + aliens on the right?

    <!--coloro:#00BFFF--><span style="color:#00BFFF"><!--/coloro-->[CC: <b>Data Core</b>]<!--colorc--></span><!--/colorc--><!--coloro:#696969--><span style="color:#696969"><!--/coloro--> .......... [<b>Crossroads</b>] [<b>Atrium</b>] .......... <!--colorc--></span><!--/colorc--><!--coloro:#FF8C00--><span style="color:#FF8C00"><!--/coloro-->[Hive: <b>Flight Control</b>] [Hive: <b>Sub Access</b>]<!--colorc--></span><!--/colorc--><!--QuoteEnd--></div><!--QuoteEEnd-->
    You mean like the controlpoint-mode hud in TF2?
    <img src="http://www.rambase.ro/site/system/files/images/tf2_contol_point_capture.jpg" border="0" class="linked-image" />
    Yes, I also thought about this. But a problem could be the minimap. Its a large element of the hud and you don't want it to be in the center of your screen. So you have to scale the minimap down a little bit and this will be an information loss.


    <!--quoteo(post=1915589:date=Mar 20 2012, 10:39 PM:name=DarkOmen)--><div class='quotetop'>QUOTE (DarkOmen @ Mar 20 2012, 10:39 PM) <a href="index.php?act=findpost&pid=1915589"><{POST_SNAPBACK}></a></div><div class='quotemain'><!--quotec-->Everything else looks excellent, though I also agree that player names would be important to display. This isn't DOTA where you have one player of each class; we have multiple unique skulks, etc. that must be called by their proper names in order to confer what the team is properly doing. I also agree that some kind of health indicator is also very important. Could we maybe colour the players' images with about a 40%-50% solid colour overlay with hue according to their current health (green > yellow > red, etc.)?<!--QuoteEnd--></div><!--QuoteEEnd-->
    I have added health bars with player names in it to the bottom of the player boxes. This seems to be the best solution...


    Here you can see the hud in different aspect ratios:

    16:9
    <img src="http://img26.imageshack.us/img26/2926/spectatorui3.jpg" border="0" class="linked-image" />

    5:4
    <a href="http://img808.imageshack.us/img808/3553/spectatorui354.jpg" target="_blank"><img src="http://img808.imageshack.us/img808/3553/spectatorui354.th.jpg" border="0" class="linked-image" /></a>

    4:3
    <a href="http://img594.imageshack.us/img594/8272/spectatorui343.jpg" target="_blank"><img src="http://img594.imageshack.us/img594/8272/spectatorui343.th.jpg" border="0" class="linked-image" /></a>
  • nUfl0wnUfl0w Join Date: 2005-02-25 Member: 42412Members
    edited March 2012
    I really like it!
    I dont think the techpoint stuff should be done in the ts2 way. Just consider the case where rines start in atrium, build a base in dc, lose atri, but survive in dc. Then all the order wont work anymore.
    Other than that I think it is a little too comic style, I mean the colours. The orange and blue. But thats just personal opinion.
    Very good work!


    EDIT
    One question that just came to my mind is: This kind of hud will be visible while you are in third person view, right? So for first person we will just see the persons hud? How about the game indicators. Those wouldnt be shown in the normal first person view, so I guess they is a need for a second first person view that combines the game informations with the normal hud. But maaaaybe I am just getting all wrong :p.
  • basti1337basti1337 Join Date: 2011-05-13 Member: 98538Members
    <!--quoteo(post=1915716:date=Mar 21 2012, 04:15 AM:name=nUfl0w)--><div class='quotetop'>QUOTE (nUfl0w @ Mar 21 2012, 04:15 AM) <a href="index.php?act=findpost&pid=1915716"><{POST_SNAPBACK}></a></div><div class='quotemain'><!--quotec-->Other than that I think it is a little too comic style, I mean the colours. The orange and blue. But thats just personal opinion.<!--QuoteEnd--></div><!--QuoteEEnd-->
    Yes, you are right, but these are just little dirty sketches for the purpose of a spectator UI layout. I'm not an artist (in fact I'm a programmer, but I don't have the time to create a customization of the current spectator ui, maybe someone else can do?) and so I just used some textures of NS2 which will represent both teams most (marine weapon-hud and the alien evolve menu background).

    <!--quoteo(post=1915716:date=Mar 21 2012, 04:15 AM:name=nUfl0w)--><div class='quotetop'>QUOTE (nUfl0w @ Mar 21 2012, 04:15 AM) <a href="index.php?act=findpost&pid=1915716"><{POST_SNAPBACK}></a></div><div class='quotemain'><!--quotec-->One question that just came to my mind is: This kind of hud will be visible while you are in third person view, right? So for first person we will just see the persons hud? How about the game indicators. Those wouldnt be shown in the normal first person view, so I guess they is a need for a second first person view that combines the game informations with the normal hud. But maaaaybe I am just getting all wrong :p.<!--QuoteEnd--></div><!--QuoteEEnd-->
    Whats the reason for using a different hud in first person spectator mode in your opinion? I think it fits well in both 3rd and 1st person views. Or do you have any other ideas for the hud elements?
  • DarkOmenDarkOmen Join Date: 2002-11-05 Member: 7148Members
    I like the changes that you made, basti! Another thing: wouldn't it be cool to have the two commanders sort towards the center of the top bar? That way, their names appear next to TR and such, plus you can easily see which commanders are facing off, etc. Beyond that, I'm at a loss at this time for any new ideas.
  • RisingSunRisingSun Rising California Join Date: 2004-04-19 Member: 28015Members, Constellation, Reinforced - Shadow, WC 2013 - Shadow
    Adding on to this would it be possible to have a "Broadcaster view" and a "Audience view". Much like a TV studio, there is a main control room that sees everything and has a BUNCH of info so they know where and when to switch too. The audience is clueless but sees the near seamless transitions and enjoys missing little to no action.

    Broadcaster view:

    Player info read out - Life, Res, and Weapon.
    Mini map gives the position.
    One touch to switch to the players cam.
    One touch to switch to a preset area cam.
    This view wouldnt have to look pretty but would get the job done. Maybe have a dual monitor support would make this easier.

    Audience view:

    So far what you have is pretty nice. The suggested TF style hive health and CC health would be nice. Each tech point shown with a color indicator of which team holds it. For this view i would really look into MMO layouts. Those games force players too keep track of a lot of information but still be able to function. Specifically healers.

    Awesome mod though. One of my major gripes of watching NS was the broadcaster is always playing catch up and cant keep the camera still. The above "BV" Might give them enough information to really give a professional looking presentation without ESP. Not to mention being able to split the screen and show two action packed frames? Not sure if all this could be coded but throwing it out there.
  • Tool8Tool8 Join Date: 2012-01-01 Member: 139405Members
    I would prefer to see the hive/cc and tech information on the scoreboard for spectators instead of having it on the screen all the time. This way spectators and people who do livestreams can look things up if they want to, but it doesn't block the view all the time
  • JowJow Join Date: 2011-06-23 Member: 106032Members
    Assuming the skycam will become the main camera mode when spectating.

    Have a lot of info, like team res nodes, some player portraits with their evolution/equips in picture form and health/armour etc arranged around the screen on the skycam, with drop down menus showing some statistics like different in res earned, kills, territory or w/e similar to DotA 2.

    Then if you go into third person it will clear all the stuff off the screen in order to give a good few of the action, first person gives true player perspective with their HUD and everything.

    Also maybe have pre set up third person cameras in room that you can quickly switch to rather than having to position every time.
  • basti1337basti1337 Join Date: 2011-05-13 Member: 98538Members
    <!--quoteo(post=1919416:date=Mar 29 2012, 06:29 PM:name=Jow)--><div class='quotetop'>QUOTE (Jow @ Mar 29 2012, 06:29 PM) <a href="index.php?act=findpost&pid=1919416"><{POST_SNAPBACK}></a></div><div class='quotemain'><!--quotec-->Then if you go into third person it will clear all the stuff off the screen in order to give a good few of the action, first person gives true player perspective with their HUD and everything.<!--QuoteEnd--></div><!--QuoteEEnd-->
    I think the top menu should be visible at all times... During my playtests in CS:GO I can tell, that a top menu isn't distracting your "good action" view.

    <!--quoteo(post=1919416:date=Mar 29 2012, 06:29 PM:name=Jow)--><div class='quotetop'>QUOTE (Jow @ Mar 29 2012, 06:29 PM) <a href="index.php?act=findpost&pid=1919416"><{POST_SNAPBACK}></a></div><div class='quotemain'><!--quotec-->Also maybe have pre set up third person cameras in room that you can quickly switch to rather than having to position every time.<!--QuoteEnd--></div><!--QuoteEEnd-->
    You mean as entry point when you switch from first person view to free camera view? This could be a little bit confusing when the camera suddenly switchs to another location and view angle during combat. Maybe as a entry point for the free look camera mode when you switch the map location by pressing a button.
  • DarkDraithDoomDarkDraithDoom Australia Join Date: 2013-10-10 Member: 188652Members
    edited October 2013
    We think a like basti1337!! This UI is something that would be very useful for spectator AND EVEN commanders.

    The only thing I found was Insight.jpg a bit small. But it was the only pic I could find.

    I've seen different variants of this UI on youtube. But my spectator mode doesn't look like this. Any ideas?

    Cheers,
Sign In or Register to comment.