4

I have an app in which users add items to a database that is synced across all devices. I need users to login in order to attach an author to each item and to record how many "points" each user has accumulated. Right now my login form looks like this:

Current form

When they press the "Off" toggle button, the "Register" button becomes clickable, but this system is confusing to my users.

Given the way the system works, my users only need a unique username, they don't need a password or anything else. The username is checked against a cloud database to make sure it is unique, and I want users to be able to use the app without picking a name.So having separate "Login" and "Register" forms seems ridiculous, I have already read this question, but the thing is, in this case, registration doesn't require extra information, it just requires a different script to run. Is there a clean, easy to understand way to do this?

4

Wow, what a pleasantly different experience. Unfortunately, this user scenario puts you at odds with just about every login/register experience on the web.

This means you'll be fighting a unique UX battle if you don't go with the industry-standard process, which separates login and registering. As is always said, don't reinvent the wheel.

I would recommend giving the user the choice at the start of the process:

LOGIN || REGISTER

Clicking one or the other would display the form field, the "off" option and a Submit button.

This makes the journey very logical and clear for the user:

  1. User decides whether they are logging in or registering. You could start with the Login selection opened by default and the register option as a second tab option
  2. User enters related registration information
  3. User chooses the state of the item
  4. User confirms choice

With your screenshot above, the journey could be:

  1. User sees form field, but is unclear what to put. If they are new, they do not realise they can enter a username without a separate registration.
  2. User sees the off button.
  3. User sees the "Register" button. Now they realise they can register on this page and move back to Step 1.
  4. User is at Step 1. and enter their information
  5. User moves to click register button

EDIT: I'm working on the assumption that once logged in, you will no longer see this option on future actions.

1

Since there is no actual authentication of credentials to access the system, you don't need to have a "login" form and a "registration" form (quotes because you're saying there are no user accounts).

If users submit content only occasionally, you can do away with the separate screen altogether and just prompt them for their name/username/e-mail in the content submission form.

If users submit content fairly often, asking them for their name/username/e-mail will be an annoying, repetitive step. Then you can create a simple welcome screen for first-time user experience like below and move the editing feature of the field into app settings (add a property called Username).

Edit

Since the comments revealed that users should be able to use the app anonymously, I added the anonymous access button. The copy of the welcome message and button labels should be tested with actual users for clarity and ease of use.

mockup

download bmml source – Wireframes created with Balsamiq Mockups

  • Users do in fact add items rather frequently, it does authenticate their name to make sure it is unique, and a cloud server keeps track of stats for that user, thus the need to register and login. Besides, I want users that do not want to contribute content to be able to use the app without logging in, I think things that "welcome" you with a registration form are annoying – Devon Muraoka Feb 13 '15 at 4:09
  • @ChuckFulminata: 1) Anonymous access is a very important requirement that was missing from your original question. See my edited mockup. 2) How does your current system react to a user trying to access it with an existing username, say after wiping app data or using a new device? It doesn't sound like you have an actual user identity authentication system. 3) My welcome message is just a placeholder example for you to replace with something more appropriate. I don't know your users, so I can't give you the exact copy to address them. They might not find it as annoying as you do. – dnbrv Feb 13 '15 at 5:03
  • 1)I realize I left out the requirement for "anonymous access" I edited the question, 2)Do you mean if they try to select an already in use username? it simply sets that as their user and any object they author will have that name on it. When a user logs in it checks it against a cloud server that stores user data. If the device is wiped they must simply log in again, that's the advantage of cloud storage. 3)It's not a personal preference thing, it's a UX thing, I want my users to start using the app right away, not have to jump through unnecessary hoops – Devon Muraoka Feb 13 '15 at 5:11
  • @ChuckFulminata: 1) Since the system only records the user name to calculate points, "login" might not be the appropriate term. See the changes to the microcopy. 2) You missed yet another condition: the timing/process step when the form is presented. If it's the first thing shown to any user when they launch the app for the first time, it's best to have some sort of a welcome message. If you want to prompt them only when they're posting for the first time, see the added mockup. – dnbrv Feb 13 '15 at 5:35

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.