Sei sulla pagina 1di 172

SUBMITTED BY:

Tharanga Nuwan Chandrasekera (CB002976)


Nuwanthi Illukkumbura (CB002926)
Thaveesha Gamage (CB003342)

INTAKE:
HF09B1 SE

MODULE CODE & TITLE:


CE00306-2-HCIU

ASSIGNMENT TITLE:
Group Assignment

SUBMITTED TO:
Ms. Jina Daluwatta

DATE DUE:
09th February 2010

TABLE OF CONTENTS

[1]
Table of Contents.............................................................................................................................2

1.0 Acknowledgements....................................................................................................................6

2.0 Introduction................................................................................................................................7

2.1 PROBLEM IDENTIFICATION...........................................................................................9

3.0 User Requirement....................................................................................................................11

3.1 Stakeholder Analysis...........................................................................................................11

3.1.1 Who are the stakeholders?............................................................................................11

3.1.2 What is the stakeholder Analysis and Why..................................................................14

3.1.3 When to Use Stakeholder Analysis..............................................................................15

3.1.4 How to do the Stakeholder analysis..............................................................................16

3.1.5 Matrix for prioritizing the stakeholders of a company.................................................18

3.1.6 Stakeholder Analysis Matrix........................................................................................21

3.2 User Profiling and Requirement Analysis...........................................................................28

3.2.1 User Profiling................................................................................................................28

3.2.2 Data Gathering..............................................................................................................29

3.3 The sampling methods.........................................................................................................44

3.3.1 Random sampling.........................................................................................................45

3.3.2 Systematic sampling.....................................................................................................45

3.3.3 Stratified sampling........................................................................................................45

3.4 Questioner given to customers.........................................................................................47

3.5 Evaluation of the Questionnaire..........................................................................................51

3.6 RESULTS analysis..............................................................................................................53

3.7 Task Analysis.......................................................................................................................65

3.8 Reference.............................................................................................................................66

4.0 Usability Goals and Usability Engineering........................................................................69

[2]
4.1 Importance of Usability.......................................................................................................71

4.2 The Usability Engineering Life Cycle.................................................................................72

4.2.1 Know the User..............................................................................................................73

4.2.2 Competitive Analysis....................................................................................................73

4.2.3 Goal setting...................................................................................................................74

4.2.4 Parallel Design..............................................................................................................75

4.2.5 Participatory Design.....................................................................................................76

4.2.6 Coordinating the Total Interface...................................................................................77

4.2.7 Guidelines and Heuristic Evaluation............................................................................77

4.2.8 Prototyping...................................................................................................................78

4.3 Usability Goals....................................................................................................................80

4.3.1 Qualitative Usability Goals...........................................................................................81

4.3.2 Quantitative Usability Goals.........................................................................................82

4.3.3 Types of Quantitative usability goals...........................................................................83

4.4 Prioritising usability goals...................................................................................................85

4.5 Applying of the usability aspects to the given situation.....................................................86

4.6 Facts gathered from the competitive analysis......................................................................90

4.7 Usability Goals determined for the current system development........................................91

4.7.1 Qualitative usability goals............................................................................................91

4.7.2 Qualitative Usability Goals...........................................................................................92

4.8 Critical analysis...................................................................................................................93

References and Bibliography.....................................................................................................96

5.0 Design and Prototype...............................................................................................................98

5.1 What is Design.....................................................................................................................98

5.1.1 Design Process..............................................................................................................99

[3]
5.1.2 Design for the User.....................................................................................................100

5.2 Design Concepts................................................................................................................112

5.2.1 Shneiderman’s “Eight Golden Rules of Interface Design”........................................112

5.2.2 Nielson’s Guidelines...................................................................................................115

5.3 Types of Design.................................................................................................................117

5.3.1 Conceptual Design......................................................................................................117

5.3.2 Physical Design.....................................................................................................118

5.4 WHAT is User Centered Design?.................................................................................118

5.5 Prototype............................................................................................................................121

5.5.1 What is prototyping?...................................................................................................121

5.5.2 Types of Prototyping..................................................................................................122

6.0 Reference...........................................................................................................................125

7.0 Bibliography......................................................................................................................126

8.0 Testing...................................................................................................................................126

8.1 Heuristic Evaluation..........................................................................................................126

8.2 Formative Testing..............................................................................................................129

8.2.1 Types of formative evaluation....................................................................................129

8.0 Critical Discussion and Application of Design and Prototype..............................................131

8.1 Requirements.....................................................................................................................131

8.2 Analysis.............................................................................................................................131

8.3 Design................................................................................................................................131

8.3.1 Parallel Design............................................................................................................133

8.4 Critical Discussion on Parallel Design..........................................................................152

8.5 Participatory Design......................................................................................................153

8.4 Iteration and Prototyping...................................................................................................154

[4]
8.4.1 Low Fidelity Prototype...............................................................................................154

8.4.2 High Fidelity Prototype..............................................................................................160

9.0 Workload Matrix...................................................................................................................175

10.0 Reference.............................................................................................................................176

[5]
1.0 ACKNOWLEDGEMENTS

We would like to thank our lecturer Miss.Jina Daluwaththa for guiding and advising us and for
the knowledge showered on us. Thank you Miss. Without your support this assignment wouldn’t
have been a success.

We also wish to thank our colleagues for the support given to us at all times, by commenting on
our assignment.

Thank you!

[6]
2.0 INTRODUCTION

Pizza Hut is an American restaurant which has over 34,000 branches opened worldwide. Since
1958 Pizza Hut has evolved to be a world’s favorite by introducing new innovative ideas for
dishes and marketing.
The system we’re designing is for Pizza Hut. Here we’re introducing a change for the restaurant
so that customers will have an enjoyable experience like never before.
Our project introduces a computerized ordering system where customers can order whenever
they want without having a waiter. Our systems are using a device called Light Touch Interactive
Projector. It uses the Holographic Laser Technology and with its multi-touch technology any flat
surface, anywhere can now be turned into a touch screen.
We are using these devices to project screens on the customer’s tables which will allow them to
do the ordering.

Projector

Touch Screen

[7]
There are hundreds and hundreds of different restaurants all around the world, but only
few of them are successful. Is it only because of the delicious, clean food that they provide or is
there some other reasons affecting this?
Presentation, impressions and feelings created by a restaurant also plays a huge role for
the success of a restaurant. Impressions can be made with colors, layouts, ease, and good
service.
Usually in a traditional restaurant the picture that pops into our mind is, a waiter bringing in a
menu to a customer, giving them time to make an order, taking the order, serving food and
receiving payment.
There are some problems in this procedure which can be improved in order to bring in
more business and make the day today work at the restaurant more efficient.
The system we’re designing is for Pizza Hut. They are currently using a simple ordering system
with basic functionality. The system we’re designing is to provide the customer an enjoyable
experience and to overcome the problems that we have identified.

[8]
2.1 PROBLEM IDENTIFICATION

Waiters are human beings, therefore they might write down incorrect information, or lose
the written form of the order. There is also a possibility of the waiter confusing the table they
have taken the order from, since they’ll be taking orders from more than just one table.
Another problem that leads to customer dissatisfaction is that customers get irritated
when they want to make an order but cannot get hold of a waiter. In rare cases they might leave
the restaurant if they are not attended to.
When a customer wants to order something after their first order they will lose their
appetite if they have to look for a waiter for a long time.
When some item on the menu is not available, they cannot remove it from the menu.
Therefore when a customer orders something which is not available and they receive a negative
answer, they might get irritated.
Sometimes when you walk into a new restaurant, customers will not know much about
what they are ordering. A restaurant might have a lot of items on their menu; therefore they
cannot visually represent everything on the menu.
When customers with a certain limited budget arrive they will have great difficulty going
through the menu looking what fits their budget.
We would like to design a system which will not only give joy to the customer, but also
help the restaurant itself.
Therefore through the new system we’re developing we hope to overcome the above
problems.

[9]
SUBMITTED BY:
Tharanga Nuwan Chandrasekera (CB002976)

INTAKE:
HF09B1 SE

MODULE CODE & TITLE:


CE00306-2-HCIU

ASSIGNMENT TITLE:
Individual Assignment

SUBMITTED TO:
Ms. Jina Daluwatta

DATE DUE:
09th February 2010

Asia Pacific Institute of Information Technology

[ 10 ]
3.0 USER REQUIREMENT

3.1 STAKEHOLDER ANALYSIS

3.1.1 WHO ARE THE STAKEHOLDERS?

According to the Zaphiris (2009) Stakeholders are the people, groups or organization with
interests in a project or program (system). In other words stakeholders are the people who will
benefit from the system as well as they may get bad outputs as well.
Stakeholders play a vital character in a successive of a project; because they are the ones who
use the system and they are the ones who affected by the system and also they are the ones who
get the feedback and develop and re develop the system. So stakeholders are one of the most
important elements of the system. Not only in the developing life cycle. In each and every step in
the project life cycle stakeholders plays a vital role.
There are main 4 types of stakeholders;
1. Primary Stakeholders
2. Secondary Stakeholders
3. Tertiary Stakeholders
4. Facilitating

[ 11 ]
PRIMARY STAKEHOLDERS

According to the Zaphiris (2009) Primary stakeholders are the ones who are directly make use of
the system by input the data to the system and receiving the outputs from the system. Primary
stakeholders frequently use the system in order to perform their work effectively and efficiently.
If we take a billing center system as an example; primary stakeholders are the people who input
the billing details and user details to the system (cashiers) and who generate the receipts for the
user. So this example clearly shows that primary stakeholders are the ones who directly use the
system.

SECONDARY STAKEHOLDERS

According to the Zaphiris (2009) Secondary stakeholders are the category which gets the
feedback from the system. Secondary stakeholders will not directly use the system to get the
feedback but they will get some kind of an output from the system.
Usually the input data which primary stakeholders are key-in to the system are generated by
secondary stakeholders and the feedback which generate from the system according to that data
will receive to the secondary stakeholders.
As the above example in primary stakeholders the customers are the people who are named as
the secondary stakeholders in here. Customers will provide the input data to the system and they
will get a receipt as a system feedback. Even though the secondary stakeholders don’t use the
system directly they will have a huge impact on the system, its function and the design of it.

[ 12 ]
TERTIARY STAKEHOLDERS

According to the Zaphiris (2009) Tertiary stakeholders are the category which is not belonging to
the primary and secondary stakeholders and still affect by the systems. Tertiary stakeholders may
not provide the input to the system but they will get some kind of an output from the system as a
requested feedback.
Asking back the same example of billing center; the tertiary stakeholders will be the managers
(sometimes) of that particular company or branch. Managers will not generate the data to the
system to key-in but they will receive the progress details or progress reports, in order to analyze
the company performances which are processed by using the data which is key-in by the primary
stakeholders and generated by the secondary stakeholders. And also due to the failure or the
succeeded of the system manager’s profit will increase or decrease. So it clearly shows that
tertiary stakeholders are directly affected by the system even though they do not use the system
directly.
Competitors also includes to the tertiary stakeholders because the failure or the succeeded of the
one companies system will affect to the profit of their company. So this tertiary stakeholder’s
category includes various people, groups or organizations.

Facilitating

According to the Zaphiris (2009) facilitating category includes the people who are design and
develop the system according to the user requirements. Their main duty is to design, develop and
maintain the system in order to satisfy the user requirements.
This category contains the all the people who involved developing the system such as
programmers, system designers and project managers. They also play a vital role as primary
secondary and tertiary stakeholders in the system because they are the once who design and
develop the system. If they fail to deliver the system which satisfied the user requirements and
also perform the tasks in user friendly manner the entire system will fail.

[ 13 ]
3.1.2 WHAT IS THE STAKEHOLDER ANALYSIS AND WHY

According to the Schmeer (2001) Stakeholder analysis is a process of systematically gathering


and analyzing qualitative information to determine whose interests should be taken into account
when developing and/or implementing a policy or program.
As mentioned earlier in this chapter the stakeholders are one of the major parts of the project so
it is really important to have a good idea about the stakeholders and their interests towards the
business and to the system. Ultimately the system will depend on the how far the system can
fulfill the stakeholder requirements.
Stakeholder analysis is identifying the key stakeholders of the organization or the system and
measuring the interest of them, also it is the way to find the influence of each stakeholder groups
to the system. And stakeholder analysis is mainly about identifying the relationship of each
stakeholder and issues they have.
Stakeholder analysis will help to identifies the following main points in a project,
 which human resources or organizations to take account of in development
 Groups that should be encouraged in order to take the best out from them.
 what are the roles they should play and what are the stages they have to involved in
 who to build and take care of relationships with
 who to update and seek the advice about the project
 Ways to shrink the negative impacts on susceptible and disadvantaged groups.

[ 14 ]
3.1.3 WHEN TO USE STAKEHOLDER ANALYSIS

Stakeholder analysis can be done in any stage of the project life cycle but it is wise to do the
analysis at the very early stage of the project, because it will give a clear idea about the
relationships and influence groups of the company.
At times it is good to do the stakeholder analysis in every steps of the life cycle. It will give a
good picture of who should be involved in the particular life cycle step and who should be
responsible in the relevant life cycle step. So it will be an advantage to the project even though it
takes time and money of the project.
Schmeer (2001)

[ 15 ]
3.1.4 HOW TO DO THE STAKEHOLDER ANALYSIS

According to the Boutelle (2004) there are 3 main steps in the stakeholder analysis. Recognize
the key stakeholders in the company
First step of the stakeholder analysis is to identify who are the real stakeholders to the project
(system), have to consider each and every person who will affected by the system and who will
might have a strong opinion on the project. It is a must to meet up these key stakeholders of the
company in order to get their ideas, these ideas may be positive or negative, but those ideas will
have an immense value when doing the requirement analysis.

1. Assessing the impact and importance of each stakeholder as well as the possible impact of the
system on each and every stakeholder
a. Prioritize stakeholders
It is always good to have a table to fill the data which is taken from the users. By
using the following table it is very easy to identify and draw the stakeholder
interest chart and also to key in the data.

Source:(Authors work)
Stakeholder Ideas
Name of the Stakeholder Influence Interest in Connection to the system
stakeholder state the System
Ex:
Tharanga Tertiary High Low Use the system in order to
Nuwan get the reports of the
company.

 High Influence, High Interest – Some stakeholders in the company will


have a high influence as well as high interest over the system. It is very
important to take their ideas and view point to the system because most
of the time these stakeholders will use the system daily.

 Low Influence, High Interest - The stakeholders who are low influence over
the project but have a high interest on the project can be a very valuable

[ 16 ]
sources of the information. They will provide the past details about the
company and they will help the project team to gain the domain knowledge. It
is good to meet these stakeholders first in order to gain the knowledge.

 High Influence, Low Interest – This category is one of the vital categories
of the stakeholders, because they won’t pay or dedicate their time for the
project thinking that they won’t affect by the system or the project. But
it is the really important to keep the focus on this category because they
have a high influence over the project. As an example these people will
be the in charge of the accepting the system in final stage. So in order to
get their attention to the project it is really important to provide them the
information about the project or the system and keep them update every
day.

 Low Influence, Low Interest – These people will not have a considerable
impact or interest on the project, as a result of that these people can be
ignored when considering the ideas and view points of the stakeholders.

3.1.5 MATRIX FOR PRIORITIZING THE STAKEHOLDERS OF A COMPANY

Following table will give a good indication of the influence of the stakeholders

[ 17 ]
Source: Anon. (nd)

Venn diagrams

In stakeholder analysis Venn diagrams are used in order to represent the connectivity and the

[ 18 ]
activities which stakeholders are involved in the system. By using the Venn diagrams the
developers can analysis can get a clear idea of the relationships among the stakeholders.
Following Venn diagram shows the main stakeholders of the company and their relationship
with each other.

Other
Programmers Companie
s
Government
Managers

NGO

Source: (Authors work)

Spider diagram

Spider diagrams are mainly used to represents the activities in the system according to their

[ 19 ]
values. Following diagram illustrate the main activities of a bill processing system and their
values regarding to the system.

Source: (Authors work)

b. Recognize stakeholder viewpoints


There are so many ways to recognize the stakeholder viewpoints, those methods
will be discussed in the latter part of this documentation.

2. Recognize the finest way to engage stakeholders


a. Add in stakeholder viewpoints into design of the system.
 Main benefit of the stakeholder analysis is to gain the ideas and
requirements form the users and also to get the permission from the
stakeholders in very early stage of the project.
 By spending the time with the users, understanding their requirements will
give a huge advantage in design a system which satisfied most of the user
requirement.

3.1.6 STAKEHOLDER ANALYSIS MATRIX

[ 20 ]
Stakeholder Analysis Matrix

Name of the Stakeholder Influence Interest in Connection to the


stakeholder state the System system

Customers Primary High High Use the system in order


(age of 10-12) to order the food and to
experience the new
technology.

Customers Primary High High Use the system to order


(age of 13-19) the food and to make the
payments, also to
experience the new
technology. They want
to see a new item every
day and like to do
experiments using
system.

Customers Primary High High Use the system to order


(age of 20-25) the food and to make the
payments, also to
experience the new
technology.

Customers Primary Medium Low Use the system to order


(age of 26 and the food and to make the
above) payments

Waiter Primary Medium High Use the system to check


the orders and to check

[ 21 ]
the bills.

