Mobile Sites and Usability: An unlocked phenomena


Everyone knows how iPod/iPhone revolutionized the user experiences of handheld devices. Its a device more usable than anything before of its kind


Lets hold our thoughts here, think for sometime and figure out the awesomeness behind this great user-experience. The two very basic points their UI revolved around were:

1. Make the Action-Points in the UI easily reachable. Since iPod was a touchscreen device, they used big sized buttons to achieve this, and a highly calibrated keyboard made typing a smoothie. Those big buttons really made accessing those action points easily. You never feel like using a stylus with iPod/iPhone, thats ease of access.

2. Minimal Scrolling: Use multiple screens instead of one big list, go deeper levels or flip that screen but stay on a single page. iPod had reasonably categorized menus at as many places as possible and the very intuitive "back" buttons sure showed the way out to the main application.

If you look closely at one of those apps you love to use, you will find the above two ideas stuck into their genes.

But, somehow, and sadly, web din't adapted this phenomenal user experience. Still there are underlined anchors, default terrible buttons and long wap-pages on mobile-versions of web sites. I believe there is a tremendous potential in this UI which is yet to be uncovered as far as mobile websites are concerned.

I tried to check it out on a very lame Google search page, results not being so pretty but definitely way more usable (Sorry i am a little bad at CSS thingies):


Which one do you prefer? (do let me know in comments!)

We have got to unlock this phenomenal UI into our web coding guidelines. The way wap sites are designed must take a leap and jump into the awesomeness of this user experience.

I suggest sticking to the following points when developing a mobile version for your site:

1. Use block styled anchors or block styled anchored lists for your navigation and other links.

2. Major Action Points in your site must have those big huge buttons to seek attention and improve the usability and user-experience of your site.

3. Try to be very specific and manage the whole content within a page or two at max. Lets break those never ending longer than Wall of China websites. We really dont need them, come on, we are heading to 4G now. Its the experience that would matter down the line and not the number of lines in your site.

4. Make sure you have a good amount of margin between your elements otherwise it gets really messed up on a touchscreen device and users end up clicking unwanted things.

5. Keep it clean, use shorter and straight words, and more visual and iconic displays rather than texts. Users are getting smarter, lets make smart sites now.

Lets make web better, together!

Comments

  1. aNishJuly 20, 2010 at 4:55 AM

    Point No.2..
    hmm..y do u hate buttons in linux ??

    ReplyDelete
  2. krgJuly 20, 2010 at 8:21 AM

    good beginning. and i would really suggest consulting a UI or usability expert before deriving anymore ideas. Usability isn't a widely understood phenomenon and a very dangerous thing to practice at home.
    Based on my conversations with usability people, here are some more points:
    - Iphone has the same interface and appearance across all applications. That smoothens out the experience and lowers the learning curve of using a different application after having used one. You, as a app publisher, cant get more radical than you need to be.
    - The whole experience being on only one medium, touch. So there isnt a extra keyboard tagged onto the device which you have to keep shifting to in between tasks.
    - The home button. no matter where you are in a navigation, you tap it, and you are back,
    - The multitouch. helps reproduce many actions by various combinations of intuitive gestures rather than have buttons for them on the screen area.

    and about points to keep in mind while designing for the web? i wont say a thing as long as jakob nielsen is at it, over to jakob: http://www.useit.com/

    ReplyDelete
  3. ashishJuly 20, 2010 at 9:55 AM

    @anish the buttons in linux have bad icons, bigger than what required. Big buttons are really needed for a touchscreen device or rather a handheld device, not a desktop device.

    @krg sir, thanks for the very useful comments!! i totally agree with you on the points for iPhone usability. But my post was really about why mobile websites are not adopting this kind of user experience. People buy it or not, iPhone did bring in those big buttons to UI and they are damn useful in a handheld device. Dont u think its time that mobile websites developers change their mindset a bit and explore this kind of user ex?
    and Nielsen is God.. no doubt!

    ReplyDelete

Post a Comment

Popular posts from this blog

Alarm Clock Myth - How to wake up early

Image
Everyone wants to wake up early, and make good use of those extra early morning hours. But we fail all the time, even if we succeed, its one-off times. I thought its a good opportunity to seize and fix this problem with the existing alarm clocks. I started exploring the existing solutions out there and found there are quite many interesting stuff: A whole breed of biologically sync'd clocks who wake you up when you are least in sleep Hard to snooze alarm clocks which ask you to solve a difficult puzzle to snooze an annoying alarm tone Motivational messages to wake you up I gave all the existing products a lot of thought and why they don't quite work. Here is my conclusion: People don't really understand the real purpose of alarm clocks .   Here's the deal: Alarm clocks are not meant to wake you up. Yes, you read it right. Alarm clocks really are the mission-control, last resort plan to wake you up at the deadline time. You are supposed to get up on
Read more

Intelligent Passwords

I attempt and dare to solve the problem of password-stealing which occur primarily due to Social Engineering Hacks. Also, this adds another layer of protection over passwords and make passwords more secure and usable! The method exploits the fact that given a word to type, different people will type the word in different fashions. The speed of typing will be different and the typing-accent will vary. We now attach this typing-accent attribute to the password and make them more secure i.e. even if you tell your password to a third-person, he wont be able to authenticate himself as you. Also, this improves the usability of passwords. As pointed by Jakob Nielsen, un-masking the password would provide better usability. Passwords can now be unmasked as this method tries to cover for the social engineering hacks which are the clear threats to unmasking passwords. As a proof of concept, i provide a demo here . The demo is Javascript based, where you can set your password and then attempt to e
Read more

The little thing that makes me hate Android

Android is awesome. We found love in a hopeless place. It's the unix of mobile phones. But it is so fricking annoying when: It vibrates on shutdown Why? Why does it have to vibrate on shutdown?? My phone battery definitely dies everyday because battery-life sucks and I suck more since I am too lazy to keep my phone charged. Now, when battery gives up, phone shuts down silently and in the end it vibrates. I pull the phone out of my pocket to see what the vibration was about, click the Power Button and it starts booting up, just to shutdown again! You may call it a dark pattern/(insert a mumbo-jumbo here), I call it wtf. wtf.
Read more