Human Factors in System Design, Development, and Testing

Human Factors in System Design Student Name:
Human factors in system design
Student Name:
Institution:
1

Human Factors in System Design Student Name:
Table of Contents
Bata E-commerce Website..............................................................................................................2
The use cases...................................................................................................................................3
Evaluation methodology..................................................................................................................4
Scenario 2....................................................................................................................................5
Scenario 3....................................................................................................................................5
Scenario 4....................................................................................................................................5
Scenario 5....................................................................................................................................6
Results Evaluation...........................................................................................................................6
Scenario 1 results........................................................................................................................7
Scenario 2 Results.......................................................................................................................8
Scenario 3..................................................................................................................................10
Scenario 4..................................................................................................................................11
Scenario 5 Results.....................................................................................................................14
Overall Results..........................................................................................................................14
Findings and Recommendations....................................................................................................15
Consistency................................................................................................................................15
Information Visibility...............................................................................................................16
Ease of use and functionalities................................................................................................16
Recommendations..........................................................................................................................16
Conclusion.....................................................................................................................................17
References......................................................................................................................................18
Appendix A: Participant’s Questionnaire......................................................................................21
2

Human Factors in System Design Student Name:
Bata E-commerce Website
An interactive system is an application that allows different users to perform various functions
with it. These systems include the E-commerce Websites, Games software, Electronic devices,
video players, photo editors among others (Alassaf, 2011). The interactions of these applications
is determined by various factors that determine its usability capabilities (Selvaraj, 2011). These
factors include; the look and feel of the graphical interfaces, the consistency of information and
design of the application, the ease of navigation across the applications, the clarity and visibility
of the functions and contents of the applications and finally the ease of use.
This report therefore focuses on a human interaction usability test carried on a Bata E-commerce
website. This website allows Bata Customers to view their products online, place an order and
pay for their goods through online platforms. The report analyses this website through
observation of how the participants perform their tasks as well as using questionnaires to capture
the users view. It also provide a thorough evaluation of the findings and recommendations given
by the participants of this research.
The use cases
Bata Brand is a wholesale and retail multinational shoe and fashion manufacturer in the world.
This company sells about 1 million shoes per day and it consists of different varieties of shoes
and fashion accessories for various users ranging from kids, ladies and men. This company has
many branches in Africa and outside Africa and its products are mainly made from leather hence
attracting most customers. In order to increase their sales and foster marketing products, this
company has developed an e-commerce website that serves all of its customers across globe
where the company has set its root. The website contains all the company’s products collection
divided into different categories (Danino, 2015). This website therefore allows the customers to
view products from their respective country, add it to the cart, make an order and wait for it to be
delivered. The following use case diagram shows various ways in which the customer interacts
with the system while making an order of their choice.
3

Human Factors in System Design Student Name:
Figure 1: Bata E-commerce Use Case
Based on the above use case diagram, the customers interacts with Bata E-commerce website in
various ways before one completes successfully making an order for the product of their choice.
Therefore, for the purpose of this report usability test evaluation, all the functionalities of this e-
commerce website will be looked at except the payment module. The test will look into how
easy the application to use, consistency of the graphical user interface, visibility and clarity of
information among others.
Evaluation methodology
The Usability test evaluation methodology for this website was based on created scenarios to
guide the participants in analysing the functionalities and usability features of this system. A
4
Select Country
Login
Signup
Select Item
Add to Shopping Cut
Select Payment Option
Make an Order
Logout

