Take the 2-minute tour ×
User Experience Stack Exchange is a question and answer site for user experience researchers and experts. It's 100% free, no registration required.

I need to create a simple account section in my mobile app with 1-level deep navigation:

           ___ Register
          /
Account --
          \___ Login

On iPhone, I'm using a grouped table view:

__________________
|_____Account_____|
|  ____________   |
| /            \  |
| | Log in    > | |
| --------------| |
| | Register  > | |
| \____________/  |
|                 |
|_________________|

When you tap a table cell, it navigates to a new screen with a back button on top back to the root account page. I think this works pretty good on iOS, because the rounded edges on a grouped table view make each cell look like a button.

On Android, the analogy to a table view is called a list view. Unfortunately, there is no built-in way to make each cell rounded in Android. Here's what it looks like:

__________________
|_____Account_____|
| Login           |
|-----------------|
| Register        |
|-----------------|
|                 |
|                 |
|_________________|

Is this an acceptable design on Android? My worry is that the list view in Android doesn't look tappable. It's just plain text with dividers. Secondly, there's two tiny lines of text on top and the bottom of the page is blank.

share|improve this question
    
perhaps this question should belong in an android section of StackExchange: android.stackexchange.com –  Andrew Davis Nov 15 '11 at 23:36
5  
@Andrew That site's for power users of Android, but not programmers and UI designers. –  Patrick McElhaney Nov 16 '11 at 1:28
    
Is there any chance you (or someone else willing) could create a wireframe or image of this so we can get a better idea of the design? –  ArtOfCode 23 hours ago

4 Answers 4

up vote 2 down vote accepted

I agree with Roman about minimizing input/operation ratio. But instead of mixing the two forms (you might have different input forms for registration, and it might confuse the user), I would use tabs. It would still need a click if you want to register, but I guess you're not doing that every day. It would be quite unbotrusive for the logging user, and for the new registering user the "register" tab would be just at the top to be seen.

Partially OT: if you still want to use a two buttons activity, I wouldn't use a ListView, that's more for when items/choices might change in time or they're so many that you need to scroll it. For two buttons, just use some layout and two buttons. You can change their aspect quite easily with nine-patches, but please note that default aspect of Android widgets is not default at all: every device can have a different look&feel, and you might not want to go against it (although most do).

www.androidpatterns.com is a nice showcase for this kind of problems.

share|improve this answer
    
I've seen the sign in/register forms as two tabs of the same form used to good effect, I think it's great for mobile. –  Ben Brocka Nov 16 '11 at 14:12

One possibly worthy alternative to list- or button-based navigation leading to separate Login and Register screens would be to combine Login and Register into a single activity. This aligns well with the notion that on mobile devices, you want to minimize the amount of data entry users need to perform (i.e. limit your registration flow to bare essentials). Several apps already do this successfully.

On this single screen would be four form elements: Email and Password fields, and Login and Register buttons. Both buttons would be disabled by default. As the user begins typing their email address, Register could become enabled. If she selects Register here, an account is created and a temporary password is emailed to them. If she begins typing a password, Login could become enabled. If she selects Login and there's an auth error, consider displaying a message to the effect of "Did you want to sign up now?" If she selects Register with both an email and a password entered, created an account with those credentials.

Some other points:

  • Don't forget to provide a 'Forgot Password' mechanism.
  • Don't bother with asking to re-type the password — users can always fall back on your 'Forgot Password' mechanism.
  • Consider prepopulating the email text field with known account email addresses on the device, to further lessen the burden of mobile text entry on the user. Android provides an AutoCompleteTextView that may serve well here.
share|improve this answer

If you're worried that your items don't look tappable, you can use a popup menu:

enter image description here

share|improve this answer
    
If you put register and login in this popup, how do you handle the back button? Say the user goes into login but discovers he has no account. So he needs to backtrack then go to register. It's kind of weird going back to a popup. Wouldn't the hierarchy be more clear with Activities (pages)? –  JoJo Nov 16 '11 at 7:28
    
Oh, sorry. Your first chart made me think that first you select a specific account and then you get the two options. It didn't occur to me that "register" doesn't fit in this model so well :). You're right. –  Vitaly Mijiritsky Nov 16 '11 at 7:35

I can tell that you're an iOS user.

Android users are conditioned by the OS to explore. Android users will also understand that "Login" and "Register" are not just random words on the screen, but two actions they may choose to execute.

Notice how google does not use anything in particular to make their settings items appear touchable:

Example of touchable items in Android

The reason why this works, is because Android is much more context-aware than iOS, and uses context to communicate selectability, rather than visual cues.

Another tip (on that you're using already, but may or may not be aware of) is to use verbs, and active language. If your diction implies information, or something static (Account) instead of something they want to accomplish (login), the user might not realize that they can touch that item.

User: "I don't want to view my account, I need to login!"

If your user is kept well aware of their location within your app, (see "I should always know where I am" http://developer.android.com/design/get-started/principles.html) then they should know that they are on that screen to login, or register, and should know that the two options on the screen are one of two actions that they need to take. Once the user realizes that, they'll tap the action they want to accomplish.

share|improve this answer

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

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