Digital

Design
in Action
Digital
Design
in Action
Creative Solutions for Designers

Chris Jackson
Nancy Ciolek
CRC Press
Taylor & Francis Group
6000 Broken Sound Parkway NW, Suite 300
Boca Raton, FL 33487-2742
© 2017 by FocalPress/CRC Press
CRC Press is an imprint of Taylor & Francis Group, an Informa business

No claim to original U.S. Government works

Printed on acid-free paper

Version Date: 20161010

International Standard Book Number-13: 978-1-138-83173-5 (Paperback) 978-1-138-62876-2 (Hardback)

This book contains information obtained from authentic and highly regarded sources. Reasonable efforts have been
made to publish reliable data and information, but the author and publisher cannot assume responsibility for the
validity of all materials or the consequences of their use. The authors and publishers have attempted to trace the
copyright holders of all material reproduced in this publication and apologize to copyright holders if permission to
publish in this form has not been obtained. If any copyright material has not been acknowledged please write and let
us know so we may rectify in any future reprint.

Except as permitted under U.S. Copyright Law, no part of this book may be reprinted, reproduced, transmitted, or
utilized in any form by any electronic, mechanical, or other means, now known or hereafter invented, including pho-
tocopying, microfilming, and recording, or in any information storage or retrieval system, without written permis-
sion from the publishers.

For permission to photocopy or use material electronically from this work, please access www.copyright.com (http://
www.copyright.com/) or contact the Copyright Clearance Center, Inc. (CCC), 222 Rosewood Drive, Danvers, MA
01923, 978-750-8400. CCC is a not-for-profit organization that provides licenses and registration for a variety of
users. For organizations that have been granted a photocopy license by the CCC, a separate system of payment has
been arranged.

Trademark Notice: Product or corporate names may be trademarks or registered trademarks, and are used only for
identification and explanation without intent to infringe.
Visit the Taylor & Francis Web site at
http://www.taylorandfrancis.com
and the CRC Press Web site at
http://www.crcpress.com
 Table of Contents

Introduction vii

Chapter 1 Understanding Visual Communication Design 1

Chapter 2 Creating a Visual Presentation 19

Chapter 3 Prototyping a User Interface (UI) Design 45

Chapter 4 Designing Interactions 75

Chapter 5 Exploring Responsive Design 99

Chapter 6 Integrating Motion in Digital Design 123

Chapter 7 Composing Interactive Forms 143

Chapter 8 Publishing to Mobile Devices 163

Chapter 9 Understanding Visual Storytelling 185

Chapter 10 Evaluating and Testing Usability 213

Index 229
Introduction

Welcome to Digital Design in Action. Digital design is not just about

making things look visually attractive on the screen. It encompasses
research, planning, presentation, and programming. You are about to
take a journey that explores practical and creative designs for mobile
apps, electronic publications (EPUBs), web, visual presentations, and
PDF documents.

This Introduction discusses the overall structure of the book and its
primary audience, artists and designers.
 What Is This Book About?
Digital Design in Action explores practical and creative designs for mobile
apps, EPUBs, web, visual presentations, and PDF documents. With the
Adobe Creative Cloud, artists and designers can develop and implement
layouts that go beyond print to include web, tablets, and mobile devices.
Written for designers, Digital Design in Action, deconstructs creative
design solutions, providing valuable insights into the design process and
methodologies used to deploy layouts for multiple output.

Each chapter balances the design aspects with related techniques. This
includes composition and layout, visual hierarchy, typography, responsive
design, media integration, and interactivity. Using the latest digital
publishing tools and the project-based design techniques outlined in
this book, a reader will be able to design their visual solutions for a variety
of digital output.

The book is designed to walk the reader through project-based case

studies that effectively enhance their design skills. Each chapter
contains a unique project exercise that offers timesaving practical tips
and hands-on design techniques. It also discusses adding interactivity
to enhance audience participation. The last section discusses usability
testing for digital design.

viii Introduction
Each exercise provides step-by-step instructions and tips for the
reader to use in conceptualizing and visualizing creative solutions
for their own digital design projects. What differentiates this book
from similar Focal Press books is that readers will view or build
professional world examples in each chapter and, as a result, learn
how to effectively design using Adobe software through the project
implementations rather than reading chapters that only explain
software interfaces and tools. Practical application is the best way to
learn and understand how to design, develop, and deploy for digital
output.

Chapter projects are geared to simulate actual client-work/practical

