Augmented Reality as an Appropriate Technology to Learn User Expe-

rience Design

Mingyang Wang

Haaga-Helia University of Applied Sciences

Bachelor’s Thesis
2021
Bachelor of Business Administration
Abstract
Author(s)
Mingyang Wang
Degree
Bachelor of Business Administration
Report/thesis title
Augmented Reality as an Appropriate Technology to Learn User Experience Design
Number of pages and appendix pages
35 + 11

In recent years, the technology industry's rapid development has provided more conven-
ience to people's lives. People's work, life, education, and entertainment have become
more diverse. AR technology is an example of rapid development in this era that has en-
tered the public's field of vision. AR technology can superimpose virtual information on the
actual environment to realize the enhancement of virtual objects to the real world. This fea-
ture allows AR technology to provide learners with a new display and interaction and pro-
vides a more natural autonomous exploration for learning. The User Experience design is a
subject with varieties of interactive learning and visual elements studies. The paper ex-
plores how to use AR as an appropriate technology to teach User Experience design.

The related researches part introduces the Gestalt principles applied in design, AR tech-
nology, and User-Centered Design. As the fundamental knowledge of UX Design study,
Gestalt principles are used to integrate with the AR technology to explore if AR is an appro-
priate technology to improve the UX design teaching. The theoretical part also introduced
the basic knowledge of Augmented reality technology and its use in the education industry.
The whole project of the thesis followed the User-Centered Design process method to
achieve the research object.

The project is divided into five stages to building a mobile application for UX design learn-
ing that incorporates AR technology. At the beginning stage, user research used qualitative
research methods and analyzed the results through thematic analysis methods. The Ideate
stage uses the lotus blossom method to broaden the mind and the value vs. effects
method to prioritize and select ideas. In the design stage, user research results are used to
think about the Information architecture design. Also, build the user interface through theo-
ries such as color psychology. After completing the high-fidelity prototype, use usability
testing methods to verify product concepts and explore research topics. The final stage is
iterate, which is to optimize the product based on user feedback.

This research explores whether AR technology is suitable for promoting UX design teach-
ing by establishing a UX design learning mobile application that uses AR technology. Sim-
ultaneously, using AR technology to improve the enthusiasm of classroom participation,
improve learner satisfaction, and enrich teaching methods and other issues have been ex-
plored and researched. This paper can be used as a reference to help teachers and institu-
tions of UX design teaching improve their teaching methods. It also serves as a reference
for optimizing the teaching of other subjects. For the developers and experts of AR technol-
ogy, this research can also be seen as an experiment to help them diverge their thinking
and try to make AR more widely used and disseminated in different industries.
Keywords
Augmented Reality, User Experience design, Gestalt principle, Mobile application
Table of contents

Terms and Abbreviations .................................................................................................... 1

1 Introduction ..................................................................................................................... 2
2 Research Questions and Research Methods ................................................................. 4
2.1 Research questions................................................................................................ 4
2.2 Research methods ................................................................................................. 4
3 Related Researches ....................................................................................................... 5
3.1 Gestalt Principles Applied in design ....................................................................... 5
3.1.1 Gestalt psychology ...................................................................................... 5
3.1.2 Gestalt Principles in design ......................................................................... 5
3.2 Augmented Reality technology............................................................................... 6
3.2.1 Introduction of Augmented Reality technology ............................................ 6
3.2.2 Augmented Reality in education ................................................................. 6
3.3 User-Centered Design............................................................................................ 7
4 Design............................................................................................................................. 9
4.1 User study .............................................................................................................. 9
4.2 Data analysis ........................................................................................................ 10
4.3 Ideation................................................................................................................. 10
4.4 Product concept ................................................................................................... 10
5 Implementation ............................................................................................................. 12
5.1 User study findings ............................................................................................... 12
5.2 Ideation and concept design ................................................................................ 15
6 Evaluation Result .......................................................................................................... 23
7 Discussion .................................................................................................................... 27
7.1 Answer to research questions .............................................................................. 27
7.2 Reliability and validity of the results ..................................................................... 29
8 Conclusion .................................................................................................................... 31
References ........................................................................................................................ 32
Appendices........................................................................................................................ 36
Appendix 1. User study affinity diagram ....................................................................... 36
Appendix 2. User personas .......................................................................................... 37
Appendix 3. Lotus Blossom brainstorming ................................................................... 39
Appendix 4. Value vs. Effort calculation ....................................................................... 40
Appendix 5. Partial low-fidelity prototype ...................................................................... 43
Appendix 6. High-fidelity prototype ............................................................................... 44
Appendix 7. Scenarios and post questions for usability testing .................................... 45
 1

Terms and Abbreviations

AR Augmented reality. A technology that allows people to integrate

digital information with the user's environment in real-time.

Concept Design It is an early phase of the product development process that

aims to create possible solutions to meet the target users'
needs and solve their pain points.

Color Psychology A psychology study of how mental and emotional colors impact
humans' emotions and behaviors.

VR Virtual reality. A technology that lets people create the com-

puter-generated simulation environment that people can inter-
act with by specific devices.

UCD User-Centered Design is a product design method that involves

a series of processes that always put the user’s needs and
pain points at the center.

UI User Interface. It refers to all the elements where allow humans

to interact with machines.

Usability Testing A user research method to ask participants to perform tasks on

the product or prototype. From participants' behavior and feed-
back to detect problems and evaluate the product.

User Study Or user research. It is a starting phase of the User-Centered

Design process. It focuses on gathering data and feedback
from target users to analyze their requirements and pain points.

UX User Experience. It refers to how users interact with a product.

 2

1 Introduction

With the rapid development of science and technology, people's life, work, study, and
other ways have been affected and changed. The emerging technologies have brought
more opportunities and choices to people. As a profession closely related to the IT indus-
try, User Experience design has attracted many people's attention. They are eager to
learn the UX design knowledge or even plan to become UX designers. How to provide a
method to help people quickly and understand UX design skills and knowledge is worth
studying.

Since UX design is a subject that involves a lot of visualization work such as branding de-
sign, UI design, and human-computer interaction. A technology that involves visuals and
interactive such as AR and VR will be an excellent fit for this project. The visual-involved
teaching method will provide more sensory stimuli and positively affect people's cognition.
That will be beneficial for improving the UX design learning experience.

According to statistics, there are 3.6 billion smartphone users worldwide in 2020 (O'Dea
2021). As an emerging technology, this indicates AR will have more opportunities to be
used by many users. Compared to other technologies, AR can be applied to smartphones
that make them more accessible and faster to use. AR is an interactive experience super-
imposed based on the real environment, and it is more able to integrate the real world and
re-created effects such as sounds, videos, and graphics. (Kovach 2020.) These are the
author's critical factors to choose AR technology to enhance the UX design learning expe-
rience.

The research aims to solve the problem related to the UX design teaching and learning,
that will be valuable for people who teach and study UX design. Create a better and more
interactive learning experience for UX design learners and help teachers discover how to
make their UX design teaching class more fun and attractive.

In the current education market, some products have begun to try and use AR technology.
However, there is rare UX design teaching application with AR technology in the market.
This thesis is a preliminary exploration of this blank area, trying to combine AR and UX
design teaching. In the project, the author used Gestalt principles or gestalt laws (Todo-
rovic, 2008) as a reference point of knowledge and expressed it in AR. This attempt is to
explore the acceptance of UX design learners for AR teaching and how to mix AR technol-
ogy into UX design teaching. If the satisfaction of the test results is high, we can combine
more UX knowledge with AR technology, and even other design disciplines can make the
next attempt. That will bring more possibilities to the design education industry.
 3

This thesis will use a UX design learning mobile application to study using AR technology
to improve the UX design learning experience. The app creation process followed the
User-Centered Design method. Collect users' pain points and requirements data by user
study, analyzing the data, and define users and problems by Thematic Content Analysis
method and personas. After the prototyping work is done, usability testing is conducted to
validate the app concept and discover the usability problem. The thesis does not go deep
on the UI design, and it does not include the product implementation content, but a high-
fidelity prototype will be presented and used as a clickable prototype for the testing sec-
tion.
 4