Manager Secondary Medium Medium Get the reports about the


menus and payments

Customers Secondary High High Will get a receipt as a


feedback when they
make the payments.

Waiter Secondary Medium High Will get a receipt when


the customer’s ordered
the food.

Manager Tertiary Medium Medium Branch profit get


increased when the
system work properly.

Waiter Tertiary High High They will have less work


when the system works
properly.

Customers Tertiary High High Ordering the food and


drinks is really easy by
using the system

Waiting for a failure of


Competitors Tertiary High High the system and also they
are keeping the eye on
the plus point of the

[ 22 ]
system.

Developers Facilitating High Medium Design and develop and


maintain the system
according to the user
requirements. And they
may have to re develop
the system if user wants
a new feature.
(Authors work)

THE ROLE OF THE PRIMARY KEY STAKEHOLDERS

Customers (All age groups) – Customers are the main stakeholders in this project, for the
reason that they are the people who always interact with this proposed system. This
proposed system is 100% depend on the user interaction (how they react to the situations,
what are their preferences and how they key in data to the system). This system is proposed
to build in order to give a good satisfactory service to the customers so it is really important
to satisfy all the customer needs by using this system. As a result of above reasons customer

[ 23 ]
is our main target and they are the key stakeholder of this system

Waiter – Waiter is also a main key stakeholder of the system because they are the people
who handle the one end of the system. They always interact with the system in order to get
the orders which customers made. So waiters play a main role in our proposed system. So
we consider them as primary key stakeholders.

THE ROLE OF SECONDARY STAKE HOLDERS

Manager – Manager of the branch will get the reports from the system and they will also get
the payment details of the customers. They have the ability to get the menu details as well
as the items sold per a day. Due to those reasons we consider manager of the company will
be a secondary stakeholder of our proposed system.

Customers (All age groups) – As managers mention in above paragraph, customers also get
the printed bill from the system. So we consider the customers as secondary stakeholders in

[ 24 ]
this system.

Waiter – waiters also will get a printed bill and printed order item list. . So we consider the
customers as secondary stakeholders in this system.

THE ROLE OF TERTIARY STAKE HOLDERS

Manager – if the system is successful and efficient more customers will come to the restaurant
and profit of the restaurant will get increased. So manager will get benefited by the system.

Customers (All age groups) - If the proposed system is successful and efficient, people can
order the food fast and they may save their time. So customers also get benefited by the system

Waiter – If the proposed system is successful and efficient, waiters can get the orders fast and

[ 25 ]
they may save their time as well as customers. So waiters also get benefited by the system

Competitors – one of the biggest tertiary stakeholders in a company. In industry each service
providers want to attract the customers more to their restaurants. So they use various methods to
attract the customers to their restaurants. One way is using high technology to serve customers
fast. This system is also a part of that high end technology. If the system is successful and
efficient then the more customers will attract to the restaurant and competitors will be affected
by it. So we consider the competitors as Tertiary stakeholders in this system

THE ROLE OF FACILITATING STAKE HOLDERS

Developers – developers are the people who are responsible in develop the system to satisfy the
user requirements. They will design the system according to the user request and they will try to
cover all the user requirements as well as GUI. So the successfulness of the system will highly
depend on developers.

[ 26 ]
3.2 USER PROFILING AND REQUIREMENT ANALYSIS

3.2.1 USER PROFILING

“According to Boutelle (2004) of identifying and categorizing your user audience, gathering
their statistics and then producing a user persona for each individual”
User profiling is one of the most important factors in developing a user satisfactory system When
categorize the important factors to a system users will be at the top of that categorized list
because user is the one who use the system daily in order to perform their works effectively and
efficiently with less effort. So it is really important to gather the user requirements and their

[ 27 ]
views on the future system and on the current system which they are using at the moment.
This should be done at the very early stage of the project because only by identifying the user
requirements and their needs will make the system success and designers and the architectures
will not be able to design or develop the prototypes or any other part of the system without user
requirements.

3.2.1.1 WHAT IS USER PROFILING?

User profiling is the way of identifying the user requirements and their needs regarding the
system and what are the main activities they want to perform by using the system and how they
are doing that particular activity currently and will the user like to change the way that they
perform that activity or will they have good ideas or suggestions on the way they perform the
activities.

3.2.1.2 HOW TO PERFORM THE USER PROFILING?

There are many ways to perform the user profiling. In following topic call ‘Data Gathering
Methods’ will discuss the way of performing the user profiling.

3.2.2 DATA GATHERING

Data gathering is collecting the relevant data to the project from the relevant stakeholders. Data
gathering is key point of the analysis. Data gathering is performed mainly to identify the user
requirements, their expectations from the system also to identify the current system of how it

[ 28 ]
work, how users perform their work, what are the main steps of performing the particular task,
also to identify who are the people responsible of it, what are the current problems and are there
any benefits from current system?
There are various ways of performing a data gathering. Following are the main methods of data
gathering.
1. Observations
2. Interviews
3. Document Reviews
4. Workshops or focus groups
5. Questionnaires

3.2.2.1 OBSERVATIONS

Observation is an excellent method of gathering data from working environment. Generally


observations are done in order to gather the data about the current system, because some users
may not express their ideas freely to another person; but observing their behavior at work will
give a good idea about the current system. For the most part observation is done in combination
with another data gathering method such as interviews to fill the gaps.
Observations will help to verify the user comments about the current system and to verify the
way that the current system works. It is always good to have an expert nearby so the expert can
say what to look for. There are many advantages as well as disadvantages in observation.
Kendall et al,(nd)

Advantages

[ 29 ]
 Can gather the data about the current system
 Can collect the data about how the people react to the situations
 Can Verifies the observed data from other sources
 Can collect the data about the peoples relationships with works
 Can gather the true feedback of the users when they use the system
 Can identify the steps of how the things done currently
Disadvantages
 Users will be nervous during the observation time.
So the real behavior will not be able to identify form the users.
 Communication errors with the user will lead the analyzer to wrong conclusion.
 Selecting observing sample is very tricky.
 Ethical issues. (Mainly with women’s)

Kendall et al,(nd)

3.2.2.2 INTERVIEWS

Interview is another good method of gathering the data from the user. Interviews are conduct on
one-on-one or with a small group of user. It is always good to have a small number of groups so
everyone will ave a space to express their ideas.
Interviews can be performed in any stage of the data gathering but is good to have interviews in
the stage of the performance analysis stage. Even though the interviews take lots of time of the
employees it is really good technique because it give the space to gather specific information
from the users.
It is always advised to prepare questionnaire before the interview take place and let the user to
answer the questions by taking their own time. Interviews always fail because the interviewer
tries to prove his opinion to the interviewee and always try to get the desired answer form the
interviewee. Kendall et al,(nd)

Main steps to have a good interview

[ 30 ]
1. Selection of the correct person to interview and inform him about the interview.
2. Make questions for the interview.
3. Do the interview with the person.
4. Document the fact and information gathered during the interview in proper way.
5. Recheck the data gathered during the interview.
6. Do the necessary corrections in documentation and sign-off the interview.

Main goals of an interview

1. To gather information about the company


2. Can Provide information to the user
3. Can gather information about the functions of the current system
4. Can verify the data which are gathered previously
5. Can identify the problems in current system
6. Can gather information about the processes.

Things should do in an interview and things should not do in an interview

1. Do not guess anything before perform an interview.


2. Do not get in to pre opinion.
3. Do not give your opinion to the user.
4. Ask both open and closed questions during the interview.
5. Make the verifications at the right moment.
6. Do not argue with the interviewee anytime and respect to his ideas.
7. Be professional and the same time try to be friendly with the interviewee.
8. Never interpret when the interviewee express their ideas.
9. Listen actively in order to give an impression to the user that the facts are really
important.
10. Let the interviewee do the majority of the talking
11. Always control the interview and target on the subject.
12. Finished the interview during the allocated time period.
13. Finished the interview in positive manner

[ 31 ]
Advantages
 Enable to learn things that cannot be directly observed.
 Allow inquiring if the answers are not clear.
 High response rate.
 Can see the real user expression.
 Increase the accuracy of data gathering.
 Allow more detail questions to ask
 interviewees are not influenced by others
 Can gather the sensitive data.

Disadvantages
 Time consuming.
 Sometimes costly.
 Communication errors.
 Sometimes people will not express their real feeling.
 Can only interview limited users (focus group is low).

Kendall et al,(nd)

3.2.2.3 DOCUMENT REVIEWS

Most of the organizations keep records of their activities such as bills, user manuals, and reports.
Review of these records will provide lots of details about the company. These records will
provide the data about the current system and how the current system works and what are the
reports, outputs which current system generate to the user and what are the inputs that should
give in order to get the valid output from the system and what are the steps that user should
follow to perform a activity. Document review is somewhat like an observation, however
document review will give valid details about the current system and sometimes these documents
will provide very sensitive data about the previous systems.

[ 32 ]
Kendall et al,(nd)
Advantages
 The documents will give a plenty of details about the current system.
 Data will be valid.
 Data will be in details.

Disadvantages
 The documents might be not valid.
 The documents might be Outdated. 
 The documents may be changed.

3.2.2.4 WORKSHOPS OR FOCUS GROUPS

This is also a good way to gather data from the stakeholders; this is also a part of observation
process. Focus group discussion will provide wide-angle views of what people think about the
current system and what their common needs.
Workshops usually involved in small number of people around 8-12 and its main purpose is to
discuss a one particular topic and gets the feedback from everyone. Participants will be free to
express their ideas and this will be really good to identify the common and sensitive issues that
system has.
Kendall et al,(nd)
Advantages
 Will give a good idea about the user requirements.
 Data will be in details.
 Can see the real user expression.
 Increase the accuracy of data gathering.
 Allow more detail questions to ask
 Can gather the sensitive data.

Disadvantages
 Time consuming.

[ 33 ]
 Sometimes costly.
 Communication errors.
 Sometimes people will not express their real feeling in front of others.

3.2.2.5 QUESTIONNAIRES (SURVEYS)

Questionnaires are used to gather data from the large number of people and when it is impossible
to meet every one of them face to face. Like interviews, surveys can also be conduct in formal or
informal way. Questionnaires are built in very simple way that people can understand questions
very easily. There are main three types of the questions which will be described in the latter part
of this documentation.
Kendall et al,(nd)
Advantages
 Can have a good idea about the question because it will have various feedbacks
from the user.
 People will express their ideas freely in open end questions.
 Can get the feedback from large group of people in a smaller time. (sample
group is high)
 Low cost.
 Interviewee can answer the question by taking his own time

Disadvantages
 People might not response.
 No control over the response
 Low probability of getting detailed feedback.
 No space to clarify the doubts.
 People will give the wrong feedbacks
 Language communication errors will direct to a wrong answer.
 May be time and recourse consuming.

[ 34 ]
THE METHODS OF MAKING QUESTIONS FOR SURVEYS/INTERVIEWS

In Surveys and interviews main thing is questions. If the questions are incorrect and they are
prepared in ineffective manner then the output will never be successful. So it is a waste of money
and the time of both interviewer and the interviewee. For that reason questions has an immense
value in surveys and interviews. There are mainly 3 type’s questions.
1. Multiple-choice question
2. Open-end questions
3. Close-end questions

Kendall et al,(nd)

3.2.2.6 MULTIPLE-CHOICE QUESTION

Multiple-choice questions are made in order to get a certain answer from the user. User
will not express their ideas about the question because user only has to pick an answer
from the set of given answers. These questions are really important when evaluating the
questioners and interview details.
Kendall et al,(nd)

[ 35 ]
3.2.2.7 OPEN-ENDED QUESTIONS

“According to Changing Mind website (2010) an open question is likely to receive a long
answer”
Open end questions are designed to get a long and meaningful answer from the user. These types
of questions will lead the user to give a long answer about the topic so the user will take some
time to answer the questions. Open questions are great tool to promote creative thoughts and
problem solving skills, for the reason that these questions will give reasonable response time to
the interviewee and also these questions will make a strong bond between the interviewer and the
interviewee. By using the open-end questions interviewer can gather lots of data about the
current system and interviewee will express their views freely.
Open-end questions typically begin with words like “Why”, “Describe”, “how”,
As a example
 Describe me what you think about the current system?
 What is it you like about the proposed system?
 Why would you say this system is a good one?
 How do you plan to accomplish your business plans?

Let the interviewee to talk more and listen to their ideas and their view points.
Interviewee will control the interview most of the time.

Advantages
 Can gather the interviewee's words which are a sign of his education,
values, and attitudes.
 Provide lots of details
 Give more attention for the interviewee.
 Valuable if the interviewer is not ready for the interview.

Disadvantages

[ 36 ]
 Might take too much time to gain relevant information
 May provide too much unrelated data about the system
 Perhaps lose the control of the interview.

3.2.2.8 CLOSE-ENDED QUESTIONS

“According to Changing Mind website (2010) a closed question can be answered with either a
single word or a short phrase”.
Closed end questions are designed in order to get a straight forward answer from the user. These
questions will limit the number of possible answers from the user and these questions are mostly
used in order to prove a point or to clarify a user given answer.
These questions will give precise details that are required. These questions will not reveal much
about the users but these questions will test their understanding about the current and proposed
system.
Close-end questions typically begin with words like “Is”, “Do”, “When”,
As a example
 Do you like the current system?
 Do you like the proposed system?
 Is the current system good?
 Do you have a business plans?

Let the interviewee to talk more and listen to their ideas and their view points. Interviewee will
control the interview most of the time.
Advantages
 Possibly will save the interview time.
 |Be able to control the interview
 Can easily compare interviews with other
 Only will get the relevant data.
 Be able to cover a huge area quickly.

Disadvantages

[ 37 ]
 Boring for the interviewee.
 Will not be able to get detailed information.
 Fail to build a bond between interviewer and interviewee.

Following table will give a good idea about the close-ended questions and open-ended questions.

Open-Ended Question Close-Ended Question


Describe me what you think about the current Do you like the current system?
system?

What is it you like about the proposed system? Do you like the proposed
system?

Why would you say this system is a good one? Is the current system good?

How do you plan to accomplish your business Do you have a business plans?
plans?

(Authors work)

[ 38 ]
Source: Kendall et al, (nd)

THE STRUCTURES OF MAKING QUESTIONNAIRES FOR SURVEYS/INTERVIEWS

There are main 3 types of structures, which are


1. The pyramid structure
2. The funnel structure
3. The diamond structure

3.2.3 THE PYRAMID STRUCTURE

[ 39 ]
The pyramid questions are start with very detailed close-ended questions and end in open-ended
questions. These questions are really important to warm up the interviewees about the particular
topic

Close-ended Questions

Start

(Source: Authors work)


End

Open-ended Questions

THE FUNNEL STRUCTURE

[ 40 ]
Funnel structured questions are start with general open-ended questions and Concludes in close-
ended questions. Provide an easy way to start the interview and interviewee will be more
relaxed. These questions are really important when the interviewees are really emotional about
the topic.

Open-ended Questions

Start

End

Close-ended Questions

(Source: Authors work)

THE DIAMOND STRUCTURE

[ 41 ]
The diamond structured questions are starting with close-ended questions and then more general
issues are examined and conclude in close-ended questions. These types of questions are
combination of pyramid and funnel structure and these questions will take time to get an answer.

Start
Close-ended Questions

Open-ended Questions Main Point

(Source: Authors work)

End
Close-ended Questions

3.3 THE SAMPLING METHODS

[ 42 ]
Sometimes the entire population will be relevantly small and the researcher can include the
whole
1. What age group do you belong to?
Below 12
12-18
19-30
31-50
Above 50

2. What type of restaurant do you usually tend to visit?


Fast food
Restaurants
Café
Pubs
Casual Dining

3. From Sri Lanka’s leading restaurants, which do you prefer?


McDonalds Dominos
Pizza
KFC Dine-mor
Pizza Hut Harpos Pizza

Other ……………………………………… (State the name)


You may select more than one

4. What is the reason for you to select that restaurant(s)?


Good Food Attractive
Good Convenient
Service
Clean Reasonable
Prices

Other ……………………………………… (State the reason)


You may select more than one

5. Are you willing to pay more for a restaurant because of good


service?
Yes
No

6. Do you leave a restaurant because of bad service from waiters?


Yes
Sometimes [ 43 ]
No

7. How often do you go through the menu before ordering?


Always
population to the study. These types of researches are called as “census” studies since the data is
gathered from each and every member of the population. But in generally it is really hard to
interview or study each and every member of the company. So it is a need to select small number
of people to represent the entire company. This method is called as sampling.
According to the statpac website there are main 2 types of sampling. It is probability or non-
probability sampling.
Probability sampling has sub categorize
a) Random sampling
b) Systematic sampling
c) Stratified sampling

Non-Probability sampling has sub categorize


a) Convenience sampling
b) Judgment sampling
c) Quota sampling
d) Snowball sampling

3.3.1 RANDOM SAMPLING 

Random sampling is the easiest way of probability sampling. Each member of the population is
equal and everyone has an equal chance of been selected. First select the right population for the
sampling then give a number to each of them and finally select numbers randomly. This method
is good when the selected population is relatively small.

[ 44 ]
3.3.2 SYSTEMATIC SAMPLING

