Why Design Thinking Works Stage 1: Empathize—Research Your

Users' Needs: Empathy is crucial to

The Challenges of Innovation: To be problem solving and a human-centered
successful, an innovation process must design process as it allows design
deliver three things: superior solutions, thinkers to set aside their own assumptions
lower risks and costs of change, and about the world and gain real insight into
employee buy-in users and their needs.
Superior solutions: Defining problems in Stage 2: Define—State Your Users' Needs
obvious, conventional ways, not and Problems. Define: the second phase of
surprisingly, often leads to obvious, design thinking, where you define the
conventional solutions. problem statement in a human-centered
Lower risks and costs: Uncertainty is manner. You will organize the information
unavoidable in innovation. That’s why you have gathered during the Empathize
innovators often build a portfolio options. stage.
The trade-off is that too many ideas dilute Stage 3: Ideate—Challenge Assumptions
focus and resources. To manage this tension, and Create Ideas: Ideate: the third phase of
innovators must be willing to let go of bad design thinking, where you identify
ideas—to “call the baby ugly,” Employee innovative solutions to the problem
buy-in: An innovation won’t succeed unless statement you’ve created. During the third
a company’s employees get behind it. The stage of the design thinking process,
surest route to winning their support is to designers are ready to generate ideas.
involve them in the process of generating Stage 4: Prototype—Start to Create
ideas. Solutions: Prototype: the fourth phase of
Why Is Design Thinking so Important? design thinking, where you identify the best
In user experience (UX) design, it’s crucial possible solution.
to develop and refine skills to understand Stage 5: Test—Try Your Solutions
and address rapid changes in users’ Out: the fifth and final phase of the design
environments and behaviors. thinking process, where you test solutions to
derive a deep understanding of the product
The 5 Stages in the Design Thinking and its user. Designers or evaluators
Process: Design thinking is a non-linear, rigorously test the complete product using
iterative process that teams use to the best solutions identified in the Prototype
understand users, challenge assumptions, stage. This is the final stage of the five-stage
redefine problems and create innovative model; however, in an iterative process such
solutions to prototype and test. Involving as design thinking, the results generated are
five phases—Empathize, Define, Ideate, often used to redefine one or more further
Prototype and Test—it is most useful to problems
tackle problems that are ill-defined or The design thinking process should not be
unknown. seen as a concrete and inflexible approach
to design; the component stages identified
should serve as a guide to the activities you edits, you’ll have a solution that can
carry out. yield positive results

WHAT IS DESIGN THINKING? EXAMPLES OF DESIGN THINKING

Design thinking is a user-centric, solutions- 1. GE Healthcare
based approach to problem-solving that can 2. Oral B
be described in four stages: 3. Netflix
1. Clarify: This phase involves 4. Airbnb
observing a situation without bias. It 5. UberEats
leans into design thinking’s user- PRACTICE DESIGN THINKING
centric element and requires 1. Consider the Big Picture
empathizing with those affected by a 2. Research Each Company’s
problem, asking them questions Competitors
about their pain points, and 3. Think Through Alternative Solutions
identifying what they solved. You
can then use what you learn to create User Interface Elements
a problem statement or question that Interface elements include but are not
drives the rest of the design thinking limited to:
process. Input Controls: checkboxes, radio buttons,
2. Ideate: Begin brainstorming potential dropdown lists, list boxes, buttons, toggles,
solutions. Take your problem text fields, date field
statement or question and ideate Navigational Components: breadcrumb,
based on patterns or observations slider, search field, pagination, slider, tags,
collected in the clarify phase. This is icons
the time to let your imagination and Informational Components: tooltips,
creativity run wild. icons, progress bar, notifications, message
3. Develop: Develop potential solutions boxes, modal windows
using the ideas you generate, then Containers: accordion
test, experiment with, and reiterate to
determine which are successful and
which aren’t. Be ready to return to
the ideation or clarification stage
based on your results. Stepping back
in the process is common—and
encouraged—in design thinking.
4. Implement: Finally, implement the
solution you’ve developed. Again,
it’s likely you’ll have to take a few
steps back and reiterate your final
solution, but that’s a central part of
this phase. After several tests and
Notes on Opening Case and EOC Cases

Opening Case
Interface Design at Aviation Electronics: This case is recap of the development and deployment of a
manufacturing support system. The case emphasizes the importance of the user experience and the
need to both begin early on the design of the user interface and the importance of continual heavy user
involvement. In the case the user/client was powerful enough to get the project manager replaced with
one who would work extremely closely with the users to develop a total user experience.

EOC Cases
Video Rental System: In this case an interchange between a user and the system is presented in
dialog format. The student is asked to develop a storyboard that encompasses that dialog.
Community Board of Realtors (running case): Community Board of Realtors is a professional
organization that supports real estate offices and agents. This case describes some of the requirements
of being able to enter information for the use case Create new real estate listing on a mobile device.
Constraints on the user input screen are that the mobile device will be small and that the entry of text
is somewhat slower than with a keyboard. The student is asked to develop a storyboard of a possible
interaction between the system, via a mobile device, and the user.
On the Spot Courier Services (running case): On the Spot is a small, but growing, courier service
that needs to track customers, package pickups, package deliveries, and delivery routes. There are two
assignments for this case. First the student is asked to develop a simple storyboard of a single use case,
Request package pickup. The student is also asked to be creative to design a user interface for the use
case View scheduled pickups/deliveries using current technology and equipment.

Spring Breaks 'R' Us Travel Services (SBRU) (running case): SBRU is an online travel services that
books spring break trips to resorts for college students. This case introduces a new ancillary capability
©2016. Cengage Learning. All rights reserved.
Systems Analysis and Design in a Changing World, seventh edition 8-3