2 Research Questions and Research Methods

The research objective is to explore how to utilize AR technology to improve the User Ex-
perience Design learning, and teaching. The thesis adopts the User-Centered Design
method to create an AR mobile application for UX design learners based on the user
study, achieve the research objectives, and get the results by conducting usability testing.

2.1 Research questions

The research revolves around one main question, that can be worded as: How AR tech-
nology can be used in the UX design teaching. To break the main question into three sub-
questions as follows:
− During the UX design teaching and learning, what are the pain points and needs of
the teacher and learner?
− How to apply AR technology to the User Experience design teaching, e.g., Gestalt
Principles?
− Is AR the appropriate approach to teach user experience?

2.2 Research methods

This research uses qualitative research to collect valuable primary data. At the early stage
of the project, the author conducted user interviews to collect target users pain points and
requirements. The semi-structured interview content is predetermined, but the questions
and the form are not (Corbetta 2003, 272). As stated by Newcomer, Hatry, and Wholey
(2015, 493), "Semi-structured interviews are superbly suited for a number of valuable
tasks, particularly when more than a few of the open-ended questions require follow-up
queries." Compared with quantitative methods, qualitative methods are more suitable for
in-depth exploration of user needs in the early stages of the project and can better empa-
thize with target users. Open questions and encourage users to speak out will get more
opinions and more comprehensive data. After the early user interviews, the author used
the Thematic Analysis method to process and group the interview data.

Usability testing is another method to validate the AR mobile application concept, to ex-
plore from the user's perceptive whether AR technology is the appropriate approach to
learn user experience.
 5

3 Related Researches

To help readers better understand the thesis topic and whole project context, chapter 3.1
introduces Gestalt theory, details Gestalt principles content is, and how it is utilized in the
design. This is the knowledge the author used as an example to integrate with AR tech-
nology in the application. Chapter 3.2 helps the reader have a basic understanding of AR
technology and its usage in education. This chapter also introduces the User-Centered
Design definition and process.

3.1 Gestalt Principles Applied in design

3.1.1 Gestalt psychology

Gestalt psychology was founded by three psychologists – Max Wertheimer, Kurt Koffka,
and Wolfgang Köhler in the early twentieth century. This theory emphasizes the whole
thing is more meaningful than the single isolated parts (Hergenhahn & Henley 2014, 434).
The word Gestalt comes from modern German, which means “placed” or “put together.”
Since there are no precisely English words to it, so it is always be translated as “pattern”
or “configuration” in psychology (Learningtheories.in 2021). As more psychologists invest
in the research of Gestalt theory, Gestalt theory has gradually been developed in more di-
rections and applied by more industries. Based on Gestalt psychology, more theories are
developed, such as Gestalt Therapy, which also involves personality, psychopathology,
and psychotherapy (Henle 1978). The founders integrated some cultural and intellectual
trends of the 1940s to 1950s to create the new gestalt theory (Yontef & Jacobs, 2018).

3.1.2 Gestalt Principles in design

Gestalt principle is also be known as gestalt laws. There is no definitive list of all Gestalt
principles, but the first principle was devised by Max Wertheimer in the 1920s, in his paper
he demonstrated humans could get meaningful perceptions from the chaotic stimuli envi-
ronment. As Kohler, Koffka, and Metzger (Todorovic 2008) defined more Gestalt princi-
ples, graphic industry designers quickly discovered and applied Gestalt principles. The
Gestalt principle is still trendy in today's design industry because it has very scientific guid-
ing significance for design composition and page layout principles.

Kurt Koffka stated, "The whole is other than the sum of the parts," which can be seen as
the fundamental idea behind Gestalt theory (Bradley 2014). The following five Gestalt
principles are commonly known and widely used in designers (Black, Luna, Lund &
Walker 2017):
− Similarity: People like to group similar things together in their minds.
− Continuity: People’s eye movement likes to follow a smooth path.
 6

− Proximity: People like to group things which close to another one.

− Closure: People like to fill the missing part of the object to recognize it as a whole.
− Figure and ground: People like to search the solid object. They can separate
shapes from the background. The Figure and ground principle was first created by
Danish psychologist Edgar John Rubin (Palmer 1999, 280).

3.2 Augmented Reality technology

AR is a technology that supports virtual objects superimposed on digital in the natural en-
vironment to create a visual and interactive experience (En.wikipedia.org 2021). The dif-
ference between AR and VR is, VR creates the full immersion experience, but AR builds
digital information in a real environment (Walker, McMahon, Rosenblatt & Arner, 2017).
"AR is more like a filter that alters how people perceive the world around them" (Seal
2021).

3.2.1 Introduction of Augmented Reality technology

AR first appeared in 1968, when computer scientist Ivan Sutherland created the first head-
mounted display (Poetker 2019). Then AR slowly approached people's vision. Especially
in 2014, Google launched Google Glass that made people have more understanding and
expectations of AR technology. Many industries have now begun to experiment with AR
technology. For example, IKEA's mobile phone application uses AR technology to support
users to browse and virtual display the home products they sell. Pokémon GO launched in
2016, which uses GPS-tracking and technology that lets people collect stuff in the real
world (The Hollywood Reporter 2016). It makes a large number of people try AR games
for the first time.

AR applications can be created by multiple programming languages. The top six most
popular languages are C#, C/C++, Java, JavaScript, Python, Swift (Watson 2019).

3.2.2 Augmented Reality in education

AR technology combines the real world and virtual things, providing more possibilities for
today's education (Phil, Manuel, Sven & Dirk 2015, 3). Its novelty and multiple styles make
it suitable for different age groups and various disciplines. AR technology has many ad-
vantages when used in education. For example, it has lower requirements for equipment
and only requires a smartphone. AR technology can help increase participation in the
classroom and arouse students' interest in learning. It can help with developing students
to be autonomous and independent in learning (Loveless 2021). Students can use it for
collaborative learning with schools or for self-study. The visualization and interactivity of
AR technology bring students a better learning experience and learn from 3d models in
 7

the actual classroom. Integrate AR technology into education can help students concen-
trate on what they are watching and interacting with, focus on exploration and practice
(Getting Smart 2020). Besides, AR technology can better increase interactivity and emo-
tional interaction in education, which will promote students to acquire information and
skills faster (ViewSonic 2019).

3.3 User-Centered Design

UCD is the abbreviation of User-Centered Design. It is a methodology used by developers

and designers to ensure the products they create meet users' needs (Lowdermilk 2013,
6). Donald Norman created the User-Centered Design process in 1993, and it is still
widely used now (Pacheco 2019). User-Centered Design is an iterate process to make the
products to solve users' problems and with high usability, and users are involved through-
out the design process. Generally, it can be divided into five steps (Spring2 Innovation
2019).

Research. Also called as empathize stage. This stage asks people to do the user study
and the feasibility research to understand the business's requirements, technical, and us-
ers' three perspectives. The User-Centered Design is a problem-solving method. The re-
search phase aims to discover the problems from the target users. The method people
used most in the research phase is the interview. Asking semi-structured and open-end
questions to know who is your users and what they need. In this phase, people also need
to do the feasibility analysis to investigate the marketing and the competitor products.

Define. After the research work is done, people need to analyze the data to help define
the project's main problem, target users, and requirements. Varieties of tools can help with
the defining work, such as Personas, to define all the target user types or profiles that can
help the whole team understand the target users' pain points, needs, and other characters
(Pérez-Montoro & Codina 2017, 73).

Ideate. Based on the design requirements defined from the last stage, ideate focus on
brainstorming ideas and then priority ideas to decide the ideas and features that can be
used in the product. This process also needs to define the basic user workflow and the
low-fidelity prototype. The initial product concept can be seen after this phase ends.