Systematic sampling method also called as nth name selection technique. This is done similar to
the random sampling. After the required population is been selected every nth record is selected
from the list. This method is user in order to select specific number of users.

3.3.3 STRATIFIED SAMPLING

Final probability sampling method is stratified sampling and this also called as cluster sampling.
Selected population is divides into groups according to a common characteristic these groups are
called as clusters. A random sample is taken from the one or more selected groups. This
sampling method is used when the selected population has less influence over the system.

For do the research we have selected customers according to the random sampling method
because it is impossible to make a data profile to each and every customer in the pizza hut and it
will be a waste of money and the time. So by using the random sampling method we have
selected 20 customers in different age groups. Our main target is the customers who are around
age of 15-21, because they are the people who like to visit fast food restaurants regularly. And
also by using random sampling we selected the 5 waiters to do our research and we did a good

[ 45 ]
observation on them and also we did a good observation on customers as well.

Customers – we select 20 customers randomly in order to collect data for our system. 1 st we
observe them very carefully, how they behave and how they react in the pizza hut. And then we
gave them a questioner. Most of the people rejected to fill the questioners because they are on a
hurry to go back to their works. But finally we able to get the data from 20 customers of pizza
hut.

Waiters- waiters reject to give the data in formal interviews because they have been instructed to
not to give company details to outsiders. So we couldn’t able to do the formal interviews with
them. But we manage to ask some questions and we manage to gather some data from them.
Observation session help us very well to understand how the pizza hut system works.

3.4 QUESTIONER GIVEN TO CUSTOMERS

[ 46 ]
1. What age group do you belong to?
Below 12
12-18
19-30
31-50
Above 50

2. What type of restaurant do you usually tend to visit?


Fast food
Restaurants
Café
Pubs
Casual Dining

3. From Sri Lanka’s leading restaurants, which do you prefer?


McDonalds Dominos
Pizza
KFC Dine-mor
Pizza Hut Harpos Pizza

Other ……………………………………… (State the name)


You may select more than one

4. What is the reason for you to select that restaurant(s)?


Good Food Attractive
Good Convenient
Service
Clean Reasonable
Prices

Other ……………………………………… (State the reason)


You may select more than one

5. Are you willing to pay more for a restaurant because of good


service?
Yes
No

6. Do you leave a restaurant because of bad service from waiters?


Yes
Sometimes [ 47 ]
No

7. How often do you go through the menu before ordering?


Always
3.5 EVALUATION OF THE QUESTIONNAIRE

This questioner is done in order to get the customers ideas and their likes and dislikes. This was
based on pyramid structure where we start in close ended questions and move into open ended
questions. Final questions are based on the answers which they given in the start of the
questioner. And it helps us to identify the expectation of the customers.

Question 1 – question one is based on to get the idea about the age group. By using this
question it is very easy to analyze the age groups and their preferences.

Question 2 and Question 3 – this question is mainly giving an idea about the user
preference about the restaurant. To check he is a pizza hut customer or not. By using this
question we were able to categorize their need and we were able to prioritize them. If
they are a regular pizza hut customer we have given them a high priority to them because
they are the people who are going to use the proposed system in future.

Question 4 – This question is giving us the idea of the reason for the customer attraction
to the restaurant and these questions help us to categorize the users according to their
likeness in the restaurants.

Question 5-6 – using high technology mean restaurant has to spend more money to
maintain the equipments in the restaurant. So it will affect to the prizes of the food in the
restaurant. So this question identifies that weather the customers willing to pay more
money for better service. If the customers will not be like to pay more for better service
this system will fail. So it is really important to keep a good eye on answers of this
question.

[ 48 ]
Question 7- 8-9 – this question is based on to identify the user’s behavior when they
want to order the food. We did a good observation too. Outcome of this question will
help us to build and design the system. If the customs pay more attention on new items in
the menu, then we have to build our system according to that. Every time user uses the
system we have to show them the new items. So this question help the developers to get
the user preference and user requirements.

Question 10-11-12 – these question will give us the idea how we should design the
system and what user like and their computer knowledge. Do they like to change into
new technology and do they still want to use the old method to order the food. If they
want to use the old method, developers can develop a system which will more similar to
the old method but which will use high technology.

[ 49 ]
3.6 RESULTS ANALYSIS

Question 1

This shows that most of the people come to pizza hut is around age of 12-18 and to 19-30. So our
main focus should be on those age groups and developers should put more attention on this age
groups requirement.

[ 50 ]
Question 2

This shows most of the people like to go to fast food restaurants. For reason that they like to get
a fast and quick service form the restaurants so can do their work without a delay. So developers
should design the system in order to give a good and fast service to the customers. If the system
take so much time to response and it is so complicated then the customers will not be come to the
restaurant.

[ 51 ]
Question 3

This question shows that pizza hut is the leading restaurant in Sri Lanka and the reason that they
already use a semi touch screen system to order the food. As a result of that they were able to
give a good and quality service to the customers which increase the customer satisfactory level.

[ 52 ]
Question 4

In this question we have given choices to the customers of the pizza hut and they have selected
the reasons for their visit to the particular restaurant. They have select good food and reasonable
price as the top 2 priorities and for the 3 rd option they have selected the good service. This is
really an important fact on this proposed system. Main reason to implement this system is to give
a good service to the customers. So it is really important to get the user response about the
service of the restaurant and what they are looking from the restaurant.

[ 53 ]
Question 5

Entire system will depend on this question, because if the restaurant going to implement this
proposed system it will cost lots of money. So the prices of the food will definitely get increased
with the technology, if the customers willing to pay a reasonable amount for the service then
company/restaurant can implement the system. If the customers will reluctant to pay extra
amount then the company won’t be able to maintain the system and it will make a bad name
impact on the company. But the response we got form this survey was really good. 75% of the
people like to pay extra amount of money to get a good service from the restaurant. So it is a
really good pulse point to the developers. By analyzing this question restaurant can make the
budget high and can purchase the more equipment to the company.

[ 54 ]
Question 6

This question and its answers clearly illustrate that most of the people around 50% is expect a
good service from the restaurants and around 90% people will leave the restaurant due to the bad
service of the waiters. So it clearly shows that if the restaurant wants to increase the number of
customers they should give a good service to the customers. Above question also a good question
for the developers who is going to develop proposed system. Because people highly expecting
the good and fast service from the waiters. So it is really important for the developers to develop
the system simple and with less complication.

[ 55 ]
Question 7

This illustrate that most of the people check the menu before they ordering the items. So it is
really important for the developers to develop the system to give a good usability for the
customers to navigate through the menus. It should be very simple and user should be able to
check the food items and their prices without making lots of clicks.

[ 56 ]
Question 8

Most of the people like to taste the new items in the restaurant. Most of the people like to have a
change. So as developers, they should be considering about good method to show the customers
what are the new items available in the restaurant so the customers can identify them easily.
Otherwise customers will not be able to identify the new items in the restaurant.

[ 57 ]
Question 9

Most of the people prefer to have a touch screen system. When we talk to them they said that it is
easy for them to make the order rather than waiting for a waiter to come and take down the order.
They also mention that it will reduce their waiting time on the restaurant. 75% of the people like
to use the touch screen system which is a really good point for the pizza hut when they
implement this system.

[ 58 ]
Question 10

Even though touch screen system is high technological system people who have an intermediate
knowledge can handle the system, so 86% of the customers coming to the pizza hut have that
knowledge. So it is not been a big problem of how to operate the system but how ever most of
the people said they are really like if the developers use single click method because they don’t
like to use double click..

[ 59 ]
Question 11

This question highly relevant to the previous question 20% of the people only familiar with the
touch screen technology. But as mention above questions this proposed system is very simple
one and it should have video tutorials which user will guide through the system. So the user will
not be facing much difficulty because they have been guided throughout the process.

[ 60 ]
Question 12

Most of the people do like to use the touch screen system because it saves lots of waiting time in
the restaurants. Normally in a busy day if a customer enters to the pizza hut then they should
wait around 5-10 min till a waiter comes to him to take the order down. So by using this system
customers can reduce that waiting time. So people like to use a touch screen system.

[ 61 ]
3.7 TASK ANALYSIS

“Task analysis analyses what a user is required to do in terms of actions and/or cognitive
processes to achieve a task”
(http://www.usabilitynet.org/tools/taskanalysis.htm)
It is really important to do a task analysis in order to identify the current system tasks as well as
the future system tasks. For the reason that by identifying the tasks of the system, developers can
easily understand the main process of the system and they may have the ability to understand
main tasks in the current system as well as the future system.

For our project we have decide to use the hierarchy chat task analysis. Where each step will
represent a one particular task and it is look like a tree. Each branch will have its own sub
branches. If the user wants to perform a certain task they should follow the particular branch in
order to fulfil the task.

[ 62 ]
3.8 REFERENCE

Anon, 2010, Open and Closed Questions, Changing  Minds [Online], available from:
http://changingminds.org/techniques/questioning/open_closed_questions.htm, [Accessed 9th
February 2010].
Anon,nd, Sampling Methods, Sampling Methods[Online], available from:
http://www.statpac.com/surveys/sampling.htm, [Accessed 9th February 2010].
Anon.nd, STAKEHOLDER ANALYSIS, Guidelines for Concept Note [Online], available from :
http://www.cphp.uk.com/downloads/GN%20Stakeholder%20Analysis%20Form.pdf, [Accessed
9th February 2010].
Boutelle.j, 2004, Understanding Organizational Stakeholders for Design
Success,boxesandarrows[Online],available from :
http://www.boxesandarrows.com/view/understanding_organizational_stakeholders_for_design_s
uccess.com, [Accessed 9th February 2010]
Kendall et al,nd, Systems Analysis and Design, Information Gathering: Interactive Methods
[Online], available from: wps.prenhall.com/wps/media/objects/1597/1636070/PPT04.ppt ,
[Accessed 9th February 2010].
Schmeer.k, 2001, Stakeholder Analysis Guidelines, Kluwer Academin, London.

[ 63 ]
[ 64 ]
SUBMITTED BY:
Thaveesha Gamage (CB)

INTAKE:
HF09B1 SE

MODULE CODE & TITLE:


CE00306-2-HCIU

ASSIGNMENT TITLE:
Individual Assignment

SUBMITTED TO:
Ms. Jina Daluwatta

DATE DUE:
09th February 2010
Asia Pacific Institute of Information Technology

[ 65 ]
4.0 USABILITY GOALS AND USABILITY ENGINEERING

Usability is one of the main aspects which need to be considered in the process of Computer
application development. Though we only discuss about the usability in this area of HCI, it’s a
subject which has a span throughout a lot of commercial areas since its principals and practices
are considered as a help to make the output a success.
According to Sharp, et al(2007) Usability in general, is the process of ensuring a product is easy
to learn, effective to use and enjoyable from the user’s perspective. Furthermore, it says that it
involves optimization of the interaction of people with the product to make sure the activities
they carry out at their day to day life to be efficient.
Furthermore, they say that
More specifically, usability is broken down into the following goals:
 Effective to use (effectiveness)
 Efficient to use (Efficiency)
 Safe to use (Safety)
 Having good utility (Utility)
 Easy to learn (Learnability)
 Ease to remember how to use (memorability).

Effectiveness is a very general goal and refers to how good a product is at doing what it is
supposed to do (Sharp, et al 2007; p21)
.
Efficiency refers to the way a product supports users in carrying out their tasks. An example of
where this kind of efficiency mechanism has been employed efficiently is in online shopping.
Once users have all the necessary personal details in an online form to make a purchase, they can
let the web site save all their personal details then if they want to make another purchase at that
site, they don’t have to re-enter all their personal details again. A highly successful mechanism
patented by Amazon.com is the one-click option, which requires users only to click a single
button when they want to make another purchase (Sharp, et al 2007; p21).

[ 66 ]
Safety involves protecting the user from dangerous conditions and undesirable situations. For
example, where there are hazardous conditions- like X-ray machines or chemical plants-
Operators should be able to interact with and control computer-based systems remotely. To make
interactive products safer in this sense involves (i) preventing the user from making serious
errors by reducing the risk of wrong keys /buttons being mistakenly activated and (ii) providing
users with various means of recovery should make errors. Other safety mechanisms include undo
facilities and confirmatory dialog boxes that give users another chance to consider their
intentions (Sharp, et al 2007; p21).

Utility refers to the extent which the product provides the right kind of functionality so that users
can do what they need or want to do. An example of a product with a high utility is an
accounting software package that provides a powerful computational tool that accountants can
use to work out tax returns. An example of a product of low utility is a software drawing tool that
does not allow users to draw freehand but forces them to use a mouse to create their drawings,
using only polygon shapes (Sharp, et al 2007; p22).

Learnability refers to how easy a system is to learn to use. It is well known that people don’t
like spending long time learning how to use a system. They want to get started straight away and
become competent at carrying out tasks without too much effort. This is especially so for
interactive products intended for everyday use, and those used infrequently. To a certain extent,
people are prepared to spend longer learning more complex systems that provide a wider range
of functionality, e.g. web authoring tools, word processors. In these situations, CD-ROM and
online tutorials can help providing step-by-step material with hands-on exercises. However many
people find these difficult to relate to the tasks they want to accomplish. A key concern is
determining how much time users are prepared to spend learning a product. It seems a waste of a
product provides a range of functionality which the majority of users are unable or not prepared
to spend time learning how to use (Sharp, et al 2007; p22, 23).

[ 67 ]
Memorability refers to how easy a product is to remember how to use, once learned. This is
especially important for interactive products that are used infrequently. If users haven’t used an
operation for a few months or longer, they should be able to remember or at last rapidly be
reminded how to use it. Users shouldn’t have to keep relearning how to carry out tasks.
Unfortunately, this tends to happen when the operations required to be learned are obscure,
illogically or poorly sequenced. Users need to be helped to remember how to do tasks. There are
many ways of designing the interaction to support this. For example, users can be helped to
remember to remember the sequence of operations at different stages of a task through
meaningful icons, command names and menu options. Also, structuring options and icons so
they are placed in relevant categories of options, e.g. placing all the drawing tools in the same
place on the screen, can help the user remember where to look to find a particular tool at a given
stage of a task (Sharp, et al 2007; p23).

4.1 IMPORTANCE OF USABILITY

Whether it’s a website or and normal day to day application, designing it according to the
usability methods is a key factor in the process of making the product more user-friendly. It may
be possible to build a bug free fully functioning system but incorporating it with user-cantered
design principles will result in a better- improved product in several areas.
(Windows User Interface Technical Articles. Usability in Software Design. Microsoft
Corporation October 2000)

One of the main attributes that determines the common acceptability of any product is
usefulness. In this we measure if the actual goals of the product can be achieved by the actual
uses the product is capable of. Usefulness is further broken down into two interrelated parts
called utility and usability. Utility refers to the amount of tasks or the task which are able for the
product to perform. As the number of tasks a product can perform increases, the utility of that
product increases. Both qualities have to be balanced in order to make a good user friendly
product. Usability Testing helps the Developers to check how easy the product is for users to get
the specified task done.

[ 68 ]
(Windows User Interface Technical Articles.Usability in Software Design. Microsoft
Corporation website 2010)

4.2 THE USABILITY ENGINEERING LIFE CYCLE

The Usability Engineering Life Cycle Helps the Product Developers to build a good, fully
functioning and reliable solution with the aid of its set of stages. According to Nielsen (1993)
given below are the stages of the usability life cycle model.
1. Know the User
a. Individual user Characteristics
b. The Users current and desired Tasks
c. Functional Analysis
d. The evolution of the user and the job
2. Competitive Analysis
3. Setting Usability Goals
a. Financial impact analysis
4. Parallel design
5. Participatory design
6. Coordinated design of the total interface
7. Apply guidelines and heuristic analysis
8. Prototyping
9. Empirical testing
10. Iterative design
a. Capture design rationale
11. Collect feedback from the field user.

[ 69 ]
4.2.1 KNOW THE USER

This is the first step of the usability process. In this stage, users’ which the system is being
designed is carefully studied. The developers have to visit and examine the customer
environment both logical and physical ways in order to get an idea on how the product should be
developed. Determining and identifying the intended customer base is a must at this stage and it
can be done quite easily in most of the situations since they can be identified as concrete
individuals. The developers can check on attributes such as age, educational background, and
work experience, previous work experience etc. in order to get a good knowledge and a good
understanding for the development of the appropriate user interfaces and functions (Nielsen,
1993: p73, 74).

4.2.2 COMPETITIVE ANALYSIS

In order to create a good product, it is recommended to analyze existing products heuristically


according to established usability guidelines and to perform empirical user testis with these
products (Bachman 1989 cited in Nielsen 1993: p79). The systems which are on the market
today go through a great amount of research and testing in order to make a good working system
and it’s much more effective to compare a realistic system rather than comparing it with other
prototypes. Users can perform real time tasks while and give their ideas on the competing system
and the developers get the chance to have a good understanding on the development of the
functionality and new methods which needs to be added to the new system (Nielsen 1993: p78,
79).

If several competing products are available for analysis, a comparative analysis can be performed
based on their differing approaches to various user interface design issues for the kind of product
being studied. The team can get new ideas for the designing system (Marchionini, 1989 cited in
Nielsen 1993. P79)

[ 70 ]
4.2.3 GOAL SETTING