that might integrate with the SBRU system, particularly the chatting subsystem. As students activate the
social networking subsystem application on their mobile devices, the resorts can use this information to
monitor locations and message traffic of the students. This information can be used to increase security
at the resort and help keep the student vacationers safe. The student is asked to be creative and develop a
storyboard of security type of information that would be helpful to the resorts.
Sandia Medical Devices (running case): Sandia Medical Devices is a company that specializes in
medical monitoring through remote, mobile telecommunication devices. In this case, there is a need to
transmit information between the remote glucose monitoring device and the base server. The students
are asked to think about the design of a smartphone app that allows the patients to view their blood
level information in a graphical form. It also would allow them to add their own comments to the data.
There are a set of questions to help the students think about how various approaches to designing the
user interface. The assignment is to sketch out a screen to show the data and which includes
appropriate controls.

Instructor's Notes
Understanding the User Experience and the User Interface

Key Terms
• user experience (UX) – all aspects of a person’s interaction with a software
application, including actions, responses, perceptions, and feelings
• user interface (UI) – the set of inputs and outputs that the user interacts with to invoke
the functions of an application
• user-centered design – design techniques that embody the view that the user interface
appears to be the entire system
 usability – degree to which a system is easy to learn and use
efficiencyhuman-computer interaction (HCI) – a field of study concerned with the
and effectiveness of user interfaces vis-à-vis computer systems, human-oriented
input and output technology, and psychological aspects of user interfaces

 metaphors – analogies between features of the user interface and aspects of physical reality that
users are familiar with

 direct manipulation metaphor – metaphor in which objects on a display are manipulated to look
like physical objects (pictures) or graphic symbols that represent them (icons)

 desktop metaphor – metaphor in which the visual display is organized into distinct regions, with a
large empty workspace in the middle and a collection of tool icons around the perimeter
 document metaphor – metaphor in which data is visually represented as paper pages or
forms

 dialog metaphor – metaphor in which user and computer accomplish a task by engaging in a
conversation or dialog via text, voice, or tools such as labeled buttons

©2016. Cengage Learning. All rights reserved.

Systems Analysis and Design in a Changing World, seventh edition 8-4

Lecture Notes
The discussion on user interface design must include the entire user experience. The user experience is
a broad concept that applies to all aspects of a person’s interaction with the system. The user interface,
which is the set of inputs and outputs that the user sees and interacts with, must fit within this larger
concept of the user experience. User interface design must consider all aspects of the user
characteristics as well as the myriad devices that the user will interact with. Figure 8-1 illustrates many
of the different elements that impact the user experience and which must be considered.
Experienced developers recognize the importance of all aspects of the user interface and recommend
using several techniques that place the user at the center of the development process. These
techniques are referred to collectively as user-centered design. User-centered design techniques
emphasize three principles:

 Focus early on users and their work.

 Evaluate designs to ensure usability.
 Use iterative development.

The early focus on users and their work is consistent with the approach to systems analysis in this text.
User-oriented analysis and design tasks are performed as early as possible and are often given higher
priority than other tasks.
The goal of user-centered design is usability, the degree to which a system is easy to learn and use.
Ease of learning and ease of use sometimes conflict. For example, a system can be easy to learn but
be cumbersome to use all day. Usability is not always easy to achieve.
The third principle of user-centered design is iterative development—that is, doing some analysis,
then some design, then some implementation, and then repeating the processes. After each iteration,
the project team evaluates the work on the system to date. Iterative development keeps the focus on
the user by continually returning to the user requirements during each iteration and by evaluating the
system after each iteration.
User interface design is, in fact, included in a much larger field of Human Computer Interaction.
This larger field focuses on all aspects of efficiency and effectiveness as humans utilize technology
to perform their business tasks.

Metaphors for Human-Computer Interaction (HCI)

There are many ways to think about human-computer interaction, including metaphors or analogies.
Each metaphor provides an analogy to a different HCI concept. Figure 8-2 is a summary chart.
Direct manipulation: A metaphor of HCI in which the user interacts directly with objects on the
display screen. The desktop metaphor is a direct manipulation approach in which the display
screen includes an arrangement of common objects found on a desk.
Document metaphor: A metaphor of HCI in which interaction with the computer involves
browsing and entering data on electronic documents.
Dialog metaphor: A metaphor of HCI in which interacting with the computer is much like carrying on a
conversation or dialog. The user asks the computer for something, and the computer responds. The
©2016. Cengage Learning. All rights reserved.
Systems Analysis and Design in a Changing World, seventh edition 8-5

computer might then ask the user for something, and the user responds. The text provides an example
that describes a manager and an assistant carrying on a conversation about messages (see Figure 8-4).
This dialog would be basically the same if the manager were interacting with a computer that talked,
or if the manager were interacting with a computer with menus and dialog boxes. Therefore, designing
a natural sequence of interactions, like a dialog, will help ensure usability in a final physical design.

Quick Quiz
Q: Why is interface design referred to as dialog design?
A: Interface design is often referred to as dialog design because the interaction between
user and computer is much like a dialog.
Q: Why are the three important principles emphasized by user-centered design?
A: Focus early on users and their work; evaluate designs to ensure usability; use
iterative development.
Q: Why are the three metaphors used to describe human-computer interaction?
A: Direct manipulation metaphor, document metaphor, and dialog metaphor.

Fundamental Principles of User-Centered Design

Key Terms
 human-interface objects (HIOs) – icons and other objects on a screen that can be manipulated by the
user and cause some action to occur

 affordance – when the appearance of a specific control suggests its function visibility
when a control is visible so that users know it is available, the control providing immediate
feedback to indicate that it is responding to the user
 tool tip – brief instructions that pop up when the mouse hovers over a control
 visibility – when a control is visible so that users know it is available

 feedback – some visual or audio response by the system in response to a user action

 radio buttons – a group of selection items that allows only one item to be selected within the group
 check boxes – a group of selection items that allows either none or many items to be selected within
the group

 continuity – maintaining a certain level of consistency over time, across multiple

releases discoverability a feature of the user interface that provides clues to help the users
uncover hidden features
 active discovery – a user-interface feature to lead users to discover hidden features

 breadcrumbs (navigation) – the technique of displaying the sequence of pages

traversed to ©2016. Cengage Learning. All rights reserved.
Systems Analysis and Design in a Changing World, seventh edition 8-6

allow easy backing out to a previous page

Lecture Notes

Human Interface Objects

