Improving the websites user experience (UX) through the human-centered

design approach ( An analytical study targeting Universities websites in Egypt)

Ta. Nada Hosseini 1), Prof. Tamer Abdellatif 2) ,Dr. Rania Farouk A.A. Nakhil 3)
1) Teaching Assistant at AOU University/ Masters student
2) Professor at Advertising Dep., Faculty of Applied Arts, Helwan University
2) Professor at Advertising Dep., Faculty of Applied Arts, Helwan University

Submit Date: 2020-05-09 18:32:23 Revise Date:2021-04-05 10:39:33 Accept Date: 2021-04-10 23:05:37
DOI: 10.21608/jdsaa.2021.29802.1029

KEYWORDS: ABSTRACT:
User experience, human cen- User experience (UX) in general aims to improve the way human
tered design, satisfaction, higher interact with a product, brand or service to achieve higher levels
educational system. of satisfaction. Through his behavior, emotions and attitudes we
can conclude the effective strategy to build a positive relationship
between him and the brand.
Human centered design as a term considered one of the new cre-
ative approaches to building a deep empathy with people in differ-
ent creative industries. It is about gaining a deeper understanding
of consumer insights.
Designing strong User experience depends on the right mixture of
elements of design; shapes, colors, navigation, content and sounds
to evoke different feelings or emotions such as welcoming, excit-
ing or curiosity to reach enough levels of satisfaction. Understand-
ing people and how they interact is crucial, especially in designing
a new website.
Research problem: Educational websites are considered one of the
most effective channels in building trust, engagement and satisfac-
tion towards the universities. This makes Improving website user
Experience very important to build a strong university’s brand im-
age in general and reach higher levels of student’s satisfaction. The
research suggests that depending on Human centered design ap-
proach could improve UX to reach the needed satisfaction levels.
Purpose This research investigates the role of human centered de-
sign in helping user experience to achieve higher levels of satisfac-
tion towards specific websites.
Methodology: an analytical study is adopted targeting some Edu-
cational websites in Egypt to explore how design disciplines can
improve user experience considering human centered design ap-
proach. Measuring users’ satisfaction levels toward specific Edu-
cational websites and the effect of HCD in increasing these levels.
Findings: Human centered design improves Educational websites
UX and able to achieve higher levels of user’s satisfaction through
a deep understanding of user insights and the reflection of this un-
derstanding on designing websites.

24 Volume 2, Issue 2 , june 2021