solutions that artists and designers have used in the industry.
Individual projects for each chapter include:
• Designing a Visual Presentation and Integrating Media
• Prototyping a Functional User Interface Design
• Exploring Responsive Layouts for Web Design
• Animating a Parallax Scroll for a Web Page
• Designing an EPUB Children’s Book
• Developing an Interactive PDF Form
• Illustrating a Visual Storyboard for an Animated Short

Who Should Read This Book?

The primary audience for this book is artists and designers. These
readers can be professionals in the workforce, students, educators,
or anyone interested in creatively designing, developing, and
deploying digital solutions. They should have a basic working
knowledge of Adobe software (InDesign, Illustrator, Photoshop,
Acrobat, and Dreamweaver). The chapter exercises teach readers
how to think creatively and get excited about pushing their design
skills to the next level.

Digital Design in Action ix

 Book Layout Conventions
To help you get the most out of this book, let’s look at the layout
conventions used in the chapters.
• Words in bold within the main text refer to keywords,
names of files, and folders.
• Menu selections are presented like this: File > Place.
• Supplemental information to the text that sheds light on a
procedure or offers miscellaneous options available to you
appear in a side column.

Icons are used throughout the book. Here is a brief explanation

of what they are and what they mean.
• Download Source Files: The source files for this book are available
to readers at www.routledge.com/cw/Jackson
• Book Resources: Supplemental book resources.
• Online Resources: Supplemental online resources.

All of the chapter exercise files are provided to readers at the following
URL: www.routledge.com/cw/Jackson. Chapter exercises have their own
compressed (zip) file. Inside each folder you will find the material needed
to complete each exercise. Completed versions for every exercise are
provided.

All of the material inside this book and accompanying digital files are
copyright protected. They are included only for your learning and
experimentation. Please respect the copyright. We encourage you to use
your own artwork and experiment with each exercise. This is not an exact
science. The specific values given in this book are suggestions. If you
want to experiment, by all means, do so. That is the best way to learn.

x Introduction
About the Authors
Chris Jackson is a computer graphics designer, professor, and graduate
director of the MFA Visual Communication Design program at the
Rochester Institute of Technology (RIT). Before joining the RIT faculty,
Chris was a new media designer with Eastman KODAK Company, creating
and delivering online instructional training via the Web and CD-ROM.
He continues to be an animator, designer, developer, and consultant for
global corporations. He lectures and conducts workshops relating
to interactive design and motion graphics.

Chris’s professional work has received over 25 distinguished national

and international awards for online communication. His areas of
research include user experience design, 2D character animation, digital
storytelling, and interactive design for children. Chris continues to publish
and present his research and professional work at Adobe MAX, ACM
SIGGRAPH, and the Society for Technical Communication (STC). Chris is
the author of After Effects and CINEMA 4D Lite (Focal Press, September
2014), Flash + After Effects (Focal Press, August 2010), Flash Cinematic
Techniques (Focal Press, January 2010), and co-author of Flash 3D:
Animation, Interactivity and Games (Focal Press, October 2006).

Nancy Ciolek is a designer and professor at the Rochester Institute

of Technology, former chair of the Graphic Design Department, and
administrative chair of the School of Design. Previously, Nancy worked
for James Bare Design and St. Mary of the Woods College, before joining
the faculty at RIT. Nancy continues to be active in the profession through
freelance and consulting work, including service as a conference program
reviewer, invited guest educator and speaker, and design consulting for
businesses, state education departments, and non-profit organizations.

Nancy has more than 30 years of experience in graphic design. She has
presented at conferences including SIGGRAPH, UCDA, Kern Conference,
TypeCon, and USG Teaching & Learning Conference. Nancy also attends
Adobe MAX to keep current on the changing software landscape as
related to design. Her design, consulting, and training freelance work
includes work for RIT Press, Dotted Lines Press, SIGGRAPH Education
Committee, Idea Connection Systems, and many other clients. Nancy
has been published in conference proceedings for SIGGRAPH, in the St.
James Press book Contemporary Masterworks, and a white paper for an
online conference for IDS Publishing/Media.

Digital Design in Action xi

 For Instructors
Digital Design in Action provides hands-on exercises that clearly
demonstrate core features in Adobe products. As instructors, we know
you appreciate the hard work and effort that goes into creating lessons
and examples for your courses. We hope you find the information and
exercises useful and can adapt them for your own classes.

