HCI Design For

Public Library
System

Name: H.R.D.K. Gunawardhana

Registration Number: 18/IT/IT/478
Subject: Human computer interaction
Contents

Introduction……………………………………………………………………………………………………………………. 2
Introduction to prototype……………………………………………………………………………………………… 3
Introduction to design evaluation…………………………………………………………………………………. 4
Information gathering Techniques………………………………………………………………………………… 5
• Interviewing and Participation Observations.………………………………………………….. 5
• Longitudinal and sporadic………………………………………………………………………………… 6
o Diary studies
o Experience sampling
o Lead users
o personas
Brain Storming Technologies………………………………………………………………………………………. 8
• Storyboard
• Paper prototype
• Digital mockup
Implementation…………………………………………………………………………………………………………… 12
• UI Design
• Code
Design Evaluations………………………………………………………………………………………………………. 17
Mental modals and cognition……………………………………………………………………………………… 18
Visual Design……………………………………………………………………………………………………………….. 19
• Typography
Summary……………………………………………………………………………………………………………………… 20
References…………………………………………………………………………………………………………………… 20

18/IT/IT/478 1|Page
Introduction

Books management system was the typical application of information management system. From this
report, I hope to talk about the HCI design for Library management system and explain all necessary process
that I used to get creative system design.

Human-computer interaction (HCI) is a multidisciplinary field. It means HCI is the best way to interact
with computers or it provide a best mechanism to interact with the computers. As an HCI designer any
person should want to do many things to give a best possible way for the users to provide a good quality
user experience.

If we get Library management system, that application can use different kind of persons. They can be
students, teachers, or another occupation. Because this system designing for public Library system. So, that
is the one challenge for face as an HCI designer.

When design an HCI system design, first we must get a clear idea about the system. For that thing we can
use a prototype for the design. From that prototype, it helps to get feedbacks from the various users. After
that, we should think about how this task start and how to continue works to reach the goal. So, we want to
use some evaluations for that. First thing we can use prototype. After getting good prototype, we must think
about user’s thoughts/perspective. because users are the main target and the final system implement for
their uses. If users do not satisfy about the system, that system become a poor one. Therefore, we have got
their ideas and we must gather information from them. For that, we must use several methods like
interviewing, participant observation, longitudinal and sporadic.

After gathering information, we should start designing the system with the ideas that collect before. In this
process we have to complete and success our design goals. So, we can use several brainstorming
technologies like Storyboard, paper prototyping and digital mockups. After those kinds of processes, we
have to evaluate our design. we can evaluate our system by various types. Finally, I hope to talk about how
Testing and implementing this system interfaces successfully.

As I mentioned before, from this report I hope to explain briefly all the processes I used for designing the
library management system and methods that I used to complete my design.

18/IT/IT/478 2|Page
Introduction to prototype

In designing process, we should think about several important things. Prototype is a one from those things.
if we get Prototype, it is approximating replication of a real-world process.

For an example if we get a building construction, we can see it all processes begin to end. But, in software
engineering process we can’t see anything like that. So, in this opportunity we can use prototyping.

If I get my System, I have an idea to develop a Library management system. But I can’t explain all clearly
with my words. Sometimes, some persons get incorrect and different idea about system and some persons
want to see the process of the system. So, users and designers can make a good communication from the
prototype and it will help to get good feedback from the users.

However, prototype is less attractive. Actually, it is not attractive as our final System. And also, it may not
fully functional. The main purpose for using prototype is give user a good idea about the system and get
feedbacks immediately.

18/IT/IT/478 3|Page
Introduction to design evaluation

At the end of the design part, design evaluation is very important. If we not thinking about it, we will have
to face different kind of problems in implementation. Design evaluation is very important, and it is a very
hard task. Because, different people have different ideas and, they are thinking in different ways. So, to
solve these kinds of problems we can use some techniques to evaluate a design.

1. Likert Scale
Using screenshots / mockups / pictures and get ratings for that. According to my system, I send this
like of screenshots, mockups or pictures about my system and get 1-5 like rating for design.
2. Open-ended reflection
In this technique, we are asking questions about system. But these questions are not yes / no type
questions or true / false type questions. From this technique, we should give attention for get large
answers for required questions.

According to my system I had to get feedbacks and ratings from students, librarian etc. In this process,
getting feedbacks from the different type of users is very important for evaluating the design. Basically,
there are different types of methods to evaluate a design. I used two types of methods from them to my
system.

1. Usability Studies
I used usability Studies as my first method. Using this method interviewing users with their
experience in the completed prototypes and get feedbacks from them. In my system I invited
Students, Librarian, Admins, and all other relative people in the library.
2. Online Surveys
I used online surveys as my second method. From this method we can cover large number of people
and can get many feedbacks from them.

18/IT/IT/478 4|Page
Information gathering Techniques