Human interface objects are those objects that appear on a screen and that the user can manipulate or
use to navigate. The concept of “affordance” means that the developer should use objects that
reflect the function that they perform. Tool tips can assist the user as he/she looks for meaningful
icons or hotspots on the screen.
HIO’s should also provide visual feedback when they are activated. This feedback can be visual,
such as a change it color or background color or highlight, or audio, such as a clicking noise.
These two principles, affordance and visibility, are critical for all types of devices and user
interface objects.

Consistency
One of the most troublesome approaches to design is a lack of consistency. When difference icons or
HIOs are used to do the same operation, or when the same HIOs have unique operations, then users
really get confused. There are several levels of consistency that are important.
Consistency within a platform is achieved when all the same HIOs are used within the Windows
platform or the Apple platform. For general purpose HIOs this is normal because those items, such
as buttons, and arrows, etc. are provided by the platform developer. Consistence across platforms,
i.e. Windows and Apple, is harder. Some HIOs have consistent use, but not all do.
Consistency within a suite of applications means that the set of related programs all have the same
look-and-feel, and use the same HIOs. A common example is Microsoft Office Suite. Most general
purpose suites have gone this way, but designers should be sure they do the same.
Consistency within an application means that the various screens all use the same HIOs to do the same
functions. This principle is frequently violated.
Continuity is slightly different than consistency. It means that the various versions of the same system
that are released to production over time also use the same HIOs. This is not always possible, due to
new functionality being added. However, as much as possible is should be an accepted principle.

Discoverability
Discoverability is the principle that it should be easy for the user to find and figure out the
operations and features on a screen. Sometimes we say, is this application “intuitive” – meaning is it
easy to figure out what to do.
Active Discovery is simply the principle that the designer will include these kinds of clues by design and
not simply let the user find the available functions by trial and error. Tool tips can help. Other clues
might include change the mouse pointer, or hover actions such as changing color. Or have little pop-up
images or textboxes that help the user discover the allowable functions. Visual diagrams are
©2016. Cengage Learning. All rights reserved.
Systems Analysis and Design in a Changing World, seventh edition 8-7

especially powerful.

Closure
Closure lets the user know that he/she has completed an operation. Visibility and feedback
are important aspects of closure.
When using a dialogue metaphor it is especially important to provide closure so that the user knows the
job is complete. Dialogues often require several steps, which all must be completed.
Another part of closure is that the user’s work should be saved or protected both during a dialogue,
but especially at the end. That can be done either automatically, or by a specific reminder to the user.
Undo capability should be provided so that the user can “back up” when necessary. Those systems
that are most useable allow several undo steps so that users can reverse more than one action.

Readability and Navigation

System users come in all skill levels and ages. It is important to make the text readable by type, size,
and color. Some systems allow the user to adjust these properties. Sometimes designers will try to
be too fancy and end up with text that is very difficult to read.
Navigation through the entire application should be obvious and easily traversed. And reversal of
navigation, in addition to reversal of actions, should also be provided. One common technique is called
breadcrumbs, which shows the hierarchy of screens that were traversed to arrive at the current
location. Making them hotspots allows the user to return to previous locations quickly and easily.

Usability and Efficiency

Usability and efficiency are overall principles which simply mean that designers should always
be thinking about how to make the application easy to use. One powerful technique, particularly
for power users, is to provide shortcut keys to the most used functions.
Error messages should be written so that they are clear and indicate not only what is in error, but
how to fix it.
Finally, the KISS (Keep It Simple Stupid) is a good design principle. Designers should always be
thinking how to make the interface, the operations, the navigation, the instructions, and so forth easy
to find, easy to navigate, easy to understand, and easy to use. Simpler is always better.

Quick Quiz
Q: What are human interface objects?
A: HIOs are all those objects that are viewable on the screen that the user can manipulate or that
cause some action to occur.
Q: What does affordance mean? Give an example.
A: It means an icon on a screen resembles or looks like the function that it performs.
For example the media player controls look like the controls on a CD/DVD player.
©2016. Cengage Learning. All rights reserved.
Systems Analysis and Design in a Changing World, seventh edition 8-8

Q: What does visibility mean? Give an example.

A: It means that the control on a screen should be easily visible, and it should provide feedback
when it is activated. An example is a button the indents or changes color when it is clicked.
Q: What does consistency mean? What are some levels of consistency?
A: Consistency is using the same HIOs to perform the same actions. Consistency can be across
platforms, across all the applications of a suite of apps, and within a single application.
Q: List three or four other important considerations in user interface design.
A: Discoverability, Closure, Readability, Undo, Navigation reversibility, Error Messages

The Transition from Analysis to User-Interface Design

Key Terms
 storyboarding – sequence of sketches of the display screen during a dialog

Lecture Notes
Use cases that require direct user interaction (i.e., interactive use cases) are the starting point for a
dialog, and the corresponding use case, activity, and system sequence diagrams are the initial
dialog documentation.

Use Cases and the Menu Hierarchy

Menus are a way of grouping large numbers of related use cases or dialogs within a user interface.
In all but the smallest systems, menus are needed to present the user with a tractable number of
choices per screen, to group related functions together so users can more easily locate them.
A designer must decide which use cases and user interfaces to include in which menus, which menus
are required, and how many menu levels are required. Menus usually contain five or so choices in
order to avoid overloading the user. Multiple levels of menus helps to keep the number of individual
menu items at a workable number.
Use cases with common actors and event decomposition or that implement CRUD actions for a
specific domain class are good candidates to be grouped into a single menu or related group of menus.
See Figure 8-15.

Analysis Models and Input Forms

Some of the models developed during the analysis activities are useful inputs to designing input forms.
For example, an SSD shows the flow of information across the system boundary. Every time
information flows across the boundary, some type of user interface document is needed. Activity
diagrams also can show where interactions occur between the user and the system. All of these points
in the diagrams are candidates for an input or output screen or some other type of user interface.
©2016. Cengage Learning. All rights reserved.
Systems Analysis and Design in a Changing World, seventh edition 8-9

Dialogs and Storyboards