All that we ask is for your help and cooperation in protecting the copyright
of this book. If an instructor or student distributes copies of the source
files to anyone who has not purchased the book, they are violating the
copyright protection. Reproducing pages from this book or duplicating
any part of the source files is also a copyright infringement. If you own the
book, you can adapt the exercises using your own footage and artwork
without infringing the copyright. Thank you for your cooperation!

Credits
We would like to thank the following people for their contributions
to this book:
• Steve Wilson, Business Woman, Chapter 1
www.flickr.com/photos/125303894@N06/14387365942/
• Lisa Zahra, DEAAF images and text, Chapter 2
• Vincent Petaccio, Water Faucet, Chapter 2
www.freeimages.com/photo/full-1171768
• Craig Young, Coins 4, Chapter 2
www.freeimages.com/photo/coins-4-1459115
• App wireframes and prototype, Ninglin Jiang, Seneca Park Zoo
Info Guide and Event Planner, Chapter 3 Case Study
• App wireframes, Yue Liu, Roc Doc App, Chapter 3
• Preliminary app sketches, Kaige Liu, Schedule It! App, Chapter 3
• App wireframes,Tejal Sampat, timeOut App, Chapter 3
App wireframes,Tejal Sampat, timeOut App, Chapter 4 Case Study
• Zhaolifang, Dinosaur Bones Vectors, Chapter 8
www.vecteezy.com/vector-art/83009-dinosaur-bones-vectors
• Stay Media Productions, Cityscape at Night, Chapter 9
illustration courtesy of iStockphoto, Image# 1564950
• Belkarus, Cowboy in the Dusk, Chapter 9
illustration courtesy of iStockphoto, Image# 9481995
• App wireframes and prototype, Jordan Reading,
ROC DOX App, Chapter 10

xii Introduction
1
Understanding Visual
Communication Design

Digital design is not just about making things visually attractive on

the screen. It encompasses research, planning, presentation, and
programming. Before we jump into action, it is important to review the
key ingredients that make visual communication design effective. The
main focus is on understanding the content, who will be using it, and
how design facilitates communication while empathizing with the users.

This chapter reviews the underlying framework in designing visual

communication for the digital world. At the completion of this chapter,
you will be able to:
• Describe the different types of content used in design projects.
• Define a user who will be interacting with the content.
• Communicate the content effectively using visual design principles.
• Explain the process of planning, designing, publishing, and
managing a digital project.
 Approaching a Digital Design Project
One of the most intimidating aspects for designers is determining how
to begin a project. A common misstep is to immediately open a software
package and start creating visuals. How can you successfully design
a project when you know nothing about the project’s subject matter?
Designers must first read and understand the content they are trying
to communicate.

Know the Context and Content

What is the difference between context and content? Context refers to a set
of conditions or circumstances that are relevant to the situation. It answers
who, what, when, where, how, and for what purpose; for example, the
client’s goals, resources, budget constraints, accessibility, and technology.
Content refers to the actual intellectual message to be communicated.

No matter what digital device, the goal of screen design is to clearly and
efficiently and effectively communicate content. You have probably heard
the popular phrase, “Content is king!” The more you focus on the content,
the easier the design decisions will be moving forward. So, what types
of content do designers encounter?
• Legacy content already exists and needs to be edited, revised,
and/or updated
• Custom content can be accessed from blogs and video posts
• User-generated content is user-controlled and may need
to be moderated at a cost
• Social media content provides marketing opportunities
but requires more maintenance to keep current
• Legal content are the client’s privacy policies, copyright information,
and terms and conditions

The connection between context,

content, and users is fundamental to
effective information architecture.

2 Chapter 1 | Understanding Visual Communication Design

Define the Users
Linking the client’s goals to the user’s needs provides a specific
objective toward which you can design. Whether you are designing
for desktop, mobile, or wearable devices, you should focus on a
“user-centered design.” What does that mean? Design is about
satisfying the user’s needs and solving their problems. A user may
be one individual or thousands; all with the same wants and needs.
You are not the user and can’t design something for everyone.

Defining the user goes beyond identifying common demographics

such as age, gender, and location. Designers need to think about the
entire user experience (often referred to as UX, UXD, or UED). Who
will be using the project? Where will the project be viewed? When
will the project be viewed? How will it be viewed? There are many
distractions that can compete and/or interfere with your design.
Defining the intended audience and how they will engage with the
content provides a solid blueprint for success.

Designers have to understand the

