[1879] Design Mockup for Improvements to the Nameplate | Voters

[1879] Design Mockup for Improvements to the Nameplate

Felinusfish

I spent some time working with the the folks in the Open Beta Discussion channel to create something that felt more "at home" compared to the current design, with improvements to the readability and overall design of the nameplates.

2 days ago

anxiouspanda

The group banner shouldn't be covered up by ANYTHING at ALL TIMES.

NiƖƖy-San

Better than what we have, but no, The whole hud being rounded is just a horrible idea, it does not work in a 3D SPACE AT ALLLLL

majorvictory

An icon got lost in this update, the Interaction status icon is gone now. It's an icon that shows whether or not a person has physbone and contact interaction enabled, it shows up as a yellow hand, or a white hand with a red line through it.

More than once have I diagnosed a problem with interactions because someone had them disabled and didn't know it, but one look at the nameplate told me.

Jakhexz

This looks bad
if you're going to make this put the Icons in the bottom right, below the paied theme logo.
Still think the 2020 nameplates were the best btw

Teflo

This feels like a refinement of the current re-design, it’s quite tasteful in the layout and typography. I’m not sure about the status, it feels a bit intrusive to a degree, particularly with longer statuses. I do see that some individuals would expect the status to be present though. Short statuses work well with the redesign, whilst longer statuses can feel visually intrusive. That being said, it’s not something simple to resolve.
I’d like to see this design at various distances, considering that this is a 2D element in a 3D space where readability is essential. Due to the resolution of VR across a range of headsets, it’s essential that key identifiable elements like name and avatar remain clearly visible. You may have some trouble with the font that you’ve picked there. You may want to increase the weight of the font as at a distance, as it may start to flicker. The avatar is also something that’s clearly visible and holds essential weight within the design, which is important considering it’s typically one of the most identifiable aspects at a distance.
The golden name for friends is a VRC classic, and for good reason, it’s arguably one of the easiest things to identify at a distance whilst in VR and sets a user apart in a crowd of nameplates. However, it also means that colours like orange, yellow, gold itself, and potentially even light shades of brown could make the text unreadable. 
Considering that users were getting close to the gallows when the gold usernames were removed, it would be advisable to test it with a series of gradients, with having the ‘hero’ gradient colour on the right (e.g. gold) and then towards the left, having a standardised gradient, fading the colour out. I’d recommend experimenting with different types of gradients and more difficult colours, like neon, pastel, and ones closely related to the golden text itself.
Keep in mind that whilst cheap for a singular nameplate, scaled up to 50 or so nameplates, effects typically used within UI design can become computationally expensive. I’d recommend minimising the amount of effects you’re using within the design to maintain performance.
I’d say overall this is a worthwhile improvement to the existing re-design, whilst maintaining the minimalist feel the developers were aiming for, whilst also keeping monetisation elements clearly identifiable but non-intrusive. It is significantly better than many of the other UI mockups that I’ve seen by other individuals. Nicely done.

Felinusfish

Teflo
> You may have some trouble with the font that you’ve picked there. You may want to increase the weight of the font as at a distance, as it may start to flicker.
The weights are identical to VRChat, the only change made was to the size of the username and the size of the avatar, shrinking them both very slightly to better suit the nameplate and refine the visual identity :)

Teflo

Felinusfish
That’s fair enough, I’d still say it’s a good idea to test it at a distance and see whether the username remains readable, particularly at the lower resolution that the game operates at on platforms like the Quest. 
I’d say experiment with it and see if it looks off with a larger weight, if it doesn’t look off, then there’s inherently no reason for it to not have a larger weight considering it’s the primary focus on the nameplate.

Felinusfish

Teflo This is definitely up to the VRChat developers to figure out, as I don't have the ability to actually check if the nameplate works in the first place

Teflo

Felinusfish
Ah yes, that’s completely understandable.
If you’re okay with using them, you could use an LLM to have it whip up an emulator in WebGL for you. You can then export the design mockup as an SVG, and have it be displayed at a variety of distances. You can then add things like the infamous screen door effect (for certain headsets), different resolutions, adding a slight blur, etc. You’re also able to add a variety of backgrounds to test readability against them to see how your design performs
If you really want to go all out, you could have it where it supports WebXR, but this is additional work and not really necessary for the design process, a simulated environment is enough to work from and attain valuable feedback. 
That being said, keep in mind of FOV of your emulated camera, it’s hard to quantifiably come up with a solution for what your emulated camera FOV should be, but in general, objects will appear larger than they actually are.
It would not be 1:1 to Unity, but it would provide a valuable simulator of what it may look like in a VR environment.

ひょなb

literal perfection! it’s an improvement, not a redesign. perfectly fits in the new UI!

AtTheCafe

The amount of people who like these concepts in the discord beta discussion chat is crazy. 
Y'all need to hire this dude. If I was an investor in VRC I'd ask you to fire whoever you've got and hire this Van Gogh of design concepts. 
These are way better than what you've all made. Tenfold. 
This concept with the yellow names has to be my favorite so far. Still don't like the profile decor, but thats another issue.  Everything about this looks great 
To add on the profile decor, it can make the nameplate harder to read so that needs to be a heavy consideration so possibly outlining the names could help greatly or, adding a heavy drop shadow to the text would be great.

Felinusfish

Here is a rough estimate of what the original nameplate looks like, for comparison. Note that this isn't accurately representative, and only "as close as it gets" for me trying to recreate it in a design program without the original.

Photo Viewer

Photo Viewer