After identifying all required dialogs, the designers must document the dialogs. One approach is to
list the key steps followed for the dialog with a written description of what the user and computer do
at each step. Designers can also document dialog designs by writing out how the user and system
might interact if they were two people engaged in conversation.
There are many possible implementations of a dialog scenario. Before deciding on a specific
implementation, an analyst often uses a technique called storyboarding—that is, showing a
sequence of sketches of the display screen during a dialog. The sketches don’t have to be very
detailed to show the basic design concept. Figure 7-7 shows a detailed storyboard example.

Quick Quiz
Q: What is the purpose of having menus in a user interface?
A: Menus are a way of organizing the functions on the user interface to allow the user to
organize his/her work and to more easily find the desired functions.
Q: What is storyboarding?
A: Storyboarding is a technique used to document dialog designs by showing a sequence of
sketches of the display screen. Users (and programmers) can understand the basic idea of a
dialog design using a simple sketch, and users are more apt to suggest design changes when
looking at a sketch. Storyboards can also be implemented with prototyping tools.

User-Interface Design

Key Terms

 text box – a rectangular box that accepts text typed on a keyboard or recognized from speech input
 list box – a text box that contains a list of predefined data values

 combo box – a text box that contains a predefined list of acceptable entries but permits the user to enter
a new value when the list doesn’t contain the desired value

 mobile responsive – designing Web sites so that the pages are responsive to being displayed on small,
mobile devices

 action bar – a common navigation bar with action controls used for smartphones and usually placed
at the bottom of the screen

Lecture Notes
Three considerations in user design include, first whether the system will use custom screens or will be
browser based and utilize html type forms.
A second consideration is the types of devices that will be used to interact with the system.
Displays ©2016. Cengage Learning. All rights reserved.
Systems Analysis and Design in a Changing World, seventh edition 8-10

range from large-format, flat-panel monitors used with desktop computers to much smaller displays
on tablets and cell phones. As the range of user-interface technologies has increased, so has the need
to create multiple user interfaces.
A third consideration applies to the operating systems and platforms that must be supported. These
alternatives include personal computers, tablets, smartphones, and so forth. There are also a wide
range of operating systems on each type of device. These decisions affect what types of HIOs are
available and how consistent the various displays can be.

Desktop and Laptop User Interfaces

Usually desktops and even many laptops have large display screen with large areas to place HIOs.
In fact, many users have oversized monitors on their desks to facilitate viewing. However, careful
consideration should still be given to screen design so that the purpose of the screen is obvious, and
related objects are grouped together. One final consideration for all user interface design is to ensure
that items are aligned perfectly, that there are no spelling mistakes, that labels are correct and well
aligned, and so forth.
Special care should be given to create data entry fields and forms that have easy to use controls, that
tabbing between fields is correct, that the fonts are readable, and that fields are edited to reduce
input errors.

Considerations for Web-Based Applications

Web-based applications rely on the Internet, so all the forms, as well as the data must transmitted
over the Internet. With current bandwidths and speeds, images and even videos are sometimes sent.
However, designers should always be aware that the larger the files sent, the longer the load times.
Users who are doing productive work can be negatively impacted with long load times.
Another important consideration is that browser based screens may be viewed on a variety of browsers.
And these browsers have different display defaults that affect the look-and-feel of the screen. It is not
uncommon for a screen to look nice in one browser, but be all messed up in a different browser.
The layout and formatting of webpages must consider the various devices and platforms. Web based
systems are especially subject to being viewed on various devices. One related decision on Web
based screen layout is the impact of advertising on the screen. The use of advertising is ubiquitous
and must be considered.

Smartphones and Small Mobile Devices

The industry is still learning how best to design for small mobile devices. Most apps are designed for a
particular platform. One principle is that smartphones are used to view Web based applications. A
Web application that is sensitive to smartphone use is said to be mobile responsive.
Two considerations about smartphone app design are the very limited screen size, and the fact that
all screens are touch sensitive (i.e. no mouse). Here are some important considerations:
• Each screen should have a single focus or purpose.
• Screens need both portrait- and landscape-view
capabilities. ©2016. Cengage Learning. All rights reserved.
Systems Analysis and Design in a Changing World, seventh edition 8-11

• When appropriate, screens should be allowed to resize without losing screen controls.
• Screen components should be directly touch-manipulated.
• Visible navigation controls should be placed at the bottom of the screen.
• Due to screen swiping, both horizontal and vertical scrolling is allowed.
• Use small pop-up screens when additional information is needed.
Data entry is also more difficult on small devices. Two particular issues are
• Fat finger problem with the user hitting multiple objects or a nearby, but incorrect object.
• Accidental touches. Sometimes the user accidently touches the screen with erroneous results.
Navigation is also more difficult on small mobile devices. Some principles include:
• Design the landing screen (first loading screen) so that it shows clearly how the app is organized
and how to get to all the functions. Include a way to return to this screen on all other screens.
• Design the user interface so that there are visual clues for where a task is located in the app.
• Consider using an action bar at the bottom (or top) of every screen with common navigation
or action controls. If the bar must be hidden, make it easy to find and show.
• Remember that there is no mouse over capability, so such techniques as tool tips are
not available.
• Ensure a Back button capability exists, either on the device or as part of the application.

Tablets
Tablets are a little larger than small devices, but still require some of the same design principles. For
example, tablets have touch screens, but do not have a keyboard or mouse. However, the larger
screen can provide more area to add controls and data.

Quick Quiz
Q: What are three general considerations for designing of user interfaces?
A: Whether the system uses custom built screens, or is browser based. What devices will it be
used on. And what operating systems will be supported (i.e. what controls are available).
Q: What are some issues with mobile devices for navigating through the application?
A: Provide visual clues. Include some type of action bar (like a menu bar). There is no mouse
over capability. Provide backup capability for accidental touches.
Q: What are two data entry issues for mobile devices?
A: Fat finger mistakes, and accidental touch mistakes.
Q: What additional issues must be addressed when designing for the Web?
A: Other issues include performance considerations due to the long transmit paths. The
amount ©2016. Cengage Learning. All rights reserved.
Systems Analysis and Design in a Changing World, seventh edition 8-12

