Mobile Web App Considerations

Below are useful considerations/topics I’ll keep in mind while designing and building the Mobile-UIs web app. They’ll also help me understand why I’ve chosen a particular strategy before I start building.

Registration and Login

  • There will be registration functionality
  • Design one registration flow for desktop and another one for mobile
  • For mobile flow consider using the email address as the username = keeps typing to a minimum
  • Think about field validation. Validate with JavaScript? Don’t forget error messages.
  • What extra refinements can I make to the form for devices that support HTML5?
  • Use CAPTCHA?
  • SMS-based activation experience. Sweet.
  • Cookies on the mobile site… yay or nay?

Presenting the Content

  • Use the server to resize images or a service like TinySrc?
  • Present a layout of thumbnail images?

Usability

  • Optimize user tasks on the mobile version of the site (efficiency)
  • Use the native app pattern of the toolbar at the bottom?

Miscellaneous

  • Retina.- make assets big enough for it, then scale them down for non-retina displays. Don’t do the opposite bc I’ll mess up the graphics by scaling them up.
  • How to implement user contribution mechanism?
  • How will I make it social and personal (vital elements in web apps)?
  • Create a separate site for mobile users? separate URL? User agent detection is unreliable.
  • Design & behavior consideration: the Uncanny Valley of user interface design. Don’t try to make the mobile site look like a native app bc users will have expectations that are impossible to meet.
  • How to provide the right experience… how will the server or client know whether to present the desktop or the mobile site?
  • Provide link to desktop site on the mobile version. That way I don’t deprive users of any functionality. I don’t think it’s possible to upload images via a mobile site yet. A workaround: email the images to the site?
  • How to create a consistent brand and user experience b/w mobile and desktop?

Speed

  • Design for mobile first, i.e. responsive web design won’t cut it bc you don’t want to force users to download resources they may never even see. Go with progressive enhancement instead.

Requirements

Users must be able to (is this list for desktop, mobile or both?):

  • add a new image (screenshot of an app)
  • find images of a particular app
  • tag images?
  • build collections of images
  • add images to a collection
  • share an image
  • del.icio.us
  • Facebook
  • Twitter
  • email
  • Tumblr
  • Digg
  • LinkedIn