Prototype and Test. In the prototype phase, people can do the usability testing before or
after the high-fidelity prototype work. UCD is a process that involves users frequently. Us-
ers' feedback can improve the design and ensure the design does not deviate from the
 8

product requirements. Except for the usability testing with target users, Heuristic evalua-
tion is an excellent method to gather feedback data and detect potential usability issues. It
is a usability inspection method that asks practitioners and other stakeholders to evaluate
the product UI based on a set of principles (Wilson 2014, 2).

Implement. The products are always to be iterated in the implementation stage since the
team will keep asking for users' feedback. Even the product goes to the implementation
phase. It still needs the designers to iterate and improve the products.

The User-Centered Design method always puts the opinions of the end-users first. The
target users are continuously involved in product design from beginning to end, provide
valuable suggestions for the project. That will be beneficial for designers and developers
to avoid high-frequency mistakes (Usability.gov 2019). The User-Centered Design makes
the product's functions more in line with the user's needs and improves the communica-
tion and contact between the product side and the user. Users can feel that their opinions
are valued and satisfied, which will lead to increased user satisfaction and make products
more competitive in the market. Even though the User-Centered Design method has be-
come a dominant theme in design, designers should not only accept the method automati-
cally but need to be criticism and keep thinking (Norman 2005, 14).
 9

4 Design

4.1 User study

To collect target users' insights that drive a User-Centered Design project, the majority of
this thesis research is qualitative method. According to Nielsen Norman Group, for usabil-
ity testing, each round only needs to test with five users (Nielsen 2000). In order to pre-
vent some participants from being temporarily unable to come, we recruited 6 interview-
ees for user interviews. In the early user study, the author invites six interviewees with a
UX design learning experience or interested in UX design but from diverse backgrounds.
They are subgroups of the target user population (Barnum 2021, 20). The research format
is the one-on-one interview. Table 1 is the profiles of the users that present the basic
background of all interviewees. The user research interviews are conducted virtually by
Zoom meeting.

Table 1. User interview participants background information

During the interview, participants were encouraged to talk about their thoughts in addition
to the pre-set questions. There are ten pre-set questions that most of them are open
questions as follows:
− Please tell me your job, gender, mobile operation system, and experience of UX
design learning.
− The way and sources they use to learn UX design.
− Please list at least one UX design knowledge that you think it's fundamental or im-
pressive.
− What are the pain points for you to learn UX design?
− Do you have a good understanding of the design knowledge and can use them
well in actual design work?
− Do you have knowledge or experience of AR technology?
− Have you heard or tried any great AR applications or products with AR features?
− How do you think about utilizing AR technology in UX design education?
− We are going to build a mobile application with some AR features to help people
learn UX design. It will provide more fun and interactive way to study. If the appli-
cation is created, do you want to try it?
− Could you share your suggestions and your concerns about this app?
 10

4.2 Data analysis

Based on the user interviews, the author adopted the thematic method which is one of the
most common forms of qualitative data analysis method (Guest, Macqueen & Namey
2012, 4.). Thematic analysis can help with data identify, analysis and report, it has six
steps for the whole process: familiar with the data, turns data into codes, search themes,
review themes, define and name themes, create report (Braun & Clarke 2006). After the
interview data analysis, the author will divide the target users into segments based on key
characteristics in common (Garrett 2011, 42).

4.3 Ideation

To expand the main problem and create more ideas, the author uses the Lotus Blossom
method. After many ideas come out, the value vs. effort matrix method is used to prioritize
ideas. The Value vs. Effort matrix method is a lean prioritization approach that consider
the time spent and the values, ideas with high value and low effort are quick wins and pri-
orities in this project (Andreev 2020). The top six items will be the main features of the app
in this project.

4.4 Product concept

At the beginning of the prototype, the App information architecture is designed to make
the product functions and features organized precisely. To flatten users' learning curve of
this new app, the author considered the mental models and studied some mobile educa-
tional apps when designing the information architecture. The previous user study results
provide the direction to the information architecture design, and the information architec-
ture decides the app's structure and organizing content.

The user flow design is an excellent way to state a user's series of actions to use the
product. It provides a clear map for the wireframe work. Refer to the user flow design, the
prototype will focus on the following workflow.

Based on the primary user flows, the low-fidelity and high-fidelity prototypes are created
by Figma software. For the implementation, the author uses the color psychology theory
and other design principles to make better UI decisions and build the design system to
keep the app with a consistent UI style.

After the high-fidelity prototyping work is done, the author invited three-person involved in
the initial user interviews. Meanwhile, another three interviewees are invited who have ex-
perience or interested in UX design. These six people had usability testing separately with
 11

the high-fidelity prototype. This usability testing aims to validate the information architec-
ture and main functions to understand if this app meets target users' needs and expecta-
tions. The author sets several tasks based on the app's main functions also prepares
some post questions after each task. The testers are encouraged to speak about what
they see and how they think. The whole usability testing will be recorded by Zoom after
getting permission from the tester. The clickable prototype tool is Figma.

With the rapid development of AR technology, some robust AR heuristics, and evaluation
metrics have been established. As Arifin, Sastria & Barlian (2018) introduced from User
Experience Metric for Augmented Reality Application: A Review, three UX evaluation
methods can be used for AR application:
− SUXES: measure the application service quality by user satisfaction level metrics.
− AttrakDiff 25: use Pragmatic quality criteria to identify if the application is fun and
attractive.
− Emocard: measure users’ emotions when interacting with the app.

In the usability testing, the author mainly usage the SUXES evaluation method to ask us-
ers' satisfaction with the app. Meanwhile, some questions related to the users’ emotions
will also be asked during the test. The following AR design heuristics rules in the report
“Augmented Reality Design Heuristics: Designing for Dynamic Interactions” also be con-
sidered when designing and evaluating the app:
− Fit with user environment and task.
− Form communicates function.
− Minimize distraction and overload.
− Adaptation to user position and motion.
− Alignment of physical and virtual worlds.
− Fit with user’s perceptual abilities.
− Accessibility of off-screen objects.
− Accounting for hardware capabilities.
(Endsley et al. 2017)
 12

5 Implementation

In this chapter, the detailed implementation work will be introduced, and the prototype will
be presented.

5.1 User study findings

We conducted interviews with six people based on the user profile in chapter 4. Through
the user interviews, we collected the answers to questions which are described in chapter
4.1. Since the interview is semi-structured, we also received valuable opinions from inter-
viewees by random questions and talk. Table 2 shows the interviewee's answers about
what approach they use to study UX design and what's the most important or impressive
UX design knowledge they think. Most interviewees said they learn from online resources,
books, and some school courses. Gestalt principles, Color usage, and User-Centered De-
sign are three knowledge they mentioned most.

Table 2. Participants experience of UX design and most essential UX design knowledge

Table 3 lists the pain points of interviewees when studying UX design, whether they can
use well the design knowledge in their actual work, their tips, and suggestions of UX de-
sign learning.
 13

Table 3. Participants’ pain points, needs and suggestions to learn UX design

 14

Judging from the answers to these three questions, most designers have the following
problems in their UX design study and work:
− For beginners, they need help in UX design learning planning and selection of
learning resources. Because of this level of learners, they have not formed sys-
tematic thinking of UX design learning, do not know what knowledge to learn, and
do not know which resources are of high quality.
− Many design theories are relatively abstract and difficult to understand. Some de-
signers can understand many design principles but cannot apply them well in their
work.
− In the process of learning UX design, there is a lack of theoretical practice. For ex-
ample, learning interaction knowledge but rarely experience how to interact during
the teaching process.

Figure 1. Participants experiences of AR technology

In the user interviews' question 7, we asked interviewees' experience of AR applications.

Four interviewees said they have the basic knowledge of AR technology and two of them
have used the AR products already. Another two interviewees only heard AR technology
before, but they don't know much about it.