Al the steps in the usability engineering lifecycle cannot be given the same level of priority. This
makes the developers to arrange their priorities on the basis of the analysis of the users and their
tasks (Nielsen 1993). Different systems contain different types of functions and features thus the
structure of the application development process needs to be prioritised differently. For an
example, in a food ordering system, its better to concentrate more on the interface of the system
in order to give the user the full interactivity within the system where as in a banking system it is
better to concentrate more on the inner functionalities of the system. Before starting the
designing of the new interface, it is important
Original product concept to discuss the usability metrics of interest to the
project and to specify the goals of the user interface in terms of measured usability (Chapanis
and budurka. 1990 cited in Nielsen. 1993: p80).

For each usability attribute of interest, several different levels of performance can be specified as
part of a goal-setting process (Whiteside et al. 1988 cited in Nielsen. 1993: p80).

Usability goals are reasonably easy to set for new versions of existing system or for systems that
have a clearly defined competitor on the market. In an existing system, either it’s recreating an
existing part or recreating a new function within the context of the existing usability methods. So
the implementation will be done according to the goals the system was previously implemented
in order to maintain the familiarity of the system. The current usability level can be determined
as the minimum acceptable usability and the improvement which is made to satisfy the users’
requirement can be determined as the target usability level. For completely new systems on the
other hand, it’s much harder to set usability goals. Good approaches for this would be as follows.
 Create a set of sample tasks and get the opinion of the specialists in the usability
engineering field to get an idea of the time it’s going to take the users to perform them.
 One can get the minimum acceptable level by asking user. But this method is not highly
recommended as to users opinions can vary and can lead to the end product being user
friendly.
(Nielsen. 1993: p81)

[ 71 ]
4.2.4 PARALLEL DESIGN

According to Nielsen et al (1993, 1994) it is often a good practice to start the design with a
parallel design process. At this stage, a number of pilot designs are being created by different
designers. The systems can be developed by individual designers or groups of designers, in
critical projects which needs more attention and usability. The goal of parallel design is to
explore different design alternatives before one settles on a single approach that can be
developed in further detail analysis. Figure below shows the concept in a much easy to
understandable manner.

Original product concept

Parallel design versions

Iterative design versions

Original Product concept

Figure 1: A conceptual illustration of the relation between parallel interactive designs. Source:
Nielson 1993: p86.

A project can have three or four designers involved in parallel design process. If the product is
much critical there are times where companies tend to devote entire teams for this until the final
stage of the design in some cases. Since parallel design is more about generating rough drafts of

[ 72 ]
the basic design ideas it is more preferable to have designers work individually rather than large
number of teams. The designers should not discuss their designs with each other. It is very
important to employ parallel design for completely new systems since it’s hard to find
information in order to determine the best possible interface. (Nielsen 1993: p85, 86, 87)

4.2.5 PARTICIPATORY DESIGN

According to Kensing and Munk-Madsen( 1993 cited in Nielsen 1993: p88) even though the
advice to “Know the user” may have been followed before the start of the design phase, one still
cannot know the user sufficiently well to answer all issues that come up in doing the design.
Instead of going for assumptions and guessing, designers should have access to a pool of
representative users after the start of the design phase. As the development of the application
progresses, developers come across sections where they will need further information in order to
create the functions or the graphical implementation according to the usability goals defined to
the system. In such cases if the team tends to build them according to the assumptions the
development team tends to take, chances are the sections may not work according to the actual
user needs thus it’s important to have actual set of user representatives who will guide the
developers in the process of development(Nielsen. 1993: p88).
Furthermore, it is important to have access to the users who will actually be using the system.
Users at times raise questions that the development team has not even dreamed of asking. Users
participating in a design process are sometimes referred to as subject matter experts or SME’s.
They are very good at reacting to concrete designs they do not like or that will not work in
practice. So the designers should present these systems in a prototype basis rather than going for
systems with voluminous specifications. In the early stages of the design it can be presented as
paper mock-ups or simply a few screen designs. It’s not just about asking users what they want.
The purpose is to get the idea on the usability of the system as the development progresses. As
the product reaches the final stages, it gets more complex and the functions will become
advanced and at this stage it is highly important to maintain focus on developing the system
since there’s a considerable chance on the developers being dragged out of the goals which are
being used. For larger projects it is good to periodically refresh the pool of users who participate

[ 73 ]
in the project since the opinions they have might not be that representative with the average user
population as the system development progresses. There are trade-offs involved in changing user
representatives but it should be kept in mind to keep the number of pool changes to a minimum
number of times during a project. (Nielsen. 1993: p88)

4.2.6 COORDINATING THE TOTAL INTERFACE

Coordination comes through the practice of the consistency in all the elements throughout the
project. Consistency is not just measured at a single point in time but should apply over
successive releases of a product so that new released are consistent with their predecessors. To
achieve this it is necessary to have some centralized authority for each development project to
coordinate the various aspects of the interface. This can be done by a single person in usual terms
but when it comes to very large projects a committee structure would be more appropriate
(Nielsen. 1993: p90).
According to Bellantone and Lanzetta (1991 cited in Nielsen,1993 p91), in addition to these
formal coordination activities, it is helpful to have a shared culture in the development groups
with common understanding of what the user interface should consist of.

4.2.7 GUIDELINES AND HEURISTIC EVALUATION

Guidelines are a set of principles for which should be followed during the development of a
project. In any given situation, several different levels of guidelines should be used. Such as
1. General guidelines- applicable to all user interfaces
2. Category specific guidelines- for the kind of system being developed
3. Product specific guidelines- for the individual product
can be taken as such levels of guidelines. The difference between standards and guidelines is that
a standard specifies how the interface should appear to the user whereas a set of guidelines
provide advice about the usability characteristics of the interface. Hopefully a given standard will

[ 74 ]
follow most of the most of the traditional usability guidelines so that the interfaces designed
according to the standard will also be as usable as possible (Nielsen, 1993, p: 91, 92).

There are a lot of guidelines given by researches, international groups etc. Choosing the right
guideline is up to the designing team since the each and every one will not be applicable to the
system. It would be a good practice to set a two or three groups to check on the different user
guidelines and then select the most appropriate set of guidelines to follow. This may not be a
good practice for small projects but for more critical and large scale projects it is more suitable to
go through this technique. The reason to this would be because the designers will be building the
system mainly based on this system and if the chosen guidelines are making the system look out
of the desired user frame, the usability of the final system would drop down and can result in
partial success. Even the users who are involved in the process of participatory design have a
chance of being misled in their ideas since they have to give their opinions within the guidelines
the design team is following.

4.2.8 PROTOTYPING

Early Usability evaluation can be based on prototypes of the final systems that can be developed
much faster and much more cheaply. It’s not a good way to start full-scale implementation
efforts based on early user interface designs. The entire idea behind prototyping is to save on the
time and cost to develop something that can be tested with real users. There are types of
prototypes which are developed based on the stage of development. It can have either a limited
number of features and full functionality within those features which is called Vertical
Prototyping and the other method having a large number of features with a limited number of
functionality within each of it called Horizontal Prototyping. One of the advantages of this type
of prototyping is that they can be often implemented fast with the use of various prototyping and
screen design tools and that they can be used to determine how good the entire interface is going
to be intact as a whole.
(Nielsen 1993: p 93, 94, 95)

[ 75 ]
There are other ways of making prototypes faster. Such as

 Placing less emphasis on the efficiency of the implementation.


 Accepting less reliable or poorer quality code. Though there can be bugs and crashes and
may distract users during testing it won’t be a big issue as to it’s purely made upon the
basis of prototyping.
 Using simplified algorithms that cannot handle all the special cases
 Using a human expert operating behind the scene to take over certain computer
operations that would be too difficult to program.
 Using a different computer system than the eventual target platform.
 Using paper Mock-ups instead of a running computer system.

Can be taken into consideration (Nielsen, 1993: p96, 97).


Several prototypes can be used together in one especially cheap prototype or as alternative
prototypes. Prototypes may sometimes be used for a special form of participatory design called
interactive prototyping where the prototype is developed and modified as on the fly as a test
user comments on its work spots. A prototype is a form of design specification and is often used
as a major way of communicating the final design to developers. Unfortunately, the prototype
can be over specified in some aspects that are not really intended to be part of the design.
Basically one needs to be aware that not every aspect of the prototype should be replicated in the
final system , and the designers should inform developers about which aspects of the prototype
are international and which are arbitrary(Nielsen 1993: p 97, 98, 99).

[ 76 ]
4.3 USABILITY GOALS

Establishment of usability goals on a project has two main purposes.


1. Designers can create the user interfaces according to the specified set of usability goals
given for the system. In order to maintain on the creation of the specified user
requirements (Mayhew 1999)

In the words of Mayhew (1999) it’s said for Example if all designers understand and
agree that ease of use for experienced users is much more important than ease of learning
for novices, design efforts can focus on alternatives that seem most likely to provide ease
of use- that is speed and efficiency. Usability goals should thus drive all user interface
design decisions.

2. The second main purpose of usability goals is to use it as acceptance criteria during
usability the process of usability evaluation, especially towards the end of the design
process. Once a section of the application is developed, the team takes the selected
usability goals for the application to the consideration and move on to the next section.
This makes it easy to keep the system specifications and the required user functions being
built and avoid problems which can be met during the evaluation process. (Mayhew
1999; P).

Usability goals are mainly based on the user profile and the contextual task analysis. They are
also made on general business goals as well. They can derived from marketing groups, technical
support groups, competitive analysis or jus informed opinion. The selection of usability goals has
to be done very carefully since it has a huge effect on the development of the required solution.
According to Wixon and Wilson(1997 cited in Mayhew 1999: P 125) for example it won’t be
necessary to concentrate on ease of learning goals for a system which is going to be used by
people who are going to be well trained and which going to use frequently. Space shuttle
systems, air traffic control systems can be considered as such systems. But for systems such as

[ 77 ]
online ordering systems, bank teller machines etc. are systems which the ease of learning has to
be a vital usability aspect hence considered as a usability goal.
Through even sources such as marketing groups, competitive analysis or even jus informed
opinion we can originate usability goals (Wixon and Wilson 1997 cited in Mayhew 1999;
p126).they can be considered as the main driven force behind the construction of the proposed
design from the interface to the system functionalities.
Usability goals can be broken down into several categories. Out of them the broadest categories
would be Qualitative Usability goals and Quantitative Usability goals. The advantage of
categorising them in these two is the ability to form a good amount of goals which can be
identified specifically.

4.3.1 QUALITATIVE USABILITY GOALS

Qualitative user goals are made to guide the design. As the name says it is used to maintain the
required quality of the end solution. The main focus here is to design the system according to the
specifications gathered to the user profiles and task analysis which is conducted in the beginning
stage of the project. Qualitative usability goals can be very useful in the beginning stages of the
project design. In the interface development stage which is the beginning stage in most of the
situations, it’s important to follow the qualitative usability goals in order to begin the project
going within the right track (Mayhew 1999; p126). Examples for qualitative usability goals can
be given as follows
1. The designed solution should support individuals who are occupied in a noisy
environment and which a lot of information can be seen on the screen, to remind them
and keep them intact with the system without from getting distracted.

2. The system should be able to be handled by people with different ages. The required
message should be conveyed to the user.

3. The designed system should support differently able people.

[ 78 ]
4.3.2 QUANTITATIVE USABILITY GOALS

Goals which have a quantitative task to be achieved are called quantitative usability goals.
Though qualitative goals are hard to be determined if they have been achieved by the end of the
system design. Quantitative goals on the other hand can be determined if they have been fulfilled
since they are so widely spread throughout the development of the whole system hence they can
be regarded as objective and measurable. These goals have a clear measurement of performance
and as a result of that developers can keep in mind to make sure they do the designing according
to the required quantitative target. Examples for such goal are as follows
1. Experienced users should take no longer than 3 minutes on average to finish
conducting a transaction.(For a bank teller machine)

2. Novice users should take no longer than 5 minutes on average to complete a


transaction.

3. (For a computer Game)A novice player should take no longer than 20 minutes to
completely gain the knowledge on the basic movements of the character.

4. An expert player should be able to finish any stage of the game other than the final part
within an average time of 3 hours.

5. (For a university online library system) a novice student (A first time student) should
be able to understand the gain the knowledge of the system within a time period of 5
minutes.

6. A normal student should have the advantage of viewing a pdf file within a maximum
time of 3 minutes.

[ 79 ]
4.3.3 TYPES OF QUANTITATIVE USABILITY GOALS

1. Ease-of-use goals- Takes a look at the use of the system by the users who are well
experienced and trained to use the product. It checks on the performance users achieve
through the use of the product. Developers basically focus on the attributes such as
speed, efficiency and flexibility which an experienced user obtains (Mayhew 1999;
p128).

2. Ease-of-learning goals- the main focus on this type of goals is to determine the
usability level of first time users. This can be applied even to the users who do not use
the system very much frequently. In other words ease-of-learning goals measure the
length and the slope of a user’s learning curve that is still in the process of mastering
the application (Mayhew 1999; p128).

3. Absolute goals- this type of goals have a specific number for the attribute it’s being
referred to. Both ease-of-use goals and ease-of-learning goals fall to this category since
they have a specific numbered value for the job the goal is made for (Mayhew 1999;
p128).

4. Relative goals- relative goals refer to the performance achieved by a user using the
built system with comparison to another system which the individual has been using
before. It can be an older version of the same system, a manual process or a different
system which does the same process. Example can be such as

1. Experienced users should take less time to do a money transfer from another
account compared with the time taken to do the same at bank X.

2. A normal user should be able to create a Page with Frames within a less amount
of time as compared with the previous version.

(Mayhew 1999; p128)

[ 80 ]
5. Performance goals- this type concentrates on the actual user performance in a
system. Usually the measurements for performance goals are time to complete a
certain tasks, number of errors or type of errors that is made by a system etc (Mayhew
1999; p128).

6. Preference goals- preference goals take a look at the amount of preferability a user
has compared with another similar system or maybe even a previous version of such a
system, based on the previous experience the person has gained in the past. Thought it
seems like this cannot be measured, it is possible to measure an amount of preference
a system can offer to a user since it’s a choice a user makes thus it’s possible to
determine if the user is satisfied with the system (Mayhew 1999; p128).

7. Satisfaction Goals- Satisfaction goals refer to the user’s amount of satisfaction in a


certain interface of the system. This can be measured in a scale starting from the
lowest satisfaction to the highest satisfaction (Mayhew 1999; p129). Examples as
follows.

1. Beginner user must rate the satisfaction with the ease of learning of the
game as at 7 on average on a scale given from1 to 10 where 1 being poor and
10 being extremely good.

2. A first time user must rate the satisfaction with the ease of using the teller
machine for money withdrawal as 3 on a scale given from 1 to 5 where 1
being “too much time consumed” and 5 being “very less time consumed”.

[ 81 ]
4.4 PRIORITISING USABILITY GOALS

It is very important to carefully select and organize the set of usability goals which is required to
create the correct, required system. Whether if it’s a simple function or a complex task to be
achieved, the development team must first understand the scope of usability goals which
supports the team to the maximum level at development stage. For a completely new system, it’s
recommended to concentrate on setting up goals that takes a look at the tasks which is been
included in the system. For a newer version of the system, it’s more useful to consider on goals
which talks about the functional properties of the system (Mayhew 1999; p130).
It should be mentioned that usability goals has to be finalised alongside with the opinions given
by the user’s, or company managers and project manages of the client side. The whole system
development is done based on these goals and it very important to carefully select the right type
of goals which is needed to build up the required system. Even the aspects of project planning
such as feasibility in all aspects (technical, economical, social etc.) can have a major impact if
the goals are not selected carefully (Mayhew 1999; p130).
After the usability goals are identified, the next thing to do is to prioritize the usability goals. It’s
better to consider the goals that are going to contribute a lot to the success of the project and put
them to the highest priority level. The least important goals can be achieved later on and can be
put to a lower priority level (Mayhew 1999; p130).

[ 82 ]
4.5 APPLYING OF THE USABILITY ASPECTS TO THE GIVEN
SITUATION.

