Interfaces for Human-System Interaction

●
Course Overview
Outline Course Goals
Structure
The Project
Administrivia
Course Introduction
Course To help you understand, plan and
design a human-machine interface.
Goals
Your What do you expect from this course?

expectations
What a goal is: an observable and measurable end result
having one or more objectives to be achieved within a more
or less fixed timeframe.
General To learn a systematic methodology for building human
objective machine interfaces for robotised applications.

How would you approach the HMI building process?

Specific ● to learn a specific approach of technical performance
objectives planning for robotised processes
● to understand what a human machine interface
means
● to understand what usability and user experience
mean
● to learn a specific approach / methodology for
analysing, designing and implementing / prototyping
a technical system
Course What are your expectations
structure regarding the course content?
Topics We’re eventually designing a technical (software)
system. What should we know to do this?
Topics ● introduction
● interfaces
● design requirements and performance planning
● functionality planning
● usecases & wireframing
● usability
● ux design
Topic: Concepts related to the interface design process:
user aesthetics ux user-friendly UCD ACD
specifications planning performance quality
Introduction competitiveness innovation guidelines
architectures protocols communication hardware
integration testing management
Topic: What does actually an interface mean?

Interfaces
Topic: What requirements should our system (and interface)
satisfy? What performance level should our system
provide? How will we prove this?
Design
Requirements
&
Performance
Planning
Topic: What functions / features should we build into our
system? Why not more? Why not less?

Functionality
Planning
 How do we describe the interaction between our
(generic) users and the system we’re building?
Topic:
Use cases
 What is actually usability?

Topic:
Usability
Topic: What means user experience?
What means user motivation?
UX

img src: https://www.iservice.at/en/basics/user-experience-ux-design/

The Challenge

Sketching an interface on a paper or by using a graphics

software tool should be easy. But what do we draw?
How usable will the result be? Will the functions we
implement be adequate?
The Project Analysis, design and
implementation of an interface
for a supervision and control
application for a robotized
assembly / packing / palletizing
process.
Project ● intelegerea / definirea scopului aplicatiei de operare
si control
Goals ● identificarea partilor interesate, a cerintelor pentru
procesul automatizat
● determinarea functionalitatilor aplicatiei de operare si
control
● proiectarea interfetei pentru aplicatia de operare si
control
● intelegerea utilizabilitatii si a UX pentru interfata
aplicatiei propuse
● implementarea unui prototip pentru aplicatie
Project goals
Previous
Outcome
Project
Integration

+ user guide

+ risk analysis
Exercise

List the main functionalities of the RF2 manufacturing

line control application, as you perceive it in this early
stage. Sketch its user interface (the most important
screens).
 What do we want to implement? For whom? How
competitive should our solution be?
Project
Steps
Preliminary
Analysis
 Who’s interested in out
assembly / packing /
Project palletizing process?
Steps
Each of these stakeholders
Process will have his/her own,
specific, requirement list
Requirements (for the entire process).

for our process:

(a) define stakeholders
(b) identify requirements
(c) rank requirements
Project Steps – Process Requirements

What are each stakeholder’s requirements and

needs for the process?

get inspired: check the

Design for X objectives!
Project Steps – Process Requirements

parti interesate: utilizatori, organizatie care

dezvolta linia robotizata, organizatia client,
(indirect) organisme de reglementare sanatate-
securitate in munca
roluri utilizator: operator, tehnician
mentenanta, tehnician verificare calitate
departamentele din organizatia noastra:
analiza (management), proiectare,
automatizare + dezvoltare software,
electricieni, productie, testare, mentenanta (la
client), economic / comercial / vanzari /
marketing
Analysis ground idea:

We should rather plan the performance of our process

than just wait and see what we eventually “obtain”.
 What should actually happen in our process? What are
the functions that contribute to getting the final result?
Project
Steps
Function
Planning
Project Steps – Function Planning

What functions will we implement (also) in a software form?

functions

functions
Project
Steps
Function
Documentation

for our app:

detail functions
(via usecases)
Project
Steps
UI Sketch
Design ground idea:

You are not your user! Build usability by carefully

considering the user experience!
 environment and programming
Project language: at your choice
Steps
Prototype
Implementation
 Portare prototip pe device-ul hardware specific
(la alegere)
Project
Steps
Testing
 Pregatire raport tehnic si prezentare pentru
sustinerea proiectului
Project
Steps
Reporting

folositi template-ul
pus la dispozitie
 🏇 low-cost
Project
🏇 highly productive
Challenges
🏇 energy-efficient
🏇 compact layout
🏇 increased safety level
🏇 highly intuitive (near-zero training time)
🏇 flexible (chess + backgammon pieces)
🏇 short installation time
🏇 support for people with disabilities

… accept one, up to week 5, & win 😁

Administrivia Schedule

Communication

Getting organized
Schedule
Communication
Getting
Organized

You
Course What means interface?
Introduction
Interface

The user interface (UI), in the industrial design field of human–

computer interaction, is the space where
interactions between humans and machines
occur. The goal of this interaction is to allow effective
operation and control of the machine from the
human end, whilst the machine simultaneously feeds
back information that aids the operators' decision-making
process.
wikipedia.org
Course topics ● introduction
(again) ● interfaces
● design requirements and performance planning
● functionality planning
● usecases & wireframing
● usability
● ux design
 As far as the customer is concerned, the interface is the
Interfaces
➔

product.
➔ The user interface (UI) is the space where interactions

between humans and machines occur.