Before the designing process, the most important thing is gathering information, or all the details related to
the interface designing. If I not thinking about those things, I have to face many problems in designing
process. I took two difference types of information gathering techniques. There are Interviewing and
participation observation and longitudinal and sporadic techniques.

1. Interviewing and Participation Observations

If I get interviewing, it is defined as interviewed peoples that involve with my system. If we are going for
interviewing, we should have a correct & clean plan to do it. Because, we do not have any plan it should be
a time-wasting task. I am interviewing several types of users in library system. Therefore, before I am
interviewing, I thought about a plan and when I am planning, I gave more attention for some things.

When I am conducting my interviewing,

I continue it from according to my plan and I try to get more details from users.
Therefore, I talked less and giving opportunity for users to talk and I record complete interview. When the
interviewing I tried to limit yes/ no answers. I always tried to get full explanations from them. In
interviewing I get many details about all kind of people who connect with the library and for everyone who
helps me taken of appreciation as them give their valuable time.

Participation observation means we should have a good understand about the users who we are
interviewing. For examples, What kind of people do and how people do his/ her tasks in the library, What
are the values and goals of the people who works in the library and also, What are the similarities, qualities,
and differences with the people who works in the library

However, finally from these kinds of ways we can get many details about the people who are works in the
library and how they connect and deal with other people in the system.

18/IT/IT/478 5|Page
 2. Longitudinal and sporadic

Interviewing is a good way to gather information. But it is not suitable for all times. Specially in the library
management system. Think about a student who is going everyday to library and get various types of books.
It is a longitudinal and very common thing to library system. We cannot interview him everyday.it is not
suitable for both our side and users’ side.

Then if we think some unexpected things can be happened in the system. For an example, Student who
came to the library and he did not return his previous borrowed book. But he requests another book without
return that book. So, those kinds of situations are called Sporadic. So, this situation not likely to the common
system.

From this kind of things, we can see interview is not only suitable method for gather information. For that
kind of situations, we can use different methods gather information. Such as diary studies, experience
sampling, lead users, extreme user.

Diary studies

In diary studies we can say some specific person like librarian in the library to maintain a diary about the
day today incidents that he or she have to face. And also, I give some instructions to follow how to maintain
a library in everyday and what I want to get from it. So, from that way I can get any longitudinal process
happen or any sporadic things happens in the library. This method is scalable, and they should maintain it
every day.

Experience sampling

From this method we hope to get information/facts from the experience of users. Because, they worked in
many years or some suitable long time of period and they have a experience how library works. That
information is very valuable and important for get good idea about special situations and how handle them.
Because, they know how to handle them from their experience.

18/IT/IT/478 6|Page
Lead Users

Lead users are the people effectively functioning in an organization for a long time. For an example from
my system librarian, book issuer are the two persons for lead users. I asked different questions from them
and I got very important information from their answers.

Personas

In personas is a basically, about persons. If we get book issuer in library, we have two persons for do it. But
one person has a good and special experience and other person does not have experience like that. we can
think he is a new person for library. And also, we can get same experience persons, but they have different
abilities in works. For an example, one person can do some work very fast but other person cannot do it
that fast. So, from these kinds of persons I can get many ideas about the system how happening and I can
know how some works fast and what are the easy ways for do that. Therefore, it is very helpful for my
design process.

So, In this section I discuss how to gather information of longitudinal and sporadic processes and what are
the methods used for that and how they are useful for information gathering process.

18/IT/IT/478 7|Page
Brain Storming Technologies

After gather information, design part is coming. We can discuss design part is several ways.

1.Storyboarding

Storyboarding has all tasks in the design. From storyboarding we are showing how our system works and
what are the steps we should use to perform it. Simply, storyboard is the system tasks and what are the
sequence that we want follow.

Storyboard

18/IT/IT/478 8|Page
2.Paper Prototype

Login Interface

Admin Interface

Admin Interface

18/IT/IT/478 9|Page
Issuer Interface

3.Digital Mockups

18/IT/IT/478 10 | P a g e
18/IT/IT/478 11 | P a g e
Implementation
1. UI Design

18/IT/IT/478 12 | P a g e
18/IT/IT/478 13 | P a g e
 2. Code

Login Interface code

18/IT/IT/478 14 | P a g e
Admin Interface code

18/IT/IT/478 15 | P a g e
Issuer Interface code

18/IT/IT/478 16 | P a g e
Design Evaluation

After the designing storyboard, paper prototype and Digital Mockup, they show to users and next we should
ready to create system. Creating process is not easy. When this process Designers always want to evaluate
the system continuously. For this evaluate process we can use following steps and they are very helpful to
evaluate correctly.

1. Before user testing,

This evaluation we should do before giving the system to the user. In this method we use to found
bugs and if there is any bug, we should fix them and get an idea about our system.

2. Before redesigning

This evaluation is very important. because, for an example there is an interface in my system I think that
interface is not good. That is my opinion. But another person’s It can be good one. So, before the
redesigning it is better to get other people feedbacks and it will help to get maximum output from the
system.