They all believe AR could be a proper technology for education. For how to utilize AR
technology to the UX design teaching, they came up varieties of brilliant ideas to help the
author broaden minds.
− It is more reasonable to recommend courses for users based on their interests and
experience. For example, a user is more like learning UX writing. We should not
always recommend Visual design courses for him.
− Even if users want to learn UX design, there are still many different topics and cat-
egories. It is best to let users choose what they want to learn.
− The app can provide a list of what books to read for inexperienced beginners, what
knowledge to learn, and what tutorials are recommended. This will be very helpful.
 15

− To cooperate with some schools or teachers to launch some high-quality courses

and AR models. This will be a win-win result.
− Create a social networking function to help users get to know and learn from more
designers.
− A function can be added to the application. When using the AR camera, the design
principles of the works illuminated by the mobile phone can be detected in real-
time.

Some of them also shared their concerns and questions about this project:
− How to attract users to encourage users to try in the early stage, and how to retain
users after their freshness disappears?
− How to evaluate whether an AR model is a good model is difficult.
− Not many teachers know how to use AR technology to make 3D models. How to
encourage UX design teachers to use this app?
− Can this model be replicated? Can other technologies also be integrated with this
app in the future?

With these interview data, the author groups them into five categories: func-
tion/knowledge, pain point/feeling, risks and concerns, sources, and technologies (see ap-
pendix 1). Based on the interview results and the business scope, the target users are di-
vided into three groups: design beginners, entry-level designers, design experts (see ap-
pendix 2). Design beginners and entry-level designers are the primary target users whose
problems and requirements will be prioritized. User personas summarize the user study
results to show diverse target user group and their problems and requirements.

5.2 Ideation and concept design

The Lotus Blossom method (see appendix 3) and value vs. effort matrix method are used
to calculation which idea is worth to be included in the app. The results (see appendix 4)
are used for identify the app's main features. We get six main features as following:
− Provide learning paths and recommend various learning resources for users based
on their experience and preference.
− Design knowledge such as design principles teaches with practical design.
− AR examples for UX design teaching and use AR technology to connect school
courses.
− Explore other designers' work and create a design social network.
− Design skills growth record and analysis to help users improve.
− Provide a real-time color palette generation tool with AR technology.

Besides, the application will also contain some minor features. For example, users can
rate each learning resource and view its average score and evaluation; each learning re-
source will have some tags related to its content, users can quickly find what they want to
learn; daily personalized learning resource recommendations.

The App information architecture diagram is designed to build a clear mind of the app's
structure and functions (Figure 2).
 16

Figure 2. App's information architecture.

Meanwhile, the main user flow design helps the author design the prototype to present its
main features. Furthermore, the low-fidelity prototype is designed based on this user flow
design (see appendix 5).

Figure 3. App's user flow design

In high-fidelity prototyping, the mock-up device used is the iPhone 8. The typeface is SF
Pro Rounded. To decide the color system, especially the primary brand color, the author
uses the mood board to collect images searched by the keywords: "simple," "comfortable,"
and "design" (Figure 4). The color style is Pastel colors, which have low saturation, soft
shade, and comfortable colors to keep the application UI clean, simple, and easy to use.
 17

Figure 4. Mood board to explore the app color style

To have a comfortable and unique impression on users' moods, the author chose purple
as the brand color. Purple has unique associations that present imaginative, wise, calm,
smoothing feelings (Cherry 2020). The secondary colors are light colors which are most
used as card background colors (Figure 5).

Figure 5. Color Palette used in UX World app

To create a comfortable and neat feel user interface, the author designs the app buttons,
chips, and card components, all with rounded corners. The author also used 3d illustra-
tions and shadow effects to make the UI look more three-dimensional to give users a
sense of multi-dimensional space like the AR function.
 18

The application is named "UX World," the logo is created in the 3d style with the brand
col-or (Figure 6).

Figure 6. UX World app logo

When users first use this app, it will ask users to set at least two topics they are interested
in and provide their design-level information for the app before sign up (Figure 7). If the
user has the UX world account already, they can click log in button.

Figure 7. Landing page and sign up screens

Based on the user’s selection, the app will provide a personalized learning path
recommendation. This learning preference setting can be reset on the profile page by
clicking the Performance reset (Figure 8). In UX World app not only provide users
personalized suggestions, but also in most pages we have varieties chips that represent
different topics that allow users to choose what they want to learn, such as chips on the
Search page, chips on the Courses page.
 19

Figure 8. Personalized learning path page and perference reset on Profile page

There are three main pages in the UX world app: Learn, Explore and Profile. The learn
page shows six sections to help users quickly find out the courses they are interested in,
and they learned recently. Explore page helps users to get more inspiration from other
designers and acquire more UX design news and knowledge. This page aims to help
users explore a broader UX world, build a light design social networking, to know and
learn from other designers. The profile page includes some basic settings, learning
history, favorite, and learning statistics (Figure 9).

Figure 9. Main pages: Learn, Explore, and Profile

 20

From the Learn page, users can see different UX Design learning materials, such as
tutorials, videos, and articles. AR example is a feature that exists within these study
resources to provide a fun, visual, and interactive way for users to learn design
knowledge. Figure 10 is the Gestalt principles course page with some AR examples inside
of the article. Users can click the switch example button to see more examples. The AR
example page also presents the instructions to explain the example.

Figure 10. AR examples in courses

Besides the AR example, the app also has an AR tool icon on every main page. After
clicking it, users can see a camera screen with two icons: scan QR code and color palette.
Users can engage with the content by scan QR codes (Figure 11). For example, users
can scan the QR code prepared by UX Design teachers to learn from some AR models.
The color palette is a real-time AR tool to automatically create the color palette by the us-
er's camera screen. When users see some designs with good use of colors, the AR color
palette tool can help them detect the colors quickly, and users can save the screen and
color palette by clicking the heart icon. It will be saved on the Favorite page, which is
under the Profile page.
 21

Figure 11. AR tools: Scan QR code and color palette.

On the Explore page, there are multiple tabs for users to select:
− Daily inspiration: users self-uploaded design works to get feedback.
− Articles: popular articles related to UX design topics on the internet.
− News: latest news that designers may be interested in.
− Case study: portfolio work share.
− Cool design: post good products or services with fancy design.
− Activity: some designer activities are holding nearby.
− Video: popular videos about design.
− Career: some recruiting information, interview tips, and career suggestions.
− Report: Industry reports and competitor analysis reports examples.

All the content on this page is intended to help users open up designers' horizons, gain
more industry knowledge and establish connections with other designers. For example, in
Figure 12, when a user is interested in other users' works, they can interact through likes
and comments on the bottom of the page. Users can also click on the publisher's Avatar
to view the poster's more information, and users can follow or send a message to get a
deeper contact. The application can also regularly hold some online or offline designer ac-
tivities and publish them through the activity page to provide designers with more social
opportunities.
 22

Figure 12. Connect with other designers from the Explore page.

In the UX world app, all the learning resources are identified as the most relevant tags.
For first-time users, they need to select tags they are interested in. Based on their
selection, the system will recommend courses or contents with relevant tags. Besides, it
provides popular tags for users to quickly find out the content users may need on the
search page (Figure 13).

Figure 13. Tags used in UX World app.