In order to conduct the competitive analysis with subject to the food ordering systems, the
following two sites were taken for the task of competitive analysis in order to gain a good picture
on the similar systems and the behavior of them in the market.
1. Pizzahut UK website (http://www.pizzahut.co.uk)

2. Dominos Pizza website (http://www.dominos.com/home/index.jsp)

The criteria section was changed according to the attributes which was taken into consideration
on behalf of the usability of a system. Given below is the competitive analysis conducted for the
above mentioned sites.

Criteria Competitor A Competitor B


www.pizzahut.co.uk http://www.dominos.com/home/index.jsp
learnability  Easy to remember the  Names of the items are
type of food u need to memorable but some are too long
have because of the and the user might find it difficult
menus which are been to keep it in mind due to the
set up. variety of items .

 Easily understandable  Both English and Spanish


language is provided and languages have been provided
can be understood by a hence making the user who
person with a standard doesn’t know English use the
level of English system as well.
knowledge.
 All the food menus are well
 Step by step menus explained with the given toppings
enable the user to

[ 83 ]
complete the order and easily can be referred to
without missing any
steps.

Interface design  Colour combinations of  Simple interface design with tab


the interfaces are been form pages which makes user
designed according to easily accessible to the pages.
the theme colours of the
 Colour combinations are easy to
system and comfortable
the human eye but the page has
to the human eye.
too much white space on it.
 Animated banners make Making it look a bit less filled.
the site livelier and give
 Animated banners are not present
the user the active
in the page and the icons which
feeling of the site.
show the food items are simple
 text fonts used are fancy pictures.
and clear to the human
 Text fonts are well used and the
eye and is easily
language is easy to understand for
readable to the user.
the user.
 Main options such as go
 Has a big number of links and
back to the home page
they are clearly visible to the
help menu are clearly
user.
shown on the top of the
page and though they
appear small in font size
they can still be seen.

Utility  User can easily select the  Has only limited number of tasks
vide variety of tasks to be selected. But the gives tasks
from delivery to even are provided with variety of
ordering a table at a functionality.
outlet near to the user
 Additional requirements such as

[ 84 ]
etc. toppings are given as well but the
user needs to go to the page after
 User can select the
giving the delivery location.
desired set of additional
requirements such as  Provides a customer service link
toppings to be put to. with all the common questions
and answers but it’s down below
 Provides a help page
the page making it a disadvantage
where a user can look
for the user.
into the information
regarding the ordering
and other topics such as
finding a nearest
location, ordering a table
etc.

Safety  Users can do the  Users can do their payment


payment from a credit through credit card of using gift
card or at the time of cards as well.
delivery.

memorability  Easy to remember names  Easy to access menu tabs are


and menus are given for designed making the user go
the user to elect their through the food items within the
food same page without opening new
page for a new menu.
 Text fonts used in the
site makes the user’s  text fonts used are formal text
mind be intact of the fonts and give the site a much
items and has a chance random looking site look making
of keeping reminded of the user feel the formality within
the item. the system.

[ 85 ]
effectiveness  Users can order any type  A big variety of food items are
of food item given at the given in the menu hence the user
local outlet of the is given with the ability to select
customer from big range of products.

 The FAQ site provides  With size of small text and formal
users with common fonts, makes the site effective to
questions making it easy the human eye and with the too
for a user to refer to a much information given in the
problem and provides system makes the user feel
feedback section for uninterested about the item.
specified user problems.

Efficiency  User can either select  Set menus are not provided and a
from a menu or go select great amount of items are given
a quick set menu for a on the menu. This might make
given price. the selection of the desired item
take time.
 Users can select food
according to the age of  Menus are not divided according
the individuals such as to the age limit or any other
kids and adults. property of the food items.

4.6 FACTS GATHERED FROM THE COMPETITIVE ANALYSIS

 The final system should have simplified menus for the user to order food items. This has
to range from pizzas to beverages.

[ 86 ]
 The interfaces of the application should consist of colours which are domain to the
company and should be arranged in a pleasing way to the human eye.

 Font sizes and font types should be set in a way that the customer would enjoy ordering
the food using the system.

 The application should support old people on selecting food items using the system using
the touch screen.

 Users should be provided with help to learn the application if the individual is using it for
the first time and should have the ability to request employee assistance if needed.

 The application should contain the ability to do the payment using credit card or to
request for a cash payment according to the user’s choice.

 Animated icons and banners should be put on the system in order to give the user a good
experience and information on latest items.

 Tool tips should be put up in order to provide user with simplified information regarding
the options.

4.7 USABILITY GOALS DETERMINED FOR THE CURRENT SYSTEM


DEVELOPMENT.

[ 87 ]
4.7.1 QUALITATIVE USABILITY GOALS

 The system should be able to be operated by all types of individuals from children to old
people. The customer base for the company is wide and it should be considered to make
sure all the people who come to the pizza hut should have the capability of easily using
the system (High priority).

 The system should be an eye catching and efficient application. Since this is going to be
the main way of ordering food at the table, it should help the staff to give the order within
a short period of time so that the customer will be satisfied and feel a good difference and
an improvement in the service (High priority).

 The systems should contain as much as interactivity as possible with the customer. The
system acts as a waiter and it should be able to give the user the scenes of liveliness and
should not make the customer feel bored using the application (High priority).

 The system should provide user to select a payment method of their choice. A customer
should have the freedom to choose to pay by the Credit card or by cash (High priority).

 The system should have the ability to show information in all three languages. The
systems should provide an option for the customer to choose their preferred language
from Sinhala, Tamil or English (High priority).

 The user should contain a help section if the customer wishes to learn about the system if
he or she is using it for the first time. Since it’s a new concept and a new way of
operation, a person would feel uncomfortable in order (High priority).

[ 88 ]
4.7.2 QUALITATIVE USABILITY GOALS

 The error ratio into the number of system operation should be at least 1 per 1 million
operations.

 The number of false operations conducted by a novice user should per operation should
be less than or equal to 3.

 The system should be able to provide an order for a particular user within a ½ of the time
taken to give the same order using the manual system.

 The time taken for a novice user (completely new to the system) to complete a task using
the system (assuming the order was a regular size pan pizza) should be less than or equal
to 6 minutes.

 The time taken for an expert user (has placed over 10 order using the system) to complete
a task using the system (assuming the order was a regular size pan pizza) should be less
than or equal to 2 minutes.

 The time taken for a user to learn the normal ordering operations of the system should be
less than 3 minutes.

 The time taken to complete a payment for the order (after the customer pays the amount
using a valid credit card) should be less than or equal to 3 minutes.

[ 89 ]
4.8 CRITICAL ANALYSIS

As our assignment we were given to create an interactive application using any kind of an
authoring tool of choice. We decided to create an interactive food ordering system to the pizza
hut which is based on the touch sensitive technology and includes all the features which a food
ordering system has to offer. It’s a new concept as since the job of the waiter is being reduced to
jus serving the food to a particular customer ordered. The application contains all the basic
operations such as order food, check for new offers and pays the bill through the use of credit
card if the user wishes to do so. It’s mainly operated through the use of a card which is used to
operate the system and in cases where a card holder has two or more individuals (e.g.: children)
along with him/her they can have the advantage of choosing or ordering food on behalf of them
as well. Since it’s a conceptual solution we were able to come up with a good efficient and user
friendly solution within our knowledge limits. In the personal opinion I’m satisfied with the
solution while we were able to come up with but there are ways of improvement which can be
further achieved in terms of usability aspects which we followed throughout the whole process.
Many more features can be and has to be added in order to make it a safe reliable system which
customers would be highly satisfied and enjoy using it as a new concept in the restaurant
industry.
If we take a look at the functions and the implementation of the system in a context of usability
criteria, it would be easy to talk about the system in a critical manner. On the context of
learnability, the users are provided with help and tool tips in order to learn the functions which
are developed to make an order. The help is provided all three languages making it accessible for
all the users in different language backgrounds. It would have been much better if the system
was equipped with a language such as Spanish or French in order to make it easy for foreign
customers specially Europeans who do not use English as a secondary language that much.
When talking about the system according to the effectiveness of the system, the users get the
ability to place an order without any delay on waiting for waiter assistance. In the normal system
a customer will have to wait till a waiter comes and take down the order and at times due to the
lack of staff and the increased amount of customers, the time for a waiter’s assistance can be
long and there can be times when a person would lose his or her appetite because of the time
taken to take down the order. With this system, users can place the order and the waiter job is to

[ 90 ]
jus serve the order to the customers’ table hence the productivity rate of the company can be
increased due to the number of orders that is fulfilled during a time period compared with the
manual system. But the development of the inner functions of the system has to be very accurate
since it should be able to handle the huge amount of orders placed through the system.
The food ordering system offers an efficient solution as it makes the process of placing an order
more efficient and less time is consumed compared with the manual system. Menus are placed in
a much easier way with information required for the user to place the order and it’s easy for the
user to decide on what he/she is going to select and place the order. the time consumption is
reduced in a lot of way ranging from the time that a customer has to wait to place an order to the
time taken to pay the bill is drastically reduced since most of these functions can be performed
through the system hence making it much efficient than the use of a manual system.
The achievement of utility in the system can be talked as a good achievement as to it has simply
made user perform a valuable process without any kind of a latency or constrain. One of the most
powerful features of this system would be the ability to perform a transaction through credit
cards. The user can instantly do the billing without waiting for the waiter to produce the bill in
order to pay which can take a considerable time if the place happens to be busy at a particular
moment. But there can be more implementations done in the system in order to increase utility of
the system. The system can be added with improvements for differently abled people such as
voice recognition method to say the order by talking or by using an eye movement recognition
tools to which can support the differently abled. It may sound unorthodox but these implements
should be made in order to make it a good system that supports all the people without the barriers
of physical ability.
Memorability wise the system is designed even for the users who would use the system very
rarely it is easy to keep in track of the functionalities of the application since the operations are
easy to remember and even to revise again if the user happens to be a rare user. The menus are
created with eye catching graphical interfaces while protecting the company theme color
combinations and it’s easy for the user to recall the items and the menus are given in a simpler
manner with most relevant details for the user to select and place the order of their choice.
At the conclusion I would like to say that this system can make a big difference in the restaurants
and as well as in the field of human computer interaction as it is a new concept to be
implemented and that it can be made with carefully examination of the usability criteria and

[ 91 ]
through the use of modern usability engineering techniques to give the user a better solution in
order to full fill their day today needs.

[ 92 ]
REFERENCES AND BIBLIOGRAPHY

Sharp, H., Rogers, Y. and Preece, J. (2007) Interaction Design : Beyond human-computer
interaction, 2nd edition, John Wiley and sons Ltd.
(October, 2000) Windows User Interface Technical Articles: Usability in Software Design.
Microsoft Corporation (online) available: http://msdn.microsoft.com/en-
us/library/ms997577.aspx#uidesign_topic2 (Accessed on 2nd February 2010)
Nielsen, J., (1993) Usability engineering, Morgan Kaufman Publishers.
Mayhew, D. J., (1999) The Usability Engineering lifecycle: a practitioner’s handbook for user
interface design, Morgan Kaufman Publishers.
(August 21, 2006) Dan brown, competitive analysis, Digital web magazine (online), available:
http://www.digital-web.com/articles/competitive_analysis (Accessed on 07th February 2010).

[ 93 ]
SUBMITTED BY:
Nuwanthi Illukkumbura (CB002926)

INTAKE:
HF09B1 SE

MODULE CODE & TITLE:


CE00306-2-HCIU

ASSIGNMENT TITLE:
Individual Assignment

SUBMITTED TO:
Ms. Jina Daluwatta

DATE DUE:
09th February 2010

Asia Pacific Institute of Information Technology

[ 94 ]
5.0 DESIGN AND PROTOTYPE

5.1 WHAT IS DESIGN


According to Dix et al. (2005, p193), the word design can be stated with a simple
definition.
“achieving goals within constraints”
Here the word goals, according to Dix et al. (2005, p193), refers to the purpose to which
the system is being built, who are the targeted users and what the users will want from the
system. Constraints are restrictions that need be considered during the development life cycle
such as time, resources, standards, costs and risks.
Of course identifying these are not enough for the project to be successful. Developers
should identify trade-offs. Trade-offs is choosing which goals or constraints can be crossed out
so that several other goals can be satisfied. Trade-offs is important to consider because it helps
designers to come up with alternative methods which are able to satisfy several constraints than a
previous method undertaken. Good designers will always think, is there a better solution than
this, if I pick this alternative will I be able satisfy more requirements, are there any more
alternative solutions
Designing is not limited to one design solution or limited to a single try. Designs are
changed over and over again and drawn again and again according to new information they
receive throughout the entire development process.
When designing a system it is important to focus on the main entities of HCI. That is
humans and computers. It is very essential to understand both their natures to develop a
successful system. As human beings they are fast learners and also it is very likely for them to
make mistakes and these mistakes could become fatal errors or lead to a critical failure.
Computers on the other hand are not perfect either. If humans give them wrong data they will
always return wrong information, and due to a human error it is also possible for an entire
computer system to fail. It is in the designer’s hands to prevent the user from making such
mistakes or errors. A good design will not lead the user to cause such errors.
With that said, it is very clear the importance of design.
(Dix, et al.2005:193)

[ 95 ]
5.1.1 DESIGN PROCESS
According to Dix et al. (2005), the process of interaction can be broken into 5 stages as
graphical shown by the diagram in Figure.
 Requirements: Requirements can be gathered from the users through interviews,
observations, documents, questionnaires, ect. Any one or more of those techniques can be
used as seen suitable to gather information from the user to identify their preferences,
their tasks, how they do it, with what do they do it and what are their requirements.
 Analysis: Analysis is the stage where the requirements gathered from the user are further
evaluated to identify key problems and requirements. At this stage a task analysis can be
performed to recognize where the user is involved and what roles can the system play and
where the system will get into the picture.
 Design: At this stage designers should evaluate how the identified requirements and
solutions can be translated into a system. Here they should focus on principles, standards,
how to design for different users, different methods which can be undertaken for the user
to interact with the system.
 Iteration and Prototyping: Prototypes can be used to get the user’s feedback on the
design and modify the design accordingly.
 Implement and Deploy: Once the users are satisfied the final product can be completed
and deployed. Documentation and creation of manuals can follow afterwards.

Scenarios Guidelines Precise


Task Analysis Principles Specification

Requirements Analysis Design Implement and


Deploy
Interviews
Ethnography Dialog Notations
Architecture
what is there Documentation
vs. Help
what is wanted Prototype

Evaluation
Heuristics

Interaction Design Process

(Source: Dix et al.2005, p195)


[ 96 ]
5.1.2 DESIGN FOR THE USER
In most cases a system is not targeted for a single user. Designers therefore should
determine to whom the system they are building is for, and what kind of skill level the users
have. A good designer will not believe the user has the same capabilities as he does. They should
understand that different users have different skill levels and they should determine how people
in different skill levels respond.

5.1.2.1 NAVIGATION DESIGN


It is the navigation design which defines the structure of the system. According to Dix et al.
(2005) there are two kinds to observe.
 Local Structure
 Global Structure

Local Structure
It is important to let the user know where they are headed and whether they are heading, is where
they want to be. With this in mind Dix et al.2005 states 4 things users will look and think when
they are using an application or a website.
“Knowing where you are
Knowing what you can do
Knowing where you are going- or what will happen
Knowing where you have been- or what you’ve done.”
(Dix et al.2005: p 205)
Letting the user know where they are is important since it will help them decide where to go
next. In some applications or websites there is a dedicated space which shows in which page the
user was last and which page they are now and sometimes where they will go next. This is very
useful when they are in some sort of procedure like booking a ticket, applying for a web mail
account or ordering a pizza. The user can clearly identify where they are now and where they
will go next or what they were doing last.

[ 97 ]

(Source: Yahoo, 2010)


The position where the user is on the application or website can be shown in a bar, usually on the
top or sometimes on the bottom of the screen. Below as an example the procedure to order a
pizza online is shown.
Initially the user will be on the home page. From the Home page they can select whether they
want to go to order a pizza, soups or beverages (or any other item). Pizza will have several types
to choose from. Once a dish is selected they can go to the order screen to make the order. For the
ease of the user, where the user is now and where the user was before can be easily identified by
the following navigation bar.

Home Pizza Veggie Pizza Order

This can be shown to let the user know where they are by displaying the current page they are on
as the last. Taking the example above, if the user was on the page for Pizza then the navigation
bar will appear like this.

Home Pizza

The last element labels the current position of the user

Or if the user is to follow some kind of predefined procedure the steps that needs to be followed
can be shown in a bar and to indicate where the user is right now can be shown by highlight the
point where the user is from on the procedure. Yahoo this type of technique on procedures like
locating a mail account when the user has forgotten their password. Figure shows how Yahoo
helps the user realize the procedure they have to follow to get their password replaced.

[ 98 ]

(Source: Yahoo, 2010)


Why this type of designs is made is because as human beings we get uneasy and restless
when we think that something is going on and on forever. A real life example is, if a movie goes
on and on for a long time they will be impatient and agitated to know the end soon. It is good
practice to show boundaries for the user when designing. When the user sees the steps they need
to follow before hand, they know what they have to do and they’ll know when to expect the
results for the action they took.
It is also very important to let the user know what they can do from where they are. This
means, what links or buttons are available which they can click to navigate from where they are.
When having links or buttons it is important to let the user know that it is something clickable.
Websites used to have hyperlinked text in blue and underline but new websites today which are
created using new, advanced software uses other methods to indicate hyperlinked text like by
adding roll over effects. Buttons which are clickable can be indicated by highlighting it in a
different color and buttons which are not clickable can be shown in gray. Below are two
examples for those incidents. Windows operating systems follows the practice of graying the text
on the buttons which are disabled and enabled buttons’ text is usually displayed in black as seen
in figure below. The figure shows how Microsoft Word 2007 highlights buttons which are
clickable when the mouse pointer in moved on top of it.

Disabled

Enabled

(Source: Author’s Work) [ 99 ]


Highlighted
Knowing “where you are going” is also very important. Why a user uses a system is to
get a job done. When they are on the process of doing so, they will not like surprises or time
consumption on their way. This can be minimized by letting the user know where they can go
next. It is not in the book of good design practices to make the user click a button to find out
what it will do and have them go back if that’s not what they want. It is always more effective if
the user can know what it will do before they have to test it.
Of course it is not advised for designers to give long descriptions on everything on the
screen to give the user a better understanding. But there are several techniques designers follow
to give on screen help like tool tips. And it is very important to name buttons or hyperlinks with
a suitable name which is visible and will communicate what will happen if it was clicked to the
user.
Once a user has performed some sort of action they would like the system to report them
whether what they have done did what they wanted to do or whether the system was unable to do
it.

Global Structure
According to Dix et al. 2005, this is the structure of the overall system. Usually a system can be
shown in a hierarchical representation. For example a system in a DVD/CD renting shop would
have a hierarchical structure to define relationships between entities as follows.

(Source: Author’s Work) [ 100 ]


Structuring the hierarchy of screen depends on the use of the screens. Taking the above
example of the DVD/CD renting shop, here the information is structured as shown in figure
above to ease the use. If the shop manager wants to add a new customer they will simply look
under “Customer” to add a new record whereas to add a new movie that came to their stock, he
would simply know to look under “Inventory” for an option to add the new arrival.

5.1.2.2 SCREEN DESIGN


Screen design is another important aspect in designing an application. When designing a
screen, designers should identify to what purpose is the screen catering, what information the
screen is expected to give, what the user have to do in this screen to get what they want. To make
it easier for the users several techniques introduced by Dix et al.(2005: p212) are explained
below.

Grouping Related Items


In the example we took before of the DVD/CD renting shop, information related to the customer
are grouped together and is given the name “Customer” and the information related to inventory
control is grouped together and is called “Inventory”. Therefore it can be said that related items
should be grouped together. Separating these related items can be done using different colors as
seen in figure below or using borders also known as “Frames” or “Group Boxes” in
programming languages such as Visual Basic.

Here in the figure below is shown a small portion of a person’s bio-data. This has
grouped together and has separated personal data such as name, date of birth and personnel
telephone number from the occupation related information such as the occupation, company
name, and company telephone number. Also once these related items are grouped, these groups,
text fields and buttons should be in a particular order where the user will understand what needs
to be done first. For example if a user is filling out a form they would be more comfortable with
a layout as seen in figure below instead of having a layout which has text fields here and there
and at every corner.

[ 101 ]
First Name
Last Name
Date of Birth
Tel.

Occupation
Company Name
Tel.

Alignment
Alignment of items is also important since it will separate certain information. The diagram
below extracted from Dix et al. (2005: p214) will explain how alignment helps users get a better
understanding.

(Source: Dix et al. 2005: p214)


Here in the images presented by (ii) and (iii) clearly helps the user identify the writer’s
surname and the first name whereas the image shown in (i) is quite difficult to identify if there is
a large number of people. Even the table of contents of these report is aligned in such a way that
users will quickly understand where they will have to look to find what they want.

[ 102 ]
(Source: Dix et al.2005: p215). )
When having multiple columns the space between the two columns comes into
consideration when both have some sort of relationship. In both Table of contents and figure
above have a relationship with the In the table of contents the chapter name is accompanied by
the page number and in one column represents the names of food items on sale in a shop,
accompanied by its price shown on the right hand side of the screen. Of course when the distance
between the two columns is enormous it is difficult to trace between the numbers and the items
on the list as illustrated as (i)But when there is some kind of support or aid to track between the
two columns, it is easier. How it’s made simple is shown by (ii) and (iii) .The image shown in
(iv) is a good method to use when the numbers are looked at frequently.

[ 103 ]
Space
Space is also an important feature in designing. Space can be used to show separations between
items or text or even to highlight certain things on the screen. Dix et al. (2005: p216) has shown
three ways space can be used to separate, structure and highlight.

(Source: Dix et al.2005: 216). )