following about the intended users:
Audience: Age? Gender? Location?
Income Levels? Education?
Disabilities?
Environment: Home? Work?
On-the-go? Noisy or quiet space?
Outdoors or indoors?
Time: Leisure? Budgeted/time
allotted?
Quick check?
Device: Old? New? Bandwidth Issues?
Connectivity Speeds?

Digital Design in Action 3

 Next, figure out what the users want. Why is the project being viewed?
Users’ motivation may come from a desire to learn more about something,
curiosity, or it is required for their jobs. Just like clients, users have goals
that will influence the final design. These goals and objectives include:
• To Learn — provide valuable and relevant information; repeat
and reinforce the content; visualize data; break content into smaller
modules for better retention; provide assessment tools such as
tests to measure the user’s progress
• To Get Answers — design searchable content and interaction;
build navigation that promotes fast access to the content;
avoid using long animation or time-consuming interactions
• To Engage — create a call-to-action button; provide clear and
direct instructions; build in error prevention during the purchasing
process; show user feedback and orientation; design elements
that convey security in interacting with the project
• To Explore — add surprise and randomness to the interactions;
create a navigational path that changes each time the project is
used; provide multiple methods of navigation

Goals drive the design. Make sure

the design solution satisfies the user’s
objectives and motivations.

4 Chapter 1 | Understanding Visual Communication Design

Finally, the project’s design needs to empathize with the user. Users are
emotional. They have needs, hopes, and fears. Designers affect users
through visual communication. So, how do you learn from your users?
In addition to describing the target audience, observe them in action.
Users often make assumptions that will cause errors and disrupt the flow
of the communication. Observation leads to a genuine understanding
of how to solve a design problem and ultimately build a better project.

Empathy for the user includes discovering:

• What makes the users tick?
• What confuses them?
• What do they like and hate?
• Are there latent needs not yet addressed?

Don’t lose sight of the user’s feelings.

Observe them in action.

Digital Design in Action 5

 In addition to observation, user information can also be collected
through surveys, role playing, and interviews. The resulting data can be
consolidated into a user persona. A persona is a fictional character that
represents the “typical” user. It is a key concept in user-centered design.
Personas capture the behavioral patterns, goals, skills, attitudes, and
environment of different user types that will interact with your project.

Elements of a user persona include:

• Name and photo
• Demographics: age, gender, location, education
• Job title: role and responsibilities
• Goals: physical, social, and technological
• Skills: experience with technology and the subject matter
• Likes and dislikes

User personas represent the “typical”

user. Data can come from observations
including video recordings, surveys,
and interviews.

6 Chapter 1 | Understanding Visual Communication Design

Outline the Project’s Scope
Designers need to understand the intended scope of the project. From
the initial client meetings, formulate how much work needs to be done
and address where the final deliverable will reside and who will maintain
it over time. If possible, identify any possible constraints and compensate
for any delays. A well-planned project should provide clarity and a unified
perspective on who is providing what to complete the project.

Include all required design components including a timeline that outlines

milestone deliverables for the project over a period of time. Any additional
client requests made outside of the approved plan are referred to as
scope creep and can negatively impact the final design. Ask the right questions to determine
the project’s scope.
Questions for the client:
• What is your goal in developing this project?
• Who are your users?
• Who are your competitors and do they have something similar?
• Who is providing the content?
• Is there a subject matter expert who can answer questions?
• Are there any existing logos or branding style guides to follow?
• Where will the final design reside?
• What tools does your company have to run, update,
and manage the project?
• How long between project updates?
• Who will maintain the project over time?

Questions for the designer:

• Do I need to hire/collaborate with an expert?
◊ Content strategist
◊ Copy editor
◊ Technology developer
◊ Marketing strategist
• What additional expenses exist?
• Hardware and software?
• Server space?

Digital Design in Action 7

 Prioritize the Content
Once the content has been collected, it is essential to prioritize the
information based on the defined goals and user needs. This is referred
to as information architecture, making order out of chaos, which allows
the user to find content and complete tasks without frustration. How you
structure the content affects the user’s response. Consider a hierarchical
approach to present what the user needs to know.

Determine which content is primary and which can be secondary. Primary

content addresses the users needs. Secondary content is supplemental.
If the user does not access this content, it will not affect the user
experience. The content is there if the user needs it. Use progressive
disclosure of information to avoid overwhelming the user.

Designers should consider the following:

• Develop a visual content map
• Define the call-to-action needed when the user arrives
at the home screen
• Develop page elements based on their purpose
• Determine the navigation to allow access to all high-priority content