Human Factors in System Design Student Name:
total of 5 users with no experience with Bata e-commerce system were used to complete several
usability tasks (Affairs, 2018). Each user was allocated 30 minutes each while the researcher
observe how they were performing the assigned tasks (Molich, 2015). The tasks were mainly
related to all the functionalities offered by the system to its customers which included: account
creation, login, and product selection, all the way to creation of an order. A total of seven
scenarios were created hence each user had to perform one task at a time. The following are the
seven scenarios used to carry out the usability test.
Scenario 1
A user was required to visit the homepage section of the Bata E-commerce website
(https://www.bata.com/), select country of choice, click on Shop Online to navigate into the main
e-commerce section where once can view various categories of the product available in the Bata
E-commerce website (Main Homepage).
Scenario 2
This scenario entailed navigating through the application’s top bar which included menus such as
School, Safaris, Ladies, Men, Kids, PataPata, Sports, Brands, Blog, Giftcard and Design
Apprentice. The aim of this scenario was to test the usability of the main navigation bar to
transverse to different parts of the application.
Scenario 3
Here the users were required to selects items from School and Safaris menu bar view their details
and add a minimum of two items from each category to the shopping cart.
Scenario 4
This scenario involved visiting a number of webpages at least six within the E-commerce
application and looking at the consistency of the design as well as the clarity of the text used in
those webpages. Here the user was required to note down the visited webpages and to state what
those web pages entailed and whether the content was representing the relevant information as
per the functions of this applications.
5

Human Factors in System Design Student Name:
Scenario 5
Under this method the user was required to go to Gift card section and create a gift card for a
recipient of their choice by choosing the design of the gift card, providing the recipient
information and paying for the gift card using credit card.
All the above activities were performed interchangeably by all the users and this provided a great
experience and opportunity to get what the users take on the Bata E-commerce was. The
scenarios focused on analysing the usability of the entire application, consistency of its graphical
user interface, relevance of the content used in different webpages and ease of navigation across
the different parts of the E-commerce application. The scenarios also provided a guideline and a
step by step approach of how users were to interact with the application and this ensured that this
ensured that it was easy to conduct the analysis more effectively.
Upon successful execution of the mentioned activities, the five users were required to fill a
questionnaire with general usability questions related to the above scenarios given to them. The
questionnaire was aimed at getting the general view of the users on this application in addition to
what their experience was while navigating through the E-commerce website (Bias, 2009). Each
user was also required to rate the specific tasks performed out of 5 points and say whether it was
a success or fail.
This evaluation methods were preferred since they provided a direct interaction or touch of the
users with the application and through observations and reading of gestures it was easy to deduce
a genuine feeling of the users on this application (Bravo, 2017). Also with the questionnaires it
would be easy to know what the users felt about the application something that could not be
observed during the execution of the above scenarios. Hence the methods were regarded most
effective and appropriate for this research.
Results Evaluation
Based on the above tasks performed, a number of key issues were observed and various results
deduced from the questionnaires filled (Nielsen, 2013). All the selected users participated all the
6

Human Factors in System Design Student Name:
above scenarios (the tasks were conducted interchangeably until every participant had performed
every task outlined in the methodology section above) in the whole process successfully and the
following results were obtained from the entire process (Muniz, 2016).
Scenario 1 results.
This scenario was aimed at testing the ease of navigation form the Bata homepage where the user
started by selecting their country of choice for shopping, then chose where they wanted to go
whether shop online, stores or Bata Corporate (The selected destination was shop online where
they could access Bata Products). During this process it was observed that majority of the users
though did not find it hard to navigate through, they did not find it necessary to have such a long
process in trying to get access to the Bata products. 3 out of 5 cited the process unnecessary and
lengthy as most of the user always want to be taken directly to the Products section without
being subjected to other processes such as this. The homepage is as shown below.
Home Page
Figure 2: Homepage
7

Human Factors in System Design Student Name:
It was also noted that all the participants were not satisfied with the design of the Bata homepage
and majority cited that the webpage is dull and has little information to communicate what Bata
really entails and the following table shows their ratings on the design and the whole process at
large.
Participants Design and contents
(out of 5)
Necessity of the
Process (out of 5)
Ease of
navigation (out
of 5)
1 3 3 4
2 2 4 5
3 2 2 5
4 2 4 4
5 1 3 5
Table 1: Results
From the above table it can be seen that majority of the participants with an average of 2 out of 5
points were not contented with the way the homepage was designed and the contents it
contained. It also evident that no one could give the necessity of the process a 5 out of 5 hence
most of the participant felt that the process was long and added no value to the application. On
ease of navigation all the participants found it easy as it was straight to the point.
Scenario 2 Results
Here the users were required to navigate through the navigation tabs of this applications as
shown below.
Figure 3: Navigation Bar
8

Human Factors in System Design Student Name:
The aim of this task was to test the ease of navigation using the main menu bar and to find out
whether the content of the navigated webpages were relevant and also check on the consistency
in design of the visited webpages (Sceviour, 2010). During this process all the participants were
able to navigate to different webpages easily ranging from School, Safari, Ladies, Men, Kids,
PataPata, Sports, Brands, Blogs, Gift Card and Designer Apprentice web pages. When asked
about the design of the webpages they visited they cited that the design was good and was direct
to the point as it contained the relevant information related to the navigation tab menu. The
participants also in unanimity agreed that the webpages were consistent in both the look and feel
and one could relate with them easily without encountering difficulties. Some of the webpages
visited by the participants included.
Safari
Figure 4: Safari
Sports
9

Human Factors in System Design Student Name:
Figure 5: Sports
From this tasks, the participants also noted that it was easy to keep track of which page one was
as well as it was easy to navigate back to the previous web page. This was made possible by the
fact the application showed the current webpage right below the main menu bar and also it had
an icon that could take you back to the home page.
For this scenario, all the participants said it was a success and gave it an average of 5 out 5 points
to express their satisfaction on how easy and appealing it was to perform the task.
Scenario 3
This task was aimed at testing how the participants find it to select a given category of product,
view the existing products and adding selected items to the shopping cart before placing an
order. With this task 4 out 5 participants were able to successfully add four items to the shopping
cart while one didn’t. Even though majority succeeded in performing this task, they all faced a
common challenge in adding the size of the shoes before adding the items to the cart. It was
observed that the participants forgot on selecting the size of their product and only did so after
they were prompted after clicking Buy Now button.
10

Human Factors in System Design Student Name:
Even though the challenge was encountered all the participants did not find it an issue and
acknowledged it as part of the process in ordering for the right product. An example of the
interface for adding the Item to the shopping cart is as shown below.
Figure 6: Add to Cart
Scenario 4
The purpose of this scenario was to test the clarity and relevance of the information represented
in various web pages and analyse every detail and feature present. The participants chose random
web pages and it was observed that it was so easy for them to move from one page to the other.
Some of the web pages visited were.
NorthStar
11

Human Factors in System Design Student Name:
Figure 7: Northstar Webpage
Toughees
Figure 8: Toughees Webpage
12

Human Factors in System Design Student Name:
The layout of all these webpages were satisfactory and the participants acknowledge that there
were other features that made the application more usable in selecting the appropriate product
from any category. Some of the features noted included:
Refine by color
This allowed the users to select a product depending on the colour of their choice. From the
colour chart provided, the participants were able to select their colour and a collection of the
product of the chosen colour would be displayed. This authored well with the participants as it
made it easy to search for the right product.
Figure 9: Refine By Feature
Sort By
In all the E-commerce webpages there was a Sort By feature that made it easy for the user to
view products of their preference based on the price.
Search field
Figure 10: Search Field Feature
The search field feature at the topmost part of the webpages also made it possible for the users to
type and locate their product without having to navigate through to all products.
The participants therefore expressed their great satisfactory on how the web pages were
segmented and the amount of functionalities provided to aid in selection of an item before
13

Human Factors in System Design Student Name:
placing an order. Therefore those task was rated successful and very important in achieving the
objectives of this application.
Scenario 5 Results
This task required the participant to create a gift card to a friend or any recipient of their choice.
All the participants performed this tasks and 3 out of 5 were able to create the gift cards
successfully. /the other two could not complete the process by fears of using their credit cards
but were also able to navigate through the process. The gift card interface was as shown below.
Figure 11: Gift Card Webpage
Overall Results
From the above scenarios, it was possible for almost all the applicants to perform all the tasks
using the Bata E-commerce system. Based on the observations and results obtained from the
questionnaires, 80 percent of the participants which translates to 4 out of 5 could perform the
task without supervision while the rest 30 percent which is just 1 participant needed a little help
to perform the allocated tasks. This gave the Bata E-commerce application a great approval
ratings of 4 out of 5 participants even though they all had an issue with the layout of the
14

Human Factors in System Design Student Name:
hompage and the process involved before accessing the E-commerce section where one could
view the products. The overall usability test result is as shown in the graph below.
Figure 12: Overall Results
Findings and Recommendations
From the results obtained above, it is therefore appropriate to say that this application has a
greater usability rate as it can be seen in the graph above. This section therfore looks at the
overall human intercations usability factors results such as consistency, visibility or clarity, ease
of use and functionalities obtained from the five questionnaires filled by the participants.
Consistency.
When asked of the overall design of the interfaces and the alignment of the web components for
the Bata Ecommerce application, all the participants expressed their satisfaction by giving it an
average of 4 points out of 5. The one point that expressed lack of satisfaction was based on the
homepage and the subsequent page where one had to select where to location such as Shop
Online, Store and Bata Corporate. All the participants recommended that this section be
reviewed and the information provided here should give an overview of what Bata entails in
order to attract more curiosity on wanting to find out more than rather providing a dull page with
15

Human Factors in System Design Student Name:
very minmal content. The paticipants proposed the use of features such as a slider that contains
images scrolling horizontally showing a summary of products and services offered by Bata
Organization.
Information Visibility
The contents of the webpages were found to be relevant and easy to understand. The alignment
of the features such as sort by, refine by size, search among others were more visible and one
could locate them easily. From the findings obtained alomost all the participants successfully
understood the information needed while executing the tasks and only one person needed little
help. Therefore, from the results obtained from the questionnaires, all the participants indicated
that they could understand the content of the application as well as locate relevant feautures
without experienceing great challenges.
Ease of use and functionalities
From the results all the participants were able to succesffully navigate through the different parts
of the webpages and execute the functions effectively. It was therfore recorded that the
applications were simple to use and interact with as there were very minimal challenges
encountered during the process. Otherwise, the participants proposed an intergration of a video
or a help section to provide guidelines to those users that are stuck when using the application as
it was the case with one participant who needed help in performing some tasks.
80 Percent of the participants recorded that this applications functionalities were easy to execute
while 30 percent felt that they needed help to execute some of the functions. The various features
helped most of the applicants know what to do at what place when interacting with the
application. It was evident that majority of the participants were able to select items, add them to
the shopping cart and place an oredr by following a step by step approach displayed in the
applications.
16

Human Factors in System Design Student Name:
Recommendations
The following are some of the recommendations made dring the human interaction test for the
Bata organization to implement in their application in order to make it more appealing and
usable.
 Improve the homepage design and add dynamic contents such as sliders that attracts the
attention of the visitor. Also considering that the homepage is the most visited web page
in this application, the Bata organization should take advantage of these and advertise
their products here rather than having it remaining static as it is now.
 Another recommendation was that the organization should reduce the process of
connecting to the products section as this wastes a lot of time and considering that their
products is similar across all the countries, they should include processes such as
identifying the visitors country towards the end of order processing than having it at the
beginning of the application.
 Also, the application should contain a help section, that a visitor can use for guidance
when lost during interactions with the application when making an order. This will make
it more effecitve and efficient since visitors will not get discouraged esily due to lack of
understanding of how the processes are carried out.
Conclusion
In conclusion, it is therefore evident that a good and quality interactive system, is the one that is
easy to use and navigate through while executing given functions. The application should be
appealing to the user and should contain relevant information that dictates the main purpose of
the application. Like witnessed in the Bata E-commerce application, a quality interactive system
should provide assistive features like search engines, ways to filter or sort content and also
17

Human Factors in System Design Student Name:
features to help the user locate their current location as well as navigate to their previous
webpages. The design shoulld be well organizaed such that it is easy to trace information or a
functionaliy without straining. All these factors are put into consideration in order to enhance
quality interactions of users with given interactive systems. An application that observe this
usability factors is likely to attract more users hence improving the business operations of the
given organiation such as Bata.
References
Affairs, A. (2018). Heuristic Evaluations and Expert Reviews | Usability.gov. [online]
Usability.gov. Available at: https://www.usability.gov/how-to-and-tools/methods/heuristic-
evaluation.html [Accessed 4 May 2018].
Alassaf, R. (2011). Capitalizing on Knowledge. [online] HCI Report: Website Evaluation.
Available at: http://tarekamr.appspot.com/pdfs/travel112012.pdf [Accessed 4 May 2018].
Allen, M. (2006). Heuristic evaluation of paper-based Web pages: A simplified inspection
usability methodology. [online] Available at:
https://www.sciencedirect.com/science/article/pii/S1532046405001085 [Accessed 4 May 2018].
Bias, R. (2009). Balanced Website Design. [online] Available at:
https://www.webjunction.org/content/dam/WebJunction/Documents/webJunction/Sample-
Usability-Report.pdf [Accessed 4 May 2018].
Bravo, W. (2017). Heuristic Evaluation of Two Travel Websites – Wendy Bravo – Medium.
[online] Medium. Available at: https://medium.com/@WendyBravo/heuristic-evaluation-of-two-
travel-websites-13f830cf0111 [Accessed 4 May 2018].
Chambers, L. (2016). How to run an heuristic evaluation. [online] UX Mastery. Available at:
https://uxmastery.com/how-to-run-an-heuristic-evaluation/ [Accessed 4 May 2018].
18

Human Factors in System Design Student Name:
Cole, N. (2017). How To Undertake a Heuristic Evaluation of a Website - Conversion Uplift.
[online] Conversion Uplift. Available at: https://www.conversion-uplift.co.uk/heuristic-
evaluation-of-a-website/ [Accessed 4 May 2018].
Citeseerx.ist.psu.edu. (2015). [online] Available at:
http://citeseerx.ist.psu.edu/viewdoc/download?doi=10.1.1.129.6038&rep=rep1&type=pdf
[Accessed 4 May 2018].
Danino, N. (2015). Heuristic Evaluation - a Step By Step Guide Article — SitePoint. [online]
SitePoint. Available at: https://www.sitepoint.com/heuristic-evaluation-guide/ [Accessed 4 May
2018].
Espejel, J. (2014). [online] Craigmacdonald.com. Available at:
http://www.craigmacdonald.com/wp-content/uploads/2014/07/Jessica-Espejel_J_14368.Espejel-
Heuristic-Evaluation-Report.pdf [Accessed 4 May 2018].
Ghazarian, A. (2014). How to Conduct a Usability Heuristic Evaluation - Designmodo. [online]
Designmodo. Available at: https://designmodo.com/usability-heuristic-evaluation/ [Accessed 4
May 2018].
Leigh (2015). A Guide To Heuristic Website Reviews. [online] Smashing Magazine. Available at:
https://www.smashingmagazine.com/2011/12/a-guide-to-heuristic-website-reviews/ [Accessed 4
May 2018].
Molich, R. (2015). [online] Uxqb.org. Available at:
http://uxqb.org/wp-content/uploads/documents/CPUX-UT_EN_Usability-Test-Report-
Example.pdf [Accessed 4 May 2018].
Muniz, F. (2016). [online] Usabilitygeek.com. Available at: https://usabilitygeek.com/heuristic-
evaluation-introduction/ [Accessed 4 May 2018].
Nielsen, J. (2013). 10 Heuristics for User Interface Design: Article by Jakob Nielsen. [online]
Nielsen Norman Group. Available at: https://www.nngroup.com/articles/ten-usability-heuristics/
[Accessed 4 May 2018].
19