➔ Users are more tolerant of minor usability issues when
they find an interface visually appealing.
➔ User-friendly = easy to use = easy to learn = easy to use
without learning.
➔ Types of interfaces: text-based & graphical, hardware,

voice & natural language / conversational, haptic &

gesture, zero-input, brain-controlled.
➔ You don't want to impress as a good designer. You want
a good product.
➔ Above all, a good user interface is clear.
Interfaces ➔ Fundamental mechanisms of a UI: navigation, input,
output.
➔ The layout organizes areas of the screen or document

for various purposes.

➔ Content Awareness: Users should always be aware of
where they are in the system and what is being
displayed.
➔ Aesthetics: Interfaces need to be functional and inviting
to use.
➔ Design the user interface with the users’ level of system
experience in mind.
➔ Keep designs consistent: this enables users to predict
what will happen next.
Performance ➔ Quality can be defined as meeting customer needs and
planning providing superior value.
Quality must be designed into the product, not inspected
& Value
➔

into it.
analysis ➔ A chain consisting of all of the systems, operations and
deliverables that touch/support the product collectively
come into play when judgments or perceptions regarding
quality are made.
➔ Technical Performance Measures (TPM): Measures of
attributes of a system element within the system to
determine how well the system or system element is
satisfying specified requirements.
➔ Quality Function Deployment (QFD) is a process and set of
tools used to effectively convert customer requirements into
detailed engineering specifications and plans.
 Voice of the customer (VoC): describes the in-depth process
Performance
➔

of capturing customer's expectations, preferences and

planning aversions.
QFD has four phases: product planning, product design,
& Value
➔

process planning, process control.

analysis ➔ Use quality characteristics which can be measured easily,
precisely, accurately and with stability.
➔ Quality characteristics should cover all dimensions of the
ideal product/process.
➔ Value is the monetary, material, or assessed worth of an
asset, good, or service.
➔ Best value: Tradeoff between price and performance that
provides the greatest overall benefit under the specified
selection criteria.
Performance Value analysis: systematic analysis that identifies and
➔

selects the best value alternatives for designs, materials,

planning processes, and systems.
If marketers expect a product to become practically or
& Value
➔

stylistically obsolete within a specific length of time, they

analysis ➔
can design it to only last for that specific lifetime.
Types of activities in (manufacturing) processes: real-value
-added, business-value -added, non-value -added.
 Usability should enhance the perceived value of the
Usability
➔

product or service.
➔ The user interaction “ability” with the product and the
effort level he invests highly depend of the sharing of
values recognized in that product.
➔ Usability: a product’s measure of being used
efficiently, effectively and with increased productivity.
➔ First rule of usability: don't listen to your users!
➔ Consider usability principles when designing your
product!
 Plan the usability level and use specific metrics to
Usability
➔

assess it!
➔ Always test usability with representative users. You
are not your user!
➔ Adequately plan your usability tests and always
document your findings!
 UX means making users' experience better through
User
➔

intentional and empathetic design

Experience ➔ user experiences: meaningful, personally encountered
Design events & knowledge gained through these events
➔ you can make designs that are relevant for your users
only if you understand them
➔ Don Norman: "Good design is actually a lot harder to
notice than poor design, in part because good designs fit
our needs so well that the design is invisible."
 psychology knowledge helps to create the design which
User
➔

will make users perform the actions they are expected

Experience to
Design ➔ understanding cognitive load and cognitive barriers
eases user experiences, making system interfaces
intuitive
➔ you should build visual elements, functionality,
interaction, and navigation according to the information
architecture principles
 ➔ the product, which is designed, can be extremely
User helpful, but - to learn that - the user should be
motivated to try
Experience extrinsic motivation: Seek of reward; it's not bad:
Design
➔

that’s just the way to make specific activities

reasoned, which is crucial for most users
➔ intrinsic motivation moves the user to act because of
the subject of the activity itself rather than reward or
recognition
➔ gamification, if appropriately applied, can increase
user engagement: people enjoy the interactive
process full of fun, challenges, and competitive spirit
similar to video games
➔ take care with gamification: it should support the
existing usecases and not create new ones
Usecases & ➔ a use case is a list of actions or event steps typically
defining the interactions between a role and a
Wireframing system to achieve a goal
➔ teams benefitting from usecases: the analysis team,
the design team, the testing team
➔ a usecase always captures some user visible function
➔ exceptions are not errors!! Exceptions describe
events that cause failure to perform use case as
described, i.e. end conditions are not met
➔ use wireframes as a visual guide that represents the
skeletal framework of an application screen
Usecases & ➔ as the wireframes do not include any design, or
account for technical implications, it is not always
Wireframing easy for the client to grasp the concept: you should
be a good communicator ;)
➔ with the visual elements more refined than with
wireframes, mockups allow stakeholders to actually
review the visual side of the project
➔ by looking at a mockup, you should have a good idea
of how the final product will look
➔ by reviewing wireframes, external business
stakeholders, like partners and clients, ensure that
requirements and objectives are met through the
design
 software project success rates are around 30%
Software
➔

development ➔ the most common factor behind project failure is

the lack of clear goals
methodologies
➔ you should use a software development
methodology for structuring, planning and
controlling a product’s development process
➔ use agile-based models to develop valuable
software parts in 2-4 week cycles
➔ clarity is the key requirement for any type of
specifications
➔ good team communication is critical to project
success
Instead of Remember, course topics support the project!

conclusions Choose a challenge to make the project work more

interesting!