Create a process and information

flowchart. The process flowchart
outlines the user’s journey through
the content. The information flowchart
illustrates the information architecture.

8 Chapter 1 | Understanding Visual Communication Design

Select the Right Tool for the Job
Designers need to carefully select the technology used to deliver a
project to its intended audience. Don’t blindly use the same tool for all
design jobs. A tool that is right for one type of project does not mean it
is right for everything. Designers sometimes get so lost in the technology
and figuring out how to develop a project that they lose focus on the
design objectives. Know what tools the client has to run, update, and
manage the content in the future.

Designers need to understand the technology requirements

and restrictions:
Online Tools:

• Adobe Dreamweaver, Muse, Edge Animate,

HTML5 Boilerplates
• Restricts design control over certain interface elements
and typography
Electronic Document Tools:

• Adobe InDesign and Acrobat Pro

• Limited interactivity and control of digital media
Presentation Tools:

• Adobe InDesign, Apple Keynote, Microsoft PowerPoint

• Limited interactivity beyond navigation and hyperlinks
Mobile App Tools:

• Apple XCode, Adobe InDesign

• Steep learning curve regarding programming interactions

Digital Design in Action 9

 Design Principles
Design is about communication. Designers need to apply proven design
theories and methods. The visuals need to be aesthetically pleasing,
promote consistency, and facilitate the user absorbing all the visual
content on any given screen. Additionally, movement can clarify complex
content or direct the user’s eye. Finally, the experience needs to empathize
with the user through affordances, mental and conceptual models, and
existing user interface (UI) design patterns.

Visual Design Principles

Design principles are the building blocks used to create visual
communication. They focus on the aesthetics by strategically
implementing images, colors, fonts, and other elements. A successful
visual design does not take away from the content on the page or
function. Instead, it enhances the user experience by engaging the
users and communicating content visually.

To review, when approaching a digital design project, first focus on the

overall design as opposed to the individual elements. This is referred
to as Gestalt. If the design elements are arranged properly, the Gestalt
of the overall design will communicate more effectively. The key
principles to incorporate include:

Alignment
• Creates order and a visual connection between
elements on the screen.
Balance
• Symmetrical, or formal balance
• Eye seeks balance and symmetry
• Asymmetrical, or informal balance
• Adds more interest
• More abstract
• Overall composition still feels balanced even though
there are differences in size, space, etc.
Contrast
• The juxtaposition of different elements used
to create emphasis in a composition
Hierarchy
• The structuring of elements within a composition
to visually show priority in the content

10 Chapter 1 | Understanding Visual Communication Design

Proximity
• Creates relationships between elements to form a focal point
• How elements within a composition are grouped to appear
as a single unit
Repetition
• Used to establish consistency and create a visual rhythm
Similarity
• Elements appear to be similar due to visual properties
such as size, shape, and color
Space
• Includes the distance between, around, above, below,
or within elements
• Both positive and negative spaces are important factors
to be considered in every design
Unity
• How different elements within a composition interact
with one another

1 2 3
1 Alignment
2 Balance
3 Contrast
4 Hierarchy
5 Proximity
6 Repetition
7 Similarity
8 Space
4 5 6
9 Unity

7 8 9

Digital Design in Action 11

 Visual Semiotics and Design
Semiotics is the theory and study of signs (words and images) as
elements of visual language for communication, and how they are
interpreted. In visual semiotics, an object not only carries information
and meaning, but also carries an emotional impact for the viewer.

When a sign is signaled to the audience through visual senses, the

impression is sent to the brain, which leads to an interpretation of
meaning — often subjective — depending on the perspective and
experience of the viewer.

There are two kinds of meaning in semiotic theory:

• Denotative — literal meaning (what you see).
An icon is denotative.
• Connotative — associated meaning (what you think).
A symbol and index are connotative.

There are three categories of signs:

• Symbol — abstract representation, often arbitrary,
of a concept that requires a learned connection.
• Icon — literal visual representation of the referent.
• Index — creates connection of concepts through
visual representation.

SYMBOL ICON INDEX

12 Chapter 1 | Understanding Visual Communication Design

Semiotic Model of Design
Every designed item has three distinct dimensions:
• Semantic
• Syntactic
• Pragmatic

Semantic — the relationship of meaning to the design. How well does

the design represent the message? Do people fail to understand
the message the design denotes? Does the design carry the same
message in various cultures?

Syntactic — the relationship of formal aspects of the design to each

