Photo by Kaboompics .

com from Pexels

Module 1

Design 101: An Introduction

Information Technology and

Information Systems Department
 Apply Design Thinking Process

Course Principles for identifying

Intended
complex problems and
analyzing it for the

Learning identification of user

requirements with regards to

Outcomes computing solution usability

and interaction design.

Information Technology and

Information Systems Department
Topic Outline

Design: Definition Psychology of Ethics on Design

Design

1 2 3
Information Technology and
Information Systems Department
Topic 1

Design: Definition
Information Technology and
Information Systems Department
 Design: Definition

“ It is the process of
envisioning and
planning the
creation of objects,
[ Strate
]
School of Design

interactive
systems, buildings,
vehicles. ”
Information Technology and
Information Systems Department
 Design: Definition

“ A plan or specification for the

construction of an object or
system or for the

[ Wikipedia
] implementation of an activity
or process, or the result of
that plan or specification in
the form of a prototype,
product or process.

Information Technology and

Information Systems Department
”
 Design: Definition

“ Its traditional role is

to improve the

[ ]
visual appearance
The Professional
and function of Association for Design
messages and
information.
” Information Technology and
Information Systems Department
 Design: Definition

“ It modern role
focuses on
people’s digital [ The Professional
]
Association for Design

experiences and
the role technology

”
plays in their
everyday lives.
Information Technology and
Information Systems Department
 Design: Definition

Information Technology and

Information Systems Department
 Design: Definition

goals and constraints

design
aesthetic, functional
economic, or socio-political considerations

Information Technology and

Information Systems Department
Topic 2

Psychology of Design
Information Technology and
Information Systems Department
Which car would you like to buy?

2
Information Technology and
Information Systems Department
Which car would you like to buy?
A B C D
1 E F
2
3
4
5
6
7
8
Information Technology and
Information Systems Department
Which of the questions took
more time for you to
answer?
Information Technology and
Information Systems Department
 Hick’s Law
 It predicts that the time it takes to
make a decision increases with the
number and complexity of choices
available. [William Edmund Hick and
Ray Hyman,1952]

Information Technology and

Information Systems Department
 Hick’s Law

Cognitive
Hick’s Law relates to
Load

Information Technology and

Information Systems Department
 Hick’s Law

Cognitive Load
• It refers to the mental processing power
being used by our working memory.

Example:

• Which button should you press to change

the channel of volume of the TV?

Information Technology and

Information Systems Department
Photo by Christina Morillo from Pexels
 Hick’s Law

Cognitive Load
• It refers to the mental processing power
being used by our working memory.

Example:

• Which is the simplest, easiest and most

usable among the remote controls?

Information Technology and

Information Systems Department
Photo by Christina Morillo from Pexels
 Hick’s Law

Cognitive Load
• It refers to the mental processing power
being used by our working memory.

Example:

 Which one makes it easier for you to search?

Link for Ask. com - https://www.ask.com/

Link for Google.com - https://www.google.com/

Information Technology and

Information Systems Department
Photo by Christina Morillo from Pexels
 Hick’s Law Key
Takeaways
Too many choices will Break up long or complex
increase the cognitive load processes into screens
for users. with fewer options.

Use progressive
onboarding to minimize
cognitive load for new
users.

Information Technology and

Information Systems Department
Photo by Christina Morillo from Pexels
 Miller’s Law
 It predicts that the average person can only
keep 7 (± 2) items in their working memory.
[George Miller, 1956]
 The act of visually grouping related
information into small, distinct units of
information.

Information Technology and

Information Systems Department
Photo by Anthony Shkraba from Pexels
 Miller’s Law: Chunking
• Example #1:
The numbers are separated by dash to easily remember.

Information Technology and

Information Systems Department
Photo by Christina Morillo from Pexels
 Miller’s Law: Chunking
• Example #2:
The information in the website are grouped into chunks and are accessible through the Navigation Links.

Information Technology and

Information Systems Department
Photo by Christina Morillo from Pexels
 Miller’s Law: Chunking
• Example #2:
The information in the website are grouped into chunks and are accessible through the Navigation Links.

To further observe and

analyze the application of
MIller's Law in starbucks.ph's
website, you may visit
https://www.starbucks.ph/

Information Technology and