1. INTRODUCTION: effectiveness and productivity, develops human
The internet is completely changing the old-style well-being, user satisfaction, availability and sustain-
way that organizations cooperate with public. For ability; and responds possible adverse effects of use
organizations, the web offers access to a huge au- on human health, security and performance.
dience and increases operational productivity. Web P. Magee (2017) defined HCD its about turning un-
sites are becoming basic components of an organi- derstanding concepts into certain product require-
zation’s survival in the globalized competition. The ments Empathy-based thoughts such as user’s atti-
web site represents an organization, communicating tudes, feelings, frustrations take a fundamental stage
an organization’s culture, values, and vision. H. Tur- in user-centered design. Babich (2019) stated Product
an )2012) believes that web site acts as a delivery designers should be able to turn empathy-based per-
means for services that simplify various tasks a stake- ceptions into organized requirements such as the us-
holder needs to complete. The website also helps as er’s targets and interaction lifestyles something that a
a platform through which an organization can inter- whole team be able to use to make a product.
act with its stakeholders. Icons 8 (2019) considered
that competition becomes much stronger, the desir- 2- Human centered design approach
ability of the websites demonstrating educational Now a days Human centered design plays an import-
institutions is speedily becoming one of the factors ant role to identify new chances for companies and
that students take into account when selecting their institution by expressing new markets to diversify for
path. In today’s academic societies, universities have current products. When you’re connected straight to
recognizable the importance of having websites to be your users, you can follow their needs that provide
able to benefit from suitable academic communica- user a sense of being understood, which can increase
tions. Furthermore, students’ satisfaction from a uni- user’s loyalty Hence, we will review the views of
versity website displays to some extent college’s web some researchers and the extent of their definition of
achievement. Awan et al. (2016) added that usabil- an HCD approach.
ity of websites measured by its user adaptive level, IDEO (2019) stated that human centered design
screen understanding level, satisfaction and learnabil- (HCD) “sits at the connection of understanding and
ity. The above- mentioned factors affect availabili- creativity.” It is a design and management framework
ty of a website design, user adaptation and show of that improves solutions to problems by connecting the
contents with ease of use and navigation. Zalewski human perspective in all phases of the problem-solv-
stated a great user experience on your site approves ing process. Babich (2018) described Human cen-
that your visitors can find all they’re looking for with tered design it is a term product creator which used
ease and speed. It’s up to you to create a content-rich, to describe a design process for people. Forsey (also
meaningfully designed site that keeps your customers agreed that HCD its method to problem-solving that
and partners engaged and resuming for more. Harte demands to put your consumer’s needs first when fol-
et al (2017) describe Design processes for example lowing an issue. To use human-centered design for
human-centered, which contain the end user through your development, you must recognize your consum-
the product progress and testing process, can be nec- er deeply, know with a valid problem they face, and
essary in confirming that the product meets the needs come up with solutions they’d hold. Most of them
and abilities of the user, especially in terms of securi- revolve nearby that HCD means creating products to
ty and user experience. solve your consumer’s struggles and help them for
Moorhead (2017) added that Human-centered design easier and better live Yalanska (2018) said that hu-
is a creative method to communicating systems de- man-centered design is process of producing things
velopment that wishes to make systems usable and based deeply on general natural characteristics of hu-
valuable by concentrating on the users, designing man thinking and perception.
around their requirements and desires at all stages, From all of these definitions, it is clear that the hu-
and by applying human factors/ergonomics, usability man-centered design puts the user first and begins to
knowledge, and techniques. This approach improves study all his needs and how to achieve this in the final

2021 ‫ يونيو‬،2 ‫ عدد‬، 2 ‫مجلد‬ 25

product that he provides to him, whether by strength- • Analyze: After a few months, take a look at your
ening the user’s experience or by mixing different Analytics and understand that your method to
design elements to make it accomplish the usability your design worked in your favor or wrong. If
From the product or website to satisfy the user. you feeling like it could expand, go again to your
users and ask for their opinion towards the de-
2.1 HCD as an approach to enhance user experience sign.
Asad (2018) said that HCD revolves around the ap-
proach to UI/UX designing that is made to increase
the usability and user experience of a certain web-
site or app. A website can only be valuable to the
users if they do not discover any hurdles in editing
each feature, content, and links then it suggests the
sign of a stable and precious user interface.Vic.gov.
au (2019) described that the best way to study how
to handle UX research is to understand the different Fig (1): Phases of Human-Centered Design (ideo.org, 2018)
types of research methods available, and then dive
in and do it. The information classified here frame- 2.3 Principles of Human-Centered Design
works a human-centered design development to keep Z.Maryna (2017) confirmed that “Human-centered
on and suggestions some of resources to aid you to design” does not basically force you to believe the
do that. Philips (2019) said that when well done, a
desires and requirements of product users first. The
human-centered approach drives the foundation of
question is how can you satisfy individuals desires
products that resonate more extremely with an audi-
in both functional and psychologically meaning-
ence, finally powerful engagement and progress. as
proof of we need to look no addition than the recent ful methods. There are 3 common principles of hu-
achievement of design-driven companies like Warby man-centered design:
Parker, Apple, Fab, and Airbnb. We’ve also newly • Collaboration: Great minds produce great con-
seen big-players similar to Google, eBay and Linke- cepts when they work together.
dIn invest in the design of more included and devel- • Empathy: You can’t form a product for people if
oped user experiences. you don’t understand their desires deeply.
• Experimentation: It’s through conversations
2.2 The Main Phases of Human-Centered Design only, investigates and learning that a well prod-
Desmond (2018) descried the steps of how to accom- uct will be born.
plish effective human-centered design: 2.4 Website design and human centered design
• Notice and brainstorm: Start by making expecta- 510.global (2019) described using a human-centered
tions about your audience and sketch questions to
approach to design and development has substantial
both check or expose your views.
social and economic benefits for people affected, aid
• User opinion: Now you have your questions writ-
workers and inter-sectorial cooperation. Highly us-
ten, it’s time to ask your questions to real cus-
tomers. If you have several diverse audiences, able systems and products tend to be more successful
go speaking with them at least person from each both technically (feasibility) and inter-sectoral (via-
section. bility) when all users can understand and use prod-
• Ideation: by have your user response, drawing ucts without additional assistance. Classifications
the board and consider how you can utilize their considered HCD approaches increase value, for ex-
opinions in your website design. ample, by:
• Implementation: Implement your strategy of ac- • Improved user experience decreasing uneasiness
tion and make your human-centered website de- and worry.
sign arise to reality. • With a wider range of capabilities, we can in-

26 Volume 2, Issue 2 , june 2021

 crease usability for people, therefore enhancing
user-friendliness.
• Improved efficiency of all consumers and the op-
erating efficiency of institutes.
• Informal to use and recognize, therefore decreas-
ing coaching and reduce costs.
• Contribute regarding scalability purposes

2.5 Human-Centered Design process to create ef-

fective website experience
League (2019) stated that we can make an optimal
user website experience through sevens stages:
1. Make identification with user personas
Fig (2): hierarchy in user experience Memnon (2019)
2. Assess what user personas need from your web-
site
3. Map their trip through the website to key reno- 2- Consistency
vation Users suppose that products have to share some
4. Recognize problems in their track connections with other products they use regularly.
which makes it easy for them to become well-known
5. Brainstorm clarifications
with the new product without any extra learning fees.
6. Arrange clarifications
7. Make a roadmap to improvement 3- Confirmation
This type of confirmation offers opportunity to users
3- User Experience which inverse an unplanned action or to reconsider-
Nakhil (2019) stated that UX is the base of the up- ation something they not certain of it.
coming engagement. So, improving the user expe-
rience is the new approach, through personalization
and straight communication. The user wants to feel
valuable and respected. Pines (2018) descried Users
need to have a touching linking to the experience of
using your website. Grass (2019) showed that if you
are simply creating an interface and not an experi-
ence, you have limited chance of gaining the follow- Fig (3): confirmation in user experience Grass (2019)
ing you need to make your product a success.
2.1- Principles of User Experience Design 4- User Control
Memon (2019) said that UX design is a creative Users have a good experience you can give them
field that greetings new opinions from new special- more control when they are use the product and they
ists, however there are about foundational UX design will be doing well according their knowledge.
principles every new designer should recognize it.
5- Accessibility
1- Visual hierarchy Accessibility means that designing products to be
hierarchy means to how content is prepared through- easy for users with incapacities to use. Meanwhile
out the application or website. The top level of the we design products for people, it’s necessary that our
hierarchy is frequently a main direction menu that products can be used excepted consumers.
contains the main units.

2021 ‫ يونيو‬،2 ‫ عدد‬، 2 ‫مجلد‬ 27

2.2 User Experience & Usability to achieve satisfac- • University: BUC (Badr University in Cairo)
tion • Location: in Ismailia Road Ahmed Orabi District,
Harte etal (2017) defined usability as “it’s the extent to Cairo – Egypt
which a user can use a product to complete particular • Home page in website contain energetic colors and
goals with effectiveness, efficiency and satisfaction in a different sections but there are a lack of important
stated framework” Soegaard (2020) described the differ- data.
ence between usability and the whole part of user expe- •
rience. Core areas of the user experience include Usabil-
ity which measure he user’s skill to reach website, use it
easily, and complete the required task the good ux comes
when the user can arrange an emotional bond with the
product or website. That means moving beyond usable
and useful and on to evolving content that produces that
promise. From that points of views, the usability is an
important design Naturally. However, we need to con-
sider usability together with these additional concerns to
create a great user experience. User experience comes as
much from interactive design, content, etc. as it apart of • University: MIU (Misr International University)
usability. • Location: in Badr city, Cairo – Egypt
• Home page: in website very organized sections
contain section for student support and section for
Methodology:
external user’s
A quantitative study was conducted, through an online
survey, targeting 170 Egyptian students registered in four
different Egyptian well known and well-established uni-
versities (non-dual degree nor international) according
to the classification of the Egypt scientific committee
These universities have been chosen for the availability
of learning management system in them and also there
is a diversity in the educational level in them so that the
measurement is accurate enough to measure the impor-
tance of improving their websites.
Governmental university websites do not have a way for
students to interact with the university directly, as learn-
ing management system that exists in private universities

The students are chosen according their specifications, • University: FUE (future university in Egypt)
the common faculty in the 4 university was Business Ad- • Location: in New Cairo, Cairo – Egypt
ministration with different minors; (accounting, market- • Home page: in website contain luxuries image which
ing, management) chosen to reduce differences between reflect efficacy. Home page cover all needs of website
students regarding the type of education. users

28 Volume 2, Issue 2 , june 2021

• University: MUST (Misr University for Sci-
ence and technology)
• Location: located in 6 October city, Cairo –
Egypt
• Home page: represent unfamiliar layout but
shows university brand image by using logo
colors

The sample included only 2nd, 3th, 4th year in

the university, the first level (freshmen) was ex-
cluded to ensure the ability of students to deal
with the educational system in general and to be
certain about the student experience.

The study has been done through two stages: the

first one aimed to evaluate the student’s univer-
sity website and the second stage aimed to eval-
uate the other website (each student chose the
website he wanted by clicking the logo button)
without any intrusion from the observant.

Fig (4): University highlighted by different color and he choose anoth-

er one by clicking the logo button Hypothesis:
H1: Increasing satisfaction rate is directly pro-
Both stages aimed to measure the satisfaction portional with improving website user experi-
rate of the student towards his university web- ence
site considering reducing the effect of his emo- H2: Usability could be an effective tool in im-
tions towards his own university (positively or proving user experience if “HCD” is considered
negativity) as a strategic approach.
• The students were asked to fill their own per-
Measuring student satisfaction sonal data as an (option) we excluded 2 out of
According to Phongphaew (2018) who evalu- stage one who didn’t fill the date to be equal
ated LMS usability, by measuring five features to the 2nd stage.
of learnability, efficiency, memorability, effec- • Number of students filled the whole survey
tiveness, and satisfaction were measured. These in stage one was:162 student, Number of stu-
usability attributes were described as follows: dents filled the whole questionnaire in stage
Table (1) phongphaew five features of measur- two was:160 student
ing usability (2018)

2021 ‫ يونيو‬،2 ‫ عدد‬، 2 ‫مجلد‬ 29

Table (2)

Table (3)
Fig (5) & (6) shows the results of the study

Accordingly, we can confirm that there is no gender

impact on satisfaction rates between students. Anoth-
er noticeable observation regarding the psychological
effect of the student’s university in comparison with
his likeability toward the different one. (More studies
are recommended to fill this gap, because this issue
Findings and Discussion: arises the lack of loyalty towards their university). To
Study showed 94% of the student are able to remem- improve the websites user experience visual hierar-
ber the BUC website; style and elements. Energetic chy should be enhanced through browsing website, to
colors might be the main reason, which agreed with make user’s eye follows his path to reach important
most of color research and its effect on memorabil- topics in a predictable way. A recognizable navigation
layout could increase the user comfortability through
ity, in addition to the color scheme and how could
focusing on familiarity and efficiency. The website
it affect the target group regarding their characteris-
should present honest and suitable information and
tics. While only 72% found it effective, they consid- data to cover the users’ needs to increase website cred-
er the lack of important data they need is the main ibility.
reason, However, MIU effectiveness reached 93% 1. User experience has an impactful role in increas-
maybe because of its organized enough and helps ing the satisfaction rate in websites
even external users to find what they search for. On 2. Usability that depends on HCD which done ac-
the other hand, FUE website learnability rate was cording to understand the needs and characteris-
90%, student found that its home page covers all tics of website users has a positive effect on im-
data they need. But Must rate be just 70% because proving user experience
they found it not familiar enough while its memo-
rability was 89% maybe because they considered Conclusion:
university identity consistency through the whole This paper is an attempt to discuss how to improving
websites user experience through human centered de-
website.
sign approach, After the current innovation in the way
of communication between institutions and organiza-
tions with expected users, the percentage of website
has increased, which reflects the extent of its devel-
opment and highest engagement between them and
users. It was important to study the user in a way that
meets his needs to reach satisfaction towards institu-
tions or the company he deals with.
Improving websites user experience become more im-
portant to make users fell being understood well from
that point new approaches like human centered design
appears which aims to solve users struggles by deeply

30 Volume 2, Issue 2 , june 2021

focus in his needs and how it changed through time site-transformation-human-centered-design
that’s discovers new solutions to meet user expecta- 13. Memon, Masooma “Important UX Design Principles
tions. When user needs are ignored, nobody would for Newcomers” Feb 2019 available online https://
prefer opening websites so that we need to enhance www.springboard.com/blog/ux-design-principles/
website usability through feel the gap between user’s 14. Moorhead Anne “ A Human-Centered Design Meth-
requirement and what he found in his round through- odology to Enhance the Usability, Human Factors,
out website. and User Experience of Connected Health Systems: A
Three-Phase Methodology” Mar 16, 2017 Available
University websites should take action to improve
online https://www.ncbi.nlm.nih.gov/pmc/articles/
their image towards student by apply principles of PMC5374275/
HCD Which improve Educational websites UX and 15. Nakhi, Rania “Meaningful storytelling as a brand en-
able to achieve higher levels of user’s satisfaction gagement approach” 2019 Published in International
through a deep understanding of user insights and the Journal of Innovation and Applied arts
reflection of this understanding on designing websites. 16. P. Magee James, How Can Human-Centered Design
Be Used to Implement A Teacher-Designed, Stan-
References: dards-Based Curriculum? August, 2017
1. Asad Nida “Human-Centered Design: 9 Examples To 17. Philips Miklos” The Importance of Human-centered
Justify Why It Matters” 2018 available online https:// Design in Product Design” 2019 available online https://
www.wowmakers.com/blog/9-human-centered-de- www.toptal.com/designers/ux/human-centered-design
sign-examples/ 18. Phongphaew,Nattaporn “ Usability Evaluation on
2. Awan Sarfraz, A TECHNIQUE TO INCREASE THE Learning Management System” July 2018 published in
USABILITY OF E-LEARNING WEBSITES, Re- researchgate available online https://www.researchgate.
searchGate, 2016 Available online https://www.re- net/publication/318157972_Usability_Evaluation_on_
searchgate.net/publication/305479002 Learning_Management_System
3. Babich Nick ” Top 4 Principles of Human-Centered De- 19. Pines, Ben “7 UX Principles for Creating a Great Web-
sign” https://uxplanet.org/top-4-principles-of-human- site “ may 2018 available online https://www.webde-
centered-design-5e02751e65b1 / SEP 2018 signerdepot.com/author/Ben-Pines/
4. Babich Nick, User Centered Design Principles & Meth- 20. Soegaard , Mads “Usability: A part of the User Ex-
ods, adobe xd, oct 2019 Available online https://xd.ado- perience” Jan 2020 available online https://www.
be.com/ideas/principles/human-computer-interaction/ interaction-design.org/literature/article/usabili-
user-centered-design/ ty-a-part-of-the-user-experience
5. Desmond Brooke “How to utilize human center design 21. Vic.gov.au “Research user experience (UX) - Digital
for your website” Dec,2018 Available online https:// Standards” www.vic.gov.au available online https://
www.greenmellenmedia.com/how-to-utilize-human- www.vic.gov.au/research-user-experience-ux DEC
centered-design-for-your-website/ 2019
6. Forsey Caroline “Using Human-Centered Design to 22. Yalanska Marina “Human-Centered Design VS Us-
Create Better Products” https://blog.hubspot.com/mar- er-Centered Design” https://tubikstudio.com/faq-de-
keting/human-centered-design sign-platform-human-centered-vs-user-centered-are-
7. Grass, jonny “ the 5 key of user experience principles” the-terms-different/ / Dec 2018
June 2019 available online https://careerfoundry.com/ 23. Z.Maryna “A Guide to Human-Centered Design Method-
en/blog/ux-design/5-key-principles-for-new-ux-design- ology and Process” July 2017 available online https://ru-
ers/ bygarage.org/blog/human-centered-design#article_title_0
8. H. Turan Aykut, ASSESSING THE USABILITY OF 24. Zalewski justin “ 6 Simple Steps to Improve User Expe-
UNIVERSITY WEBSITES, TOJET , July 2012 rience” without Available online https://www.convince-
9. Harte Richard, etal “A Human-Centered Design Meth- andconvert.com/digital-marketing/improve-user-ex-
odology to Enhance the Usability, Human Factors, and perience/ (accessed Jan 20, 2020
User Experience of Connected Health Systems “2017 Websites:
10. Icons 8 / https://icons8.com/ https://icons8.com/articles/
25. 510.global “human centered design” April 2019
ux-design-educational-websites/ may 2019
11. IDEO HUMAN CENTERED DESIGN .ideo.org Available online https://www.510.global/hu-
https://www.ideo.org/work https://www.510.global/hu- man-centered-design/
man-centered-design/ April 2019 26. https://www.hexwhale.com/improve-user-experi-
12. League mindy “7 Steps to Website Transformation with ence-website/
Human-Centered Design” April 2017 Available on- 27. https://www.nngroup.com/articles/university-sites/
line https://www.prometsource.com/blog/7-steps-web- 28. https://www.webdesignerdepot.com/author/Ben-Pines/

2021 ‫ يونيو‬،2 ‫ عدد‬، 2 ‫مجلد‬ 31