of data transmitted to a page, such as video, sound, and program logic affects the
performance. Finally, since Web applications are available to everybody, consideration should
be given to support for persons with disabilities.

Designing Reports, Statements, and Turnaround Documents

Key Terms
There are four types of output reports commonly provided by an information system:
 Detailed reports—These contain specific information on business transactions.
 Summary reports—These are often used to recap periodic activity.

 Exception reports—These provide details or summary information about transactions or

operating results that fall outside of a predefined normal range of values.

 Executive reports—These are used by high-level managers to assess overall organizational health
and performance.

 drill down – user-interface design technique that enables a user to select summary information and
view supporting detail

Electronic Reports:
Organizations use various types of electronic reports, each serving a different purpose and each
with its respective strengths and weaknesses. Electronic reports provide great flexibility in the
organization and presentation of information. In some instances, screen output is formatted like a
printed report but displayed electronically. However, electronic reports can also present information
in many other formats.
An important benefit of electronic reporting is that it is dynamic; it can change to meet the specific
needs of a user in a particular situation. In fact, many systems provide powerful ad hoc reporting
capabilities so users can design their own reports on the fly. One technique, called drill down, allows
the user to activate a “hot spot hyperlink” on the report, which tells the system to display a lower-
level report that provides more detailed information.

Graphical and Multimedia Presentation:

The graphical presentation of data is one of the greatest benefits of the information age. Tools
that permit data to be presented in charts and graphs have made information reporting much more
user friendly for printed and electronic formats. Information is being used more and more for
strategic decision-making as businesspeople examine their data for trends and changes.

Quick Quiz
Q: What are four common types of reports?

©2016. Cengage Learning. All rights reserved.

Systems Analysis and Design in a Changing World, seventh edition 8-13

A: Detailed reports, summary reports, exception reports, and executive or management reports.
Q: What is drill down? What kind of output utilizes drill down?
A: Drill down is only available on electronic reports and provides capability to click on a
value in a report and access additional detail or extended information about that value.
Q: What is one of the most common uses for graphical information on a report?
A: Graphical representation is especially powerful for presenting comparisons or trends.

Classroom Activities
Classroom activities can be divided into two areas of focus, desktop systems and web based systems.
In each of those instances, a more passive type of activity would be to analyze several screens or forms
based on the criteria given in the chapter. Most of today's desktop system conform to standards and are
quite similar – particularly with regard to menus. However, there are many desktop systems that are
deficient in such things as tool bars, shortcut keys, and help pages. Many do not have any contextual
level help and other problems. It is an interesting activity to find some of those poor examples and ask
class members to either try to do a task that is hard to do, or suggest how the problems might be
improved.
Web based systems have a much broader range of very bad designs to very good designs. PC World
has a list of 25 worst websites. You, the teacher, can also find websites that are very unfriendly. Even
some very popular websites are so filled with banner advertisements and “in your face” advertisements
that they are offensive to some users. An interesting class activity is to observe and discuss some of
these very bad sites.
More active classroom activities would be to have student teams design some screens or pages
and have them present their solutions to the class. This activity requires more preparation by both
the students and the teacher. A short in class exercise, however, could be done in few minutes.

Troubleshooting Tips
The basic concepts in the chapter are not particularly difficult. The major issue in this chapter is that
there is a lot of information and material to cover. User interface design, and system interface design,
is not a complex topic, but it is very time consuming. Good interface screens and reports require a
tremendous attention to detail and frequently many iterations with the user. The basic concepts taught
in this chapter will help the student get started, but working with the user to actually develop screens,
reports or Web pages is a demanding job.
One area that students sometimes have problems is identifying the user interface based on the
information available in system sequence diagrams and/or activity diagrams. A system sequence
diagram is more oriented to individual input and output transactions, where the user interface requires
many more concepts and considerations. We recommend that you walk through an example of starting
with a use case, identify the messages on the system sequence diagram, and then show the final
screens or web page layout. The data will be the same, but there will normally be many other items on
the screen for beauty, consistency, navigation, and other usability issues.
The other area that is new for the students is how to create a storyboard. In fact, that is part of the
same ©2016. Cengage Learning. All rights reserved.
Systems Analysis and Design in a Changing World, seventh edition 8-14

problem – to take a single use case or message in a use case and expand it to cover various steps of
validating input data, navigating around the screen, and finally submitting the data. Working through
an example in class, and then allowing the students to also do an example goes a long way to help
them be able to create storyboards. Several of the EOC cases require storyboards, so it would be a
good idea to help them work through one in class.

Discussion Questions
1. Design Standards and Creativity

The definition of interface design standards states that “general principles and rules must be
followed….” Do user interface design standards restrict creativity? Does adherence to a standard
reduce productivity by causing each developer to change his or her approach to building systems?
How easy or difficult is it to adhere to a documented standard? How can an organization’s adherence
to standards be improved?

2. Internationalization

What is the impact of internationalization on user interface design? If you know that your software will
be used in Europe or Japan, what is a source of standards that can be used to support international
software development? How can software development kits (SDKs) be used to assist with this effort?

3. Usability Testing

Usability testing is a key part of the design process and typically involves a wide range of techniques
and investment resources. Using the dialog design for RMO phone-order representatives, how would
you recommend that usability testing be conducted? How would you recommend that usability testing
be handled for the dialog design for the RMO Web site? Should usability testing for both dialog
designs be handled in the same fashion, or are different approaches needed for each dialog design?

©2016. Cengage Learning. All rights reserved.

 Module 2
The Design Process

AIS103P
MANAGEMENT OF INFORMATION AND
TECHNOLOGY
SESSION 2
MALAYAN COLLEGES LAGUNA-E.T. YUCHENGCO COLLEGE OF
BUSINESS
MA. CECILIA G. ADEFUIN JANUARY 2023
Module 2: The Design Process

 At the end of the session, you will be able

to:
Demonstrate one’s knowledge in the
design process in creating information
solutions using digital technologies and
discover the myriad applications of
various design concepts in digital
solutions.
Design Thinking
Process
Design Thinking

 Itisa user-centric, solutions-based

approach to problem-solving that can
be described in stages/processes (Han,
2022).
The Design Thinking Process