Designing Forms
The most complex type of layout to design is forms. This needs much more analysis than any
other type of screen. In forms, designers should understand how to organize the order of how the
user will enter information, decide what information they should enter, how it’ll be easier for
them to enter, will they understand the structure of the form, how to structure the form so that
users can easily understand where what should be entered and will they understand to provide
the correct information to the correct field. These should be looked into before creating a form.
Alignment matters in form designing.

(Source: Author’s Work)

[ 104 ]
First Name

Last Name

Tel.

Address

First Name

Last Name

Tel.

Address

To make it easier for users to understand where the information should be entered, some
designers follow the practice of having the title on top of the text box as seen below.

First Name Last Name

(Source: Author’s Work)


(Source: Ms Office, 2010)
[ 105 ]
Consistency
Consistency matters. As human beings users are fast learners and also very resistant to change.
Once they get used to a particular environment they prefer the environment not to change. This is
Ms should
why each layout Word be built according to the same standards. Ms Power Point can be applied
Consistency
within an application or a couple of related applications. Microsoft Office applications have the
same set of rules, layouts, and standards. They are not only consistent within the application but
all the applications together are also consistent.

(Source: Ms Office, 2010)

(Source: Ms Office, 2010)


[ 106 ]
Microsoft Office applications have buttons with consistent labels not just within the application
but also between related applications such as Power Point, Access, Excel, ect.

Ms Word Ms Power Point

Bold

Italics

Underline
(Source: Ms Office, 2010)

Figure is a screen shot from Ms Word whereas the shown in the Figure is a screen shot from Ms
Power Point. The buttons to turn text to “Bold”, “Italics”, “Underline”, to change the font, font
size, color and increase/decrease font size in Ms Word are all indicated by the same labels in Ms
Power Point. This is because users who are used to Ms Word will find learning Ms Power Point
easier since they now identifies what the button does.

Shapes/Appearances
Shapes of a particular object define what the person can do with the object. For example the
circle shape of the steering wheel of a car tells whoever drives it that it can be turned. In a similar
way the appearance of an object in a computer system also tells the user what they can do with it.

[ 107 ]
If there are buttons which takes on the shapes shown in Figure, usually on the very top or very
bottom of the screen, users simply understands that it means they can navigate left or right.

Icon to start recording a macro Progress bar to show a file being saved.

[ 108 ]
5.2 DESIGN CONCEPTS

5.2.1 SHNEIDERMAN’S “EIGHT GOLDEN RULES OF INTERFACE DESIGN”


Strive for Consistency

Consistency is important. Humans may learn fast but they prefer to be in an environment that
they are used to. Change can have negative effects on the user. In an application or a website
once the user is familiar with the layout they will have no problem finding their way through that
page again. If the application or website uses the same icons, labels, layouts, shortcuts, color
schemes and placements of items consistently users will have no difficulty getting a task done if
they navigate away from where they are to another screen on the same system or website. But if
the layouts aren’t consistent the users will have to learn and get familiar with the entirely new
layout, all over again. This will take off precious time of the user who is trying to get a job done.
Enable frequent users to use shortcuts

Depending on the system, its users can vary from expert users to novice users. Expert users
might not want to waste their time browsing through menus to find what they want. Instead they

might prefer something faster like shortcut keys or commands. Even being novice users once the
End: Once password is changed a message will appear to confirm the process is over.
user is comfortable with the system they’d prefer to get their frequently done jobs, done faster.
This is where the need for shortcuts comes in.
Offer informative feedback

(Source: Facebook, 2010)


[ 109 ]
Once an action is given to the system to perform the user would expect some kind of response
from the system stating whether the command the user gave was successful or not. Feedback can
be given in various ways for different purposes.
Microsoft Office applications use a separate bar at the bottom of the screen to show the status of
current application. This bar can be used to convey messages in the form of text, icons or
progress bars.

Icon to start recording a macro Progress bar to show a file being saved.

(Source: Ms Word, 2010)

[ 110 ]
Design Dialogs to yield closure

Designs should be made in a way that there should be a beginning, middle and an end so that the
user will not feel it is endless. As an example let’s take the steps involved in changing your
Facebook password.
Beginning: Go to “Account Settings” and click change password.

Middle: Enter the old password and the new password on the given fields.

End: Once password is changed a message will appear to confirm the process is over.

(Source: Facebook, 2010)


[ 111 ]
Offer error prevention and simple error handling

Users might not be able to understand the error a system throws. Therefore the design itself
should prevent the user from causing an error to occur. If an error does occur the system should
help the user to recover from the error instead of leaving them stressed and confused. The system
should provide information and links to show how the user can recover from the error.
Permit easy reversal of actions

Users should be allowed to do some kind of roll back on their activities. Any web browser allows
users to go back to where they were before. This is seen as a way to encourage users to navigate
through the application or website because they know if they made a mistake they can roll back
and start all over again.

Support internal locus of control

Forward
Back

(Source: Mozilla Firefox, 2010)


Support internal locus of control

Humans would like to feel in control. So in a computer system, rather than the human being the
one who provides the answers, it should be designed in a way that the users are the ones in
control, and the ones who are commanding the computer. Not the other way round.
Reduce short-term memory load

A user’s short term memory capacity is not enough to contain a massive amount of information
or conduct large processes. Good screen designs will reduce the load the user has to remember
by “keeping displays simple, consolidating multiple page displays and providing time for
learning action sequences.” (Dix et al.2005: p283) (Bell University, 1998 cited Schneiderman,
2004)

[ 112 ]
5.2.2 NIELSON’S GUIDELINES
Visibility

Options on a particular screen should be visible to the user. If not they will have to waste time
they can use to acquire information on searching how to get the job done. Different designers
have come up with alternative and creative ways in which they can make everything visible to
the user. Most common practice would be not to make the screen too crowded. It is good to have
everything in one page so that the user doesn’t have to remember a lot or navigate into multiple
pages. But crowding one screen only makes it difficult for the user to find their way through the
page and also make them feel stressed.
Feedback

Feedback comes in many different forms and for different purposes. In computer terms feedback
is given to users to inform them of the results, progress, completion and abortion of a process or
action that they have performed. Once a user has performed an action they expect some sort of
feedback. How the feedback is given depends on what and how large the process is.

In processes which are not large and which doesn’t consume much time will give instant
feedback, usually through message boxes. Below figure shows the message box which prompts
in Ms Word when the user clicks the close button with an unsaved document open.

(Source: Potosnak, 2001)

[ 113 ]
(Source: Ms Word, 2010)

If the system processes something larger like moving a large file to another folder in the
computer, progress bars are used to help the user identify how much more does he have to wait,
how much of the process is done. Such a progress bar is shown in below.

(Source: Windows XP, 2010)


Constraints

Constraints are a sort of limitation than is applied to minimize the user making errors. Errors
caused by users can be led to unimaginable errors. Therefore it is good practice to minimize
these errors by applying validations and automating user input by including combo boxes, radio
buttons, check boxes, list boxes or drop down menus.

Mapping

Mapping is the placement of objects in a way that the user will understand how to use it.

Consistency

Consistency is using the same layouts, structure and other components such as labeling buttons
and what buttons do, throughout the entire application or website. Consistency is thoroughly
explained previously.

[ 114 ]
Affordance

Once a person takes a look at a certain object they will understand how to use that object. This is
called affordance.

(Nielson, c.1990)

5.3 TYPES OF DESIGN


After analyzing users, tasks, requirements and usability goals, the next step in the HCI
life cycle is to design the system or application. The design stage can be mainly divided into 2
parts, Conceptual design and Physical design.

5.3.1 CONCEPTUAL DESIGN


According to Potosnak (2001) conceptual design is, “construction of the ideas or
concepts that a user needs to learn about what a product is, what it can do, and how it is intended
to be used”.
Once users and user requirements are identified the next task is set for the designers.
Designers are entrusted to have these requirements gathered designed in the form of a user
interface. Building the conceptual design is first started by defining to what purpose the system
or application is being designed. Next is to identify what and where the users will be involved in
the system, and how the system can be designed in order to satisfy their requirements.
Constraints and objectives should be defined in order to design a proper interface with
less repeating activities, let the user to be more in control, and provide feedback.
Next few steps involve defining what the users will need, the tasks they will have to perform and
design the user interface based on these findings.

[ 115 ]
If we illustrate the steps followed in conceptual design it will look as follows.

Requirements Gathering
and Analysis

(Source: Potosnak, 2001)

5.3.2 PHYSICAL DESIGN

In the conceptual design designers have identified the purpose for the system, the user’s
requirements and what can be included in the design so that those requirements can be satisfied.
Next in this stage of the project the conceptual design should be balanced with the physical
design. The conceptual design is creativity and alternative methods decided to solve user
problems and meet requirements all pooled together. Physical design is the actual stage where it
is decided whether these ideas or designs can be implemented. For example, a team which is
designing an interface for a mobile phone can design beautiful, user friendly and creative
interfaces which satisfy the user but after designing the next step would be to decide if these
interfaces can be displayed in the small screen of the mobile phone.
(Rogers et al. 2007: 551)

5.4 WHAT IS USER CENTERED DESIGN?

As the name defines it, User Centered Design is where the designing stage of the application or
website is focused on user involvement. At each predefined points a prototype is presented to the

[ 116 ]
end-user and the contractors to receive their comments, feedback and to identify areas which
seems confusing or difficult to the end-user.
(Bell College, 2005)
Parallel Design
Once the user requirements and problems are identified all the designers in the designing
team are to create and present different designs for this common system. This is a very useful
method to identify an efficient way to overcome problems that were identified in the current
system and alternative methods that can be used to satisfy user requirements since several ideas
and approaches will be brought up by the designers.
(Usability.gov, n.d)
Participatory Design
Parallel designs can be tested with users and elements which are approved by the users
can be combined together to create one system. The participatory design is created with several
stakeholders getting together and discussing the useful aspects of previous designs and things
that can be added. Participatory design is the foundation to start designing for the final product.
Participatory designs are useful since it increase the chances of finding problems, and a diverse
pool of solutions in different people’s point of view can be acquired.
(Gaffney, 1999)
Iterative Design
This stage is where a prototype of the participatory design is first built and presented to
the end-user. Once the prototype is tested with user, evaluation, feedback and new problems
identified are documented. According to these discovering the prototype is further evolved into a
newer version and is again presented to the user for further feedback and problem identification.
This stage keeps repeating till the user is satisfied and the contract come to a mutual agreement
that the final product is ready to be published.

[ 117 ]
Parallel Design

Requirements Gathering
and Analysis

Participatory Design

Iterative Design

First Modify
Evaluation
Prototype Prototype

Final
Product
[ 118 ]

(Source: APIIT lecture slides, 2010)


5.5 PROTOTYPE

5.5.1 WHAT IS PROTOTYPING?


Prototyping is a way of letting the primary stakeholders get used to or get to know the
look, behavior and functionality of a system before the final product is made. At different stages
of the system development life cycle, according to different requirements a suitable type of
prototyping is selected.
Prototyping can be paper based or software which can be used to test with users before
implementing the final product. Why prototyping is useful is because it is a very effective way to
communicate with the users or the contractors (also known as stakeholders). Rather than explain
the functionality or the appearance of the system verbally, prototypes can help to let the user test
the product and learn it so that they can give informative feedback. This is also an opportunity
for the designers to identify the capabilities, limitations of the system, problem areas, clarify
confusions and get honest feedback from the user by observing their behaviors towards the
system.
Prototypes are given to users so that designers can evaluate the user’s behavior and areas
that needs to be modified in the prototype. Once problems are identified, designers will build a
second prototype with the identified problems solved to evaluate it for the second time.
According to Dix et al. (2005: p220),
“This type of evaluation intended to improve designs, is called formative evaluation.”

[ 119 ]
Formative evaluation will be done iteratively till the users and the designers are satisfied with the
prototype. This is when the final product will be made. Then comes the summative evaluation,
“which is performed at the end to verify whether the product is good enough”
(Dix, et al. 2005:220)

[ 120 ]
5.5.2 TYPES OF PROTOTYPING
There are several types of prototyping techniques but all of them can be categorized into to two
main types.
 Low fidelity prototyping
 High fidelity prototyping
(Bell College, 2005)
Low fidelity prototyping
This type of prototyping focuses more on letting the user get an idea about what the system will
look like rather than how it will function. Functionality in this type of prototyping is usually less
or no functionality at all. Low fidelity prototyping is usually used at the very earliest stages of
the design life cycle almost as early as when developing the conceptual design. This is because
since it is not costly or very time consuming to build, this type of prototyping can be used to
cater changes in the design endless times until the user is satisfied.
There are several types of Low fidelity prototyping as well.
(Rogers et al. 2007: 531)

Sketches/Paper based Prototyping


The simplest form of prototyping is the paper based or sketching prototyping techniques. This
type of prototyping can be used if the application that is being modeled for the end-user does not
require a lot of functionality and does not need to display complex information to the user. This
sort of prototyping is only limited to paper designs which can be later evolved with corrections.
Paper based prototyping is usually used at the very early stages of the development life cycle
since more detailed prototypes with interactivity is more suited for later stages.
Paper based prototypes will show placement of buttons, text fields, combo boxes, list boxes, tabs
and labels so that the user can identify the behavior of the system. Users usually interact with this
type of prototypes visually and orally. This is a very useful method for designers to identify areas
which confuses the user, broken navigation, and missing options. It is also very convenient
prototype since corrections can be easily made to the design.
(Thomson, 2009 )

[ 121 ]
Storyboarding
In storyboarding, a series of screens which are sketches of the system are drawn to show the
procedure a system follows when the user wants to perform a certain task. Storyboarding can be
hand drawn images of the screens or can be drawn using drawing software such as Flash,
Photoshop or Illustrator. This series of screens are usually described as to what will happen if the
user clicked a particular button that’s shown in the screens.

