Official Open

Official Open

What is Information Design

• Information design is the skill of
taking complex information and
displaying it in an engaging,
and easy to
understand manner.
Official Open

How is basic information organized?

• Basic information or content can • Time - The information is displayed
be organised in 5 ways. These in chronological order or time
are Location, Alphabetical sequence.
Order, Time, Category and Hierarc • Category - The information is
hical. organized into meaningful groups,
• Location - Information is organized such as product categories, rooms
by geographical location such as categories, genres.
address, countries and states. • Hierarchical - The information is
• Alphabetical - The information is arranged by scale such as size or
sorted alphabetically. cost; and from low value to high
value or vice versa.
Official Open

• Organising information for different types of digital interfaces

involved differing principles. We will examine the design
considerations for the web interfaces, the mobile interfaces, and
infographics.
Official Open

What is Information Architecture?

• Information Architecture (I.A.) focuses on organising information
within the digital platform. The term “Information architecture” was
also first coined by Richard Saul Wurman.
• Information architecture (I.A.) focuses on organizing, structuring,
and labeling content in an effective and sustainable way.
• In web design, it is the process where the content or information of
the website are put together with the understanding of who the users
are and how they will be using the content.
• The goal is to help users find information and to complete the tasks.
Official Open

How to plan the I.A.?

• There are 4 major components to consider when planning for the I.A.
Official Open

How to plan the I.A. for a digital platform?

• The first step is to take the content of the website and sort it into
categories and sub-categories.
• Give a label to each category.
• Each category will form the navigation system.
• The major categories will form the global navigation and the sub-
categories will form the local navigation.
• And consider a Search system to ease the findability of content.
Official Open

Information Interdepency
• In their book "Information
Architecture for the World
Wide Web", Lou Rosenberg
and Peter Morville
explained that to create a
good information
structure, there is a need
to understand
the interdependent nature
of users, content and
context.
Official Open

In a nutshell
• I.A. is about sorting the content into the right places, and creating
the classifications and hierarchical relationships.
• Choosing the appropriate labels for each category of content is
important. Ideally, the labels should map to the user's
understanding.
• Tagging is also important to improve the search. The end result
would be a hierarchical relationship structure, sometimes known as
a site map.
• From the hierarchy structure, the navigational structure, such as the
global and local navigation, can be determined.
Official Open

What is the difference between I.A. and

Navigation?
• IA is the information backbone of the site.
• Navigation refers to the elements on the user interface that allow
users to reach specific information on the site.
• They are related but they are not the same. Designing the
information structure first will result in the navigation structure.
• The goal of a navigation structure is to help users find information,
and to encourage them to take desirable action.
Official Open

What are the main navigational components

of a website?
• A website navigation is a collection of user interface components including
the navigational components.
• The navigation components include:
• Global navigation
• Local navigation
• Utility navigation
• Breadcrumbs
• Filters
• Related links
• Footers
• Fat footers
Official Open

How to organize the navigation structure for

the web site?
• Major categories of content forms the global navigation structure of
the website.
• Sub-categories of content becomes the local navigation for that
specific content.
• Related content but are not the major focus, is placed under Related
Links.
• To help users know where he or she is, a breadcrumb trail is
designed. This is also known as signposting.
Official Open

Cross chanel interface design considerations

• Design for Universal Appeal
• Design for Visual Appeal
• Design for Mass Market Users
Official Open

Design for Universal Appeal

• It is about designing apps that works well across different
platforms and still maintain the same look and feel. An example
would be the Google application which has a similar interface on both
the laptop and the tablet version.
Official Open

Design for Visual Appeal

• When designing for cross-channel devices, it is important to consider
visual appeal and what is trending.
• Apple was the first company that applied skeuomorphism to its
graphical icon designs. Skeuomorphism refers to making of the icon to
have a three dimensional feel with a close to real look and feel.
• As time moves on, flat design catches on. It became hip to have the
look and feel as simple and as basic as possible.
• Visual appeal is important so as to gain followers.
Official Open

Design for mass market users

• Not all users are computer geeks
• Most modern users tend not remember the details of how the app or the
devices works, but they just know that it works. Thus when designing the
interfaces, help the users to move through the pages smoothly without too
much mental load. Reduce the amount of information to be memorised. Use
simple language and keep interactions short and to the point.
• Only uses a handful of apps
• Most users use only a dozen of apps. They are hesitant to download more.
• Uses apps in short bursts
• Research found that most users stay on an app for an average of 5 minutes.
Because their stay on time is short, interfaces need to be designed with quick
usability and clarity that will not confuse the users.
Official Open

Design for mass market users

• Follows the 80/20 rule
• The 80/20 rule is also known as the Pareto Principle. The principle states that
80% of users will only use 20% of the features found in the app. No matter
how many advanced features are included, users tend to use a small fraction
of the many available features. Test with the users to find out the frequently
used features, and focus on improving these features.
• Likes what everyone else likes
• Most typical users are familiar with a standard way of using the interfaces and
will accept a standard array of colours or fonts rather than dark or weird
colours or fonts. Which is why sticking with primary colours in the icon design
and sticking with a standard way of interaction will be best when designing
for mass market.