Human Factors in System Design Student Name:
Nist (2012). [online] Nist.gov. Available at:
https://www.nist.gov/sites/default/files/documents/itl/vote/Guidelines_CIF_Template_Manufactu
rers.pdf [Accessed 4 May 2018].
Sceviour, J. (2010). Usability and Usability Testing of Websites: An Example Redesign for
Sargent Manufacturin g. [online] Available at: https://web.wpi.edu/Pubs/E-project/Available/E-
project-052710-070710/unrestricted/Usability_and_Usability_Testing_of_Websites.pdf
[Accessed 4 May 2018].
Selvaraj, S. (2011). Ten Usability Heuristics with Example.
Sutcliffe, A. (2001). Heuristic Evaluation of Website Attractiveness and Usability. [online]
Available at:
https://www.researchgate.net/publication/221620759_Heuristic_Evaluation_of_Website_Attracti
veness_and_Usability [Accessed 4 May 2018].
Tfa.stanford.edu. (2018). [online] Available at:
https://tfa.stanford.edu/download/TenUsabilityHeuristics.pdf [Accessed 4 May 2018].
Wong, E. (2018). Heuristic Evaluation: How to Conduct a Heuristic Evaluation. [online] The
Interaction Design Foundation. Available at:
https://www.interaction-design.org/literature/article/heuristic-evaluation-how-to-conduct-a-
heuristic-evaluation [Accessed 4 May 2018].
Yushiana, M. (2007). Heuristic evaluation of interface usability for a web‐based OPAC. [online]
Available at: https://www.emeraldinsight.com/doi/abs/10.1108/07378830710840491 [Accessed
4 May 2018].
20