1.Empathize
2.Define
3.Ideate
4.Prototype
5.Test

(The Design Thinking Process - How Does It Work?, 2020)

 1. Empathize
 Empathy is the centerpiece of a human-centered design
process. It is your effort to understand the way they do
things and why, their physical and emotional needs, how
they think about world, and what is meaningful to them.
 As a design thinker, the problems you are trying to solve
are rarely your own—they are those of a particular group “To create
of people; in order to design for them, you must gain meaningful
empathy for who they are and what is important to them. innovations, you
need to know your
 How? Observe, Engage, Watch and listen users and care
about their
lives.”Ahaxj
 2. Define
 This process is all about bringing clarity and focus to the design space. It is about making sense of
the widespread information you have gathered.

 The Define mode is critical to the design process because it

results in your point-of-view (POV): the explicit expression
of the problem you are striving to address. It defines the
RIGHT challenge to address, based on your new
understanding of people and the problem space. “Framing the
right problem is
the only way to
 How to define a good Point Of View (POV)
create the right
solution.”
 2. Define
 How to define a good Point Of View (POV)
 - Provides focus and frames the problem
 - Inspires your team
 - Informs criteria for evaluating competing ideas
 - Empowers your team to make decisions independently in
parallel
 - Captures the hearts and minds of people you meet “Framing the
 - Saves you from the impossible task of developing concepts that are all right problem is
things to all people the only way to
create the right
(i.e. your problem statement should be solution.”
discrete, not broad.)
 3. Ideate
 This process concentrate on idea generation.
Mentally it represents a process of “going wide” in terms
of concepts and outcomes. Ideation provides both the fuel
and also the source material for building prototypes and
getting innovative solutions into the hands of your users.

Ideation is your chance to combine the understanding you “It’s not about
have of the problem space and people you are designing for coming up with
with your imagination to generate solution concepts. the ‘right’ idea,
Particularly early in a design project, ideation is about pushing it’s about
for a widest possible range of ideas from which you can select,
not simply finding a single, best solution. generating the
broadest range of
possibilities.”
 3. Ideate
 VARIOUS FORMS OF IDEATION:
- Step beyond obvious solutions and thus increase the
innovation potential of your solution set
- Harness the collective perspectives and strengths of your
teams
- Uncover unexpected areas of exploration
- Create fluency (volume) and flexibility (variety) in your “It’s not about
innovation options coming up with
- Get obvious solutions out of your heads, and drive your the ‘right’ idea,
team beyond them it’s about
➢ How? You ideate by combining your conscious and generating the
unconscious mind, and rational thoughts with imagination broadest range of
possibilities.”
 4. Prototype
 The Prototype mode is the iterative generation of artifacts intended to answer
questions that get you closer to your final solution. A prototype can be anything that
a user can interact with – be it a wall of post-it notes, a
gadget you put together, a role-playing activity, or even a storyboard.
Ideally you bias toward something a user can experience.
▪ To ideate and problem-solve.
▪ To communicate.
▪ To start a conversation.
▪ To fail quickly and cheaply.
▪ To test possibilities.
▪ To manage the solution-building process. “Build to think
 How? Build with the user in mind
and test to
learn.”
 5. Test
 The Test mode is when you solicit feedback, about the prototypes
you have created, from your users and have another opportunity to
gain empathy for the people you are designing for. Testing is
another opportunity to understand your user, but unlike your
initial empathy mode, you have now likely done more framing of
the problem and created
prototypes to test.
“Testing is an
 Why?
opportunity to
▪ To refine prototypes and solutions.
▪ To learn more about your user learn about your
▪ To refine your POV solution and
 How? your user.”
 Show don’t tell; Create experiences; Ask users to compare.
Elements of Project Charter
 Title
 Scope Overview
 Business Case
 Background.
 Milestone Schedule with Acceptance Criteria.
 Risks, Assumptions, and Constraints
 Resource Estimates
 Stakeholders list.
 Team Operating Principles.
 Lessons Learned.
 Signatures and Commitment.
3 Basic Capabilities supported by IS
 The information
systems infrastructure
enables processing,
storing, and
transmission of data.
Transmission
Storing
of Data
Processing
Mobile Payments Are IN!
 Mobile phones are still on the rise in the developing
country most specially with the situation brought by
covid 19 pandemic where individuals are required to stay
at home. Mobile payments were considered by majority
of the consumers, resulting in many positive
developments and change in many establishments.
 Google Map’s Street View
Street View stitches together billions of panoramic images to provide a
virtual representation of our surroundings on Google Maps. Street View's
content comes from two sources - Google and contributors. Through our
collective efforts, we enable people everywhere to virtually explore the
world.

Ethical Issues:
1. Collective sense of intrusion that has stimulated concerns of losing one’s privacy
2. Parents are worried pictures of their children could possible make them targets of child
predators
3. Adults worried that public know their whereabouts
4. People are worried that the camera captures every move without their consent

The data being stored, shared, and exchanged in the cloud, companies such as google,
Facebook, and Apple effectively become the custodians of data that have the potential to ruin
the lives of the untold number of people.
Having access to vast amounts of data provides the potential of monetizing the data in some
way.
Information Systems Architecture
 Formal definition of an organization's technologies, systems,
and processes that support an organization's specific business
processes and strategy.
 It reflects the specific capabilities from this overarching set of
capabilities to support the specific strategy and processes of an
organization.
 IS Infrastructure –Digital infrastructure
Modern organizations use various applications and databases to
support their decision making, business processes, and competitive
strategy. These applications and databases rely on IS Infrastructure
consist of:
 Hardware
 System software
 Application software
 Storage
 Networking
 Data centers
Overview of IS Infrastructure
An evolving IS
infrastructure is
needed to support an
organization's strategy
and business processes
Essential Components of an
organization’s IS Infrastructure
 Hardware- the computer that run the applications and databases
necessary for processing transactions or analyzing business data
 System Software- Operating system
It coordinates the interaction between hardware devices,
peripherals, application software , and users.
 Storage- to store massive amounts of data for operational, backup,
and archival purposes
 Networking- one of the reasons why information systems have become
