Login screen 2.0

[rupl]

In #31 I did all the absolute basics to qualify this as a website. But the login screen is still lacking, especially once #68 goes in, which makes the post-login UI hella slick compared to my previous efforts at designing the controls.

@afragon you said you or someone was up for designing the login. Can you direct them to this issue so we can start the discussion?

I have a few things that are only in my head so I oughta just list them here to be considered:

New logo

I should have done this ages ago, but I want to make the logo in bustashape. We can save SVGs now so there's no excuse not to. I would like to take a crack at this, but if someone creates a great logo we can use it.

Normally one, but possibly two inputs

The "name" field is currently suppressed. I didn't remove it during Vetfest, only hid it from view. In general it will stay that way but I can imagine there could be a few scenarios where requiring a name would be fun (e.g. if you only get one single shape and you are the sole controller of it. Adding names to the elements could be fun).

Advanced config

The two inputs of username + room name should be the only required input ever. The rest of it will be hidden behind some sort of button or very discrete link which unlocks all the fancy options. None of these exist yet as config; currently I have to change the hardcoded settings and redeploy the site. Some examples:

• Color palette — we would just show names. A band of colors would be nice, but adding HTML into a <select> is no-go. So lets keep it simple and name the palettes with fun names like Autumn, Sunset, Neon, etc.
• Flags — ability to turn config for each aspect on/off, e.g. disable changing of mix-blend-mode or disabling opacity control. These alone can allow us very flexible yet robust ways of "art directing" a particular bustashape canvas, causing people to inadvertently collaborate on a cohesive art piece.
• Globals — canvas background color falls into this category. Can't think of another at the moment.
• Modes — I need to file a separate issue for this, but I want to expose various modes (not Blend Mode, which is a Flag) which override any individual setting and set up the canvas in special ways, most likely through an include system which will plugin to some sort of hook system that doesn't exist yet. The "UV Laser mode" I mentioned falls into this category. It customizes color palette, touch events, and the UI itself. Modes are where it's at I think. Completely forces people into a corner so they just create instead of configure.

  Design constraints

Fit everything on iPhone 5 screen. It would be extra convenient for me to not have to disrupt all the scroll locking I've done. We can totally move words or put them at the bottom. Make the logo a bit smaller, etc.

[rupl]

I just happened upon this UI pattern while checking out https://rollcall.audio — very nice way to present the same two options that we give to our users:

Join the party could (once we have #55 resolved) dump you into the most popular room.

Create new room doesn't have to be changed much. We already put people in a semi-random room when no input was given using a pre-determined list of room names that is sufficiently large for our current volume of traffic (nobody). The rollcall site creates a random string as a room, and while that's simple/safe from a dev perspective, I quite like being able to name the room you want to use. It gives the URLs a more human feel.