Human Factors in System Design Student Name:
Appendix A: Participant’s Questionnaire
21
Bata E-commerce Website Usability Test
Participant Name………………………………………………………….
Date………………………………………………………………………..
Kindly answer the following questions based on the exercises carried out during testing of Bata E-commerce
website.
1. How many tasks did you manage to perform successfully?
…………………………………………………………………………………………………………
2. Which tasks did you find hard to perform and why?
…………………………………………………………………………………………………………
…………………………………………………………………………………………………………
3. How did you find the overall design of this system?
…………………………………………………………………………………………………………
…………………………………………………………………………………………………………
…………………………………………………………………………………………………………
4. Are there things you did not like about this system? If yes highlight them below/.
……………………………………………………………………………………………………….
………………………………………………………………………………………………………..
………………………………………………………………………………………………………..
5. On your own opinion do you think this application needs some improvements? If yes which changes do
you think should be made here?
……………………………………………………………………………………………………………
……………………………………………………………………………………………………………
……………………………………………………………………………………………………………
6. How did you find the ease of navigation across different web pages of this E-commerce system?
a) Easy b) Slightly difficult c) Difficult
7. Was the information contained in this application relevant and clear to the user?
a) Yes b) No
8. In a range of 1 to 5 (1 being very poor and 5 being Satisfactory) how would you rate this system in
general?
………………………………………………………………………………………………………..
…………………………………………………………………………………………………………
9. Will you visit this website again when you want to buy their products or will you just prefer to visit their
branches?
…………………………………………………………………………………………………………….
…………………………………………………………………………………………………………….
10. What are some of the features that made it possible for you to perform the tasks easily?
……………………………………………………………………………………………………………
…………………………………………………………………………………………………………….
…………………………………………………………………………………………………………….
************* Thank You***************