LABORATORY EXERCISE
HCI GUIDELINES
I.
Guidelines Rating Remarks
Balance 8 The screen elements are balanced, but side elements are
Balance the optical not utilized, it might be tedious to users to scroll all the way
weight of screen down.
elements.
Equilibrium 10 Due to scroll type of information in which all elements are in
Maintain a midway the center this is a good interface.
center of suspension
Symmetry 10 The symmetry of elements and links are excellent, spaces
Arrange elements so for images with information on the side is a good way of
that elements on one providing engaging texts.
side of the center
line are replicated on
the other side.
Order 9 The way the website is introduced is intriguing, this is due to
Order elements to telling what are the potential of using this site, who are the
correspond with ones behind it and its features.
hierarchy of
perceptual
prominence.
Consistent 9 The distance between the images and elements are easy for
Maintain a consistent the eyes with variety of users such as students and
ratio between ratios company workers.
height and width
Unity 7 The distance between elements are somewhat balanced
Attempt coherence and consistent throughout the entire page.
of the layout by
keeping elements in
relative proximity.
Alignment 10 Alignment between sections of the page are consistent,
Align elements proper gap to disclose which section is which.
horizontally and
vertically
Density 8 The page is not crowed with information, as well as
Optimize the organized elements from the top and bottom.
occupied areas of
the screen.
Guideline link: [Link]
%26+Sons%2C+[Link]
Essay
Since Fluidui is about a website that creates eye pleasing and fluid user interface, they should
as well provide or be a model to their offer to its user. I chose these set of guidelines because
they correlate to what kind of website Fluidui is. Such as placements of elements, density of
information, links and elements of the website and what it has to offer. These set of guidelines
match Fluidui than guidelines that focuses on what type of platform that it is in, which is not
apparent to the website.
II.
If you were going to develop an emergency mobile application, what HCI criteria and
category would you use as a guideline in the design and development of the application?
Why?
The criteria and category I would use Task/Operational Context and User Type.
The Operational Context will ensure that every user, connected to internet or not, anytime and
anywhere are ensured to receive assistance or service of the application. While the User Type
will ensure that all users receive equal treatment of the elements of the application, this ensures
that anyone can use the services of the emergency application.
I chose these elements because they are close to what an emergency application needs, the
application doesn’t need aesthetic user interface or what organization it falls through, the users
don’t need to know or witness these to use the service of the app.
If you were assigned to design and develop the interface of a learning management
system for a university, what HCI criteria and category would you use as a guideline in
the design and development of the application? Why?
The criteria and category I would use General HCI Design, Platform/System Setup and
Interface Style/ Modality.
The General HCI Design will be the basis of the interface of the learning management system,
this manages the display layouts, structures, output, interface, user experience, etc. are up to
the standards of the learning management system. While the Platform/System Setup are ways
that the learning system is flexible among its users, ranging from mobile devices to virtual
reality. Interface Style/ Modality are different ways that the interface can be interacted with, from
mouse and keyboard to controllers and motion gestures.
I chose these as a guideline because they are what needed in designing and developing the
interface of a learning management system. Due to university users, many of which have
different learning styles, the introduction of different platforms helps students engage in
learning.
If you were developing the interactive interface of a video editing tool, what HCI criteria
and category would you use as a guideline in the design and development of the
application? Why?
The criteria and category I would use General HCI Design, Applications and
Interface Style/ Modality.
The General HCI Design will ensure that the designs, layouts, interface, tabs and options, etc.
are easily accessible to its users. While Applications specifically media will be the main
interactive interface since I am developing a video editing tool, I will need a media type
application. Interface Style/ Modality are different ways that the interface can be interacted with
specifically windows since video editing softwares rely on tools to edit, that said Interface style
has a lot of menus, Guis’ and widgets.
