After investigating, sketching and building a simple navigation solution for mobile devices, I will investigate some further issues that need to be addressed in building a responsive ecommerce website. This journal will focus on creating usable forms and making use of conditional loading.
Ecommerce sites make use of forms when asking users to sign up, register and in the process of purchasing products. I believe that, by creating usable forms, users will be less likely to become frustrating during the shopping process on their mobile device.
Wroblewski suggests the following points for improving the usability of forms on mobile devices:
- Using top aligned labels to ensure enough space for inputs
- Autocapitalise should be removed from inputs that are not proper nouns
- Removing autocorrect for inputs where this is not required (email, username etc)
- Using input masks to prompt the user
- Fewer questions the better
- Take the virtual keyboard’s height into consideration
I took these points into consideration and found a clever way of implementing a solution that could prompt the user, and at the same time make use of top aligned labels.
I believe it is important to ensure the form does not appear too long and complicated to a user as they may choose to leave the site at this stage in the process.
Anything that can be done to stabilize response times will result in a usability improvement. By stabilizing response times, the users will expect a page to load within a certain time period. In order to ensure that product pages load within a specific time scale I will be implementing a technique used by sites like Facebook and Twitter.
On ecommerce sites there may be a large number of products for each subcategory. I used the Sports Direct website as an example of this. They have an inventory of hundreds of men’s trainers.
On their mobile site they load 24 items at a time and then show the user the option to load more.
This approach means that each time the user selects a category there will only be a maximum of 24 items loaded, this is of particular use if the user has a poor data connection when browsing the website.
In my sketching for products I have made use of conditional loading. I will test how this should be implemented with focus groups. Whether this is similar to Facebook where the user pulls the screen up to load the next posts, whether it loads automatically when the bottom of the page is reached or whether a button is shown to prompt the user to load more posts like the Sports Direct mobile site.
My next steps will involve creating sample product lists and testing each of the above approaches with potential users.