Index Cards
These are small rectangular cards which has different screens drawn on them. Users can interact
with these cards by touching the paper surface. The response for the action the user will be
shown by another card or orally told by the instructor.
(Rogers et al. 2007: 531)

[ 122 ]
High fidelity prototyping
Instead of using paper based prototypes which can be easily modified but are not even close to
the final product, high fidelity prototypes are more detailed and are very near to the finishing
product. These types of prototypes are made using special software such as Visual Basic, Flash
or SmallTalk. High fidelity prototypes are useful for designers to test their new ideas and to
identify technical problems and it is also very useful to get user comments since it is more
understandable.
(Rogers et al. 2007: 535)
Computer based
 Vertical prototyping
It only implements the very important features and omits most features. In other words it’s fully
focused on the functionality of the system and it allows users to carry out real tasks.

 Horizontal prototyping
Even though screens are fully compatible, users will not be able to perform real tasks since this
type of prototyping focuses on the system’s interface rather than functionality.

 Scenario
Features and functionality in this kind of prototype is reduced and the users can only interact
with the system in predefined paths.

Wizard of Oz
In wizard of Oz prototyping the user is given the impression that they are interacting with the
actual computer system (or a functioning prototype) but without their knowledge they are
actually interacting with another human being whose responding to their requests.
(Bell College, 2005)

[ 123 ]
6.0 REFERENCE

Bell College(2005), Prototyping, [Online] available:


http://hamilton.bell.ac.uk/btech/hci/hcinotes17.pdf [Accessed 10 Jan 2010]

Bell College (2005), Guidelines and Standards [Online] available:


http://hamilton.bell.ac.uk/btech/hci/hcinotes16.pdf [Accessed 7 Jan 2010]

Bell College (2005), User centered Design, [Online] available:


http://hamilton.bell.ac.uk/btech/hci/hcinotes12.pdf [Accessed 7 Jan 2010]

Dix, Alan., Finlay, Janey., Bowd, Gregory.D., Beale, Russell., (2005) Human-Computer
Interaction, 3rd Edition, Pearson Education, Ltd

Thomson, Reynard (2009). What Is Software Prototyping?, [Online] available:


http://www.reynardthomson.com/what-is-prototyping.html [Accessed 7 Jan 2010]

Rogers, Yvonne., Preece, Jenny., Harp, Helen., (2007) Interaction Design, 2nd Edition, John
Wiley & Sons Ltd: England.

Gaffney (1999) Usability Techniques ,[Online] available:


http://www.infodesign.com.au/ftp/ParticipatoryDesign.pdf [Accessed 7 Jan 2010]

Usability.gov( n.d), What is parallel design, [Online] available:


http://www.usability.gov/design/paralleldesign.html[Accessed 7 Jan 2010]

Potosnak, Kathy(2001) What Is Conceptual Design? [Online] available:


http://www.interfaceconcepts.com/concept.htm [Accessed 7 Jan 2010]

[ 124 ]
7.0 BIBLIOGRAPHY
Ambler, Scott.W., (2009). User Interface Design Tips, Techniques, and Principles, [Online]
available: http://www.ambysoft.com/essays/userInterfaceDesign.html [Accessed 7 Jan 2010]

AskTog (n.d). First Principles of Interaction Design, , [Online] available:


http://www.asktog.com/basics/firstPrinciples.html [Accessed 7 Jan 2010]

8.0 TESTING

8.1 HEURISTIC EVALUATION


Heuristic evaluation, developed by Nielsen and Mohlich(1990) is a technique used by designers
to test if their designs cater usability. According to Nielsen(1990), he has identified 10 heuristics.
Visibility of system status
Users should be aware of the status of the system, that is they should receive informative
feedback from the system. This is generally useful once the system has performed a task for the
user; the user should be informed whether the task was completed, failed or still progressing. As
discussed in Design and Prototype, the status of the running system or the status of the system
after an action has been performed can be shown in various ways.
Match between system and the real world
A system is usually targeted for a large, diverse group of people. Knowledge and skill differs
from human to human. Taking this into consideration, designers must understand that, not
always do their users have expert knowledge. Therefore a designer should always concentrate on
its novice users.
User control and freedom
Users are prone to make errors. As intelligent creatures, users also learn from these mistakes. A
good system design will not discourage a user to move further after making a mistake. It is good

[ 125 ]
practice to include some sort of roll back (undo) mechanism in the system so that users can go
back to where they were.
Consistency and standards
As discussed in previous chapters, consistency in a system or application is important.
Consistency is not only having the same colors and layouts throughout the application. It is also
having consistent patterns to get a certain job done. For example, if the user sees a certain button
in one screen and sees the same button with the same labeling in the next screen, the user
believes that the button will perform the same actions as the previous one. If it didn’t this is a
cause to surprise the user.

Error Prevention
Instead of waiting for the user to make a mistake, as a good designer you will predict the kind of
mistakes a user can make and take action accordingly.
Recognition rather than recall
Short term memory capacity of the user is limited. It is unacceptable to let a user remember
many things. Good designs will keep their screens simple and allow on screen help, or allow
users to retrieve information they are looking for easily.
Flexibility and efficiency of user
Even though novice users might prefer to get their jobs done slowly and carefully in the
traditional way, expert users might want to get things done faster by using short cut keys or
invisible commands.
Aesthetic and minimalist design
Always include the most wanted information. If all the unnecessary information are also
displayed it will minimize the incidence of users noticing the important information.
Help users recognize, diagnose, and recover from errors
Once an error has occurred, users should be guided as to how to recover from the error instead of
abandoning them.
Help and documentation

[ 126 ]
In rare occasions, when the system is straightforward it is unnecessary to provide documented
help. But it is always healthier to provide users with help as to how to use the system.
(Nielsen, 1990)

[ 127 ]
8.2 FORMATIVE TESTING
According to Rogers et al (2007, p 588) When a product is evaluated during design to find out if
the solution has been able to meet the requirements of the user which was able to meet earlier in
the stage is called formative testing. This method of evaluation covers a wide area of the design
from the very beginning of the development of the system sketches to finalizing the perfect
working solution and continuing to maintain the product.
Key roles of Formative testing
Based on the facts according to Allen Nan(2003) we can define the key features of formative
testing according to the computer application standards. They are
1. Rapid feedback. Mainly provide continuous feedback on the systems’ efficiency of
conflict management and resolution work. While the project is still continuing, this
provides feedback on the development of the application.
2. Documentation. A formative testing process can document how a application is is
progressing in its development the techniques used and the impact made in the beginning
and middle sections of work. It can be highly useful in a later time to review
documentation of the progress of the development in order to do any further development
in upcoming versions of the project.
3. Planning. Formative evaluation helps planning and allows for revision of or
recommitment to plans. When a formative evaluation process shows the application has
been going out of the scope, the people who are in charge of the work has the ability to
revise their plans in order to continue with the new additions or to master the existing
functions.

8.2.1 TYPES OF FORMATIVE EVALUATION


There are many types of evaluating methods such as observations, interviews, surveys, analysis
etc. which can be a par in the process of formative evaluation. within the range of formative
evaluation, there are four primary goals for formative evaluation approaches which each of it
will more or less emphasize on the requirement and the objectives of the program.
1. Planning evaluation. Planning evaluation simplifies and determines the plans of the
project. This involves checking if the goals and timelines are appropriate. It checks for

[ 128 ]
the suitability of the goals and timelines and if the methods implemented to reach the
requirements. Furthermore, a planning evaluation can lay the ground work for future
formative and summative evaluations by developing indicators (Allen Nan, 2003).
2. Implementation evaluation. This step concentrates on the focuses on the subject to
which a program is proceeding according to the schedule. Designers can check on their
application development of the product if they find out the team is going out of the scope
of development (Allen Nan, 2003).
3. Monitoring evaluation. This action is conducted by an external source of evaluation
during the time of the development. The observer may choose to monitor implementation
of a conflict resolution project by way of like going through a workshop, having
discussion with the people in the project. For long-term conflict resolution work, a
monitoring evaluation can provide a funder useful reassurance that money is being well
spent (Allen Nan, 2003).
4. Progress evaluation. This determines the progress of the system. The main goals of the
system should work as a benchmark for the purpose of measuring the system progress.
Information obtained through this can be used in a summative evaluation later on (Allen
Nan, 2003).

[ 129 ]
8.0 CRITICAL DISCUSSION AND APPLICATION OF DESIGN
AND PROTOTYPE

8.1 REQUIREMENTS
The main target is to let the user be fully in control of the system, and to eliminate the problems
identified in section 2.1.

8.2 ANALYSIS

8.3 DESIGN
Since the system we’re building is based on touch screens we have looked into some design rules
that designers follow to design interface for touch screens.
When designing for a touch screen use large buttons. As the designer, they wouldn’t know the
size of the user’s fingers since it differs from one another. So it is always better to design for a
user with large fingers.
It is also important to have sufficient space between buttons so that users will not accidently
click another button which is placed nearby.
Buttons should be labeled in a way that the user will understand what the button does. It is
always better to use words, rather than symbols to label a button.

(Source: Strauss, 2009)


Touch screen systems should be kept simple and straight forward, especially when they are being
designed for a group of diverse users. Multiple windows, multiple clicks, drag and drop should
be limited to reduce complexity of the system since it is not always that a user will understand

[ 130 ]
how to deal with it. Also do not overwhelm the user with many choices. It will be difficult for
them to understand what they really have to do to get a job done.

In our case we’re designing an ordering system so as to omit the reason to call a waiter.
Therefore it is important to guide the user through the application and provide on screen help as
much as possible. (Tyco Electronics Corporate Website, 2009 and Strauss, 2009)

Strauss , Morgan. (2009) Labeling Touchscreen Interfaces,


[Online]. Available http://blog.guifx.com/2009/07/15/labeling-touchscreen-interfaces/
[Accessed on 7 Jan 2010]

Tyco Electronics Corporate Website (2009) Touchscreen Application Tips, [Online]. Available
http://www.elotouch.com/Support/TechnicalSupport/10tips.asp [Accessed on 7 Jan 2010]

[ 131 ]
8.3.1 PARALLEL DESIGN
At this stage our group members have drawn three different parallel designs for the entire
system.
8.3.1.1 Tharanga Nuwan Chandrasekera

Welcome To Pizza Hut

Select your language

ENGLISH SINHALA

TAMIL URDHU

OK Cancel

Users have to select the language 1st in order to use this system, after user has selected preferred
language, entire system will change it to that particular language.

[ 132 ]
Welcome To Pizza Hut

Enter the Number of Persons:

OK Cancel

After table get switch on it will prompt a one question to get the number of users which have
come to eat. Table is divided into 6 parts virtually. Only 6 people can sit around the table and
chairs have been fixed to weight sensors, which will identify what are the places that people
are seated, and according to that; table will restart again. If the person who got the card can
order the menus for the others or he can give that right to other partners.
If the card holder wants he can set the budgets to the each person or he can set a budget to the
table.

[ 133 ]
Main Menu: Pizza Hut

PIZZA RICE

SOFT DRINK STARTERS

FOOD DRINK OTHER

OK Cancel

This system will be a complete touch system base one. So user can select the necessary food
items by pressing the symbol. Every item is been represent by using letters as well as using
animated pictures.
So anyone can feel and understand what they are going to order.
These menus will be interactive and has lots of animations which will give a good feel about
the food to the user.
It will give a good impact on the user as well as to the restaurant.
As User clicks the DRINK button it will take the customer to a new screen which will show
the real size image of the glass, so user will be aware of what he/she going to order.

[ 134 ]
Drinks Menu: Pizza Hut

OK Cancel

This screen will show the drinks which are available currently in the restaurant. So user will be
able to select one drink using touch system.
When user select a particular drink user will take to a new screen which will show a real time
animation to that drink, which will give a better feeling to a user.

[ 135 ]
Drinks Menu: Pizza Hut

120/=

OK Cancel

User can select the drink and he can see the drink which they going to buy and price of it.
This is completely touch system so user will not be get board when using it.

[ 136 ]
FINAL ORDER: Pizza Hut

Person 1 Person 2 Person 3


Pizza 1 Pizza 1 Pizza 2
Coca Cola 1 Coca Cola 2 Fanta 1

REORD REORD REORD REORD


ER ER ER ER
Cancel 3220/=
ORDER

Card holder will get a final menu of the each user. So he can accept it or he can reject it and
asked that person to reorder it. After he is satisfied with the order he can approved the order.
Then entire table order will send to the kitchen.

[ 137 ]
8.3.1.2 Nuwanthi Illukkumbura

The first time a customer walks into the restaurant they will be given a card. This card
will be then placed on the table somewhere in front of where the person is sitting. A family
would only get one card.
The table will be divided into 6 equal areas for each member who’s sitting as shown in
Figure 1. When this card is placed somewhere in the area that belongs to the card holder, the
table will be activated.

[ 138 ]
English

isxy,

தமிழ்

First it will show a screen which will allow the customer to select the language he/she
wishes. This is shown in Figure 2. This screen will appear on everyone’s screen. Once the
language is selected the menu will be shown. The menu screen differs from the card holder’s
screen to the other members.

[ 139 ]
Cheese Pizza Cheese Pizza Cheese Pizza
Rs. 2000 Rs. 2000 Rs. 2000

Cheese Pizza Cheese Pizza Cheese Pizza


Rs. 2000 Rs. 2000 Rs. 2000

A screen similar to the above will appear for the card holder. Along with the menu items
there is a sidebar as well. An enlarged version of the sidebar is given below.
When the “Set Budget” button is pressed a screen will pop up as shown in the figure
below. The user can enter their budget and hit the submit button. Once the button is clicked they
will be taken back to the menu screen, but this time only dishes that fit their budget will appear.
In the “List of Order” section all the orders approved by the other members will appear.
If an order needs to be cancelled the card holder can simply click, drag and drop it off the list.
The total amount of this whole list will appear on the small area reserved for that purpose.
When the “Send Order” button is clicked the order will be sent to the restaurant staffs
who evaluates these orders and a feedback message will appear on the screen as shown below.

[ 140 ]
Set Budget

1 2 3
List Of Orders
2 Cheese Pizzas 4 5 6

4 Chicken Pizzas 7 8 9

1 Veggie Pizza 0 Submit

Your Order has been sent.


Total
Thank You!! 

Send Order

[ 141 ]
Cheese Pizza Cheese Pizza Cheese Pizza
Rs. 2000 Rs. 2000 Rs. 2000

Cheese Pizza Cheese Pizza Cheese Pizza


Rs. 2000 Rs. 2000 Rs. 2000

This is the screen which appears for all the other members. It simply has all the menu items as in
Figure 5. Customers can navigate through these menu items using the next, previous arrows. To
enlarge menu item users can simply click on them.

[ 142 ]
Cheese Pizza Rs. 2000
Ingredients : 2  teaspoons  olive oil, 1  cup  fat-free
bottled pizza sauce, 2  cups  (8 ounces) shredded part-
skim mozzarella cheese, 1/2  cup  (2 ounces) grated
fresh Parmesan cheese
Order

An enlarged menu item looks as shown in Figure 6. It includes the name, price and ingredients
of the item. The purpose of including ingredients is because, in case a customer was allergic to
some sort of food or spice, they can simply check it here.
If the customer wants to order the enlarged item they can click the “Order” button, and the order
will be added to the “Order List” of the card holder’s.

[ 143 ]
1 2 3

4 5 6

7 8 9

The restaurant will have a layout of how the tables are placed in the restaurant. This is
shown in a touch screen. When an order is sent by a table, that particular table will be
highlighted in some color to indicate an order has been received.

To check the order the staff member has to click the colored table and a screen like in Figure 8
will appear.

[ 144 ]
Table 4 Welcome
2 Cheese Pizza Rs. 4000.00
4 Chicken Pizza Rs. 6000.00
1 Veggie Pizza
Menu
Rs. 2000.00 Special offers

Total 12,000.00

Print

This screen shows the order made by the selected table and the total amount to be charged. If a
customer wants to make another order after the first order it will be added to this list. Finally
when the customer is to make payments the print button can be clicked and the bill for that
customer will be printed.
After the print button is pressed, the temporary data that was saved for that table will be cleared,
and will be ready for a new entry.

[ 145 ]
8.3.1.3 Thaveesha Gamage

Beverage Starters Pizzas

Welcome

Place the order Total

Swipe the Card


Scene1 of 5
Description: This is the welcome screen which appears on the table.

[ 146 ]
Welcome

Back Select
to the the table positions ifBill
menu
there are multiple people

A banner or advertisement of the


company

Screen 2 of 5
Description: after the customer swipes the card the customer has ta select the table positions if
there are any more members who are coming with him/her. We assume that the tables used are
rectangular in shape.

[ 147 ]
Welcome

Menu Special offers

Scene 3 of 5
Description: in this screen the customer can access the menu to order items and can also
check in the special offers which the restaurant does timely.

[ 148 ]
Beverage Starters Pizzas

Place the order Total

Scene 4 of 5
Description: once the customer accesses the menu, he can choose from the different food items
to order from the section given on the top of the screen. Once a tab is clicked a drop down
interface comes and the food items related to the section is appeared. The grand total is shown on
the bottom right corner of the screen.

[ 149 ]
Back to the menu Bill

A banner or advertisement of the


company

Scene 5 of 5
Description: once the customer has done the order he can either go back to the menu to make
another order or go on to request to produce the bill.

