LECTURE 6 Flashcards
is the structure that supports the visual components of
an interface
The Layout
- it works opening the pads where the site can ship the
group around and make sense of the information
The Layout
it also helps the content to highlight what is the most
important data
The Layout
this is also reflected in more test accomplishment and
more time on the side or engagement
The Layout
relates to objectives reflected in a
good user experience that is why we can say that a
correct layout makes the user mind what he is looking for
a good layout design
- offers a different stance from both multi-channel and
cross-media
Cross Channel UX
has argued that ‘the job
of the designer is now not just to design the device, the
software, and the way you interact with it, but to design
the whole experience of the service so it is coherent and
satisfying’.
- Gillian Crampton-Smith (2004)
has moved from designing a website or an app to
do a single thing to designing a service.
ux
concerned not just with the details of
the user interface or how a website works but with
providing a service
ux designers
is a sequence of
interactions that constitutes a whole or more abstract
achievement
Service
important for service design.
time dimension
Elements of UX
- Strategy
- Scope
- Structure
- Skeleton
- Surface
conceptualized the
development of websites in terms of five elements
- Jesse James Garrett (Garrett, 2003)
This led to a famous figure that was widely adopted as
a guide to good web design
Elements of UX
the most abstract or hardest from implementation
Strategy Plane / Bottom Layer
concerned with understanding the overall objective of
the interactive system or service
Strategy Plane / Bottom Layer
the nature of the people who will be using it and what
their needs and desires are
Strategy Plane / Bottom Layer
the nature of the people who will be using it and what
their needs and desires are
Strategy Plane / Bottom Layer
the emphasis is on functionality or what the system will
enable people to do and on content or the information
that the system will hold
Scope Plane / Second Layer
- covers information architecture
Structure Plane / Third Layer
- also includes specifying the interaction design the data
flows and allocation of function between user and
system
Structure Plane / Third Layer
concerned with information design, navigation design,
and interface design
- Information Design
Might also consist of many modalities including sound
and touch
Surface Plane / Final Layer
Called as Visual Design by Garett
Surface Plane / Final Layer
We call this representational design
Surface Plane / Final Layer
- This element of design is concerned with the aesthetics
of the design
Surface Plane / Final Layer
Consistency and appropriateness of the presentation
are critical here
Surface Plane / Final Layer
- a key step in the process of user interface design that
answers the question
Conceptual Design
- This is the part of the system design that brings the
designer’s mental model
Conceptual Design
- It is a theme, notion, or idea with the purpose of
communicating a design vision about a system or
product
Conceptual Design
part of the design process after
you have a clear grasp of the problem and your users’
needs
Rapid Prototyping
a structured technique for encouraging individuals to
come up with ideas for a design
Sketch (Sketching)
- the focus is on the design of individual screens not the interface mechanics
Sketch (Sketching)
will be useful in defining and refining test
organization, conceptual ideas, and the general layout of
screens
sketch
should be an entity that has enough of a
general look to suggest the functionality, interaction, and
layout of screens
- hand sketch
also suitable for use by entire
development team giving everyone a sense of what the
real design issues
sketches
require no large investment of time and
money
sketches
can also be quickly modified and iterated as
many times as necessary because there has been no
emotional investment in code and the status queue
sketches
wrap approximations and often
yield more substantive suggestions or critical comments
than actual screen drone versions
screen sketches
used to define a systems
requirement
sketches
- Concept sketches by two different designers are
diversions, when the two work together to combine
ideas from each separate sketches
Convergence
a visual schematic blueprint or template of a screen or
web page design in an interaction design
Wireframes
a skeletal representation of screen or page layout of
interaction objects such as tabs menus buttons dialog
boxes displays and navigational elements
Wireframes
on screen content and
behavior but not graphical specifics such as fonts colors
or graphics
purpose of wireframes
the basis for iterative rapid prototypes
wireframes
are the blueprint for
design
wireframes