powerful and important to modern organizations.
 Data Centers- to house the different infrastructure components
so as to ensure security and availability.
Hardware
Hardware
 Internet of Things (IoT) uses various sensors, controllers, and
other single purpose computing devices used to provide valuable
data as input to different processing technologies.
 Radio Frequency Identification (RFID)- IoT technology
helping to monitor product flows , which is rapidly replacing
the standard bar codes you find on almost every product.
 Uses electromagnetic energy to transmit data between a
reader and a processing device or RFID tag
Software

Operating systems is a
system software that
coordinate the
interaction between
users, application
software , hardware
and peripherals

Application Software is a software

design for specific tasks. It helps to
automate business processes.
Software
Applications software's
1. Productivity Tools. Microsoft Office (Word, Excel, PowerPoint,
Access)
2. Supply Chain Management Systems- support the coordination
of suppliers as well as the production and distribution of products
or services
3. Customer Relationship Management (CRM) systems to help
companies win and retain customers, gain marketing and customers
insights.
Software
 Database-
 are collections of related data organized in a way that facilitates
data searches. Are used to store data and to make the data accessible
where and when needed.
 Are vital to an organizations operations and often are vital to
competitive advantage and success.
 Database Management Systems (DBMS)
 Type of software that allows organizations to more easily store,
retrieve, and analyze data.
 DBMS: Microsoft Access
 Microsoft Access is a well-known database management system produced by
Microsoft and is part of the Microsoft 365 office suite. Microsoft Access
combines Microsoft’s relational Jet
Database Engine with software development tools and a graphic user interface
(GUI). Microsoft Access also has the distinction of being the first mass-market
database program for Windows.
 Microsoft Access enables business and enterprise users to manage
data and analyze vast amounts of information efficiently.
 Access is an easy-to-use tool for creating business applications, from
templates or from scratch. With its rich and intuitive design tools, Access can
help you create appealing and highly functional applications in a minimal

amount of time.
Storage
Storing and retrieving data is key for organizational success.
REQUIREMENTS FOR STORAGE INFRASTRUCTURE
 1. Timeliness; 2. Searchability; 3. access speed; 4. life span
 TYPES OF DATA
 Operational Data- data used for managing business processes, such as for
processing transactions or for data analysis
 Backup Data- short term copies of organizational data, used to recover from
system related disaster ( backup data are frequently overwritten with newer
backups)
 Archival Data- long-term copies of organizational data, often used for
compliance and reporting purposes.
Networking
 Computer networking is the sharing of data or services.
The information source produces a
message , which is encoded so that it can be transmitted via a communitarian
channel.; a receiver then decodes the message so that it can be understood by
the destination
Computer networks require three things:
 1. A sender (Source) and a receiver (destination) that have something
to share (message)
 2. A pathway or transmission medium, such as cable, to send the
message
 3. Rules or protocols governing communication between
senders and receivers.
Types of Network
Characteristics of Internet, Intranet,
and Extranet
Data Centers
 To satisfy the increasing requirements for
processing and storing the ever-growing volume
of data, large organization need hundreds or ever
thousands of servers.
 Data centers need to be modular so as to be easily
expandable in case of changing needs.
 To ensure uninterrupted service, the data centers
are self-sufficient, and each can operate for up to
2 day on self generated power.
Managerial Issues: IS Infrastructure
 Advances in hardware have enabled advances in software
 Hardware and software obsolescence, faster IT cycles, issues
such as when and how to upgrade the current infra.
 Organizations storage needs are growing at an ever-increasing
pace and deal with fluctuations in demand for computer power.
 Increasing need for both computing power and storage fuels an
increasing demand for energy, which can affect a company’s image
as well as its bottom line.
Cloud Computing
 Cloud computing uses a utility computing business model
where customers can draw on a variety of computing
resources that can be accessed on demand with minimal
human interaction;
 Characteristics of Cloud computing
 On-demand self-service
 Rapid elasticity
 Broad network access
 Resource pooling
 Measured service
Cloud Computing

 Infrastructure as a service (IaaS)

 Platform as a service (PaaS)
 Software as a service (SaaS)
Cloud Computing
 Consideration to move in a public cloud-based infrastructure,
organizations have to weigh issues such as:
 Availability
 Reliability
 Scalability
 Viability
 Security
 Privacy
 Compliance
 Openness
 Diversity of offerings
 cost
AIS103P
Management of Information and Technology

FACULTY MEMBER: Ma. Cecilia G. Adefuin

E-MAIL ADDRESS: [email protected]
DAYS AVAILABLE: Monday, Wednesday
TIME AND VENUE: 5:30pm-8:30pm

Thank you and God bless

 Module 2
The Design Process

AIS103P
MANAGEMENT OF INFORMATION AND
TECHNOLOGY
SESSION 3
MALAYAN COLLEGES LAGUNA-E.T. YUCHENGCO COLLEGE OF
BUSINESS
MA. CECILIA G. ADEFUIN JANUARY 2023
Module 2: The Design Process

 At the end of the session, you will be able

to:
Demonstrate one’s knowledge in
the design process in creating information
solutions using digital technologies and
discover the myriad applications of
various design concepts in digital
solutions.
Design Concepts
Innovation Design Concepts
(Innovation Design Principles to Start & Maintain, 2019)

It is important to know the purpose or the organizational goals why

they want to innovate. This goals will be the basis of choosing the
appropriate approach for innovation.
2 Innovation Approaches
 1. Incremental innovation
 2. Innovation at scale
Innovation Design Concepts
(Innovation Design Principles to Start & Maintain, 2019)
Innovation Design Concepts
(Innovation Design Principles to Start & Maintain, 2019)
Innovation Design Concepts
(Innovation Design Principles to Start & Maintain, 2019)

Four Design Principles

 1. Design for relevance- Keep thinking back to how this innovation will benefit
your employees or customers (or both), and let that guide you through the
process.
 2. Develop for Scalability- It's important to not only think about the
scalability of the innovation itself but also the scalability of the
organization supporting it.
 3. Brace for impact- What were the key metrics prior to the implementation of