3. Before releasing

Finally, before the release system for the users we should again evaluate. Because, I should be able to
release a maximum output from the system and it reduce errors and I should try give a smoothen final
output.

After finishing all design evaluation process, we should used Heuristic Evaluation to evaluate the design.
Heuristic Evaluation is, if the team evaluate a design, they have to follow some guidelines.

• Invite some experts and users

• Let them to examine the system
• Different people come up with different concerns
• Team can use Nielson’s heuristic evaluation principles to evaluate system.

These methods are very important and valuable. Because, there can have multiple evaluations and many
ideas about the system. From that we can get best system as the final output.

18/IT/IT/478 17 | P a g e
Mental Models and Cognition

If we get Mental model, it is like an image or picture on the users’ mind or users’ idea. Actually, from the
mental model we should give simple user interfaces to understand that what is my design. Mental model is
very important to show only necessary things for the users. If not, the system will be complex and difficult
to understand.

Therefore, we should be able to design our system for approximation system that users already have
experience. In library, book issuer has some experience for book issuing process. So, I have to design my
system familiar with that process. From that, he can easily adopt to my system with his mental model.

Cognition is things that we can used to improve the user experience. For that, we can use Encourage
experimentation, scaffold errors, and Increase efficiency. We can add some features to user interfaces, and
we can get several experiments from users and we can encourage that experiments. That is called Encourage
experimentation.

In Scaffold errors we can provide some status bar to get status for some work is success or not. For an
example we can add status bar to book issuing interface in system to get the book issuing is success or not.

Then, increase efficiency means how we show or display things in the user interfaces. This very important
thing. For an example, we can use images for the user interfaces. But, we should careful about those images.
Because, if images can give the attractive mode to the interfaces, but it is not suitable for use images in
everywhere.

18/IT/IT/478 18 | P a g e
Visual Design

When we are designing HCI system, we can use three types of building blocks.

There are,

• Typography - Typography means when we are designing how we can arrange, how positioning
texts, how using the styles for text like things.
• Layout - Layout means how we are positioning elements like images, videos, and texts in the
system.
• Colors - From using colors we can provide some special messages like success, warning, and error
messages to the users. It is very important for users to get the idea about the system easily. In this
process we should apply colors to the suitable places.

Typography

• Point size - from the point size means font size. When we design the system, we should think about
the people who are using this system. Sometimes, book issuer or librarian can be old persons. So,
that kind of situations we should use big fonts for help them to identify words clearly.
• Line spacing - when we are designing and creating the system, we should think about the line
spacing. Because, Line spacing also helps to provide better user experience for clearly identify
things.
• Ascenders and descenders - ascenders means how far from the line text are gone up and
descenders means how far from the line text are gone down.
• Font weight - when we want to highlight some special features or some special things in interfaces,
we can use the font weight option and we can show those things by highlighted.

18/IT/IT/478 19 | P a g e
Summary

In this report I explained all the process steps related with the HCI design for a Library Management system.
I started this this report from explaining what is prototyping, what is design evaluation and how to gather
information for my system. In prototyping explanation, I explained what is prototyping how we use
prototyping, advantages of prototyping like things. Then I explained design evaluation like what a design
evaluation is, why we use it, and what are the things that we do. After, I explained how to collect
information. Mainly I mentioned two types of information gathering techniques. There are interviewing
and participant observation and longitudinal and sporadic techniques. I explained them briefly in this report.

Then, I described design process and applied storyboard, paper prototype and digital mockups according to
my system. Next, I applied how I implement my system interfaces using java swing and finally I explained
how I evaluate my system design using several evaluating techniques.

After that I started implementation of my interfaces using java swing and then I explained briefly about my
interfaces and finally I discussed how I evaluate my designs using various evaluating techniques. So, this
is my report summary for HCI design for Public Library Management System.

References

https://intetics.com/blog/the-main-steps-of-the-user-interface-design

https://www.getsmarter.com/blog/career-advice/what-is-human-computer-interaction-
hci/?ef_id=c:379617804200_d:c_n:g_ti:dsa-
777997000052_p:_k:_m:b_a:77811214532&gclid=Cj0KCQjwhIP6BRCMARIsALu9Lfmg054aI0b8ycCHO_B
8_-wxkrALkLPF49OIhialnKbZw3pLVqanE9AaAqvSEALw_wcB&gclsrc=aw.ds

https://www.cs.bham.ac.uk/~rxb/Teaching/HCI%20II/intro.html

https://www.interaction-design.org/literature/topics/human-computer-interaction#:~:text=Human-
computer%20interaction%20%28HCI%29%20is%20a%20multidisciplinary%20field%20of,cover%20almos
t%20all%20forms%20of%20information%20technology%20design.

https://searchsoftwarequality.techtarget.com/definition/HCI-human-computer-interaction

18/IT/IT/478 20 | P a g e