The functionalities above are the main functions of the UX World app. More high-fidelity
prototypes can be seen in appendix 6. The demo video can also be seen on YouTube
(https://youtu.be/fZv4ofLllek).
 23

6 Evaluation Result

We have conducted several evaluations for high-fidelity prototypes through the usability
testing method. Usability testing with target users can help people reduce the risk of creat-
ing the wrong product it serves. It can also save time, money, and other resources for a
team. Compared with quantitative research, we use usability testing to deep talk with tar-
get users, hear their thoughts, and observe their emotions and behaviors directly to detect
more usability problems and get more data from target users.

The objectives of the usability testing were:

− Validate if the AR tools in the app help learn UX design and attractive for target
users.
− Validate the UX world app's concept with target users and check if the product
meets users' expectations.
− Test if it is easy to use and discover the usability problems in this app.
− Gather feedback to improve the UI/UX of the app.

Six participants are invited to do the usability testing. Three of them (interviewee ID: C, D
and E) come from the initial user interview group in Chapter 5.1.

Figure 14. Participants in usability testing

All usability testing was conducted as a remote 1:1 meeting on Zoom since our interview-
ees are located in different countries. We prepared the instruction file and the clickable
prototype, asked their permissions before the meeting to record the meeting. Also, we
clarified the testing needs users to share their screens and turn on the camera to ensure
we can see the emotions on their faces. The clickable prototype can be seen from Figma
URL: https://www.figma.com/proto/8rSDBEBqsDxbWhkBh2RMr2/High-fi?node-
id=2%3A115&scaling=scale-down.

The usability tasks are designed as five scenarios based on the UX world app's main fea-
tures, more details can be seen from the appendix 7:
 24

− Task 1: Sign up and preference setting.

− Task 2: View courses and try the AR examples.
− Task 3: Create networking and browsing on the Explore page.
− Task 4: Try the AR color palette function.
− Task 5: Browse and interact with the app and share feedback.

Each scenario was read and spoken loudly by testers before the task. After completing
each task, some post-task questions are waiting for participants' answers. The usability
metrics we used are task completion time and rate, error frequency, easy to use rate, and
satisfaction rate. All of the positive and negative feedbacks and recommendations are
also be used as metrics to get broader feedback.

The findings of the usability testing as follows:

Task completion time and rate: Task 4 asks participants free to try the app and open to
share their opinions, so there is no need to record the time and completion rate. The other
four tasks were all completed within two minutes, and the avg completion rate is 87.5%.
Task 1 and task 3 got the highest - 100% completion rate, and task 4 with the lowest rate -
66.7% (Table 4).

Table 4. Task completion rate in usability testing.

Interviewee ID Task 1 Task 2 Task 3 Task 4

C √ √ √ √

D √ - √ √

E √ √ √ -
G √ √ √ √

H √ √ √ -
I √ √ √ √

Completion 100% 83.3% 100% 66.7%

Rate

Errors: AR example icon is not prominent enough for users, which causes task 2 to have
an error. The user cannot find out where the AR color palette is saved because the tooltip
disappears very soon. The saved color palette, courses, and posts are showing on the fa-
vorite page; users feel confused because of this page's name, which made task 4 had a
high error rate.

Overall easy to use rate: 4 participants rated the app as 5 – very easy, and the other 2
participants rated it as 4 – somewhat easy. The avg easy to use rate is around 4.7.
 25

Overall satisfaction rate: The avg overall satisfaction rate is 4.3. Four participants feel
somewhat satisfied with the UX World app, but they believe it still has room for improve-
ment. Two participants were delighted with the app and showed great interest in it.

Usability testing rating

5

5 5 5
3 5 4,67
Rating

4 5 5 4
2 4,33
4 4 4 4

0
C D E G H I Avg Score
Participants ID

Easy to use rate Satisfaction rate

Figure 15: Users’ satisfaction rating and easy to use rating results

Like: Most participants like the personalized learning path recommendation think this
function is very friendly and valuable to UX design beginners. They also like the AR color-
palette real-time generator tool since this function is fun, and they never see a similar tool
in other apps. Some participants like the AR examples, but the prototype cannot provide a
simulated AR camera screen in the usability testing. However, they still think this is an at-
tractive concept to them. Two participants like the tags used in the whole app. They ex-
plained tags are the clear indicator for users to find what they needed quickly. Most partic-
ipants think the app looks clear and neat about the UI of the app, and the color style looks
comfortable.

Dislike: In task 4, after users click the save color palette button, the app shows a tooltip
and lasts 2 seconds to tell users," Color palette is saved in Favorite page under Profile."
Most users mentioned this tooltip should persist for a longer time before disappearing.
Moreover, on the same page, it should provide a shortcut to view all saved color palettes.
Meanwhile, participants dislike the name of the favorite page. They feel confused when
they view all the saved items on the favorite page. From the AR example page, two partic-
ipants think on the course page goes back to the main Learn page needs four clicks that
 26

are too many for users. It makes users easily get lost when using these pages. They need
a more straightforward way to return to the main pages easily and quickly.

Recommendations and concerns: Some of the testers who participated in the user re-
search were very excited about the color palette tool. They look forward to the AR tool to
check design principles used in practical designs to add to this app. Some participants be-
lieve that the AR example requires much work for application developers to design and
produce, which is a bright spot of the application and a difficulty in development. Besides,
the tester also provided many suggestions that can help us improve, as follows:
− Add icons that quickly return to the main page for the secondary and tertiary
pages to clarify navigation.
− Add an icon to save the color palette album on the AR color palette page to
provide a shortcut.
− Add learning experience badges and reward mechanisms, establish learning
mile-stones, and let users feel the progress they have made.
− Add some small practical tasks to the course, encourage everyone to com-
plete, share and evaluate each other.
− To make AR functions richer and more exciting, invite some teachers to partici-
pate and make AR models to encourage students to interact by using this app.

Emotions: In addition, in the usability test, we also encouraged users to express their real
feelings and emotions during the test. We recorded these emotional description words to
know whether users like the product. The following table summarizes the ten emotion de-
scriptive words that appear most frequently in the test. Two of the top ten are pleasant
emotions words. That could indicate the users have a positive attitude, they like the app
concept, and they would like to try it if we can publish the app in the future.

Table 5: Top 10 emotion descriptive words in the usability testing.

No. Word frequency statistics
1 interesting 9
2 creativity 7
3 amazing 6
4 cool 6
5 satisfied 6
6 fun 5
7 attractive 4
8 confused 4
9 enjoy 3
10 concerned 3
 27

7 Discussion

Overall, in the high-fidelity prototype usability testing, participants showed a positive atti-
tude to the UX World app concept. They are pretty satisfied with the app's primary func-
tions, features, user experience and looking forward to using this app in the future. From
the early user research and the high-fidelity usability testing, target users' opinions and
feedback helped the author to get varieties of findings and precise answers for the re-
search questions in Chapter 2.

7.1 Answer to research questions

Sub-question 1: During the UX design teaching and learning, what are the pain points
and needs of the teacher and learner?

Refer to the user research results in chapter 5, that indicates people with different levels
of UX study experience have different pain points. From the table 3 we got findings of be-
ginner level target users' pain points are distinguishing what knowledge to learn and how
to choose the resources. It is difficult for beginners who have no experience or just started
their UX design learning to figure out the fundamental knowledge they should learn is their
main pain point. They are eager to have a clear systematic learning path and skill tree to
grow into UX designers. The Figure 14 shows a comment from a beginner-level inter-
viewee described his needs during early user interview. Beginners expect the product can
be a professional UX design teacher's role to guide them how and where to start their
study, provide proper learning resources at the same time.

"I am not clear with the learning path. Finding out helpful learning resources is time-con-
suming. Because we have too many choices, we cannot detect which course has the
better quality as a beginner. I hope we can get some guidance from real professional
designers or teachers. They create a list with the basic knowledge we should learn,
what kind of books they recommend beginners to read. They help us to design the per-
sonalized learning path. I hope to see this kind of services, even though it's not free, as
long as it's reliable, I'll buy it."
Figure 14. Comments from the beginner-level UX design learner

Also, from the early user study results we can see, the junior designers who have less
than three years of work experience, they feel it is challenging to apply design principles
well in their practical design work is their most significant pain point. 67% interviewees
said they cannot utilize well the design theories and principles into the practical work (see
table 3). Besides, they hope to broaden their design horizons, understand industry
 28

knowledge, network with others and master more updated design tools (Doyle 2018).
They hope to draw knowledge and inspiration from better designers.

Design experts and teachers are looking for a more creative teaching way to attract stu-
dents' engagement in their classes. The classes lack innovation, and hard to make stu-
dents active during the class are their pain points. Also, they hope to provide a way to
help students self-study when they after school. The comment from a UX design teacher
in the usability testing is compiled in Figure 15.

“As a UX design teacher, I like to be curious and keep trying new ways to improve my
teaching. Innovative methods can make students more involved in teaching content. I
think online teaching has its own unique advantages. The content that students want to
learn is inherently strongly related to mobile devices and computers. Putting the learn-
ing content on the Internet allows students to learn and experience. It is a good idea to
integrate AR technology into UX teaching because UX design students need to learn
interaction, but how to learn UX interaction through AR requires more exploration. I
think if UX design teachers can design excellent models, it will make the classroom
more interesting, whether online or offline.”
Figure 15. UX design teacher’s comments in the usability testing

Sub-question 2: How to apply AR technology to the User Experience design teaching,

e.g., Gestalt Principles?

Integrate the AR technology with the UX design knowledge can be built in a variety of
ways (Dirin & Laine 2018). For instance, the AR color palette tool which presented in Fig-
ure 11. It provides a real-time color generator with AR technology. The similar implemen-
tation can be seen from the app “ColorSnap® Visualizer” on the Google Play. It allows us-
ers to open AR camera to instantly see the colors in real time. The color palette content
will be changed based on the camera screen captures. It is a very easy-to-use tool that
can help designers collect pictures with a good color match. AR Gestalt principle example
is also a case that integrates the AR into the UX design knowledge very well. It presents
the principles in a three-dimension way to help users learn from their observations and in-
teractions. Teachers can create their 3D AR models and share the QR code with stu-
dents. They can scan the QR code by the AR tools - scan QR code function to view the
model. Based on these ideas, the real-time de-sign principle identification can be a cool
feature to integrate AR with UX design. However, it needs more complex technology - ma-
chine learning and image acquisition support.

Sub-question 3: Is AR the appropriate approach to teach user experience?

 29

AR is a technology suitable for UX design teaching from the user research results and us-
ability testing results (Nguyen, Muilu, Dirin & Alamäki 2018). First of all, its visual and in-
teractive form fits well with the content of UX interactive teaching. AR is type of interactive
medium (Jo & Kim 2019), in UX design, interaction design itself is a crucial part. It is worth
exploring to experience and learn inter-action from AR. Secondly, its novel, exciting and
innovative form brings freshness to learners and can arouse their interest and participa-
tion. From table 5, we can see the users who participated in the usability testing ex-
pressed pleasant emotion words a lot. AR brings a fresh and different experience for the
users and easy to attract people’s attention. Figure 15 also presents the average satisfac-
tion rate for the app is 4.3. That means users have a positive attitude to the AR UX educa-
tion app. McNair and Green (2016) had a simi-lar finding from an experiment to measure
how students will accept the AR books that they found AR technology used in the class
can encourage class engagement and have a positive impact on students’ performance.
Compared with other technologies, AR technology has a lower cost for learners and is
easier to be widely disseminated and applied. It is also more suitable for self-study of UX
de-sign outside the classroom. Besides, AR technology's development trend also indi-
cates that AR will be used in all walks of life. The combination of UX design teaching and
AR technology is the general trend.

Main research question: How AR technology can be used in the UX design teaching?

As the study results, AR as new technology is an appropriate approach to teach UX de-

sign. It can be integrated very well with the UX design knowledge to solve the UX design
learners' pain points and meet their requirements. Teachers or UX design education appli-
cations can use AR technology to show learners three-dimensional models, thereby help-
ing users observe and learn from multiple dimensions. AR models can also help users
learn interaction design, and more importantly, users can view these models at any time.
Use AR technology to make some design gadgets that help daily design work and learn-
ing, such as AR real-time generation of color palettes and AR real-time detection of de-
sign principles. That can teach design not only knowledge but also improves users' design
work efficiency. The novelty of AR is an effective means of innovating teaching methods
and attracting students to participate. For new technologies and visualization forms, learn-
ers will show greater interest and more effectively engage in UX design learning.

7.2 Reliability and validity of the results

The most significant limitation of this research is the AR function experience in usability
testing. The author cannot provide testers with a more realistic test version to experience
 30

the AR function. This can cause misjudgment of the user's emotional response. The au-
thor did not implement the actual AR model prototype most because of the time re-
striction. Besides, the author is a beginner of the AR model creation, so no confidence to
add this into the first evaluation. The evaluation with the actual AR prototype will be left for
the future work.

In the final stage, to validate the application concept, usability testing requires a one-to-
one interview test. Six usability testing all conducted as remote online usability testing by
Figma and Zoom software. That because the participants are located all over worldwide,
so they cannot do the test face-to-face. An emotional evaluation has been done after the
usability testing (see appendix 8). The frustration or some of the emotional factors related
to this application has been evaluated. More improvement work is needed to provide a
better user experience.

To better implement the user-centered approach, the author should conduct a simple user
test after the low-fidelity design is completed, mainly for validating the function and appli-
cation's information architecture. In this way, the author can obtain more user feedback
early in the design to design a more in line with the user's wishes. Besides, the user study
and usability testing participants are from 18 - 50 years old with a major in information
technology. The sample size is small and limited, so it's better to have a survey with a
larger population of target users, which can ensure the results more reliable.
 31

8 Conclusion

In conclusion, Augmented Reality is an appropriate technology that can be used for im-
proving the UX design teaching. In this research thesis, to validate this hypothesis the au-
thor established the mobile application UX World through the User-Centered Design
method, integrate AR technology into the UX design education app based on users' pain
points and requirements. The thesis involves qualitative research to do the early-stage
user study and the usability testing method to validate the application concept to get the
answer to the main research question: "How can AR technology be used in teaching User
Experience design?"

In the research, some feasible methods have been demonstrated. More complex ideas
such as AR real-time recognition design principles have been provided, worthy of in-depth
exploration in the future. From the usability testing results in the research, most test partic-
ipants are satisfied with and look forward to integrating AR technology and UX design
teaching, which they believe will bring a novel experience with multiple dimensions. Some
users even think that the integration of AR into design teaching is the future development
trend. The study contributes to the UX design teaching industry by providing an example
of adding AR technology to UX design education. Teachers and other relevant persons
can get inspiration from this study and expand the idea into a broader scope.

In the future, the author can contact professional AR technicians and UX design teachers
to jointly produce a more professional AR model to make it more compatible with the
teaching content. Meanwhile, we can discover more ways to integrate AR technology and
UX design teaching. After creating a complete version, ask for help from professional pro-
grammers to implement the application. Then the author will carry out a new round of test-
ing and invite more target users to participate in the testing.
 32

References

Andreev, M. 2020. Prioritization Methods and Techniques - Part 4: Value vs. Effort Matrix
as a Lean Prioritization Approach. Blinklane Consulting. URL:
https://www.blinklane.com/insights/prioritization-methods-and-techniques-part-4-value-vs-
effort-matrix-lean-prioritization-approach/. Accessed: 8 April 2021.

Arifin, Y., Sastria, T. G. & Barlian, E. 2018. User Experience Metric for Augmented Reality
Application: A Review. Procedia Computer Science, 135, pp. 648-656.

Barnum, C. M. 2021. Usability testing essentials: Ready, set...test! 2nd ed. Morgan Kauf-
mann. Cambridge.

Black, A., Luna, P., Lund, O. & Walker, S. 2017. Information design: Research and prac-
tice. Routledge. New York.

Bradley, S. 2014. Design Principles: Visual Perception And The Principles Of Gestalt.
Smashing magazine. URL: https://www.smashingmagazine.com/2014/03/design-princi-
ples-visual-perception-and-the-principles-of-gestalt/. Accessed: 24 January 2021.

Braun, V. & Clarke, V. 2006. Using thematic analysis in psychology. Qualitative Research
in Psychology, 3, pp. 77–101.

Caulfield, J. 2019. How to do thematic analysis. Scribbr. URL:

https://www.scribbr.com/methodology/thematic-analysis/. Accessed: 18 March 2020.

Cherry, K. 2020. The Color Psychology of Purple. verywell mind. URL:

www.verywellmind.com/the-color-psychology-of-purple-2795820#:~:text=People%20of-
ten%20describe%20this%20color. Accessed: 28 February 2021.

Corbetta, P. 2003. Social research: theory, methods and techniques. Sage. London.

Dirin, A. & Laine, T. 2018. User Experience in Mobile Augmented Reality: Emotions, Chal-
lenges, Opportunities and Best Practices. Computers, 7, 2, pp. 33.

Doyle, S. 2018. My advice to all junior UX designers. Medium. URL:

https://uxdesign.cc/my-advice-to-all-junior-ux-designers-e1caf2f20594. Accessed: 11 April
2021.
 33

Endsley, T. C., Sprehn, K. A., Brill, R. M., Ryan, K. J., Vicent, E. C. & Martin, J. M. 2017.
Augmented Reality Design Heuristics: Designing for Dynamic Interactions. Human Fac-
tors and Ergonomics Society 2017 International Annual Meeting, 61, 1, pp. 2100-2104.

En.wikipedia.org. 2021. Augmented Reality. URL: https://en.wikipedia.org/wiki/Aug-

mented_reality. Accessed: 25 January 2021.

Garrett, J. J. 2011. The elements of user experience: User-Centered Design for the Web
and beyond. 2nd ed. New Riders. Berkeley.

Getting Smart. 2020. The Future of VR & AR in Education. URL: https://www.get-

tingsmart.com/2020/09/the-future-of-vr-ar-in-education/. Accessed: 25 January 2021.

Guest, G., Macqueen, K. M. & Namey, E. E. 2012. Applied Thematic Analysis. Sage.
Thousand Oaks.

Henle, M. 1978. Gestalt Psychology and Gestalt Therapy. History of the Behavioral Sci-
ences, 14, pp. 23-32.

Hergenhahn, B. R. & Henley, T. B. 2014. An Introduction to the History of Psychology. 7th

ed. Wadsworth Cengage Learning. Belmont.

Jo, D. & Kim, G. J. 2019. AR Enabled IoT for a Smart and Interactive Environment: A Sur-
vey and Future Directions. Sensors, 19, 19, pp. 4330.

Kovach, N. 2020. What is Augmented Reality (AR) and How does it work. ThinkMobiles.
URL: https://thinkmobiles.com/blog/what-is-augmented-reality/. Accessed: 21 Marth 2021.

Learningtheories.in. 2021. GESTALISM. URL: http://learningtheo-

ries.in/unit%20%20%201/Unit_-1_Human_learning/gestalism.html. Accessed: 24 March
2021.

Loveless, B. 2021. Developing A Student-Centered Classroom. Education corner. URL:

https://www.educationcorner.com/developing-a-student-centered-classroom.html. Ac-
cessed: 25 January 2021.

Lowdermilk, T. 2013. User-Centered Design. 1st ed. O'Reilly Media. Sebastopol.

 34

McNair, C. L. & Green, M. 2016. Preservice Teachers’ Perceptions of Augmented Reality.

Literacy Summit Yearbook, 2, 12, pp. 74-81.

Newcomer, K. E., Hatry, H. P. & Wholey, J. S. 2015. Handbook of practical program

evalua-tion. 4th ed. Jossey-Bass. Hoboken.

Nielsen, J. 2000. Why You Only Need to Test with 5 Users. Nielsen Norman Group. URL:
https://www.nngroup.com/articles/why-you-only-need-to-test-with-5-users/. Accessed: 17
April 2021.

Norman, A. D. 2005. Human-centered design considered harmful. Interactions, 12, 4, pp.

14-19.

Nguyen, N., Muilu, T., Dirin, A. & Alamäki, A. 2018. An interactive and augmented learn-
ing concept for orientation week in higher education. International Journal of Educational
Technology in Higher Education, 15, 35.

O'Dea, S. 2021. Number of smartphone users worldwide from 2016 to 2023. Statista.
URL: https://www.statista.com/statistics/330695/number-of-smartphone-users-worldwide/.
Accessed: 28 March 2021.

Pacheco, J. 2019. History and Nature of User-Centred Design. Medium. URL: https://me-
dium.com/@joshuapacheco/history-and-nature-of-user-centred-design-
18e20f86294f#:~:text=The%20origin%20of%20today's%20user,user's%20experi-
ence%20with%20a%20system'. Accessed: 26 January 2021.

Palmer, S. E. 1999. Vision science: photons to phenomenology. MIT Press. London.

Pérez-Montoro, M. & Codina, L. 2017. Navigation design and SEO for content-intensive
websites: A guide for an efficient digital communication. Chandos Publishing. Cambridge.

Phil, H., Manuel, S., Sven, E. & Dirk, B. 2015. Benefits of Augmented Reality in Educa-
tional Environments – A Systematic Literature Review. Internationale Tagung
Wirtschaftsinformatik. Osnabrück.

Poetker, B. 2019. A Brief History of Augmented Reality (+Future Trends & Impact).
Learn.g2.com. URL: https://learn.g2.com/history-of-augmented-reality#:~:text=Aug-
mented%20reality%20technology%20was%20in-
vented,of%20use%20cases%20for%20AR. Accessed: 18 April 2021.
 35

Seal, A. 2021. Top 7 Augmented Reality Trends For 2021. URL:

https://www.vxchnge.com/blog/augmented-reality-statistics. vXchange. Accessed: 25
March 2021.

Spring2 Innovation 2019. Design Thinking VS User-Centered Design. URL:

https://www.spring2innovation.com/2019/04/design-thinking-vs-user-centred-design/. Ac-
cessed: 31 March 2021.

The Hollywood Reporter 2016. Pokemon Go: 11 Real-World Hazards of the Catch 'Em All
Craze. URL: https://www.hollywoodreporter.com/lists/pokemon-go-guide-game-tips-real-
life-hazards-910304. Accessed: 17 April 2021.

Todorovic, D. 2008. Gestalt principles. Scholarpedia, 3(12), 5345.

https://doi.org/10.4249/scholarpedia.5345. Accessed: 25 January 2021.

Usability.gov. 2019. Benefits of User-Centered Design. URL: https://www.usabil-

ity.gov/what-and-why/benefits-of-ucd.html. Accessed: 17 April 2021.

ViewSonic. 2019. 6 Benefits and 5 Examples of Augmented Reality in Education. URL:

https://www.viewsonic.com/library/education/6-benefits-and-5-examples-of-augmented-
reality-in-education/#Educational_AR_apps_to_Get_the_3D_Ball_Rolling. Accessed: 17
April 2021.

Walker, Z., McMahon, D. D., Rosenblatt, K. & Arner, T. 2017. Beyond Pokémon: Aug-
mented Reality Is a Universal Design for Learning Tool. SAGE Open, URL: https://jour-
nals.sagepub.com/doi/10.1177/2158244017737815#. Accessed: 28 March 2021.

Watson, T. 2019. Top 6 Most Popular AR & VR Programming Languages for Custom Pro-
jects. Skywell software. URL: https://skywell.software/blog/top-6-ar-vr-programming-lan-
guages/. Accessed: 19 April 2021.

Wilson, C. 2014. User Interface Inspection Methods: a User-Centered Design method.

Morgan Kaufmann. Waltham.

Yontef, G. & Jacobs, L. 2018. Gestalt therapy. Current Psychotherapies, 11, pp. 309-348.
 36

Appendices

Appendix 1. User study affinity diagram

 37

Appendix 2. User personas

38
 39

Appendix 3. Lotus Blossom brainstorming

 40

Appendix 4. Value vs. Effort calculation

Value Effort
(1-20) (1-20) Priority score
Idea
4.4: Design theories and principles list and introductions. 18 5 3.6

1.3: A quick tutorial for first-time user about how to use this app,
what feature / function will be helpful for his level. 13 5 2.6

1.6: Add tag for all course, articles help users to quickly find out
things they want to learn. 13 5 2.6

3.7: Encourage users to share their works to get feedback. 13 5 2.6

4.1: Website list and clear categories marked. 13 5 2.6

4.2: Free online tutorial list, links and tags for which level. 13 5 2.6

4.3: Book and e-book list for different types and different levels
designers. 13 5 2.6

4.5: Design Podcast, Blogs and articles recommendation. 13 5 2.6

4.6: Design methods and design tools list. Recommend different

tools for different type designers. 13 5 2.6

5.4: Recommend 1 to 2 articles or other resources per day based

on users preferences. 13 5 2.6

6.5: Users can rate for the design tools, books, tutorials. The app
will show an average rating to users. 13 5 2.6

8.1: Teaching users how to define problem, what's the process of

a problem-solved method. 13 5 2.6

1.1: Recommend courses and resources according to the user's

design level (experience). 20 8 2.5

5.5: Provide a clear process of design, and list all methods and
tools for each stage for users to quickly find and use it. 20 8 2.5

7.2: List more practical examples that followed or violated that

theory. 20 8 2.5

4.7: Big companies Design systems list and links. 10 5 2

5.1: Color palette creation and color matching and selection tool. 20 10 2

7.1: Provide more videos, pictures instead of only the theory text
when teaching the theories. 15 8 1.875

7.5: Learn design theories from famous websites and famous de-
signs. 15 8 1.875

1.2: Provide a mind map for users what skills and knowledge is
essential to designers, how to learn it step by step. 18 10 1.8
 41

1.4: Provide a variety of tags for users to choose what they are
interested in and recommend content based on it. 13 8 1.625

1.8: Create a knowledge tree or a skill analysis tool for every user
to record their learning history. 13 8 1.625

3.2: Interview or article to introduce famous designers growth sto-

ries. 13 8 1.625

3.6: Set milestones in the app for users to visualize their grow. 13 8 1.625

5.3: Weekly good design sharing and analysis 13 8 1.625

5.6: Good quality articles and courses. 13 8 1.625

5.7: Provide tips for job interviews, CV, and portfolio preparation. 13 8 1.625

6.1: Invite professional designs to share their learning and work-

ing experience. 13 8 1.625

6.6: Users can send private messages to other users to ask

questions and social. 13 8 1.625

7.3: Invite users to add more visual examples or practical exam-

ples, and allow other users to vote if it's a good example. 13 8 1.625

8.7: Connect the design theories and principles to practical prod-

uct to teach. 13 8 1.625

1.5: Provide book lists for different level users. 8 5 1.6

3.1: Design inspiration for designers to share good designs. 8 5 1.6

3.3: Share big companies designer roles requirements. 8 5 1.6

6.2: Provide a function for users to share their design, users can
Like, Follow and Comment. 8 5 1.6

8.4: Encourage users to upload their practical projects with detail

introduction. 8 5 1.6

8.6: Provide a function that user can post their problem in practi-
cal design work and asking other users help. 8 5 1.6

2.1: Small AR game to learn design principles, such as Gestalt

Principles. 20 13 1.538461538

2.3: Connect the lecture with the app, teacher provides QR

codes for students, they can scan it to view the artwork or de-
signs. 20 13 1.538461538

7.7: Connect the AR function with the design theories to make it

more visual. 20 13 1.538461538

1.7: Invite professional designers to write some articles for begin-

ners to help them start. 18 13 1.384615385

2.4: AR creates color palettes in real-time. 18 13 1.384615385

 42

5.2: Identify the design principles in the design work. 18 13 1.384615385

8.2: Series of tutorial teach users from zero to build a whole prac-
tical project. 18 13 1.384615385

7.4: Learn design theories from games. 13 10 1.3

4.8: Recommend good design and professional designers to help

users get insights from them. 10 8 1.25

7.6: Set exercises after each lesson to help users to understand. 10 8 1.25

7.8: Use tags to quickly show designs in the App that follows the
specific design theory. 10 8 1.25

8.8: Provide problem solving tools link or template. 10 8 1.25

2.2: Create AR Virtual teacher character to teach students like in

the classroom. 15 13 1.153846154

2.5: AR identify the famous artwork and designs, show the crea-
tor and design details info and introduce the design for users. 20 18 1.111111111

2.6: AR function to identify the basic design principles in the de-

sign works. 20 20 1

3.5: Share reports which are design related. 5 5 1

3.8: Also share the technology news and knowledge, industry

news in App. 8 8 1

5.8: Users can interactive with other designers, especially some

professional designers. 13 13 1

6.3: Invite professional designer to share their case studies. 13 13 1

6.4: Invite professional designers to write articles and create tuto-

rials. 13 13 1

6.8: User can see other designers’ skills, companies, working ex-
perience and the tag they are interested in. 8 8 1

8.3: Hold activities or competition to ask users build real project. 13 13 1

8.5: Provide problem-solved design exercise. 8 8 1

6.7: App will recommend some professional designers live in the

same or near city with the user. 5 8 0.625

3.4: Invite big companies’ designers to record their work in big

companies. Such as a day in the life of a Google designer. 8 13 0.6153846154

2.7: User can scan their own design works and create a QR
code, so other users could scan it to see the design. 5 13 0.3846153846

2.8: Create an AR character to guide users how to use the App. 5 13 0.3846153846
 43

Appendix 5. Partial low-fidelity prototype

 44

Appendix 6. High-fidelity prototype

 45

Appendix 7. Scenarios and post questions for usability testing

Scenario 1: Sign up and preference setting.

You are a beginner with a strong passion for UX design. What you are most interested in
are UX design and User-Centered Design. However, you do not know how to start and
where to learn them. You are looking for a clear path and good quality resources to learn
them. Your friend recommended you a new app called UX world to help you learn UX de-
sign. So you download it and try to sign up for the app.

Post-questions:
− What content did you see?
− How do you feel the first time sign up for the app? Is it clear and easy to use?
− Is there anything that frustrated you?
− What do you like or dislike in this task?

Scenario 2: View courses and try the AR examples

You want to see the app's popular courses and enter the most popular course to view
what tags are included. You read the content of the course and find out which section pro-
vides AR examples. Enter the page and try the AR examples of the Proximity principle
and Closure principle.

Post-questions:
− What content did you see?
− What do you think of the Learn page?
− What do you think of the AR examples? Is it useful?
− Is there anything that frustrated you?
− What do you like or dislike in this task?

Scenario 3: Create networking on Explore page

Now you are on the Explore page. You want to see what features and functions on this
page. You viewed some posters under the Daily inspiration tab. You are very interested in
the "LinkedIn logo redesign," so click it to see more details. Also, you viewed the author of
this post and followed him from his personal profile page.

Post-questions:
− What content did you see?
− What do you think of the Explore page?
− Which feature are you most interested in on the Explore page?
− Is there anything that frustrated you?
− What do you like or dislike in this task?

Scenario 4: AR color palette

 46

You heard from your friend UX world app has an AR color palette function. You want to
find it out and try it. Save a color palette and try to find out where the saved color palette is
and how you can view it later.

Post-questions:
− What content did you see?
− What do you think of the AR color palette function?
− Is there anything that frustrated you?
− What do you like or dislike in this task?

Scenario 5: Browse and interact with the app

Now please try the app, choose the page you are interested in to browse and interact.

Post-questions:
− Please rate for the app from 1-5: Is it easy to use?
1. Very difficult
2. Somewhat difficult
3. Neither difficult nor easy
4. Somewhat easy
5. Very easy
− Please rate your overall satisfaction with this UX World app.
1. Very dissatisfied
2. Somewhat dissatisfied
3. Neither dissatisfied nor satisfied
4. Somewhat satisfied
5. Very satisfied
− Which function or UI most impressed you?
− What do you think the AR tools in this app? Is it helpful and fun to learn UX de-
sign?
− Do you have any other comments/suggestions/concerns about the app?