Information Systems Department
 Miller’s Law: Chunking
• Example #3:
The information in the website are grouped into chunks and are accessible through the Navigation Links.

To further observe and

analyze the application of
MIller's Law in Apple Inc.'s
website, you may visit
https://www.apple.com/ph/?a
fid=p238%7Cs7yabjj45-
dc_mtid_18707vxu38484_pcri
d_405975359035_pgrid_1628
0229612_&cid=aos-ph-kwgo-
brand--slid---product--

Information Technology and

Information Systems Department
 Miller’s Law: Chunking
• Example #4:
Even computer games are following the Miller's Law to avoid overloading of information.

Information Technology and

Information Systems Department
Miller's Law Takeaways

Don’t use the

“magical number
seven” to justify
unnecessary design
limitations.

Organize content into

smaller chunks to
help users process,
understand, and
memorize easily.
Information Technology and
Information Systems Department
 Jakob’s Law of
Internet User
Experience
It states that users spend most of their time on
other sites, and they prefer your site to work the
same way as all the other sites they already
know. [Jakob Nielsen, 2000]

Information Technology and

Information Systems Department
Photo by cottonbro from Pexels
 Jakob’s Law of Internet User Experience

Mental Models Which one are you more accustomed to?

• It is what we think we know about a system,

especially about how it works.

Example:
Rules of Survial (NetEase Game)
• In the warfare-like games such as Rules of
Survival and Call of Duty, players who are
using both games will always compare each
other. They will criticize which of its controls,
design, and gaming experience is better.
They will always gear their vote to the one
they are very familiar with because it gives
them more positive user experience.

Call of Duty (Activision)

Information Technology and
Information Systems Department
Photo by Christina Morillo from Pexels
Jakob’s Law of Internet User
Experience Takeaways
By leveraging existing
Users will transfer
mental models, we can
expectations they have built
create superior user
around one familiar product
experiences in which the user
to another that appears
can focus on their task rather
similar.
than learning new models.

Minimize discordance by
empowering users to
continue using a familiar
version for a limited time

Information Technology and

Information Systems Department
Topic 3

Ethics on Design
Information Technology and
Information Systems Department
 Ethical Design

• A design made with the intent to do good,

and unethical design is its black hat
counterpart.

Photo by Tranmautritam from Pexels

Information Technology and

Information Systems Department
 Ethical Design

Information Technology and

Information Systems Department
Photo by Christina Morillo from Pexels
 Ethical Design Best Practices

Use data to Advertising Always, Don’t ask Be

improve the without always for more transparent.
human tracking. prioritize than you
experience. usability. need.

Information Technology and

Information Systems Department
Summary

Design refers to the output of the process of producing quality user

experience from the product through its physical attributes and
functionality.
Hick’s Law predicts that the time it takes to make a decision increases with
the number and complexity of choices available.
Miller’s Law predicts that the average person can only keep 7 (± 2) items in
their working memory.
Jakob’s Law of Internet User Experience states that users spend most of their
time on other sites, and they prefer your site to work the same way as
all the other sites they already know .
Ethical Design is a design made with the intent to do good, and unethical
design is its black hat counterpart.
Use the Ethical Hierarchy of Needs and best Practices in Ethical Design to be
able to make an Ethical Design.

Information Technology and

Information Systems Department
References

• What is Design? (2018) Strate School of Design. Retrieved April 9, 2020

from https://www.strate.education/gallery/news/design-definition
• Design (2020) Wikipedia. Retrieved April 9, 2020, from
https://en.wikipedia.org/wiki/Design
• What is Design? (2020) The Professional Association for Design. Retrieved
April 9, 2020, from https://www.aiga.org/what-is-design
• Yablonski, Jon. (2018). Psychology of Design. A List Apart. Retrieved April
14, 2020 from https://alistapart.com/article/psychology-of-design/
 Ng, Victoria. (2020). Retrieved April 14, 2020. Considerations and
Responsibilities for Ethical Designers. https://uxdesign.cc/considerations-
and-responsibilities-for-ethical-designers-829450fcb972

Information Technology and

Information Systems Department
 Prepared by:
Mrs. Charlene I. Vergara – Gonzales, MIT, MTA

Information Technology and

Information Systems Department
 Information Technology and
Information Systems Department