other. How does the design look? How well do the parts of the design
relate to each other? Is the construction of the design consistent in its
use of visual principles?

Pragmatic — the relationship of a visual image to a user. Can a person

use the design for its intended use? Is the design legible in typical
viewing distances and lighting? Is the design difficult to reproduce?

Semantic Syntactic
Meaning Message / Aesthetic Form
Perception Meaning Structure
Communication Variables

Pragmatic
Function / Technical
Usability Production
Ergonomics

Digital Design in Action 13

 Motion Principles
The movement of images and text can be used to communicate complex
ideas and concepts. Movement can also guide the user’s eye and influence
their interactions. For example, mobile devices are now implementing
motion principles in the user interface to show transition from one screen
to the next.

Motion can ease the user through the experience. It also assists with the
visual hierarchy through how objects come on and off the screen, or into
focus. The design challenge is using proper restraint when it comes to
animating objects on the screen. Too much motion can sometimes be
distracting or even confusing to the user. Motion should always be used
1 to maintain or help focus on the content, not take it away.

Chapter 6 will cover these motion principles in detail:

• Anticipation
• Arcs
2 • Follow-through
• Overlapping actions
• Slow-in and slow-out
• Squash and stretch

1 2 3 4
4

Examples of motion principles:

1 Anticipation
2 Slow-in and slow-out
3 Overlapping actions
4 Squash and stretch

14 Chapter 1 | Understanding Visual Communication Design

User-Centered Design Process
Designers need to take a holistic approach to understanding the users,
their tasks, and their environments. In order to achieve this, the users
must be involved throughout the design and development process.
This user-centered design process is iterative.

Successful user-centered design incorporates the following:

Affordances
• Visual clues that help users understand how to use an object

Mental and conceptual models

• Users predict how an object will behave based on
previous experience
• Learned over time and built on top of one another

UI design patterns
• Using and repeating established design standards for:
◊ the placement of graphical user interface assets
◊ user interactions and feedback

User-centered design is a process

that assists designers in creating
interactive content and user interfaces
that are learnable, usable, and fun.

Digital Design in Action 15

 The Digital Design Cycle

Designing for multiple screens and devices poses unique challenges.

For example, the actual process of developing a website generally follows
the same steps, from gathering the initial information, to the visual design
and development, to the website’s launch and maintenance. The process
may vary slightly from designer to designer, but the basic cycle includes:

Analysis
• Identifying and defining the users and their needs
• Personas, profiles, accessibility
• Define the client’s goals and objectives
• Planning the project goals and objectives to address
the needs of the users
• Matrix of user tasks
• Workflow

Conceptual Design
• Gathering and organizing the information
• Information architecture and analysis of content
• Navigation plan
• User personas and scenarios
• Designing the visual look and feel
• Conceptual model
• Visual metaphors
• Design concepts
• Navigation design
• Storyboards and wireframes

16 Chapter 1 | Understanding Visual Communication Design

Design and Implementation
• Designing the user interface
• Mockups
• Interaction flow
• Deference/clarity/depth
• Developing the underlying structure for the user’s experience
• Layout: a collection of formats, styles, and grid systems
• Typography: a selection of typefaces and typesetting
for the written content
• Color: to assist in communicating complex information
or directing the user’s eye
• Imagery: the use of visual semiotics, from photographically
real to abstract icons and symbols
• Animation: a kinetic display of information using
the element of time
• Interaction: moving from passive to active user involvement
• Sequencing: visual storytelling techniques to break
the content up into manageable “chunks”
• Sound: the use of abstract, vocal, or music

Usability Evaluation
• Testing the effectiveness of the experience throughout each stage
• Making iterative improvements based on the evaluation results

Launch and Maintenance

• Delivering the site to device(s)
• Maintaining the site to keep it current

Digital Design in Action 17

 Summary
This chapter reviewed the underlying framework for designing visual
communication for the digital world. Designers need to apply proven
design theories and methods. They need to take a holistic approach to
understanding the users, their tasks, and their environments. The visuals
need to be aesthetically pleasing, promote consistency, and facilitate
the user absorbing all the content on any given screen.

Digital design encompasses research, planning, presentation, and

programming. You should now be able to:
• Describe the different types of content used in design projects.
• Define a user who will be interacting with the content.
• Communicate the content effectively using visual design principles.
• Explain the process of planning, designing, publishing, and
managing a digital project.

The next chapter focuses on presentation design.

18 Chapter 1 | Understanding Visual Communication Design