It comes as no surprise that behemoth Amazon cater for this need well, having good examples of mobile site and app (pictures below displaying in that order)
AMAZON HOMEPAGE
The two home pages immediately demonstrate their suitability for the mobile platform: the content is trimmed down, and only the most relevant options provided.
What I find interesting is that the site uses a search box as the first main component. In the app meanwhile, you are required to click to then search, or use the somewhat unnoticeable search option along the bottom of the screen. It is things like this that will enable me to identify what makes for a more effective mobile user interface. The quicker you can complete a task the better.
The app succeeds in providing large tappable areas, and also, removing scrolling here on the first page.
The recommended items on the app allow for swiping, something users are gradually being encouraged to do with the new touch screen devices, yet could confuse new comers who will no doubt prefer the more informative/directional buttons found on the mobile site.
SEARCH RESULTS
Search results differ slightly too. The site offers more results immediately, yet could be criticised for reducing the screen estate of each item and making it harder to read. Furthermore, the mobile site seems more reflective of desktop styling with blue, underlined hyperlinks. This will likely be preferred by less savvy consumers who are familiar with such colouring conventions on the desktop site. The app gains merit for its more stylised arrangement.
The app can also be commended for providing a back button at the top of the page, albeit disguised somewhat with wording for where it will lead to, rather than a simple "back". If the mobile browser doesn't consistently provide one, users could find navigation more difficult on the mobile site.
ITEM LISTING PAGE
The product pages use images to illustrate what they are selling. This is good and probably a staple expectation for an e-commerce site.
The app again succeeds by making all content tappable and linking to more specific information on the next page. Notably, because it is an app, animations and loading seem much quicker. The structure appears neater in a more rigid construct.
The site again succeeds by placing information the typical Amazon shopper will want towards the top of the page (price, star rating, stock status). This bodes well for efficiency. Furthermore, the Buy button is easily located, with contrasting colours, and shaped graphics easily distinguishing it on the page.
CHECKOUT
The checkout screens I think show the contrast achievable through good design. The mobile site seems plain, a jumble of information, ill formed in its positioning and underlined links inserted too. Meanwhile, the app breaks up the information well, the use of white-space makes consumption of the page much easier. Colour is used to alert the user to the required action, red being a commonly associated sign of warning.
In terms of buttons, I believe the mobile site offers, visually, the better usability. They tend to be rounded, with gradients to better distinguish between regular page text. The app meanwhile offers a small arrow that dictates the direction but is placed in a much larger button canvas - this being what lessens the association of it being a click-able link. Fortunately should the user tap any part of this they will execute the link due to much more inclusive user interaction design.
The bottom navigation options for the app would allow quicker connections to places of relevance. This is good, being a consistent menu. However its dark styling makes it difficult to read and thereby could become a lesser used commodity than originally designed for.
----------
This has proved helpful in allowing me to frame some activities for my test subjects. Importantly, they will need to concur with what users will do on their mobile device, but for Amazon, the design seems to indicate search, price and star reviews as valuable attractions to their users.
@
No comments:
Post a Comment