Embed Size (px)
Citation preview
CSC 352 : INTERACTION DESIGN FOR COLLABORATION & COMMUNICATION
Table of Contents Goal-Driven Design............................................................................................................7
Usability..............................................................................................................................9
The Five Dimensions........................................................................................................10
Cognitive Psychology.......................................................................................................10
Human Interface Guidelines.............................................................................................11
Daily Tasks and Deliverables...............................................................................................11
Design Strategy.................................................................................................................11
Wireframes of Key Interactions........................................................................................11
Prototypes:........................................................................................................................11
Stay Current......................................................................................................................12
Design Methodologies...............................................................................................................12
Participatory Design..................................................................................................................12
Task Analysis..........................................................................................................................13
What is a TASK?..............................................................................................................13
Hierarchical Task Analysis...............................................................................................13
Techniques for Analysis...................................................................................................13
Engineering Task Models..........................................................................................................14
Characteristics of Engineering Task Models....................................................................14
ConcurTaskTree (CTT).............................................................................................................14
Concept of Usability Engineering................................................................................................14
Goals of Usability Engineering.........................................................................................15
Usability.................................................................................................................................15
Usability Study.........................................................................................................................15
Usability Testing......................................................................................................................15
Acceptance Testing...................................................................................................................15
Software Tools.........................................................................................................................15
Prototyping..............................................................................................................................16
User Centered Design (UCD).....................................................................................................17
UCD Drawbacks...............................................................................................................17
Interactive System Design Life Cycle (ISLC)..................................................................17
GUI Design & Aesthetics..........................................................................................................18
Written and compiled by Dr. Muchelule Yusuf Wanjala, [email protected] Page 1
Touch Screen...........................................................................................................................18
Gesture Recognition..................................................................................................................18
Speech Recognition..................................................................................................................18
Keyboard................................................................................................................................19
Response Time........................................................................................................................19
Dialog Representation...............................................................................................................19
Introduction to Formalism..........................................................................................................19
State Transition Network (STN).......................................................................................20
StateCharts........................................................................................................................20
Illustration.........................................................................................................................20
Petri Nets...........................................................................................................................20
Visual Thinking.......................................................................................................................21
Visual Immediacy.............................................................................................................21
Visual Impetus..................................................................................................................21
Visual Impedance.............................................................................................................21
Visual Metaphors, Association, Analogy, Abduction and Blending................................21
Direct Manipulation Programming..............................................................................................21
Distance............................................................................................................................22
Direct Engagement...........................................................................................................22
Problems with Direct Manipulation..................................................................................22
Users.....................................................................................................................................23
Human Factors......................................................................................................................23
User Interfaces......................................................................................................................23
Sensory Design.....................................................................................................................24
Information Architecture......................................................................................................24
Information Design...............................................................................................................24
Technology...........................................................................................................................24
Overview of the information mapping method....................................................................25
What is Information Visualization?......................................................................................25
Information Architecture Basics..............................................................................................26
Why a Well Thought Out IA Matters...................................................................................26
What You Need to Know.....................................................................................................26
IA Sub-Specialties................................................................................................................27
Written and compiled by Dr. Muchelule Yusuf Wanjala, [email protected] Page 2
Information Architecture Basics..............................................................................................27
Why a Well Thought Out IA Matters...................................................................................27
What You Need to Know.....................................................................................................28
IA Sub-Specialties................................................................................................................29
User Interface Design Basics...................................................................................................29
Choosing Interface Elements................................................................................................29
Best Practices for Designing an Interface............................................................................29
Interaction Design Basics.........................................................................................................30
Best Practices for Designing Interactions.............................................................................30
Wireframing.............................................................................................................................32
The Value of Wireframes.....................................................................................................32
Creating Wireframes............................................................................................................33
Important Elements Illustrated in Wireframes.....................................................................33
Types of Wireframes............................................................................................................34
Prototyping...............................................................................................................................34
Benefits of Prototypes..........................................................................................................34
The Difference between Sketches and Prototypes...............................................................35
High-Fidelity and Low-Fidelity Prototyping........................................................................36
Creating Paper Prototypes....................................................................................................36
Components of the method...................................................................................................37
Information types..............................................................................................................37
Research-based principles.................................................................................................38
Units of information..........................................................................................................38
Advantages of information mapping....................................................................................38
Advantages for writers......................................................................................................38
Advantages for readers.....................................................................................................39
Advantages for organizations...........................................................................................39
What is Information Visualization?......................................................................................39
What are Collaboration Skills?.........................................................................................40
Elements of Successful Collaboration..............................................................................40
Types of Collaboration Skills...........................................................................................41
Communication.................................................................................................................41
Emotional Intelligence......................................................................................................41
Written and compiled by Dr. Muchelule Yusuf Wanjala, [email protected] Page 3
Respect for Diversity........................................................................................................41
Productivity Software.......................................................................................................42
Network interaction tools.....................................................................................................42
Cisco Network Shapes......................................................................................................46
Step 1: Turn it on and point it in the right direction.........................................................49
Step 2: Define the scale of the problem............................................................................49
Step 3: Sleuth basic diagnostics........................................................................................50
Step 4: Report trouble with good information..................................................................51
Step 5: Untangle advanced client issues...........................................................................52
Step 6: Understand infrastructure failure points...............................................................53
Step 7: Quantify application and destination issues.........................................................53
Step 8: Squish code bugs..................................................................................................53
Step 9: Run a tight ship.....................................................................................................54
Step 10: It works at home but not at work........................................................................54
10. Ping.............................................................................................................................54
UC Solution Components.....................................................................................................63
Cisco UC Network...............................................................................................................64
UCM Functions....................................................................................................................65
UCM Signaling and Media Paths.........................................................................................66
Cisco UC Database...............................................................................................................66
Database Access Control......................................................................................................68
UCM Licensing....................................................................................................................69
Summary...............................................................................................................................69
References............................................................................................................................70
Written and compiled by Dr. Muchelule Yusuf Wanjala, [email protected] Page 4
CSC 352: Interaction Design for Collaboration & communication Course outline
Course Code: CSC 352 Title: Interaction Design for Collaboration & CommunicationCourse Lecturer: Dr. Muchelule Yusuf Contacts:- cell: +254 701952124e-mails: [email protected],[email protected], [email protected]
Lecture Time:
Purpose of the CourseThis course has been designed so that a graduate of the course can build and understand much of the system interaction design for collaboration and communication
Expected Learning Outcomes1. Contextualize interaction design practice in terms of disciplinary history and develop
disciplinary appropriate language2. Identify and apply compositional theory to design practice3. Discuss interplay of presentation and reception4. Develop the ability to articulate intention in work through verbal critique5. Assess and improve production value through design practice, optimization, and
media technique6. Explore creative process, perception and problem solving
Course Content
Week1: concepts of design practice and design methods for interaction designers.
Week2-3: interaction design components
Week4: Human-machine interfaces from a human perspective
Week5: Human-machine interfaces from technology-centered one.
Week6: CAT 1
Week7: Interaction design types,
Week8: design evaluation,
Week9: design process:- graphics, audience and users, human cognition,
Week10: information mapping and design language,
Week11: information visualization
Week12: collaborative communication and its aspects
Week13: Interaction presentation skills of HTML, CSS, and JavaScript.
Week14: CAT 2 and Groups assignments presentations
Week15: Revision and exams
Written and compiled by Dr. Muchelule Yusuf Wanjala, [email protected] Page 5
Teaching Methodologies
Lectures, directed reading, practical demonstrations of communication services, and hands-on laboratory sessions and projects.Instructional Material and/or Equipment
Audi visual equipment, computer simulation software, computer programming toolsCourse Assessment
Continuous Assessment Test - 30%
Main Examination -70%
Core Reading Material for the course
1. N. R. Malik, Electronic Circuit Analysis, Simulation and Design, Prentice-Hall, 1995. 2. D. Comer and D. Comer, Fundamentals of Electronic Circuit Design, John Wiley &
Sons, 2003. 3. S. Franco, Design with Operational Amplifiers and Analog Integrated Circuits,
McGraw-Hill, 1988.
Lecturer In-Charge:
Lecturer Sign:……….………………………..….. Date:………………….Approved for Circulation
Name………………..............Sign…………………...Date…………………
Chairman, Department of Computer Science (Official Stamp)
Name………………..............Sign…………………...Date…………………
Dean, School of Business and Technology (Official Stamp)
Introduction
Written and compiled by Dr. Muchelule Yusuf Wanjala, [email protected] Page 6
Interaction design began the day the first screen was designed to hold more than static copy. Everything from a button to a link to a form field is part of interaction design. Over the past several decades, a number of books have been released that explain facets of interaction design, and explore the myriad ways it intersects and overlaps with experience design. Interaction design has evolved to facilitate interactions between people and their environment. Unlike user experience design, which accounts for all user-facing aspects of a system, interaction designers are only concerned with the specific interactions between users and a screen. Of course, in practice things are never so crisply delineated.
Common Methodologies
Although interaction design spans myriad types of web and mobile applications and sites, there are certain methodologies that all designers rely on. We’ll explore some of the more common methodologies here: goal-driven design, usability, the five dimensions, cognitive psychology, and human interface guidelines.
Goal-Driven Design
Goal-driven design was popularized by Alan Cooper, in his book The Inmates Are Running the Asylum: Why High-Tech Products Drive Us Crazy and How to Restore the Sanity, published in 1999. Alan defines goal-driven design as design that holds problem solving as a highest priority. In other words, goal-driven design focuses first and foremost on satisfying specific needs and desires of the end-user, as opposed to older methods of design, which focused on what capabilities were available on the technology side of things.
Today, some of the points Alan brings up seem obvious, since designers rarely select interactions based solely on development constraints. However, at its heart, the methodology is all about satisfying the end-user’s needs and wants, which is just as necessary today as it ever was. The process involved in goal-driven design, according to Alan, requires five shifts in the way we think as interaction designers.
Written and compiled by Dr. Muchelule Yusuf Wanjala, [email protected] Page 7
1. Design first; program second. In other words, goal-driven design begins with considerations for how users interact (and how things look!), rather than beginning with technical considerations.
2. Separate responsibility for design from responsibility for programming.This refers to the necessity of having an interaction designer who can champion the end-user, without worrying about the technical constraints. A designer should be able to trust his or her developer to handle the technical aspects; in fact Alan Cooper suggests that to do otherwise places the designer in a conflict of interest.
3. Hold designers responsible for product quality and user satisfaction.Though stakeholders or clients will have their own objectives, the interaction designer has a responsibility to the person on the other side of the screen.
Written and compiled by Dr. Muchelule Yusuf Wanjala, [email protected] Page 8
4. This particular idea has developed into something that is now more commonly associated with user research: personas. Yet Alan reminds us to connect personas back to the product, and constantly ask: where will this person use this? Who are they? What do they want to accomplish?
5. Work in teams of two. Lastly, interaction designers should never work in a silo. Collaboration with others, which Alan Cooper calls a “design communicator,” is key. Though the design communicator Alan envisioned in 1999 was typically a copywriter intended to provide marketing copy for products, today that has expanded to include a project manager, content strategist, information architect, and many others.
Usability
Usability may feel like a vague term, but at its heart, designers are simply asking “can someone easily use this?” It’s been explained in books and online in a myriad of ways, and we will review a few different definitions to uncover some common themes and nuances:
In the book Human Computer Interaction by authors Alan Dix, Janet E. Finlay, Gregory D. Abowd, Russell Beale, usability is broken down into three principles:
Learnability: how easily can a new user learn to navigate the interface?
Flexibility: how many ways can a user interact with the system?
Robustness: how well are we supporting users when they face errors?
Meanwhile, Nielsen and Schneiderman explain usability as being made up of five principles:
Learnability: how easily can a new user learn to navigate the interface?
Efficiency: how quickly can users perform tasks?
Memorability: if a user hasn’t visited the system in a while, how well will they remember the interface?
Errors: how many errors do users make, and how quickly can they recover from errors?
Satisfaction: do users enjoy using the interface, and are they pleased with the results?
Lastly, the international standard (ISO 9241) has also broken down the word into five principles:
Learnability: how easily can a new user learn to navigate the interface?
Understandability: how well can a user understand what they are seeing?
Operability: how much control does the user have within the interface?
Attractiveness: how visually appealing is the interface?
Usability compliance: does the interface adhere to standards?
Written and compiled by Dr. Muchelule Yusuf Wanjala, [email protected] Page 9
Clearly, there are common themes that make up what it means for an interface to be “usable.” Regardless of the usability principles a designer follows, it’s an important consideration for any interface.
The Five Dimensions
In Bill Moggridge’s book of interviews, Designing Interactions, Gillian Crampton Smith, an academic in interaction design, introduced the concept of four dimensions of an “interaction design language.” In other words, these dimensions make up the interactions themselves, and as a result they make up the communication between a user and the screen. The four original dimensions are: words, visual representations, physical objects or space, and time. More recently, Kevin Silver, senior interaction designer at IDEXX Laboratories, has added a fifth dimension, behavior.
1D: words should be simple to understand, and written in such a way that they communicate information easily to the end user.
2D: visual representations are all graphics or images, essentially everything that is not text. They should be used in moderation, so as to not overwhelm.
3D: physical objects or space refers to the physical hardware, whether it’s a mouse and keyboard, or a mobile device a user interacts with.
4D: time is the length that the user spends interacting with the first three dimensions. It includes the ways in which the user might measure progress, as well as sound and animation.
5D: behavior was added by Kevin Silver in his article, What Puts the Design in Interaction Design. It is the emotions and reactions that the user has when interacting with the system.
Using these five dimensions, an interaction designer can pay attention to the very experience the user has when communicating and connecting with a system.
Cognitive Psychology
Cognitive psychology is the study of how the mind works, and what mental processes take place there. According to the American Psychological Association, these processes include “attention, language use, memory, perception, problem solving, creativity, and thinking.”
While psychology is an immensely broad field, there are a few key elements of cognitive psychology that are particularly valued, and in fact may have helped form the field of interaction design. Don Norman called out many of them in his book, The Design of Everyday Things. Here are just a few.
Mental models are the images in a user’s mind that inform their expectation of a certain interaction or system. By learning the user’s mental model, interaction designers can create systems that feel intuitive.
Interface metaphors make use of known actions to lead users to new actions. For example, the trash icon on most computers resembles a physical trash can, in order to alert a user to the expected action.
Written and compiled by Dr. Muchelule Yusuf Wanjala, [email protected] Page 10
Affordances are things that are not only designed to do something, but that are designed to look like they are designed to do something. A button that looks like a physical object you can push, for example, is an affordance designed so that someone unfamiliar with the button will still understand how to interact with it.
Human Interface Guidelines
This section is a bit of a misnomer; there actually is no single set of human interface guidelines. However, the idea behind creating human interface guidelines is in itself a methodology. Guidelines have been created by most major technology design businesses, including Apple and Android, Java and Windows. The goal is the same for all of them: to alert prospective designers and developers to advice and recommendations that will help them to create universally intuitive interfaces and programs.
Daily Tasks and Deliverables
An interaction designer is a key player throughout the entire development process. They have a set of activities that are key to the project team. These typically include forming a design strategy, wireframing key interactions, and prototyping interactions.
Design Strategy
Although the boundaries here are fuzzy, one is certain: an interaction designer will need to know who they are designing for and what the user’s goals are. Typically, this is provided by a user researcher. In turn, an interaction designer will assess the goals and develop a design strategy, either independently or with help from other designers on the team. A design strategy will help team members have a common understanding of what interactions need to take place to facilitate user goals.
Wireframes of Key Interactions
After the interaction designer has a good idea of the strategy motivating a design, they can begin to sketch the interfaces that will facilitate the necessary interactions. The devil here lies in the details: some professionals will literally sketch these interactions on a pad/dry-erase board while others will use web applications to aid them in the process, and some will use a combination thereof. Some professionals will create these interfaces collaboratively while others will create them alone. It all depends on the interaction designer and their particular workflow.
Prototypes:
Depending on the project, the next logical step for an interaction designer might involve the creation of prototypes. There are a number of different ways in which a team might prototype an interaction, which we won’t be covering in extensive detail here, such as html/css prototypes, or paper prototypes.
Written and compiled by Dr. Muchelule Yusuf Wanjala, [email protected] Page 11
Stay Current
One of the hardest parts about being a practicing interaction designer is the speed of change in the industry. Every day, new designers are taking the medium in a different direction. Consequently, users are expecting these new kinds of interactions to appear on your website. The prudent interaction designer responds to this evolution by constantly exploring the web for new interactions and taking advantage of new technologies—while always keeping in mind that the right interaction or technology is the one that best meets the persona’s needs, and not merely the newest or most exciting. Interaction designers also stay current by following thought leaders (like the notable designers below) on Twitter, and pushing the medium forward themselves.
Design Methodologies
Various methodologies have materialized since the inception that outline the techniques for human–computer interaction. Following are few design methodologies −
Activity Theory − This is an HCI method that describes the framework where the human-computer interactions take place. Activity theory provides reasoning, analytical tools and interaction designs.
User-Centered Design − It provides users the center-stage in designing where they get the opportunity to work with designers and technical practitioners.
Principles of User Interface Design − Tolerance, simplicity, visibility, affordance, consistency, structure and feedback are the seven principles used in interface designing.
Value Sensitive Design − This method is used for developing technology and includes three types of studies − conceptual, empirical and technical.
o Conceptual investigations works towards understanding the values of the investors who use technology.
o Empirical investigations are qualitative or quantitative design research studies that shows the designer’s understanding of the users’ values.
o Technical investigations contain the use of technologies and designs in the conceptual and empirical investigations.
Participatory Design
Participatory design process involves all stakeholders in the design process, so that the end result meets the needs they are desiring. This design is used in various areas such as software design, architecture, landscape architecture, product design, sustainability, graphic design, planning, urban design, and even medicine.
Written and compiled by Dr. Muchelule Yusuf Wanjala, [email protected] Page 12
Participatory design is not a style, but focus on processes and procedures of designing. It is seen as a way of removing design accountability and origination by designers.
Task Analysis
Task Analysis plays an important part in User Requirements Analysis.
Task analysis is the procedure to learn the users and abstract frameworks, the patterns used in workflows, and the chronological implementation of interaction with the GUI. It analyzes the ways in which the user partitions the tasks and sequence them.
What is a TASK?
Human actions that contributes to a useful objective, aiming at the system, is a task. Task analysis defines performance of users, not computers.
Hierarchical Task Analysis
Hierarchical Task Analysis is the procedure of disintegrating tasks into subtasks that could be analyzed using the logical sequence for execution. This would help in achieving the goal in the best possible way.
"A hierarchy is an organization of elements that, according to prerequisite relationships, describes the path of experiences a learner must take to achieve any single behavior that appears higher in the hierarchy. (Seels & Glasgow, 1990, p. 94)".
Techniques for Analysis
Task decomposition − Splitting tasks into sub-tasks and in sequence.
Knowledge-based techniques − Any instructions that users need to know.
‘User’ is always the beginning point for a task.
Ethnography − Observation of users’ behavior in the use context.
Protocol analysis − Observation and documentation of actions of the user. This is achieved by authenticating the user’s thinking. The user is made to think aloud so that the user’s mental logic can be understood.
Written and compiled by Dr. Muchelule Yusuf Wanjala, [email protected] Page 13
Engineering Task Models
Unlike Hierarchical Task Analysis, Engineering Task Models can be specified formally and are more useful.
Characteristics of Engineering Task Models
Engineering task models have flexible notations, which describes the possible activities clearly.
They have organized approaches to support the requirement, analysis, and use of task models in the design.
They support the recycle of in-condition design solutions to problems that happen throughout applications.
Finally, they let the automatic tools accessible to support the different phases of the design cycle.
ConcurTaskTree (CTT)
CTT is an engineering methodology used for modeling a task and consists of tasks and operators. Operators in CTT are used to portray chronological associations between tasks. Following are the key features of a CTT −
Focus on actions that users wish to accomplish.
Hierarchical structure.
Graphical syntax.
Rich set of sequential operators.
Interactive systems Design
The objective of this chapter is to learn all the aspects of design and development of interactive systems, which are now an important part of our lives. The design and usability of these systems leaves an effect on the quality of people’s relationship to technology. Web applications, games, embedded devices, etc., are all a part of this system, which has become an integral part of our lives. Let us now discuss on some major components of this system.
Concept of Usability Engineering
Usability Engineering is a method in the progress of software and systems, which includes user contribution from the inception of the process and assures the effectiveness of the product through the use of a usability requirement and metrics. It thus refers to the Usability Function features of the entire process of abstracting, implementing & testing hardware and
Written and compiled by Dr. Muchelule Yusuf Wanjala, [email protected] Page 14
software products. Requirements gathering stage to installation, marketing and testing of products, all fall in this process.
Goals of Usability Engineering
Effective to use − Functional
Efficient to use − Efficient
Error free in use − Safe
Easy to use − Friendly
Enjoyable in use − Delightful Experience
Usability
Usability has three components − effectiveness, efficiency and satisfaction, using which, users accomplish their goals in particular environments. Let us look in brief about these components.
Effectiveness − The completeness with which users achieve their goals.
Efficiency − The competence used in using the resources to effectively achieve the goals.
Satisfaction − The ease of the work system to its users.
Usability Study
The methodical study on the interaction between people, products, and environment based on experimental assessment. Example: Psychology, Behavioral Science, etc.
Usability Testing
The scientific evaluation of the stated usability parameters as per the user’s requirements, competences, prospects, safety and satisfaction is known as usability testing.
Acceptance Testing
Acceptance testing also known as User Acceptance Testing (UAT), is a testing procedure that is performed by the users as a final checkpoint before signing off from a vendor. Let us take an example of the handheld barcode scanner.
Software Tools
A software tool is a programmatic software used to create, maintain, or otherwise support other programs and applications. Some of the commonly used software tools in HCI are as follows −
Specification Methods − The methods used to specify the GUI. Even though these are lengthy and ambiguous methods, they are easy to understand.
Written and compiled by Dr. Muchelule Yusuf Wanjala, [email protected] Page 15
Grammars − Written Instructions or Expressions that a program would understand. They provide confirmations for completeness and correctness.
Transition Diagram − Set of nodes and links that can be displayed in text, link frequency, state diagram, etc. They are difficult in evaluating usability, visibility, modularity and synchronization.
Statecharts − Chart methods developed for simultaneous user activities and external actions. They provide link-specification with interface building tools.
Interface Building Tools − Design methods that help in designing command languages, data-entry structures, and widgets.
Interface Mockup Tools − Tools to develop a quick sketch of GUI. E.g., Microsoft Visio, Visual Studio .Net, etc.
Software Engineering Tools − Extensive programming tools to provide user interface management system.
Evaluation Tools − Tools to evaluate the correctness and completeness of
The interactive system design shows that every phase depends on each other to serve the purpose of designing and product creation. It is a continuous process as there is so much to know and users keep changing all the time. An interactive system designer should recognize this diversity.
Prototyping
Prototyping is another type of software engineering models that can have a complete range of functionalities of the projected system. prototyping is a trial and partial design that helps users in testing design ideas without executing a complete system.
Example of a prototype can be Sketches. Sketches of interactive design can later be produced into graphical interface. See the following diagram.
Written and compiled by Dr. Muchelule Yusuf Wanjala, [email protected] Page 16
The above diagram can be considered as a Low Fidelity Prototype as it uses manual procedures like sketching in a paper.
A Medium Fidelity Prototype involves some but not all procedures of the system. E.g., first screen of a GUI.
Finally, a Hi Fidelity Prototype simulates all the functionalities of the system in a design. This prototype requires, time, money and work force.
User Centered Design (UCD)
The process of collecting feedback from users to improve the design is known as user centered design or UCD.
UCD Drawbacks
Passive user involvement.
User’s perception about the new interface may be inappropriate.
Designers may ask incorrect questions to users.
Interactive System Design Life Cycle (ISLC)
The stages in the following diagram are repeated until the solution is reached.
Diagram
Written and compiled by Dr. Muchelule Yusuf Wanjala, [email protected] Page 17
GUI Design & Aesthetics
Graphic User Interface (GUI) is the interface from where a user can operate programs, applications or devices in a computer system. This is where the icons, menus, widgets, labels exist for the users to access. It is significant that everything in the GUI is arranged in a way that is recognizable and pleasing to the eye, which shows the aesthetic sense of the GUI designer. GUI aesthetics provides a character and identity to any product.
Touch Screen
The touch screen concept was prophesized decades ago, however the platform was acquired recently. Today there are many devices that use touch screen. After vigilant selection of these devices, developers customize their touch screen experiences. The cheapest and relatively easy way of manufacturing touch screens are the ones using electrodes and a voltage association. Other than the hardware differences, software alone can bring major differences from one touch device to another, even when the same hardware is used. Along with the innovative designs and new hardware and software, touch screens are likely to grow in a big way in the future. A further development can be made by making a sync between the touch and other devices.
Gesture Recognition
Gesture recognition is a subject in language technology that has the objective of understanding human movement via mathematical procedures. Hand gesture recognition is currently the field of focus. This technology is future based. This new technology magnitudes an advanced association between human and computer where no mechanical devices are used. This new interactive device might terminate the old devices like keyboards and is also heavy on new devices like touch screens.
Speech Recognition
The technology of transcribing spoken phrases into written text is Speech Recognition. Such technologies can be used in advanced control of many devices such as switching on and off the electrical appliances. Only certain commands are required to be recognized for a complete transcription. However, this cannot be beneficial for big vocabularies.
Written and compiled by Dr. Muchelule Yusuf Wanjala, [email protected] Page 18
Keyboard
A keyboard can be considered as a primitive device known to all of us today. Keyboard uses an organization of keys/buttons that serves as a mechanical device for a computer. Each key in a keyboard corresponds to a single written symbol or character. This is the most effective and ancient interactive device between man and machine that has given ideas to develop many more interactive devices as well as has made advancements in itself such as soft screen keyboards for computers and mobile phones.
Response Time
Response time is the time taken by a device to respond to a request. The request can be anything from a database query to loading a web page. The response time is the sum of the service time and wait time. Transmission time becomes a part of the response time when the response has to travel over a network.
Dialog Design
A dialog is the construction of interaction between two or more beings or systems. In HCI, a dialog is studied at three levels −
Lexical − Shape of icons, actual keys pressed, etc., are dealt at this level.
Syntactic − The order of inputs and outputs in an interaction are described at this level.
Semantic − At this level, the effect of dialog on the internal application/data is taken care of.
Dialog Representation
To represent dialogs, we need formal techniques that serves two purposes −
It helps in understanding the proposed design in a better way.
It helps in analyzing dialogs to identify usability issues. E.g., Questions such as “does the design actually support undo?” can be answered.
Introduction to Formalism
There are many formalism techniques that we can use to signify dialogs. In this chapter, we will discuss on three of these formalism techniques, which are −
The state transition networks (STN)
The state charts
The classical Petri nets
Written and compiled by Dr. Muchelule Yusuf Wanjala, [email protected] Page 19
State Transition Network (STN)
STNs are the most spontaneous, which knows that a dialog fundamentally denotes to a progression from one state of the system to the next.
The syntax of an STN consists of the following two entities −
Circles − A circle refers to a state of the system, which is branded by giving a name to the state.
Arcs − The circles are connected with arcs that refers to the action/event resulting in the transition from the state where the arc initiates, to the state where it ends.
StateCharts
StateCharts represent complex reactive systems that extends Finite State Machines (FSM), handle concurrency, and adds memory to FSM. It also simplifies complex system representations. StateCharts has the following states −
Active state − The present state of the underlying FSM.
Basic states − These are individual states and are not composed of other states.
Super states − These states are composed of other states.
IllustrationFor each basic state b, the super state containing b is called the ancestor state. A super state is called OR super state if exactly one of its sub states is active, whenever it is active. the above diagram explains the entire procedure of a bottle dispensing machine. On pressing the button after inserting coin, the machine will toggle between bottle filling and dispensing modes. When a required request bottle is available, it dispense the bottle. In the background, another procedure runs where any stuck bottle will be cleared. The ‘H’ symbol in Step 4, indicates that a procedure is added to History for future access.
Petri Nets
Petri Net is a simple model of active behavior, which has four behavior elements such as − places, transitions, arcs and tokens. Petri Nets provide a graphical explanation for easy understanding.
Place − This element is used to symbolize passive elements of the reactive system. A place is represented by a circle.
Transition − This element is used to symbolize active elements of the reactive system. Transitions are represented by squares/rectangles.
Arc − This element is used to represent causal relations. Arc is represented by arrows.
Written and compiled by Dr. Muchelule Yusuf Wanjala, [email protected] Page 20
Token − This element is subject to change. Tokens are represented by small filled circles.
Visual Thinking
Visual materials has assisted in the communication process since ages in form of paintings, sketches, maps, diagrams, photographs, etc. In today’s world, with the invention of technology and its further growth, new potentials are offered for visual information such as thinking and reasoning. An initial terminology for talking about visual thinking was discovered that included concepts such as visual immediacy, visual impetus, visual impedance, and visual metaphors, analogies and associations, in the context of information design for the web. As such, this design process became well suited as a logical and collaborative method during the design process. Let us discuss in brief the concepts individually.
Visual Immediacy
It is a reasoning process that helps in understanding of information in the visual representation. The term is chosen to highlight its time related quality, which also serves as an indicator of how well the reasoning has been facilitated by the design.
Visual Impetus
Visual impetus is defined as a stimulus that aims at the increase in engagement in the contextual aspects of the representation.
Visual Impedance
It is perceived as the opposite of visual immediacy as it is a hindrance in the design of the representation. In relation to reasoning, impedance can be expressed as a slower cognition.
Visual Metaphors, Association, Analogy, Abduction and Blending
When a visual demonstration is used to understand an idea in terms of another familiar idea it is called a visual metaphor.
Visual analogy and conceptual blending are similar to metaphors. Analogy can be defined as an implication from one particular to another. Conceptual blending can be defined as combination of elements and vital relations from varied situations.
The HCI design can be highly benefited with the use of above mentioned concepts. The concepts are pragmatic in supporting the use of visual procedures in HCI, as well as in the design processes.
Direct Manipulation Programming
Written and compiled by Dr. Muchelule Yusuf Wanjala, [email protected] Page 21
Direct manipulation has been acclaimed as a good form of interface design, and are well received by users. Such processes use many source to get the input and finally convert them into an output as desired by the user using inbuilt tools and programs.
“Directness” has been considered as a phenomena that contributes majorly to the manipulation programming. It has the following two aspects.
Distance
Direct Engagement
Distance
Distance is an interface that decides the gulfs between a user’s goal and the level of explanation delivered by the systems, with which the user deals. These are referred to as the Gulf of Execution and the Gulf of Evaluation.
The Gulf of Execution
The Gulf of Execution defines the gap/gulf between a user's goal and the device to implement that goal. One of the principal objective of Usability is to diminish this gap by removing barriers and follow steps to minimize the user’s distraction from the intended task that would prevent the flow of the work.
The Gulf of Evaluation
The Gulf of Evaluation is the representation of expectations that the user has interpreted from the system in a design. As per Donald Norman, The gulf is small when the system provides information about its state in a form that is easy to get, is easy to interpret, and matches the way the person thinks of the system.
Direct Engagement
It is described as a programming where the design directly takes care of the controls of the objects presented by the user and makes a system less difficult to use. The scrutiny of the execution and evaluation process illuminates the efforts in using a system. It also gives the ways to minimize the mental effort required to use a system.
Problems with Direct Manipulation
Even though the immediacy of response and the conversion of objectives to actions has made some tasks easy, all tasks should not be done easily. For example, a repetitive operation is probably best done via a script and not through immediacy.
Direct manipulation interfaces finds it hard to manage variables, or illustration of discrete elements from a class of elements.
Written and compiled by Dr. Muchelule Yusuf Wanjala, [email protected] Page 22
Direct manipulation interfaces may not be accurate as the dependency is on the user rather than on the system.
An important problem with direct manipulation interfaces is that it directly supports the techniques, the user thinks.
Interaction design types
The following are common elements of interaction design typesUsersInteraction design is all about people. This includes thought processes, needs, expectations and perceptions. As such, it is considered naive to design interactions without being fully engaged with users. This can be superficially solved with abstractions such as user personas. It is far better to be engaged with users and immersed in the culture surrounding your products.
Context Of Use Customer Perceptions
Feasibility Studies Lead Users
Prototypes User Experience
User Needs User Persona
Human FactorsHuman factors are the physical, cognitive and behavioral characteristics of people. This is commonly applied to interaction design to ensure interfaces are useful for as many people as possible. For example, human factors is used to model the needs of people with disabilities to ensure designs are universally accessible.
Ban The Average Decision Fatigue
Edge Cases Human Error
Human Factors Human Scale
Situational Awareness Universal Design
User InterfacesThe design of tools and environments that can be controlled and/or explored by people. User interfaces may be designed to be productive and pleasing to use such that controls feel intuitive and environments are either stimulating or relaxing.
Complexity Hiding Fit For Purpose
Modeless Design Principle Of Least Astonishment
Principle Of Least Effort Usability
User Intent User Interface Design
Written and compiled by Dr. Muchelule Yusuf Wanjala, [email protected] Page 23
Sensory DesignDesigning for the senses including visual design, look and feel, product form and other experiences of sight, sound, touch, taste, smell andsensation.
Color Theory Form Factor
Graphic Design Haptic Perception
Look And Feel Sensation
Sensory Design Visual Design
Information ArchitectureThe structural design of information environments. This is typically intended to organize complex and rich information resources into manageable units that are easy to explore.
Choice Architecture Drill Down
Information Architecture Information Density
Information Overload Information Scent
Information DesignThe design of information itself including media, text, game content, documents and software interfaces. Information design is about communicating effectively whereas information architecture is about making information easy to find.
Communication Objectives Composition
Information Design Layout
Message Framing Negative Space
Target Audience Typography
TechnologyThe design of technology for user interaction. Most interaction designers work with commercially available technologies. However, some are engaged in the research, development and commercialization of new technologies for user interfaces or environments.
Affective Computing Digital Experience
Digital Twin Gamification Techniques
Mixed Reality Natural Language Processing
Pervasive Computing Reliability Engineering
Overview: Interaction Design
Written and compiled by Dr. Muchelule Yusuf Wanjala, [email protected] Page 24
Type Design
Definition (1) The design of environments that people use.
Definition (2) The practice of designing user interfaces for products, services and tools.
Related Concepts Design »Visual Design »Information Design »Product Design »Service Design »User Experience »
INFORMATION MAPPINGInformation mapping is a research-based method for writing clear and user focused information, based on the audience's needs and the purpose of the information. The method is applied primarily to designing and developing business and technical communications. It is used as a content standard within organizations throughout the world
Overview of the information mapping method
The information mapping method is a research-based methodology used to analyze, organize and present information based on an audience's needs and the purpose of the information. The method applies to all subject matter and media technology. Information mapping has close ties to information visualization, information architecture, graphic design, information design, data analysis, experience design, graphic user interface design, and knowledge management systems.
What is Information Visualization?
Information visualization is the process of representing data in a visual and meaningful way so that a user can better understand it. Dashboards and scatter plots are common examples of information visualization. Via its depicting an overview and showing relevant connections, information visualization allows users to draw insights from abstract data in an efficient and effective manner.
Information visualization plays an important role in making data digestible and turning raw information into actionable insights. It draws from the fields of human-computer interaction, visual design, computer science, and cognitive science, among others. Examples include world map-style representations, line graphs, and 3-D virtual building or town plan designs.
Written and compiled by Dr. Muchelule Yusuf Wanjala, [email protected] Page 25
The process of creating information visualization typically starts with understanding the information needs of the target user group. Qualitative research (e.g., user interviews) can reveal how, when, and where the visualization will be used. Taking these insights, a designer can determine which form of data organization is needed for achieving the users’ goals. Once information is organized in a way that helps users understand it better—and helps them apply it so as to reach their goals—visualization techniques are the next tools a designer brings out to use. Visual elements (e.g., maps and graphs) are created, along with appropriate labels, and visual parameters such as color, contrast, distance, and size are used to create an appropriate visual hierarchy and a visual path through the information.
Information visualization is becoming increasingly interactive, especially when used in a website or application. Being interactive allows for manipulation of the visualization by users, making it highly effective in catering to their needs. With interactive information visualization, users are able to view topics from different perspectives, and manipulate their visualizations of these until they reach the desired insights. This is especially useful if users require an explorative experience.
Information Architecture BasicsInformation architecture (IA) focuses on organizing, structuring, and labeling content in an effective and sustainable way. The goal is to help users find information and complete tasks. To do this, you need to understand how the pieces fit together to create the larger picture, how items relate to each other within the system.
Why a Well Thought Out IA MattersAccording to Peter Morville , the purpose of your IA is to help users understand where they are, what they’ve found, what’s around, and what to expect. As a result, your IA informs the content strategy through identifying word choice as well as informing user interface designand interaction design through playing a role in the wireframing and prototyping processes.What You Need to KnowTo be successful, you need a diverse understanding of industry standards for creating, storing, accessing and presenting information. Lou Rosenfeld and Peter Morville in their book, Information Architecture for the World Wide Web, note that the main components of IA: Organization Schemes and Structures: How you categorize and structure information Labeling Systems: How you represent information Navigation Systems: How users browse or move through information Search Systems: How users look for information
Written and compiled by Dr. Muchelule Yusuf Wanjala, [email protected] Page 26
In order to create these systems of information, you need to understand the interdependent nature of users, content, and context. Rosenfeld and Morville referred to this as the “information ecology” and visualized it as a venn diagram. Each circle refers to:
Context: business goals, funding, politics, culture, technology, resources, constraints Content: content objectives, document and data types, volume, existing structure,
governance and ownership Users: audience, tasks, needs, information-seeking behavior, experienceIA Sub-SpecialtiesSince the field of IA is complex and when dealing with large information systems the task becomes more massive, sometimes experts choose a specialized niche within the discipline. Some examples of IA sub-specialties include focusing on search schemas, metadata, taxonomy, etc.
Information Architecture BasicsInformation architecture (IA) focuses on organizing, structuring, and labeling content in an effective and sustainable way. The goal is to help users find information and complete tasks. To do this, you need to understand how the pieces fit together to create the larger picture, how items relate to each other within the system.
Why a Well Thought Out IA Matters
Written and compiled by Dr. Muchelule Yusuf Wanjala, [email protected] Page 27
According to Peter Morville , the purpose of your IA is to help users understand where they are, what they’ve found, what’s around, and what to expect. As a result, your IA informs the content strategy through identifying word choice as well as informing user interface designand interaction design through playing a role in the wireframing and prototyping processes.What You Need to KnowTo be successful, you need a diverse understanding of industry standards for creating, storing, accessing and presenting information. Lou Rosenfeld and Peter Morville in their book, Information Architecture for the World Wide Web, note that the main components of IA: Organization Schemes and Structures: How you categorize and structure information Labeling Systems: How you represent information Navigation Systems: How users browse or move through information Search Systems: How users look for information
In order to create these systems of information, you need to understand the interdependent nature of users, content, and context. Rosenfeld and Morville referred to this as the “information ecology” and visualized it as a venn diagram. Each circle refers to:
Context: business goals, funding, politics, culture, technology, resources, constraints Content: content objectives, document and data types, volume, existing structure,
governance and ownership
Written and compiled by Dr. Muchelule Yusuf Wanjala, [email protected] Page 28
Users: audience, tasks, needs, information-seeking behavior, experienceIA Sub-SpecialtiesSince the field of IA is complex and when dealing with large information systems the task becomes more massive, sometimes experts choose a specialized niche within the discipline. Some examples of IA sub-specialties include focusing on search schemas, metadata, taxonomy, etc.
User Interface Design BasicsUser Interface (UI) Design focuses on anticipating what users might need to do and ensuring that the interface has elements that are easy to access, understand, and use to facilitate those actions. UI brings together concepts from interaction design, visual design, and information architecture.Choosing Interface ElementsUsers have become familiar with interface elements acting in a certain way, so try to be consistent and predictable in your choices and their layout. Doing so will help with task completion, efficiency, and satisfaction.Interface elements include but are not limited to:
Input Controls: buttons, text fields, checkboxes, radio buttons, dropdown lists, list boxes, toggles, date field
Navigational Components: breadcrumb, slider, search field, pagination, slider, tags, icons
Informational Components: tooltips, icons, progress bar, notifications, message boxes, modal windows
Containers: accordionThere are times when multiple elements might be appropriate for displaying content. When this happens, it’s important to consider the trade-offs. For example, sometimes elements that can help save you space, put more of a burden on the user mentally by forcing them to guess what is within the dropdown or what the element might be.
Best Practices for Designing an InterfaceEverything stems from knowing your users, including understanding their goals, skills, preferences, and tendencies. Once you know about your user, make sure to consider the following when designing your interface:
Keep the interface simple. The best interfaces are almost invisible to the user. They avoid unnecessary elements and are clear in the language they use on labels and in messaging.
Create consistency and use common UI elements. By using common elements in your UI, users feel more comfortable and are able to get things done more quickly. It is also important to create patterns in language, layout and design throughout the site to help
Written and compiled by Dr. Muchelule Yusuf Wanjala, [email protected] Page 29
facilitate efficiency. Once a user learns how to do something, they should be able to transfer that skill to other parts of the site.
Be purposeful in page layout. Consider the spatial relationships between items on the page and structure the page based on importance. Careful placement of items can help draw attention to the most important pieces of information and can aid scanning and readability.
Strategically use color and texture. You can direct attention toward or redirect attention away from items using color, light, contrast, and texture to your advantage.
Use typography to create hierarchy and clarity. Carefully consider how you use typeface. Different sizes, fonts, and arrangement of the text to help increase scanability, legibility and readability.
Make sure that the system communicates what’s happening. Always inform your users of location, actions, changes in state, or errors. The use of various UI elements to communicate status and, if necessary, next steps can reduce frustration for your user.
Think about the defaults. By carefully thinking about and anticipating the goals people bring to your site, you can create defaults that reduce the burden on the user. This becomes particularly important when it comes to form design where you might have an opportunity to have some fields pre-chosen or filled out.
Interaction Design BasicsInteraction design focuses on creating engaging interfaces with well thought out behaviors. Understanding how users and technology communicate with each other is fundamental to this field. With this understanding, you can anticipate how someone might interact with the system, fix problems early, as well as invent new ways of doing things.
Best Practices for Designing InteractionsConsider these qualities and associated questions when creating digital products that have an interactive element:
Questions to Consider when Designing for Interaction
Define How Users Can Interact with the Interface
What can a user do with their mouse, finger, or stylus to directly interact with the interface? This includes pushing buttons, dragging and dropping across the interface, etc.
What commands can a user give, that aren’t directly a part of the product, to interact with it? An example of an “indirect manipulation” is when a user hits “Ctrl+C”, they expect to be able to copy a piece of content.
Written and compiled by Dr. Muchelule Yusuf Wanjala, [email protected] Page 30
Questions to Consider when Designing for Interaction
Give Users Clues about Behavior before Actions are Taken
What about the appearance (color, shape, size, etc) gives the user a clue about how it may function? These help the user understand how it can be used.
What information do you provide to let a user know what will happen before they perform an action? These tell users what will happen if they decide to move forward with their action. This can include meaningful label on a button, instructions before a final submission, etc.
Anticipate and Mitigate Errors
Are there constraints put in place to help prevent errors? The Poka-Yoke Principle says that placing these constraints forces the user to adjust behavior in order to move forward with their intended action.
Do error messages provide a way for the user to correct the problem or explain why the error occurred? Helpful error messages provide solutions and context.
Consider System Feedback and Response Time
What feedback does a user get once an action is performed? When a user engages and performs an action, the system needs to respond to acknowledge the action and to let the user know what it is doing.
How long between an action and a product’s response time?Responsiveness (latency) can be characterized at four levels: immediate (less than 0.1 second), stammer (0.1-1 second), interruption (1-10 seconds), and disruption (more than 10 seconds).
Strategically Think about Each Elements
Are the interface elements a reasonable size to interact with?Fitts’ Law says that elements, such as buttons, need to be big enough for a user to be able to click it. This is particularly important in a mobile context that likely includes a touch component.
Written and compiled by Dr. Muchelule Yusuf Wanjala, [email protected] Page 31
Questions to Consider when Designing for Interaction
Are edges and corners strategically being used to locate interactive elements like menus? Fitts’ Law also states that since the edge provides a boundary that the mouse or finger cannot go beyond, it tends to be a good location for menus and buttons.
Are you following standards? Users have an understanding of how interface elements are supposed to function. You should only depart from the standards if a new way improves upon the old.
Simplify for Learnability
Is information chunked into seven (plus or minus two) items at a time? George Miller found that people are only able to keep five to nine items in the short-term memory before they forgot or had errors.
Is the user’s end simplified as much as possible? Tesler’s Law of Conservation notes that you need to try to remove complexity as much as possible from the user and instead build the system to take it into account. With that said, he also notes to keep in mind that things can only be simplified to a certain point before they no longer function.
Are familiar formats used? Hick’s Law states that decision time is affected by how familiar a format is for a user to follow, how familiar they are with the choices, and the number of choice they need to decide between.
WireframingA wireframe is a two-dimensional illustration of a page’s interface that specifically focuses on space allocation and prioritization of content, functionalities available, and intended behaviors. For these reasons, wireframes typically do not include any styling, color, or graphics. Wireframes also help establish relationships between a website’s various templates.
The Value of WireframesWireframes serve multiple purposes by helping to:
Connect the site’s information architecture to its visual design by showing paths between pages
Written and compiled by Dr. Muchelule Yusuf Wanjala, [email protected] Page 32
Clarify consistent ways for displaying particular types of information on the user interface
Determine intended functionality in the interface
Prioritize content through the determination of how much space to allocate to a given item and where that item is located
Creating WireframesIt’s important to keep in mind that wireframes are guides to where the major navigation and content elements of your site are going to appear on the page. Since the goal of the illustrations is not to depict visual design, keep it simple.
Do not use colors. If you would typically use color to distinguish items, instead rely on various gray tones to communicate the differences.
Do not use images. Images distract from the task at hand. To indicate where you intend to place an image and its size, you can instead use a rectangular box sized to dimension with an “x” through it.
Use only one generic font. Typography should not be a part of the wireframing discussion. Within the wireframes, however, you may still resize the font to indicate various headers and changes in the hierarchy of the text information on the page.
Since wireframes are two-dimensional, it’s important to remember that they don’t do well with showing interactive features of the interface like drop-downs, hover states, accordions that implement show-hide functionality, or auto-rotating carousels.
Important Elements Illustrated in Wireframes
Written and compiled by Dr. Muchelule Yusuf Wanjala, [email protected] Page 33
Although wireframes differ from site to site, the following elements often are included as standard elements on wireframes:
Logo
Search field
Breadcrumb
Headers, including page title as the H1 and subheads H2-Hx
Navigation systems, including global navigation and local navigation
Body content
Share buttons
Contact information
FooterTypes of WireframesWireframes can vary both in their production, from paper sketches to computer-drawn images and in the amount of detail that they convey. Low and high-fidelity are terms used to identify the level of wireframe production or functionality.
Low-fidelity wireframes help facilitate project team communication and are relatively quick to develop. They tend to be more abstract because they often use simple images to block off space and implement mock content, or Latin (lorem ipsum) text as filler for content and labels.
High-fidelity wireframes are better for documentation because of their increased level of detail. These wireframes often include information about each particular item on the page, including dimensions, behavior, and/ or actions related to any interactive element
PrototypingA prototype is a draft version of a product that allows you to explore your ideas and show the intention behind a feature or the overall design concept to users before investing time and money into development. A prototype can be anything from paper drawings (low-fidelity) to something that allows click-through of a few pieces of content to a fully functioning site (high-fidelity).
Benefits of PrototypesIt is much cheaper to change a product early in the development process than to make change after you develop the site. Therefore, you should consider building prototypes early in the process. Prototyping allow you to gather feedback from users while you are still planning and designing your Web site.
Written and compiled by Dr. Muchelule Yusuf Wanjala, [email protected] Page 34
Nielsen has found that the biggest improvements in user experience come from gathering usability data as early as possible. He notes that it’s cheaper to make changes before any code has been written than to wait until after the implementation is complete.The Difference between Sketches and PrototypesAlthough the difference between sketches, wireframes, and prototypes isn’t always clear, there are differences in their intentions. Bill Buxton, in his book Sketching User Experiences, provides a list of descriptors that help explain the differences:
Sketch Prototype
Evocative Didactic
Suggest Describe
Explore Refine
Question Answer
Propose Test
Provoke Resolve
Tentative Specific
Non-committal Depiction
Tracy Lepore further defines the differences by visually showing the continuum from sketch to design by depicting the relationships between what the design is trying to communicate, the amount of iteration between phases, and the fidelity of the design.
Written and compiled by Dr. Muchelule Yusuf Wanjala, [email protected] Page 35
High-Fidelity and Low-Fidelity PrototypingThere is an on-going debate about using low versus high fidelity prototyping and how much a prototype should resemble the final version of your design. Both have been found to be basically equivalent in finding usability issues (Walker et al 2002). With that said, there are things to consider when trying to decide which option is best for your project:
Low-fidelity prototypes are often paper-based and do not allow user interactions. They range from a series of hand-drawn mock-ups to printouts. In theory, low-fidelity sketches are quicker to create. Low-fidelity prototypes are helpful in enabling early visualization of alternative design solutions, which helps provoke innovation and improvement. An additional advantage to this approach is that when using rough sketches, users may feel more comfortable suggesting changes.
High-fidelity prototypes are computer-based, and usually allow realistic (mouse-keyboard) user interactions. High-fidelity prototypes take you as close as possible to a true representation of the user interface. High-fidelity prototypes are assumed to be much more effective in collecting true human performance data (e.g., time to complete a task), and in demonstrating actual products to clients, management, and others.
Creating Paper PrototypesPaper-based prototyping is the quickest way to get feedback on your preliminary site information architecture, design, and content. Paper prototypes are easy to create and require only paper, scissors and sticky notes.
Use one piece of paper for each Web page you create and then have users try them out in a usability test. Users indicate where they want to click to find the information and you change the page to show that screen.
Written and compiled by Dr. Muchelule Yusuf Wanjala, [email protected] Page 36
The process helps you to gather feedback early in the design process, make changes quickly, and improve your initial designs.
Components of the method
Information mapping provides a number of tools for analyzing, organizing and presenting information.
Information types
Some of Robert E. Horn's best-known work was his development of the theory of information types. Horn identified six types of information that account for nearly all the content of business and technical communications. The types categorize elements according to their purpose for the audience:
Information Type
Description
Procedure A set of steps an individual performs to complete a single task
ProcessA series of events, stages or phases that occurs over time and has a specific outcome
Principle A statement designed to dictate, guide or require behavior
Concept A class or group of things that share a critical set of attributes
Structure A description or depiction of anything that has parts or boundaries
Written and compiled by Dr. Muchelule Yusuf Wanjala, [email protected] Page 37
Fact A statement that is assumed to be true
Research-based principles
The information mapping method proposes six principles for organizing information so that it is easy to access, understand, and remember:
Principle Description
Chunking Break up information into small, manageable units
Relevance Limit each unit of information to a single topic
Labeling Label each unit of information in a way that identifies its contents
ConsistencyBe consistent in use of terminology as well as in organizing, formatting and sequencing information
Accessible detail
Organize and structure information so those who need detail can access it easily, while those who don't can easily skip it
Integrated graphics
Use graphics within the text to clarify, emphasize and add dimension
Units of information
Documents written according to information mapping have a modular structure. They consist of clearly outlined information units (maps and blocks) that take into account how much information a reader is able to assimilate. There is an essential difference between an information unit and the traditional text paragraph. A block is limited to a single topic and consists of a single type of information. Blocks are grouped into maps, and each map consists only of relevant blocks. The hierarchical approach to structuring information greatly facilitates electronic control of content via content management systems and knowledge management systems.
Advantages of information mapping
The information mapping method offers advantages to writers and readers, as well as to an entire organization.
Advantages for writers
Written and compiled by Dr. Muchelule Yusuf Wanjala, [email protected] Page 38
Information mapping offers these advantages for writers:
An easily learned systematic approach to the task of writing that once learned, enables writers to minimize down time and start writing immediately
A subject-matter independent approach that can be applied to all business-related or technical content
A content standard that greatly facilitates team writing and management of writing projects
Enhanced writer productivity, with less time required for both draft development and review, and
Easy updating and revision of content throughout its life cycleAdvantages for readers
Information mapping offers these advantages for readers:
Quick, easy access to information at the right level of detail, even for diverse audiences Improved comprehension Fewer errors and misunderstandings Fewer questions for supervisors, and Shorter training cycles, less need for re-trainingAdvantages for organizations
Also an entire organization can benefit from using a content standard like information mapping if the method is used with the following objectives in mind:
Revenue growth by reducing time to create content and accelerating time to market Cost reduction by capturing employee knowledge, increasing operational efficiency,
reducing support calls, and decreasing translation costs Risk mitigation by increasing safety and compliance
What is Information Visualization?
Information visualization is the process of representing data in a visual and meaningful way so that a user can better understand it. Dashboards and scatter plots are common examples of information visualization. Via its depicting an overview and showing relevant connections, information visualization allows users to draw insights from abstract data in an efficient and effective manner.
Information visualization plays an important role in making data digestible and turning raw information into actionable insights. It draws from the fields of human-computer interaction, visual design, computer science, and cognitive science, among others. Examples include world map-style representations, line graphs, and 3-D virtual building or town plan designs.
The process of creating information visualization typically starts with understanding the information needs of the target user group. Qualitative research (e.g., user interviews) can reveal how, when, and where the visualization will be used. Taking these insights, a designer can determine which form of data organization is needed for achieving the users’ goals. Once information is organized in a way that helps users understand it better—and helps them apply it so as to reach their goals—visualization techniques are the next tools a designer brings out to use. Visual elements (e.g., maps and graphs) are created, along with appropriate labels, and
Written and compiled by Dr. Muchelule Yusuf Wanjala, [email protected] Page 39
visual parameters such as color, contrast, distance, and size are used to create an appropriate visual hierarchy and a visual path through the information.
Information visualization is becoming increasingly interactive, especially when used in a website or application. Being interactive allows for manipulation of the visualization by users, making it highly effective in catering to their needs. With interactive information visualization, users are able to view topics from different perspectives, and manipulate their visualizations of these until they reach the desired insights. This is especially useful if users require an explorative experience.
COLLABORATIVE COMMUNICATION
Collaboration is essential in almost all aspects of life and work. Nearly every imaginable job in business today entails at least some joint effort among members of a team working together collaboratively. This makes cooperation an essential skill in most sectors of the professional world. Building collaboration means building trust. Those most effective at building trust know how to understand a variety of perspectives, manage priorities from everyone in the group, and then decisively meet expectations as a reliable member of a team.
What are Collaboration Skills?
The definition of the word ‘collaboration’ refers to working with someone else in order to create or produce something. Collaboration skills enable people within an organization (or outside an organization) to engage with each other productively and efficiently. Successful collaboration requires a cooperative spirit and mutual respect. Employers typically seek employees that function effectively as part of a team and are willing to balance personal achievement with group goals. In some cases, teams that collaborate include members of the same department coordinating on an ongoing activity. In other situations, interdepartmental teams are assembled to form cross-functional teams tasked with completing special projects within a prescribed period of time.
Elements of Successful Collaboration
The idea of collaboration seems easy enough. Doesn’t it just imply “working together.” But there’s more to it. If you are working with others on a project, take note of these elements of healthy collaboration:
Establish clear definitions and agreements on the roles of partners in the collaborative process.
Keep communication open within teams, never withholding information necessary to carry out tasks.
Reach consensus about goals and methods for completing projects or tasks. Don’t move forward until all members are in agreement.
Offer recognition of, and respect for, the contributions of all collaborators. It’s important to give credit where credit is due.
Carefully identify obstacles and address problems cooperatively as they occur. Teamwork is essential at all times.
Written and compiled by Dr. Muchelule Yusuf Wanjala, [email protected] Page 40
Place group goals above personal satisfaction and/or recognition, especially if you are the leader. It’s crucial to put the desired project results at the forefront. Collaboration isn’t about individual goals.
Be willing to apologize for missteps and forgive others for mistakes. Holding a grudge or sabotaging the efforts of other team members destroys collaboration.
Types of Collaboration Skills
Communication
Getting your point across is not always as easy as you think. Among individuals that do not take the time to understand one another, misunderstanding is a common distraction from project goals.Being able to collaborate means paying attention to verbal and nonverbal cues, and then learning how to speak directly to the issue at hand. You can’t be afraid to share your perspective, and neither can you try to impose your viewpoint on everyone else.
Active Listening Written Communication Verbal Communication Nonverbal Communication Focus Confidence
Emotional Intelligence
Emotional intelligence (or EQ) is quickly becoming one of the most sought-after soft skills in the workplace. Those with strong emotional intelligence are able to understand the “hidden” needs of themselves and others. When a team member is moody and snaps at another team member, those with emotional intelligence are able to surmise that the irritability could be evidence of the moody member’s need for rest or help. Even issues such as laziness or stubbornness are seen by those with emotional intelligence as merely symptoms of a bigger problem that everyone can work together to address.
Resilience Not Easily Offended Interpersonal Skills Able to Detach from Their Own Strong Emotions Curiosity Empathy Compassion Identify Systematic Problems Conflict Resolution
Respect for Diversity
Economies from multiple continents are beginning to merge. More and more businesses do business with companies overseas. Even within the U.S., more women and minorities are running key roles within an organization. As such, team members that collaborate well are open-minded about all walks of life.
Written and compiled by Dr. Muchelule Yusuf Wanjala, [email protected] Page 41
Respect for diversity does not mean that people must let go of their religious beliefs or their own convictions. It does mean, however, that everyone respects each other’s perspectives as being equal. All voices matter, and each team member is sensitive to behaviors or decisions that could be subtle forms of discrimination against a certain group of people.
Open Communication Sensitivity to Ethnic and Religious Backgrounds Building and Managing Expectations Facilitating Group Discussion Agreeing on Roles that Capitalize on Individual Strengths Building Consensus Eliciting Viewpoints from Reluctant Team Members
Productivity Software
There is an app or software for nearly every task under the sun. Collaborating effectively doesn’t mean that you must know how to use every kind of productivity software imaginable, but it does mean that you should become familiar with different computer programs that are a good fit for your team. Some teams work more effectively through digital communication channels only, such as social media, instant messaging, and video conference tools. Other teams work best in close proximity with a big table nearby that everyone can fit around. Often, teams are required to collaborate with some mix of digital and in-person tools
Network interaction toolsNetwork Icons - Basic Symbols
Cisco Network Icons - Routers
Written and compiled by Dr. Muchelule Yusuf Wanjala, [email protected] Page 42
Cisco Network Icons - Switches and Hubs
Documentation Icons ShapesThe Cisco Corporate Icons template includes about 250 standard black theme Cisco shapes, containing special and highly detailed symbols, accurate shapes and computer graphics for 100baset hub, ace, atm router, ata, arrows motion, arrows for pointing, access point etc.
Written and compiled by Dr. Muchelule Yusuf Wanjala, [email protected] Page 43
Documentation Icons Shapes
Network DiagramIdentifiable network icons are used to depict common network appliances. For example: Router, and the style of lines between them indicate the type of connection. Clouds are used to represent networks external to the one pictured for the purposes of depicting connections
Written and compiled by Dr. Muchelule Yusuf Wanjala, [email protected] Page 44
between internal and external devices, without indicating the specifics of the outside network. The server is further connected to a printer and a gateway router, which is connected via a WAN link to the Internet.
Cisco Network Topology
Cisco Lab Network Diagram
Written and compiled by Dr. Muchelule Yusuf Wanjala, [email protected] Page 45
Cisco WAN Network Diagram
Cisco Network Shapes
Draw Cisco Computer Network Diagrams, Designs, Schematics, and Network maps with Edraw in no time! Pre-drawn shapes representing computers, network devices plus smart connectors help create accurate diagrams and documentation. Special libraries of highly detailed, accurate shapes and computer graphics, servers, hubs, switches, printers, mainframes, face plates, routers etc. for Computer Network, Telecommunications, Wireless Internet, Power, Storage and other equipment. Include:
Cisco Product Cisco IBM Products Cisco LAN Cisco Media
Written and compiled by Dr. Muchelule Yusuf Wanjala, [email protected] Page 46
Cisco Miscellaneous Cisco People Cisco WAN Cisco Building icons
Marketing Icons ShapesThe Cisco Corporate Icons template includes about 200 standard grey theme Cisco shapes. Special symbols of highly detailed, accurate shapes and computer graphics for 10700, 15200, 3200 mobile, desktop, asic processor etc.
Marketing Icons Shapes
Written and compiled by Dr. Muchelule Yusuf Wanjala, [email protected] Page 47
NETWORK TROUBLESHOOTING
Network troubleshooting is the collective measures and processes used to identify, diagnose and resolve problems and issues within a computer network. It is a systematic process that aims to resolve problems and restore normal network operations within the network. Network troubleshooting is primarily done by network engineers or administrators to repair or optimize a network. It is generally done to recover and establish network or Internet connections on end nodes/devices. Some of the processes within network troubleshooting include but are not limited to:
Finding and resolving problems and establishing Internet/network connection of a computer/device/node
Configuring a router, switch or any network management device Installing cables or Wi-Fi devices Updating firmware devices on router switch Removing viruses Adding, configuring and reinstalling a network printer
Network troubleshooting can be a manual or automated task. When using automated tools, network management can be done using network diagnostic software. Wireless networking is both pervasive and getting more complicated behind the scenes. For end users, Wi-Fi is the invisible network resource that they connect to. For wireless network administrators -- who
Written and compiled by Dr. Muchelule Yusuf Wanjala, [email protected] Page 48
design, deploy and support the wireless LAN -- the Wi-Fi network is a fairly complicated beast with many moving pieces that are part of the bigger networking environment. When wireless connection problems occur, how end users and administrators respond depends on various factors. In this article, we consider 10 common steps for troubleshooting and exonerating the wireless network on the way to finding the source of trouble.
Step 1: Turn it on and point it in the right direction.
Sometimes the most obvious causes of system trouble can be the hardest to see. All of us make faulty assumptions at times. When we go to access the Wi-Fi network and nothing happens, it's best to start with the absolute basics.
Regardless of what device you are using, verify that the wireless adapter is toggled on.
On phones and tablets, make sure you are not in Airplane Mode. Many WLAN environments have multiple service set identifiers, or network names,
and not all of them lead to where you want to go. When your Wi-Fi is enabled and you show a connection but can't get anywhere, check to make sure you are connected to the right network for your particular role. Some wireless networks are special-purpose dead ends that don't reach the internet.
Depending on what network you are connecting to, you may need coordinated permission to use the Wi-Fi. If you skip this step, the wireless network can certainly feel broken.
Step 2: Define the scale of the problem.
The vast majority of Wi-Fi problems are single-client issues -- as long as the network was designed and installed by qualified professionals. At the same time, even market-leading vendors can deliver buggy code, and good components occasionally do fail. When you encounter wireless network performance issues, you need to understand how far the problem stretches. This step applies whether you run the network, or just use it.
Take a deep breath before you start calling the entire wireless environment bad. If you are the only one having wireless connection problems in a room full of people, then that is telling.
Do you have a comparative device? For instance, can you connect with your laptop but not your smartphone? Can you compare your situation with someone nearby?
If you conclude the issue is with a single device, user or password, then you may need help desk assistance to get configured correctly.
All client devices and individual user accounts can have issues. Whether you're a C-level employee or your device is a top-end Apple product, everyone eventually experiences wireless connection problems.
If multiple users are having issues, the more details you can provide to IT, the faster the resolution will be.
Written and compiled by Dr. Muchelule Yusuf Wanjala, [email protected] Page 49
Finding the scope and scale of your wireless connection problems
Step 3: Sleuth basic diagnostics.
There's no such thing as too much information when reporting network troubles. Just try to be specific. When your wireless connection fails, it can be unnerving, especially when you're trying to do actual work. Laptops, tablets and smartphones can show and tell you basic diagnostic information. But you have to know what you're looking at. Don't jump to conclusions based on scant information.
Signal bars are perhaps the most basic and universal indicator of signal strength. When wireless network connectivity is in question, we probably all take a look at the bars. If the bars are not present or too weak, then that's good information -- but it may not tell the whole story.
Some client devices are really poor at roaming, which is the process of leaving one cell for a stronger or better one. Roaming is mostly all client-controlled, subject to however the wireless adapter driver code was written. This is not spelled out in the 11 standard, so vendors have flexibility to put their own spin on roaming. If my device doesn't roam well, my weak signal can actually be poor device performance on a perfectly healthy network.
Ping with caution. One of the most universal network troubleshooting steps is to ping a destination. This tells you whether the target device is alive, that the network path between source and destination is good in both directions, and how long it took to get a response. But ping may fail for several reasons -- from host-based firewall settings to filtering along the way. Use ping, but know that it's not absolute.
DNS problems can be tricky. I try to reach SearchNetworking.com and it fails. Is the Wi-Fi broken? Maybe not. DNS translates the SearchNetworking server name to and from its IP address 206.19.49.153. If I put the IP address in the browser and get to the site, we have a DNS issue. Basic DNS tests are easy, and they tell a lot when troubleshooting. Include your DNS findings in any trouble ticket.
Most well-run networks have everything labeled in some fashion. If you are reporting trouble and have an access point (AP) within sight, try to note how it's labeled and what color LEDs are visible on it. Every bit of input helps for troubleshooting wireless connection problems.
Written and compiled by Dr. Muchelule Yusuf Wanjala, [email protected] Page 50
Step 4: Report trouble with good information.
Outside of the smallest business environments, a business WLAN typically has several components that help you get on the network and keep you connected. The fastest resolution will come with good information relayed to support staff, whether it's a formal help desk or just the IT person who deals with problems. The following information and questions are important when troubleshooting wireless connection problems:
Where did the problem occur? Within a given room? If applicable, did the trouble follow you to a different room, floor or building?
If you have multiple devices, did they all have problems? If not, which devices worked and which did not? If they all failed, did the failure feel the same?
What time and date did the issue happen? Nothing is harder to troubleshoot than, "Last week sometime, I had an issue on the network." Every hour of network operation equals thousands of lines of logs to parse. Good timestamps help immensely.
Get a meaningful description of what was experienced. Was the wireless network visible? Could you connect but get nowhere, or not connect at all?
Did you get an IP address? Was any DNS testing done? If on a smartphone, did you toggle between Wi-Fi and cellular to see if one network
behaved while the other did not? There's no such thing as too much information when reporting network troubles. Just
try to be specific.
Written and compiled by Dr. Muchelule Yusuf Wanjala, [email protected] Page 51
Step 5: Untangle advanced client issues.
When everything seems to be configured correctly, but a certain device just won't behave, it's time to dig deeper on the device. At this point, one classic mistake is to start adjusting settings on the network to try to "fix" a problematic client device. Leave the network alone or you'll likely cause bigger issues. Watch out for these following items, and expect all of these to be scrutinized if a help desk is involved:
Unfortunately, drivers can still wreak havoc on whether a Windows machine will perform well on Wi-Fi. Even with Windows updates turned on, most hardware drivers do not automatically refresh. Check the drivers for your wireless adapter, basic I/O system, and chipset for freshness. All three can cause problems.
If you are connecting to an enterprise secure WLAN, something as simple as time and date inaccuracies can prevent wireless authentication. Make sure yours are right.
Enterprise secure networks are far more complicated than those simply using a password or pre-share key. Several settings may have to be configured and possibly even a certificate loaded on your client device before you can connect. Business networks are frequently concerned with authentication, strong encryption and logging details of every connection for audit and troubleshooting purposes. This greatly increases the complexity of getting individual client devices onboarded. See if your network administrators provide a configuration tool or written instructions on getting configured, or you'll likely stay dead in the water.
User credentials can also be a problem -- especially if your network requires occasional changes to passwords. Make sure your Caps Lock is not on, and that you know your password before attempting to connect.
Step 6: Understand infrastructure failure points.
Most of the WLAN infrastructure will be a mystery to the actual Wi-Fi clients, but there is value in understanding some common high-level failure points on the infrastructure side. In well-administered network environments, most of the following should be monitored closely with various automated tools. As mentioned earlier, most Wi-Fi problems tend to be single-user in nature, but those mentioned here will generally be felt by multiple clients.
Wireless access points stop working for various reasons. They may experience component failure, firmware corruption or physical damage. Perhaps the cable connecting the AP to its network switch gets compromised, or the upstream switch port has issues. In a perfect world, there will be redundancy among access points and losing one isn't noticed by end users. But not all environments are perfect.
If a wireless environment is under-built, access points may get overwhelmed by high client counts or just a few clients doing high-bandwidth applications. Either way, if you are on a congested access point, it can be slow or unusable.
If a switch that powers multiple access points has problems, then the chance of an area-wide or building-wide outage becomes very likely.
Many access points are akin to business telephones because they get their intelligence from a network-connected component called a controller. When a controller fails, you may lose dozens, hundreds or even thousands of access points -- this is every engineer's nightmare.
Step 7: Quantify application and destination issues.
Written and compiled by Dr. Muchelule Yusuf Wanjala, [email protected] Page 52
It takes time to label everything and keep the diagrams accurate. But all of this is an investment at troubleshooting time. What if you're successfully connected to Wi-Fi but can't get a specific application to work? Or you try to reach a web destination, but you get an error page? Usually, these situations have nothing to do with Wi-Fi. Generally, other network conditions are to blame.
When you hit a roadblock, try to quantify what is working right and what is failing. Problems this specific will only be the fault of the WLAN if some specific protocol or destination is blocked in a firewall setting. The access points and actual radio frequency environment will have nothing to do with this sort of situation, but the information you gather will help administrators troubleshoot what's going on.
Step 8: Squish code bugs.
Unfortunately, in today's business wireless networks -- despite high prices and promises of cutting-edge innovation -- the logic under the hood is often buggy. Several modern AI-driven analytics dashboards are available, but none of them can tell you that code bugs are hitting your Wi-Fi environment. So, we live with this problem, and surprisingly market-leading systems can be the worst offenders. Although network administrators are responsible for resolving code bugs, end users often feel the effects. Whether in the form of a memory leak or an intermittent malfunction, code bugs can be the absolute worst thing to hit a wireless network. Here are some of the symptoms of code bugs:
spontaneous reboot of multiple access points, from a few to thousands; APs that stop allowing client access; specific features stop working; some common subset of client devices all have the same issue while others are fine;
and erratic network behavior for Wi-Fi clients or access points.
Code bugs often require a support ticket to be opened with the WLAN vendor. There can be a great deal of tension here. The network engineering team wants a fast resolution. Network users are affected, and organizational tech execs are looking for accountability while the vendor grapples with a convoluted troubleshooting algorithm. Meanwhile, features may be disabled, but the end result is usually a code upgrade. When dealing with code bugs, communicate with users and upper management. Tell them what is happening: The network itself is fine, but the code running it is problematic.
Step 9: Run a tight ship.
Today's wireless networks are often extremely complicated and integrated with a growing number of parts of the larger network environment. Tools, training, documentation and monitoring are all key components as an effective response when trouble hits. The team supporting your wireless environments should have wireless-specific skills and the right software and test equipment to cut through the fog when responding to problems. Good network diagrams, well-labeled cables, access points, switches and up-to-date call lists can reduce the time it takes to resolve problems. Staff needs occasional training and your tools will need to be refreshed periodically. It takes time to label everything and keep the diagrams accurate. But all of this is an investment at troubleshooting time.
Written and compiled by Dr. Muchelule Yusuf Wanjala, [email protected] Page 53
Step 10: It works at home but not at work.
Never before has there been such an amazing breadth of wireless client devices. From smart home gadgetry to wireless printers to Wi-Fi-enabled lab instrumentation, there is a fascinating array of stuff that wants to find its way to the business WLAN environment.
Network troubleshooting tools
Network troubleshooting tools are a necessity for every network administrator. When getting started in the networking field, it is important to amass a number of tools that can be used to troubleshoot a variety of different network conditions. While it is true that the use of specific tools can be subjective and at the discretion of the engineer, the selection of tools in this article has been made based on their generality and common use. This article reviews the top 10 basic tools that can help you troubleshoot most networking issues.
10. Ping
The most commonly used network tool is the ping utility. This utility is used to provide a basic connectivity test between the requesting host and a destination host. This is done by using the Internet Control Message Protocol (ICMP) which has the ability to send an echo packet to a destination host and a mechanism to listen for a response from this host. Simply stated, if the requesting host receives a response from the destination host, this host is reachable. This utility is commonly used to provide a basic picture of where a specific networking problem may exist. For example, if an Internet connection is down at an office, the ping utility can be used to figure out whether the problem exists within the office or within the network of the Internet provider. Figure 1 below shows an example of the ping utility being used to obtain the reachability status of the locally connected router.
Figure 1: Ping utility
9. Tracert/traceroute
Typically, once the ping utility has been used to determine basic connectivity, the tracert/traceroute utility can used to determine more specific information about the path to the destination host including the route the packet takes and the response time of these intermediate hosts. Figure 2 below shows an example of the tracert utility being used to find
Written and compiled by Dr. Muchelule Yusuf Wanjala, [email protected] Page 54
the path from a host inside an office to www.google.com. The tracert utility and traceroute utilities perform the same function but operate on different operating systems, Tracert for Windows machines and traceroute for Linux/*nix based machines.
Figure 2: Tracert/traceroute utility
8. Ipconfig/ifconfig
One of the most important things that must be completed when troubleshooting a networking issue is to find out the specific IP configuration of the variously affected hosts. Sometimes this information is already known when addressing is configured statically, but when a dynamic addressing method is used, the IP address of each host can potentially change often. The utilities that can be used to find out this IP configuration information include the ipconfig utility on Windows machines and the ifconfig utility on Linux/*nix based machines. Figure 3 below shows an example of the ifconfig utility showing the IP configuration information of a queries host.
Figure 3: Ifconfig utility
Written and compiled by Dr. Muchelule Yusuf Wanjala, [email protected] Page 55
7. Nslookup
Some of the most common networking issues revolve around issues with Dynamic Name System (DNS) address resolution issues. DNS is used by everyone using the Internet to resolve commonly known domain names (i.e. google.com) to commonly unknown IP addresses (i.e. 74.125.115.147). When this system does not work, most of the functionality that people are used to goes away, as there is no way to resolve this information. The nslookup utility can be used to lookup the specific IP address(es) associated with a domain name. If this utility is unable to resolve this information, there is a DNS issue. Along with simple lookup, the nslookup utility is able to query specific DNS servers to determine an issue with the default DNS servers configured on a host. Figure 4 below shows an example of how the nslookup utility can be used to query the associated IP address information.
Figure 4: Nslookup utility
6. Netstat
Often, one of the things that are required to be figured out is the current state of the active network connections on a host. This is very important information to find for a variety of reasons. For example, when verifying the status of a listening port on a host or to check and see what remote hosts are connected to a local host on a specific port. It is also possible to use the netstat utility to determine which services on a host that is associated with specific active ports. Figure 5 below shows an example of the netstat utility being used to display the currently active ports on a Linux machine.
Written and compiled by Dr. Muchelule Yusuf Wanjala, [email protected] Page 56
Figure 5: Netstat utility
5. PuTTY/Tera Term
When connecting to a variety of different types of equipment, a telnet, SSH or serial client is required; when this is required both the puTTY and Tera Term programs are able to provide these functionalities. The selection of one over the other is strictly a personal preference. Figures 6 and 7 below show both puTTY and Tera Term being used to connect to a host via SSH.
Figure 6: PuTTY
Written and compiled by Dr. Muchelule Yusuf Wanjala, [email protected] Page 57
Figure 7: Tera Term
4. Subnet and IP Calculator
One of the most important tools in the belt of a junior network engineer is an IP network calculator. These can be used to unsure a correct IP address selection and with this a correct IP address configuration. While this type of tool is used by senior level network engineers, much of the information obtained from the tool becomes simpler to calculate the longer and more experience you have in the field. Two of the more commonly used free IP calculators include Wildpackets (Bitcricket) Network Calculator and Solarwinds Advanced Subnet Calculator which can be found at the links below.
http://www.bitcricket.com/downloads/IPCalculator.msi
http://downloads.solarwinds.com/solarwinds/Release/FreeTool/SolarWinds-Subnet-Calculator.zip
Figure 8: Subnet calculator
3. Speedtest.net/pingtest.net
A very easy test that can be used to both determine the Internet bandwidth available to a specific host and to determine the quality of an Internet connection is the use of the tools
Written and compiled by Dr. Muchelule Yusuf Wanjala, [email protected] Page 58
available at the speedtest.net and pingtest.net websites. The speedtest.net site provides the ability to determine the amount of bandwidth that is available to a specific host at a specific point in time; this is often a good tool to use when measuring how long it is going to take to upload or download information from a local to remote host. This measurement can also be used to determine whether the connection is offering the amount of bandwidth that was purchased from the Internet provider; keep in mind however that some amount of bandwidth difference is expected between the quoted bandwidth purchased and the measured bandwidth. The pingtest.net website is used to determine the quality of the connection by measuring the ping response times and jitter amounts over a short period of time. This information can be used to determine a likelihood of how well the measured connection will deal with certain types of high demand traffic like Voice over IP (VoIP) or gaming. Figure 9 and 10 below show example output from both of these sites.
Figure 9: Speedtest
Written and compiled by Dr. Muchelule Yusuf Wanjala, [email protected] Page 59
Figure 10: Pingtest
2. Pathping/mtr
In an effort to take advantage of the benefits of both the ping and tracert/traceroute commands, the pathping and mtr utilities were developed. Both of these tools take the functionality and information that can be obtained from these types of tools and provide a more detailed single picture of the path characteristics from a specific host to a specific destination. Figure 11 and 12 below show examples of these two tools and what information they provide.
Written and compiled by Dr. Muchelule Yusuf Wanjala, [email protected] Page 60
Figure 11: Pathping
Figure 12: Mtr
1. Route
The last of the tools covered in this article is the route utility. This utility is used to display the current status of the routing table on a host. While the use of the route utility is limited in
Written and compiled by Dr. Muchelule Yusuf Wanjala, [email protected] Page 61
common situations where the host only has a single IP address with a single gateway, it is vital in other situations where multiple IP address and multiple gateways are available. Figure 13 below shows an example of the route utility being used on a Windows machine.
Figure 13: Route Utility
Summary
As with any job, the type of tools that are quickly available can greatly influence the amount of time that it takes to complete a job. When troubleshooting a networking issue, the amount of time that it takes to find and fix a problem directly affect the wasted costs that it causes to any system relying on the network. This article has taken a look at the 10 most commonly used tools that can help in ensuring that the time that it takes to find and fix a problem is as short as possible. I hope the information in this article can be helpful in future troubleshooting.
UNIFIED COMMUNICATIONS IN NETWORKING
What is unified communications?
People work together in different ways. And they use a lot of collaboration tools: IP telephony for voice calling, web and video conferencing, voice mail, mobility, desktop
Written and compiled by Dr. Muchelule Yusuf Wanjala, [email protected] Page 62
sharing, instant messaging and presence, and more. Unified communications (UC) solutions deliver integration of these tools, with seamless user experiences that help people work together more effectively. Anywhere, on any device. They bring real-time communication from your phone system and conferencing solutions together with messaging and chat, and integrate with everyday business applications using APIs
Unified Communications (UC) is an IP-based communications system integrating voice, video, data, and mobility products and applications. It enables more effective, secure communications and can transform the way in which we communicate. UC represents a communications paradigm shift like that of the invention of the telegraph. UC removes the geographic barriers of effective communications through the use of voice, video, and data integration. Business can be conducted with a fluidity that progresses and evolves with you. Information has been at our fingertips for a long time, but UC enables the sharing of this information to create knowledge and value.
UC Solution Components
UC strategy encompasses voice, video, and data traffic within a single network infrastructure. Cisco UC equipment is capable of managing all three traffic types and interfacing with all standards-based network protocols. Cisco IP Communications represents a new way of delivering UC functionality to enterprise customers. Instead of delivering a collection of disjointed products with individual release dates, testing methodology, and documentation, Cisco UC is a coordinated release of an integrated set of products that are tested, documented, and supported as a system. Cisco Unified Communications Solution Components
The components of the standard layers are as follows:
Infrastructure layer: The infrastructure consists of routers, switches, and voice gateways. The infrastructure layer carries data, voice, and video between all network devices and applications. This layer also provides high availability, management, quality of service (QoS), and network security.
Call control layer: The call control layer provides for call processing, device control, and administration of the dial plan and features.
Applications layer: Applications are independent from call-control functions and the physical voice-processing infrastructure. Applications, including those listed here, are integrated through IP, which allows the applications to reside anywhere within the network: Voice mail, integrated messaging, and unified messaging applications are provided through Cisco Unity, Cisco Unity Express, or Cisco Unity Connections products.
— Contact centers of various sizes can be built with Cisco Unified Contact Center and Cisco Unified Contact Center Express.
— Cisco Unified Meeting Place and MeetingPlace Express are medium- to large-scale conferencing servers that support video integration. The MeetingPlace product integrates lecture-style conferences with scalable collaboration and control tools. Cisco Unified MeetingPlace Express is positioned to the small to medium-sized enterprises. MeetingPlace Express is the successor of the Cisco Conference Connection server.
Written and compiled by Dr. Muchelule Yusuf Wanjala, [email protected] Page 63
— Cisco Emergency Responder (ER) enhances the existing emergency functionality offered by UCM. Cisco ER provides physical location updates for mobile devices to guarantee that emergency calls to the public safety answering point (PSAP) are properly routed to the PSAP in charge of emergency calls for that site. Cisco ER identifies the caller location and maps all calls from that physical location to an emergency line identification number (ELIN) through the use of standard automatic number identification (ANI)/caller identification (CLID).
— The Cisco Unified Presence server collects information about the availability and communications capabilities of a user and provides this information to watchers of the user as a status indication. The status information includes the user's communications device availability. For example, the user might be available via phone, video, web collaboration, or videoconferencing.
— Standard protocol interfaces, including Telephony Application Programming Interface (TAPI), Java Telephony Application Programming Interface (JTAPI), Simple Object Access Protocol (SOAP), Q.SIG, H.323, Media Gateway Control Protocol (MGCP), and Session Initiation Protocol (SIP) are available to support third-party applications.
Endpoints layer: The endpoints layer brings applications to the user, whether the end device is a Cisco IP Phone, a PC using a software-based phone, or a communications client or video terminal. Cisco UC provides multiprotocol support for Skinny Client Control Protocol (SCCP), H.323, MGCP, and SIP.
Cisco UC Network
The Cisco UC system delivers fully integrated communications, converging voice, video, and data over a single network infrastructure using standards-based protocols. The Cisco UC system delivers unparalleled performance and capabilities to address current and emerging communications needs in the enterprise environment, as illustrated by the network topology .The Cisco UC product suite is designed to optimize functionality, reduce configuration and maintenance requirements, and provide interoperability with a variety of other applications. It provides this capability while maintaining high availability, QoS, and security.The Cisco UC system integrates the following major communications technologies:
IP telephony: IP telephony refers to technology that transmits voice communications over a network using IP standards. Cisco UC includes a wide array of hardware and software products such as call-processing agents, IP phones, voice-messaging systems, video devices, conferencing, and many other applications.
Customer contact center: Cisco Unified Contact Center products are a combination of strategy and architecture to revolutionize call center environments. Cisco Unified Contact Center promotes efficient and effective customer communications across large networks by enabling organizations to draw from a broader range of resources to service customers. These resources include access to a large pool of agents and multiple channels of communication and customer self-help tools.
Video telephony: The Cisco Unified Video Advantage products enable real-time video communications and collaboration using the same IP network and call-processing agent as Cisco UC. Cisco Unified Video Advantage does not require special end-user training. Video calling with Cisco Unified Video Advantage is as easy as dialing a phone number.
Written and compiled by Dr. Muchelule Yusuf Wanjala, [email protected] Page 64
Rich-media conferencing: Cisco Unified MeetingPlace creates a virtual meeting environment with an integrated set of IP-based tools for voice, video, and web conferencing.
Third-party applications: Cisco works with leading-edge companies to provide the broadest selection of innovative third-party IP communications applications and products focused on critical business needs such as messaging, customer care, and workforce optimization.
UCM Functions
UCM extends enterprise telephony features and functions to packet telephony network devices. These packet telephony network devices include Cisco IP Phones, media-processing devices, VoIP gateways, and multimedia applications. Additional data, voice, and video services, such as converged messaging, multimedia conferencing, collaborative contact centers, and interactive multimedia response systems, interact with the IP telephony solution through the UCM application programming interface (API).
UCM provides these functions:
Call processing: Call processing refers to the complete process of originating, routing, and terminating calls, including any billing and statistical collection processes.
Signaling and device control: UCM sets up all the signaling connections between call endpoints and directs devices such as phones, gateways, and conference bridges to establish and tear down streaming connections. Signaling is also referred to as call control and call setup/call teardown.
Dial plan administration: The dial plan is a set of configurable lists that UCM uses to perform call routing. UCM is responsible for digit analysis of all calls. UCM enables users to create scalable dial plans.
Phone feature administration: UCM extends services such as hold, transfer, forward, conference, speed dial, redial, call park, and many other features to IP phones and gateways.
Directory services: UCM uses its own database to store user information. User authentication is performed locally or against an external directory. Directory synchronization allows for centralized user management. Directory synchronization allows UCM to leverage users already configured in a corporate-wide directory.
Programming interface to external applications: UCM provides a programming interface to external applications such as Cisco IP SoftPhone, Cisco IP Communicator, Cisco Unified IP Interactive Voice Response (IP IVR), Cisco Personal Assistant, Cisco Unified Personal Communicator, and UCM Attendant Console.
Backup and restore tools: UCM provides a Disaster Recovery System (DRS) to back up and restore the UCM configuration database. The DRS system also backs up call details records (CDR), call management records (CMR), and the CDR Analysis and Reporting (CAR) database.
UCM Signaling and Media Paths
UCM uses SIP or SCCP to communicate with Cisco IP Phones for call setup and teardown and for supplementary service tasks. After a call has been set up, media exchange occurs directly between the Cisco IP Phones across the IP network, using the Real-Time Transport Protocol (RTP) to carry the audio. UCM is not involved in a call after the call has been set up. If the UCM server were unplugged during the duration of the call, users would not notice unless they attempted to use a feature on the phone. UCM is involved only in call setup, teardown, and features. If the UCM server that set up the call were down during a
Written and compiled by Dr. Muchelule Yusuf Wanjala, [email protected] Page 65
conversation, end users would see a message indicating "CM Down, Features Disabled" on the LCD screen of the IP phone.
Cisco UC Operating SystemThe UCM operating system is based on Red Hat Linux. Operating system and application updates are provided by Cisco through patches that are digitally signed by Cisco. Unsupported software and applications (not digitally signed by Cisco) cannot be uploaded or installed into the system. Root access to the file system is not permitted. The operating system has been hardened by disabling all unnecessary accounts and services. There is also no access to native operating.
system debug interfaces. Traces, alarms, and performance counters can be enabled and monitored through the UCM GUI. Some files and directories are accessible through the Cisco CLI and GUI for maintenance purposes. Remote-access support allows Cisco Technical Assistance Center (TAC) engineers to remotely access the UCM server for a restricted time interval. Remote-access support can be enabled in UCM serviceability tools. The IBM IDS is the database for the Cisco UC applications. The IDS database installation and configuration is scripted into the UCM installation DVDs. No UNIX or IBM IDS database knowledge is required to configure and operate UCM.
Cisco Secure Agent is included with the appliance to provide protection against known and unknown attacks. Cisco Secure Agent is a host-based intrusion prevention system (HIPS). A DHCP server is integrated into UCM to provide IP telephony devices with their IP addressing requirements. The Cisco UC operating system is also used for these Cisco UC applications:
Cisco Emergency Responder 2.0 Unity Connection 2.0 Cisco Unified Presence 6.0
Cisco UC Database
The data in the UCM database is divided into two types, as described in the sections that follow.
Static Configuration DataStatic configuration data is created as part of the configuration of the UCM cluster. Read/write access to this data is provided for the publisher only. Subscribers provide only read-only access to this data. If the publisher becomes unavailable, the subscriber data can be used to process calls, but it cannot be modified. Database replication is unidirectional, from the publisher to the subscribers. Only CDRs and CMRs are replicated from the subscriber servers to the publisher. All other configuration information is downloaded from the publisher.
User-Facing FeaturesYou have learned that the publisher is the only server with a read-write copy of the database, and all configuration changes should be made on the publisher. These changes are then replicated downstream to the subscribers. This model represents a single point of failure from the perspective of moves, adds, and changes (MAC). The problem is further exacerbated because the publisher was the only server in the cluster responsible for call-forwarding changes, extension mobility logins, and message-waiting indicators before UCM 6.0. UCM
Written and compiled by Dr. Muchelule Yusuf Wanjala, [email protected] Page 66
6.0 treats a portion of the database as dynamic configuration data. Read/write access to dynamic configuration data is provided on all servers, allowing certain information to be modified if the publisher server is unavailable. The dynamic information that can be changed during a publisher outage is known as user-facing features (UFF). UFF data is replicated from the subscriber servers where the change was initiated to all other subscriber servers in the UCM cluster.
Examples of UFFs include the following:
Call Forward All (CFA) Message Waiting Indication (MWI) Privacy, Enable/Disable Do Not Disturb, Enable/Disable (DND) Extension Mobility Login (EM) Hunt Group Login Status Monitor (future use) Device Mobility CTI CAPF Status (Computer Telephony Integration, Certificate Authority Proxy Function)
The services listed in Table 1-1 rely on the availability of the publisher server regardless of the version of UCM used.
Table 1-1 Publisher Server Required Services
Component Function
CCMAdmin Provisions everything
CCMUser Provisions user settings
BAT Provisions everything initiated by the Bulk Administration tool
TAPS Provisions everything initiated by the Tool for Auto-Registered Phone Support
AXL Provisions everything initiated by the AVVID XML Layer service
AXIS-SOAP Enables and disables services through SOAP
CCM Inserts phones (auto-registration only)
LDAP Sync Updates end-user information
Written and compiled by Dr. Muchelule Yusuf Wanjala, [email protected] Page 67
License Audit
Updates license tables
Database Access Control
Database access is secured using the embedded Red Hat, iptables dynamic firewall and a database security password. The procedure to allow new subscribers to access the database on the publisher is as follows:
Step 1 Add the subscriber to the publisher database using UCM Administration.
Step 2 During installation of the subscriber, enter the same database security password that was entered during installation of the publisher.
After this configuration, the following process occurs to replicate the database from the publisher to the newly added subscriber:
1. The subscriber attempts to establish a connection to the publisher database using the database management channel.
2. The publisher verifies the subscriber's authenticity and adds the subscriber's IP address to its dynamic firewall (iptables).
3. The subscriber is allowed to access the publisher database.4. The database content is replicated from the publisher to the subscriber.
Database Access Control
UCM Licensing
Licensing is implemented in UCM beginning with Release 5.0. Administration of license management is done through UCM GUI administration, allowing accurate tracking of active device registrations compared to the license units that have been purchased. License enforcement occurs at the time of phone provisioning and UCM service activation. The publisher is the only licensing server. The licensing server is the logical component that keeps track of the licenses purchased and the licenses used. If the publisher fails, no new phones can register, and no configuration changes will be allowed. Existing phones will continue to operate during a publisher outage.UCM tracks the license compliance for devices, applications, and software as follows:
Device units licenses: The maximum number of provisioned devices in the UCM database will be tracked and enforced. Route points and CTI ports are not enforced.
Application licenses: Application licenses are required for every call-processing server running the CallManager service. Application licenses are tied to the MAC address of the network interface card (NIC) of the server.
Written and compiled by Dr. Muchelule Yusuf Wanjala, [email protected] Page 68
Software licenses: Software licenses are tied to the major version of the software. Software licenses are required for upgrade to UCM 6.
Summary
The following list summarizes the key points that were discussed in this chapter:
Cisco Unified Communications (UC) is a community of components designed to enable rapid, efficient communications. UC components include the following:
— Endpoints — Application integration — Call control — Infrastructure Cisco Unified Communications Manager (UCM) is the call-routing component of the Cisco
UC ecosystem, providing call setup and teardown services to both voice and video communications. UCM provides a centralized command and control topology to configuration management while leveraging the distributed nature of IP communications. UCM is a software solution that is supported on various hardware configurations. Media Convergence Servers (MCS) are Cisco-branded hardware solutions that run on HP or IBM server platforms. UCM Versions 5.0 and later use an appliance model where most administration is performed on a client pointing to the web services running on UCM. The hardened operating system is based on the Red Hat Linux variant. There is no access to the Linux kernel, and this lack of access provides a high level of security to the Cisco UC platform. UCM versions before 5.0 (4.x and earlier) used a Microsoft Windows-based operating system.UCM database Versions 5.0 and later leverages the IBM Informix Dynamic Server (IDS) to store all configuration data, including the user database. Versions earlier than 5.0 use a Microsoft SQL server database for most configuration information, while user information is stored in the DC Directory server. The DC Directory and the IBM IDS are LDAP-compliant databases. UCM licensing consists of the license server and the license manager. The license server component runs on the publisher server, whereas the license manager runs on every server.
References Jesse James Garrett’s The Elements of User Experience: User-Centered Design for the
Web and Beyond (2nd Edition) A Case Study of How Interface Sketches, Scenarios and Computer Prototypes
Structure Stakeholder Meetings by Johanson and Arvola M. Walker, L. Takayama and J.A. Landay, High-fidelity or low-fidelity, paper or
computer? Choosing attributes when testing web prototypes, Proceedings of the Human Factors and Ergonomics Society 46th Annual Meeting, September 29–October 4, 2002, Baltimore, USA, HFES, Santa Monica (2002), pp. 661–665.
Designing for Interaction: Creating Innovative Applications and Devices (2nd Edition) by Dan Saffer.
Information Architecture for the World Wide Web: Designing Large-Scale Web Sites by Peter Morville and Louis Rosenfeld.
The Elements of User Experience: User-Centered Design for the Web and Beyond (2nd Edition) by Jesse James Garrett
Written and compiled by Dr. Muchelule Yusuf Wanjala, [email protected] Page 69
Information Architecture for the World Wide Web: Designing Large-Scale Web Sites by Peter Morville and Louis Rosenfeld
Written and compiled by Dr. Muchelule Yusuf Wanjala, [email protected] Page 70