the innovation and what impact does the innovation have on these key metrics?
 4. Iterate to last- Realizing an innovation or invention is not the end of the story.
Only the start of it.
1. Design for relevance
(Innovation Design Principles to Start & Maintain, 2019)

Being relevant means creating innovation with purpose. The key is to

remember that, above all, innovation is there to make life better for
human beings. Being relevant also means considering aspects like
privacy, compliance, accessibility, and anything else related to
customer or employee needs.
2. Develop for Scalability
(Innovation Design Principles to Start & Maintain, 2019)
Scalability is about how well an innovation can handle an increase or decrease in
volume. Being scalable has everything to do with the fundamentals of an organization. It's necessary to
evaluate an organization's operating processes, systems, and technology to
see if they can flexibly adapt to changing demands.
 Human capital. These technologies will impact the
 Ways of working. scalability of high-tech companies
 Open source tooling. With competitive advantages and market
shares at stake, scalability is a key driver for
 Enterprise architecture. growth in high-tech companies. Ever-
 Enterprise (and/or third-party) platforms. increasing demand and emerging technologies
drive the need for innovation at scale.
 Networks and connectivity.
Discover how your business can quickly adapt
 Data centers. to changing needs and opportunities.
The need for scalability is most crucial, and most obvious, at the core of your organization's
operations. But don't forget it's also important to consider other services and solutions that could be
affected, too.
3. Brace for impact
(Innovation Design Principles to Start & Maintain, 2019)

This principle refers to the idea that you

should measure the impact of your innovation solution.
With organizational impacts, it's important to be able
to monitor how well the new application is
performing—as well as being alerted right away if
anything is going wrong. You have to prepare a
comprehensive measurement plan, as well as
checking in advance how these new change ( Ex in
values) match up with past reporting methods.
4. Iterate to last
(Innovation Design Principles to Start & Maintain, 2019)
Customers and employees increasingly expect companies to stay up to date with
the latest technology—which has been a hard thing to predict in the past. So it’s hard to say exactly
when the next big change will come or what it will be. But it
will come, and a great innovation concept includes plans for that eventuality.

Bear in mind that most technologies come in waves, with second and third-generation
developments bringing a maturity that can be leveraged to great benefit by earlier
innovations—providing they can accommodate the update.
Make sure that that the change you're bringing to your company will last.
User Interface (UI)
Design
User Interface (UI) Elements
 Input Controls: checkboxes, radio buttons, dropdown
lists, list boxes, buttons, toggles, text fields, date fields
 Navigational Components: breadcrumb, slider, search
field, pagination, slider, tags, icons
 Informational Components- tooltips, icons, progress bar,
notifications, message boxes, modal windows
 Containers: accordion
Best Practice for Designing an
Interface
 Keep the interface simple
 Create consistency and use common UI elements
 Be purposeful in page layout
 Strategically use color and texture
 Use typography to create hierarchy and clarity
 Make sure that the system communicates what’s
happening
 Think about the defaults.
Basic Concepts in UI Design
 Human Interface Objects (HIO) are objects that appear on a
screen and that the user can manipulate or use to navigate.
 Affordance: means that the developer should use objects that reflect
the function that they perform.
 Tool tips: can assist the user as he/she looks for
meaningful icons or hotspots on the screen.
Basic Concepts in UI Design
 Consistency designing UI is important to achieve the quality of design
and the standards of systems which are essential for successful and high
acceptance rate of the UI design from the end users.
 LEVELS OF CONSISTENCY
 Consistency within the platform: all the same HIOs are used within the
Windows platform or the Apple platform.
 Consistent within a suite: set of related programs all have the
same look-and-feel, use the same HIOs. (Ex Microsoft Office)
 Consistency within an application: various screens all use the same
HIOs to do the same functions
Basic Concepts in UI Design
 Continuity is slightly different than consistency. It means that the
various versions of the same system that are released to production over
time also use the same HIOs if not it should be an accepted principle.
 Discoverability it should be easy for the user to find and figure out
the operations and features on a screen.
 Intuitive: meaning is it easy to figure out what to do.
 Active Discovery: this concept help the user discover the
allowable functions. Ex: tool tips, change the mouse pointer, hover
actions for changing color, little pop up images or text
boxes, and visual diagram.
Basic Concepts in UI Design
 Closure lets the user know that he/she has completed an operation.
Visibility and feedback are important aspects of closure.
 Readability and Navigation
 Readability It is important to make the text readable by type, size and
color. Some systems allow user to adjust these properties.
 Navigation the application should be obvious and easily traversed. Ex
breadcrumbs shows the hierarchy of screens that were traversed to arrive at
the current location
Basic Concepts in UI Design
 Usability and Efficiency it means that designers should always be
thinking about how to make the application easy to use. Ex: provide
shortcut keys to the most used functions.
 Error message should be written so that it is clear to know the error and how to fix the
error.
 Keep it Simple Stupid (KISS) is a good design concept. Designers should always be
thinking how to make the interface , operations, navigation, instructions which is easy to
find, easy to navigate, easy to understand and easy to use. Simpler is always better.
References
Chapter 8 – Designing the User Interface. (n.d.). Cerritos College. Retrieved January 12,
2023, from https://www.cerritos.edu/dwhitney/SitePages/CIS201/Lectures/IM-7ed-
Chapter08.pdf

Innovation Design Principles to Start & Maintain. (2019, August 9). Accenture. Retrieved
January 29, 2023, from https://www.accenture.com/nl-en/blogs/insights/innovation-design-
4-principles-to-start-and-maintain

User Interface Design Basics. (n.d.). Usability.gov. Retrieved January 12, 2023,
from https://www.usability.gov/what-and-why/user-interface-design.html

User Interface Elements. (n.d.). Usability.gov. Retrieved January 12, 2023, from
https://www.usability.gov/how-to-and-tools/methods/user-interface-elements.html
AIS103P
Management of Information and Technology

FACULTY MEMBER: Ma. Cecilia G. Adefuin

E-MAIL ADDRESS: [email protected]
DAYS AVAILABLE: Monday, Wednesday
TIME AND VENUE: 5:30pm-8:30pm

Thank you and God bless