[ 150 ]
8.4 CRITICAL DISCUSSION ON PARALLEL DESIGN
As a group of three members we have identified the problems and requirements of the users and
gave the task to each member to come up with separate designs to solve this. As shown before
we have 3 design solutions at hand. After further analysis and discussions we have extracted the
useful elements from each design.

Tharanga Nuwan Chandrasekera Nuwanthi Illukkumbura Taveesha Gamage


Users should be allowed to select an Users should be allowed to Users should be allowed to
appropriate language. select an appropriate select an appropriate language.
language.
When there is the need for two bills Orders made by the other There should be a welcome
to be generated from the same table, members of the table will be screen which will not only be
two cards will be placed. Once card collected to a central acting as a screen saver but
holder will have to tell the system location and the card holder also instructing the user to
the number of people who belongs will be capable of sending or place the card on the table to
to his bill deleting an order made by use the system.
someone else.
The final set of orders should be The system should allow the
displayed in a separate screen rather user to enlarge the pizza.
than from a bar on the side of the
screen.

8.5 PARTICIPATORY DESIGN

[ 151 ]
After the parallel designs were evaluated, components that were identified as useful from the
parallel designs and the components that are missing or thought to be useful were pooled
together to form the participatory design.
The participatory design is based on these findings.
There should be some method to show the user to drop the card on the table to see the
system. This is where the welcome screen is useful. The welcome screen will instruct the user to
place the card on the table to activate the table.
Instead of having to choose the language at the very first time the system starts up, it is
better if the language could be changed back and forth throughout the system. Therefore a
separate row on the top of the screen is dedicated for the user to select the language they want.
Users might find it difficult to find the structure of the system. So as to avoid this,
another dedicated row will be included to show the users navigation behavior. The navigation
bar will show the previous pages and the current page the user is on. The page names will be in
the form of buttons and these will be linked to its page, so instead of backing up a couple of
times they can click on the page they want to go to.
A sidebar is included on the cardholder’s screen where the cardholder will be able to see
the orders made by his fellow members and the orders he has made. The side bar will include the
names of the items set to order, their quantities, price for each item and the total price. There will
be a button called “SEND ORDER”. Once all orders are made by the group, that button can be
clicked to send the order to the kitchen.
The feature to enter the budget of the customer has been removed since it will limit the
user’s spending and it could be shown as a disadvantage for the company.
The parallel designs have not mentioned how to let the user select the quantity and the
size of the pizza (between small, regular and large). A separate screen will be added to the
system to attend to the problem.
Even if the system is made for ordering, payments are made manually. So to call a waiter,
the system will have a button which will alert the kitchen that the particular table needs a waiter
to attend to. This can be used to call the waiter when making payments. Another button will
be available for the user to get help regarding how to use the system. The help button will
provide them video tutorials. With these identified the first low fidelity prototype is assembled.

[ 152 ]
8.4 ITERATION AND PROTOTYPING

8.4.1 LOW FIDELITY PROTOTYPE

8.4.1.1 STORYBOARDING
Screen No. 1/6 Screen Name Main Menu

Buttons Language Buttons: Sinhala, English and Tamil, Navigation Bar Buttons:
Main Menu, Side bar Buttons: Send Order, Call Waiter and Help, Menu
Buttons: Pizza, Pasta, Soups, Drinks, ect. Navigation Buttons: Next,
Previous (If required).

Links to Page From the welcome screen.

Links from Page Pizza page, Pasta page, Soups page, Drinks page and Help page.

Description This is the main menu. From here the user may select the type of dish they
would like to order.

Screen No. 2/6 Screen Name Pizza

Buttons Language Buttons: Sinhala, English and Tamil, Navigation Bar Buttons:

[ 153 ]
Main Menu, Pizza, Side bar Buttons: Send Order, Call Waiter and Help,
Menu Buttons: Veggie, Chicken, Sausage, Seafood, Beef, ect. Navigation
Buttons: Next, Previous (If required).

Links to Page Main Menu >> Pizza

Links from Page Veggie page, Chicken page, Sausage page, Seafood page, Beef page and
Help page.

Description This page includes all the different types of Pizzas available in the
restaurant. Customers can select their taste for pizza in this page.

Screen No. 3/6 Screen Name Veggie Pizza

Buttons Language Buttons: Sinhala, English and Tamil, Navigation Bar Buttons:
Main Menu, Pizza, Veggie Side bar Buttons: Send Order, Call Waiter and
Help, Menu Buttons: Cheese and Onion, Cabbage, Broccoli, ect.

[ 154 ]
Navigation Buttons: Next, Previous (If required).

Links to Page Main Menu >> Pizza >> Veggie

Links from Page From this page the users will be taken to the dedicated page for the dish.
There the user can select the size, quantity and order the pizza.

Description This displays all the dishes available in the restaurant which belongs to the
category “Veggie”.

[ 155 ]
Screen No. 4/6 Screen Name Cheese and Onion Pizza

Buttons Language Buttons: Sinhala, English and Tamil, Navigation Bar Buttons:
Main Menu, Pizza, Veggie, Cheese and Onion Side bar Buttons: Send
Order, Call Waiter and Help, Menu Buttons: Enlarge Pizza, Small, Regular,
Large, Increase quantity, Decrease quantity, Add to List.

Links to Page Main Menu >> Pizza >> Veggie >> Cheese and Onion

Links from Page Users can return to the menu.

Description In this page users can select the size of the pizza they want. They can select
between “Small”, “Regular” and “Large”. Also the users can select the
quantity of the item they want by increasing, decreasing the value using the
arrow buttons.

[ 156 ]
Screen No. 5/6 Screen Name Help

Buttons Language Buttons: Sinhala, English and Tamil, Navigation Bar Buttons:
Main Menu, Help Side bar Buttons: Send Order, Call Waiter and Help,
Menu Buttons: How to order a Pizza, How to order soups, How to order
drinks, How to order pasta, How to call a waiter.

Links to Page Links to this page is available throughout the entire system.

Links from Page How to order a Pizza video, How to order soups video, How to order drinks
video, How to order pasta video, How to call a waiter video, Main Menu.

Description This screen holds links to all the tutorials.

[ 157 ]
Screen No. 6/6 Screen Name Video Tutorial

Buttons Language Buttons: Sinhala, English and Tamil, Navigation Bar Buttons:
Main Menu, Help Side bar Buttons: Send Order, Call Waiter and Help,
Menu Buttons: Video

Links to Page Help >> Select required tutorial

Links from Page Main Menu, Help

Description This provides video tutorials on how to use the system.

[ 158 ]
8.4.2 HIGH FIDELITY PROTOTYPE

8.4.2.1 COMPUTER BASED PROTOTYPING (HORIZONTAL)


After evaluating the low fidelity prototype for problem areas, a high fidelity prototype
has been made with all problems cleared. Some areas that were identified missing in the low
fidelity prototype are as follows,

Once users are in the process of ordering a pizza it is difficult for them to switch to
another category like pasta immediately. To overcome this, a separate navigation bar is used
which has links to the main dishes such as Pizza, Pasta, Soups and Drinks.
There is another navigation bar on top of the screen which will link to the pages the
customer has passed. This is added so as to make the system flexible for the customers.

According to the previous designs the card holder will have a separate side bar. This will
consume a lot of space from the card holder’s screen. If it should be placed as in the previous
design some options such as having a button to delete an order should be omitted and rely on
other techniques such as drag and drop. So as to overcome this problem, the “Shopping Cart”
technique used in most websites is used here as well. Therefore a new button is introduced to the
screen, with the shopping cart label.

When this button is clicked a separate window will be opened to show the same information that
was represented in the order bar.

[ 159 ]
8.4.2.1.1 Navigation Design
Local Structure

To allow users easily identify where they are right now, we have used a navigation bar on top of
the screen which indicates where the customer was before and where the customer is right now
on the system.

Main Menu Pizza

Where the user Where the user is right


was before now, is highlighted

With this type of navigation bar, users can easily identify where they were before as well.

In every screen, on buttons which are clickable, a tool tip will be labeled on the button to inform
the user that it should be clicked. Also the buttons will be animated so as to grab the user’s
attention (usually shining effects) and to show it is something interactive.

Buttons are named in a way to give the user an idea as to where the particular button will take
them. Since it’s a touch screen machine and tool tips cannot appear as a roll over effect, labels
on buttons are usually verbs which will indicate where it’ll take the user rather than symbols.
Of course symbols are used in certain buttons such as Help which most people today are
familiar, is indicated with a question mark. Also it is common understanding that a bell will be
used to call someone. Hospitals usually have a small button by the bed with a bell symbol on it to
call a nurse into the room. Of course, being in a restaurant that someone who is being summoned
would be a waiter.

[ 160 ]
Global Structure

Pizza Hut Ordering


System

Set Seating If cards are more


Arrangement than one

Home

Pizza Type 1

Type 2
Pasta

Drinks Type 3

Soups

View Order List

Help

[ 161 ]
8.4.2.1.2 Screen Design Strategies
After considering facts, guidelines, rules gathered on user interface design, such as,
 Grouping related items
 Space
 Alignment
 Consistency
 Shapes/ Appearance
 Visibility
 Match between system and the real world
 Offer informative feedback
 User control and freedom
 Error Prevention
 Reduce short-term memory load
 Support internal locus of control
 Permit easy reversal of actions
 Design Dialogs to yield closure

Screen Name Buttons Application of Design Theories

Welcome - This screen will instruct the user to place the given
Screen card on the screen to activate the table.
This screen which is what the user sees the very
first time will guide the user as to how to start using
the system.
Seat  The seats on the When more than one card (Maximum two) are
Placement screen will be in the placed on the screen, a pop up with the seating
form of buttons. arrangement of the table will be shown so that the
 Language buttons. user can select in which seats the members who
belong to him or her are.
Different users are familiar or comfortable with

[ 162 ]
different languages. Therefore 3 main languages
used in Sri Lanka have been added to the system
This bar is consistent throughout the entire
application. This is to allow the user to change the
language whenever they want.

When a seat is clicked it will be highlighted to


indicate that it is selected.
Main Menu  Top Navigation Bar The main menu is the first screen the user will see
buttons after the system has been activated.
 Language buttons. As said before the language buttons are consistently
 Side Navigation bar added to all the screens.
buttons. The Side Navigation bar includes links to all the

 Top Navigation bar dishes available in the restaurant such as, Pizza,
buttons. Drinks, Soups and Pasta.

 Play video. Top navigation bar includes a button to go to Home


screens. The purpose to use the top navigation bar is
 Call waiter.
to let the user identify where they were before and
 Help.
where they are now. Also since the bar is linked to
the page it displays, users can also click and
navigate to the page.
All the buttons which are clickable will have a
shining effect to grab the user’s attention and to
convey that it is something the user can interact
with.
Indicated by a question mark the help button has to
be clicked twice for the button to activate. This is to
avoid, the user mistakenly pressing the button
Indicated by a Bell the “Call Waiter” button has to
be clicked twice. This is to avoid, the user
mistakenly pressing the button.

[ 163 ]
Pizza Screen  Top Navigation Bar The different types of pizzas will be available on
buttons: Home, Pizza. this screen.
 Beef Pepproni Top navigation bar includes buttons to go to Home
 Chicken Spicy and Pizza Screens.

 Chillie Beef Buttons for Beef Pepproni, Chicken Spicy, Chillie

 Super supreme Beef,


Super supreme, Chicken Hawaiian and Chicken
 Chicken Hawaiian
Hurricane when clicked will go to the individual
 Chicken Hurricane
screens for separate dishes.
 Call waiter
 Help
 View Orders

Individual  Top Navigation bar Here the user can set the quantity, size and add the
Screens for  Side navigation bar order to the shopping cart.
dishes  Language buttons Users can select the size of the pizza, between

 Select size small, regular and large.


The increase, decrease buttons allows the user to
 Decrease quantity
browse through numbers to set the quantity of the
 Increase quantity
pizza they want to order.
 Add
Top navigation bar will show links to Home, Pizza
 Call waiter
and the individual screen.
 Help
The add button will add the order to the shopping
 View Orders
cart. Once the order has been made the “View
Order” button will blink to indicate the user that an
order is available inside the cart.
The side navigation bar and the language bar will be
consistent as mentioned before.

View Orders  Cancel Order This will display detailed information such as
 Remove quantity, name, price and total price of all the

[ 164 ]
 Send Order orders. Customers if seen finalized can also send the
 Back order to the kitchen.

 Top Navigation bar The “Cancel Order” button will cancel the entire

 Side navigation bar order.


The “Remove” button will appear in front of every
 Language buttons
dish, and can be used to remove a particular dish
 Call waiter
from the list.
 Help
“Send Order” button will send the order to the
 View Orders
kitchen.
The Side navigation, top navigation, language bars,
call waiter, help and view order buttons will be
consistent as in all screens.

Call Waiter  Call Waiter This will display that the waiter has been called.
A feedback will be given to the user saying that
their request has been fulfilled, and they will be
navigated back to the menu.
Help  Top Navigation bar This screen provides video tutorials of how to order
 Side navigation bar a pizza, drinks, soups, pastas and how to call a

 Language buttons waiter.

 Call waiter When the tutorial buttons are clicked a pop up will
show a video tutorial of the application.
 Help
 View Orders
 How to order Pizza
 How to order Soups
 How to order Drinks
 How to order Pasta
 How to call a waiter

[ 165 ]
Items which are related to each other are grouped together. Below are the lists of features that are
grouped together.
 Language buttons are placed together.
 Links to navigate between dishes are placed together.
 Links which shows the navigation path of the user are grouped together.
 List of items are grouped together.
 Features added for assistance such as Help and Call Waiter are grouped together.
Grouped items are separated from one another, using sufficient space and alignment.
The system uses language which can be easily understood by the users. Since the system is being
built for diverse users, it is important to use language which is easily understood by the
customers. To ease understanding, we have used descriptive names such as, “View Order”, “Call
Waiter”.
Symbolic approaches are also used to convey messages to the user.
Buttons Description

A button used to call a waiter has a bell as its


label since in most countries the bell is a
Language Selection
symbol to call someone.

Navigation bar to show the path


The button used to get help has a question
mark as its label. A question mark
Navigation barsymbolizes
for the
Main Body
a question. Most applications
dishes on the computer
and the internet use the question mark to
convey questions will be answered in that link.

In real life, a shopping cart is used to gather all


the items needed and are bought once
everything needed are inside the cart. The same
concept can be applied for computer based
systems as well.
A consistent layout is used throughout the entire application.

[ 166 ]
View Order List
Call Waiter Help
Not only the placing of items but also, colors, animations, effects, naming and actions of buttons,
navigation from one page to another, procedures such as ordering a pizza, ordering soups,
ordering drinks, ordering pasta are also consistent throughout the system.

[ 167 ]
Special Case

If a particular table is required to generate two bills, two cards will be given. When these cards
are placed on the screen one user will get a screen with seating arrangement of the table. Here
the customer can select where the members who belong to them are so that the system will
accurately place the orders in the correct shopping cart.

[ 168 ]
Main Menu

On the right hand side of the menu, the navigation bar will appear. It contains links to all types of
dishes available in the restaurant. In the middle, shown by the image of the television is a video
clip of Pizza Hut to keep the customers entertained. The buttons which appear on the bottom left
hand corner are used to call a waiter and to browse the help tutorials.
Call waiter is indicated by a button which has a bell as the label and Help is indicated with a
question mark. Users can also select a language they are comfortable with throughout the entire
application.

[ 169 ]
Pizza Menu

In the menu page, different types of pizza will be listed as seen above. This screen will have a
new button called the “View Order”, indicated by a shopping cart. Also the navigation bar on the
top now shows a link to the Home, also known as Main Menu page. The buttons are made to be
large so that they will fit the largest finger size. Also, an acceptable amount of space is left
between the buttons to avoid a button getting pressed, mistakenly. A tool tip saying “Click” is
also available on the buttons which respond to a single click to indicate that it is something
clickable. For buttons like Call Waiter, to avoid the button being pressed mistakenly, the button
only navigates from the page once it is double clicked. At the first click a tool tip will appear as
shown below.

[ 170 ]
Pizza Dish Screen

This screen is a dedicated page for the dish. Here the user can select the quantity and the size of
the pizza. According to the user’s selection the total price will be shown. Once the user decides
to order it they can click the “Add” button, indicated by a “+” symbol. When that particular
button is clicked, the order will be added to the “Shopping Cart”. How the order will be sent to
the shopping cart will be shown by an animation, and the shopping cart, or the “View Order”
button will start blinking, once it receives an order. This is to help the user realize that they can
view their orders when that button is clicked.

[ 171 ]
View Order Screen

On this page, all the orders made by the members of the table are shown in detailed. The
information presented in this screen includes the total number of quantities ordered from each
dish, the total price for a particular set from a dish and the overall total of the order. The card
holder can remove certain dishes from the table, cancel the entire order and start all over again or
send the finalized order to the kitchen. To remove a dish, a “Remove button” will be available on
the screen. If a particular dish has 2 orders, that is, say there are three Cheese and Onion regular
pizzas in the list. The customer wants to reduce the quantity to one. To do so, the customer only
has to click on the “Remove” button twice. If it is one dish he or she wants to remove a single
click on the button will do so.

[ 172 ]

Potrebbero piacerti anche