Csun 2016 inclusive design workshop

PowerPoint Presentation

Hello!Accessible Design Thinking | SXSW

March 12, 2016

Hello, and welcome to our Accessible Design Workshop. We only have one short hour today but hope that we can pass on an overview that will help you to understand how to begin implementing an inclusive design thinking framework into a product development environment. Well be mixing in a couple of fun exercises to get you moving around and to build empathy as we go.

Alarm ClockEMPATHY ICEBREAKER

2015 IBM Corporation


Take 1 minute and design an alarm clock.

EMPATHY ICEBREAKER

IBM Corporation

Prompt: "Take 1 minute and design an alarm clock"(don't give the audience any constraints, or notion of users, experience design etc. After a minute, ask people to share their design. Choose two or three. Note for the group that most if not all of the drawings are similar, uncreative, lack innovation etc. More importantly, note for the group that in most cases, they've made an assumption that their user can hear. They've taken for granted that their user has all of the same abilities they themselves have. Crumple and throw away. Take responsibility as the facilitator for the fact that "the prompt I gave you was actually poorly formed. To get to a better outcome, now take 1 minute and design a better way for people to wake up in the morning-- some of your users are unable to hear." Invariably, the design sketches are more innovative, more human-centered and substantive. We can host a very short reflection with the group on that.

A Quick SummaryAGENDA


Over 100 Years of Accessibility InnovationIBM CORPORATION

IBM Corporation

Up until around the mid to late 80s, accessible technology was mostly analog but that made some of the innovation even more amazing.

1940s IBM gains notoriety for hiring military veterans with disabilities.

1970s and earlier:Remote Control Keyboard (1950s): Enabled partially paralyzed patients who were confined to bed to use a keyboard -- positioned, say, on their laps -- to produce a series of documents simultaneously on a nearby ???IBM Shoebox (1960s): A forerunner of today's voice recognition systems, Shoebox was an experimental machine that performed arithmetic-on-voice command.First Braille printer (1975)

1980s:Talking typewriter for people who are blind (1980)Talking display terminal (1981): "The mother of all screen reading technologiesPhone Communicator (1987): For people who are deaf and hearing impaired. Allowed a computer to be used as a teletype (TTY) and a touch-tone phone to be used as a keyboard, so information could be displayed on the computer screen.Screen Reader/DOS (1988): One of the first screen reading products in the world. The word "screen reader" is now used as the name of the category of software.

1990s:IBM VoiceType Dictation (1990): An automatic speech recognition system used to control the desktop and applications. It allowed people with mobility impairments to use voice input to their computers instead of the keyboard.SpeechViewer (1991): Program designed to help therapists meet the challenges of teaching speech. SpeechViewer is used to help people with varying disabilities, from those who are deaf or hard of hearing to those who are relearning to speak after a traumatic injury.

THINKable (1991): Software for DOS specifically developed by IBM to assist individuals with memory or attention deficits. Emphasis was on working with the participants in several areas: attention, discrimination, memory and sequencing. Therapy studies have demonstrated its usefulness to help treat various cognitive dysfunctions.

Screen Reader/2 (1992): Allowed users to have text and even the graphical user interface information on computer displays converted to synthesized speech audio or Braille output. It helped blind and visually impaired people to create and edit documents, manage files, analyze data and even access the Internet with greater ease than before. As a result of this product, 'screen reader' became the ubiquitous industry term for desktop solutions for the blind.

IBM ViaVoice (1998): Evolved from VoiceType Dictation, but was more effective in that it allowed users speak more naturally without providing a short break between each word or phrase. While ViaVoice provided hands-free access to the computer for mobility impaired users, it was widely used as a productivity tool by non-disabled users.

IBM Home Page Reader (1999): The first practical screen reader and voice browser product in the world.

1914Hired first employee with a disability1900s

1950-60s1950sRemote Control Keyboard

1960sShoebox

1970s1970sFirst Braille Printer

1980s

1980Talking Typewriter

1981Talking Display Terminal

1987Phone Communicator

1988Screen Reader / DOS

1990Voice Type Dictation

1991THINKable

SpeechViewer

1992Screen Reader/2

1994SpeechViewer II

1996SpeechViewer III

1997Home Page Reader

1998ViaVoice

1999Corporate mandate

WCAG 1.01990s

IBM CORPORATION

IBM Corporation

IBM has always been about innovations for people with disabilities since we hired our first employee with a disability back in 1914. But digital innovations really began around 1990 with the first screen reader for DOS.

Graphical user interfaces like MS Windows came along soon after and changed the game.

2000s

2003Easy Web Browsing

Web Accessibility Technology

2004CaptionMeNow

aDesigner

2008Spoken Web

WCAG 2.0

AbilityLab Sametime Language Translator & Conference Transcriber

Virtual Worlds Accessible User Interface

2009Accessible Workplace Connection

iAccessible2 and WAI-ARIA

AbilityLab Captioner & Editor

AbilityLab Accessibility Mentor

2010Connections 3.0

AbilityLab Voice Chat Transcriber

AbilityLab Compliance Checker

2014WAI-ARIA

IBM CORPORATION

IBM Corporation

Computer interfaces started to become more visual and skeuomorphic, using everyday metaphors to represent tasks, new difficulties arose for people with disabilities to effectively use computers. For example, a file folder image represented a group of files for a user but since it was no longer the word Files, a blind user would no longer be able to understand the metaphor. The invention of the mouse further complicated things for those who were unable to use it or use.

But IBM continued to blaze a trail for accessibility, creating new technologies that allowed people with disabilities to continue using technology as it evolved minute by minute. Soon, software development kits (SDKs) allowed a competent product team to create just about any application imaginable, but as you know from looking at most digital products that were released in the late 90s or even up until only a few years ago, and sometimes now, design was and is lacking.

Confidential :: IBM Corporation

So, IBM set out to change that and make sure that the design being done at IBM is the best in the world. And, unlike most other software giants, we started out and have continued to focus on integrating accessibility with design thinking. This starts at the top.


Ginny RomettyCEOToday, when I think about diversity, I actually think about the word inclusion. And I think this is a great time of inclusion.

IBMs CEO, Ginni Rometty, expresses her commitment to both design and accessibility. The continued evolution of IBM includes the continued integration of accessibility into our products.


Frances West was recently named Chief Accessibility Officer at IBM, another great step forward and show of commitment to people with disabilities. We are seeing many big players in the industry follow suit, creating new accessibility groups and hiring experts in accessibility design and development.


Frances West CHIEF ACCESSIBILITY OFFICERIts not about them; its about all of us.

Frances relentlessly makes sure that all groups in IBM collaborate to understand how to deliver accessible, inclusive products. In fact, currently, the busiest collaboration that we are having is with IBM Design.


Phil Gilberts group in IBM Design is dedicated to integrating accessibility into their framework, IBM Design Thinking. Since the inception of the IBM Design group, now some 300 strong, accessibility has been a part of the IBM Design Thinking framework and we are still learning from day-to-day how to work better together to innovate inclusive design.


Phil GilbertGM IBM DESIGNThe new IBM Design Language has accessibility integrated into all aspects of design.

Each new class of designers that comes into IBM Design spends a week in a hackathon focused on inclusive design innovation.

The new designers are also introduced to the IBM Design Thinking framework for digital product development. Here to give us some more information on IBM Design Thinking is Joni Saylor, master inventor, product designer, and executive assistant to Phil Gilbert.

(introduce Joni to talk about design thinking and the loop)

that for many people, design is branding, or visual design, graphic design, advertising, interior design, or fashion design.

All of these things are valid interpretations of design, but none of them really get at design as design as we are practicing it here at IBM.

Design is the intent behind an outcome.

Before we begin, lets make sure everyone understands what we mean when we say design:Design is the purpose, planning, and intent behind an action, fact, or material object.

What conditions can we create to bring great designs to life?

Human-centered outcomes require empathy for the people you serve.

But were not just interested in any outcome. We want outcomes that help people.This requires us to understand the perspectives of the people whose future we are helping to shape.

Were not interested in tech for the sake of tech, or even design for the sake of improving the trivial problems in our business.

Delivering outcomes at speed and scale requires us to work together.

To solve big problems quickly, we need a framework for working together across disciplines.

IBM Design Thinking

We created IBM Design Thinking to help us:Understand peoples needs.Form intent.Deliver outcomes at speed and scale.

Understand peoples needs.


Form intent.


Deliver outcomes at speed and scale.


The Loop

At the heart of IBM Design Thinking is a behavioral model for discovering users needs and envisioning a better future: a continuous loop of observing, reflecting and making.

ObserveReflectMake

A great outcome is one that fits your users real-world context. Its exactly what they need.But its easy to get caught in the fury of your own making, and miss critical details about their lived experience

Observing is about immersing yourself in your users world.

Meaningful outcomes come from an understanding of the real problems your users have.

Observing is about immersing yourself in your users world, to:Get to know your users:Build empathy with them. Figure out what makes them tick.Uncover needs:Figure out how your users measure success. Look for opportunities to improve their experience.Learn the landscape:Find wisdom and cautionary tales from competitors, collaborators, and case studies.Test ideas:Validate or invalidate your ideas by putting them in your users hands. Listen for feedback.

When you observe, make sure to set aside your assumptions and take it in without judgement.This is about discovering what your users world is objectively like not about seeking validation for your existing ideas and assumptions.

Reflecting is about converging on a point of view.

Good decisions begin with an understanding of your situation, your purpose, and how you can make a difference for your users.

Reflecting is about coming together and converging on a point of view, to:Find common ground:Get to know your team members as people, not just coworkers.Understand what you can and cant do as a team.Uncover insights:Synthesize what you all know to find hidden wisdom.Align your team:Get everyone on the same page.Plan ahead:Decide on your next move.Commit to an idea or take another loop.

When you reflect, reflect together to stay in sync. Reflecting individually is important, but reflecting as a team is fundamental to great collaboration.

Making is about giving form to ideas.

You cant know everything but you do know some things, so jump right in. The earlier you make, the faster youll learn.

Making is about getting your hands dirty, to:Communicate conceptsA picture is worth a thousand words. Dont tell people our ideas, show them!Explore ideasThink with your hands. Find out what works and what doesnt. Take advantage of happy accidents.Prototype possibilitiesValidate your ideas by simulate the experience you want to deliver.Drive outcomesThe only way to see an outcome is to make it happen.

Reflecting individually is important, but reflecting as a team is fundamental to great collaboration.

Low Vision GogglesEMPATHY EXERCISE


Break into groups of 4 or 5 Take a pair of the low-vision gogglesTake out your phoneAssistance by anyone in your group is fine & encouraged.EMPATHY EXERCISE

Break into groups of 4 or 5. Take a pair of low-vision goggles. Take out your phone. Assistance from your group is encouraged.

StepsWhile wearing a pair of the goggles, please take out your phone and do the following:1. Take a photograph of something in the room.2. Share that photograph on social media. Feel free to tag us on Twitter!#a11ydesign | @bo.campbell | @charupandhi | @Moekraft | @ibmaccess3. Email the photograph with a brief description to: [email protected]. Please pass the goggles to the next person.

EMPATHY MAP


Technology is a pervasive part of living today. Mobile devices, computers, digital media and IoT devices. You use technology in your home, the classroom, at work, the gymyou name it! Whatever you want to do or learn, theres an app for that!

Why is Accessibility Important?

So with this pervasive use of technology we want to make sure that there is not a digital divide that blocks some people from being able to enjoy these great new technologies. Not everyone can use a touch screen device. Not everyone can use their voice to control the navigation system in their car.

1. Diversitya diverse workforce works harder and is more creative.

2. Economic with a growing market of seniors, hundreds of billions of dollars are untapped.

3. Humanitarian we all want to work, be productive and earn our way.

People with disabilities, and many of the elderly represent a very large market potential. Just consider that the baby boomers in the United States who were born between 1946 and 1964, are approximately 35% of the U.S. adult population. They hold 70% of the disposable income. They are also retiring later due to the increase in the life expectancy.Statistics according to Bloomberg report at: http://www.bloomberg.com/infographics/2013-09-17/preparing-for-the-mature-consumer-boom.html

UN Convention on the Rights of Persons with DisabilitiesY SignatoriesB RatificationsO No action YetSignatoriesRatificationsNo Action Yet

IBM Corporation

So how many people in this room have heard of the United Nations Convention on the Rights of Persons with Disabilities, or UNCRPD?For people with disabilities, this will have a HUGE impact! It is the biggest driver for accessibility policy and regulations worldwide. Shown in blue on the map are the one hundred sixty two countries that have ratified the UNCRPD. Why is this so significant? By ratifying, they promise to develop laws and regulations in support of people with disabilities which includes:Promoting universal design in standards of developing goods, services, equipment and facilities.Protecting the rights of persons with disabilities as far as non-discrimination and full participation in all aspects of life including education, transportation, information & communications, the internet, and electronic and emergency services.

Citation: www.un.org/disabilities/countries.asp?navid=12&pid=166

Details of map: There are 162 ratifications and 160 signatories to the UNCRPD. The bulk of the map shows up in blue indicating the ratifying countries, and the numbers are growing.There are approximately 10 countries, shown in orange, that have taken no action yet - mostly in Africa. All of the countries in North and South America have taken action by signing or ratifying the UNCRPD. There are approximately 20 countries that have signed but not ratified the UNCRPD, including the United States. Those are indicated in yellow.

IBM Corporation

The United States has several accessibility regulations. The first of those is the Americans with Disabilities Act which recently celebrated its twenty fifth anniversary last year. The better part of those years focused on the accessibility of the physical world - buildings, parking spaces, sidewalks and crosswalks. But the focus of the ADA is changing in a very important way to include the digital world - access to technology and information.

Humanitarian ComplianceAt the foundation of accessible digital products lies decades of effort to build standards and tools.

IBM Corporation

Joni - note: first 25 years of ADA was more about physical, next 25 focus intensely on digital.

At the foundation of accessible digital products lies decades of effort to build standards. Federal regulations such as the Americans with Disabilities Act and Section 508 of the U.S. Rehabilitation Act drive the W3C consortiums standards and guidance for building accessible digital products. These standards continue to evolve as technology advances. IBM is very active in standards groups as well as government regulations, fighting for the rights of the disabled to have the same, inclusive experiences as everyone else.

Although we all agree that accessibility is a humanitarian effort, it is necessary to create a framework of regulations and standards to protect individuals who may be unable to use important products many take for granted. IBM has been a key player in the development of the Web Content Accessibility Guidelines (WCAG) and Accessible Rich Internet Applications (WAI-ARIA) standards. In fact, there isnt a web technology that IBM has not been involved in making it possible to create accessible Web applications that can work on different operating systems and browsers.

Humanitarian ComplianceAt the foundation of accessible digital products lies decades of effort to build standards and tools.

IBM Corporation

It is regulations such as the ADA and Section 508, which is a regulation for government procurement of accessible technology, that have been driving compliance. But more than that, it is a humanitarian effort - the right thing to do. Regulations also drive the need for accessibility standards - how do you know what needs to be done and whether or not you comply? Standards give you the foundation for making technology accessible. IBM is a key player in standards development worldwide. In fact, there isnt a web technology that IBM has not been involved in working to make it accessible, like the Web Content Accessibility Guidelines, or WCAG and Accessible Rich Internet Applications (WAI-ARIA) standards.

What Makes a Product Usable and Accessible?

IBM Corporation

Is it really the regulations that are making technology more accessible? Is it the standards we apply?

A product is usable if the people for whom it is intended can use it effectively, efficiently, and with satisfaction.UsabilityISO 9241-11

The usability of a product, service, environment or facility by people with the widest range of capabilities.AccessibilityISO 9241-11Accessible Design Thinking

IBM Corporation

Usability is something designers think about every day, but they dont always think about the edge cases, the atypical users that may have difficulty with the interactions defined for typical users. Then you have accessibility which focuses on the persons with disabilities and making technology work for them using defined standards defined. However, standards dont always lead to the best overall user experience. Accessible Design Thinking integrates accessibility into product design from the start. Usability, user experience and accessibility are inseparable and often go hand-in-hand. Better accessibility often improves usability and experience for everyone. Think about the curb cutThose were originally designed for wheelchair use, but are useful for anything with wheels: strollers, bicycles, rolling luggage.

Clear a path for everyoneCopyright 2002 Michael F. Giangreco. Illustration by Kevin Ruelle. Peytral Publications. INC.

IBM Corporation

When we consider the experience for everyone, we can reach inclusive solutions that are best for everyone.

In this cartoon, there is a group of people waiting to enter a building through fresh snow. A man is shoveling the steps while an access ramp remains covered in snow. The man shoveling the steps informs a man in a wheelchair that he will shovel the ramp after he shovels the steps since more people are waiting for the steps. The man in the wheelchair smartly replies that if the ramp was shoveled first, everyone could use it.

IBM Corporation

A great example of usability for everyone is the interior ramp in the Ed Robert Campus for disabilities at Berkeley. Everyone can use the ramp to reach the second floor and its a beautiful visual feature.

Disabilities we design for

IBM Corporation

We design for many different disabilities.

PhysicalEpilepsy MobilityFine Motor Movements Speech Impairment

IBM Corporation

Physical disabilities cover a wide range from epileptic seizures caused by various stimuli to mobility impairments to speech disabilities, each with their own specific user needs to meet.

HearingDeafHard of Hearing

IBM Corporation

There are hearing impairments from someone who is hard of hearing or losing hearing due to age to someone who might be deaf with minimal or no perception of sound.

VisionColor BlindnessVisual Impairment Blind

IBM Corporation

Visual disabilities can be as minor as the reduced color perception due to aging or cataracts, to color blindness, to someone who has a visual impairment which may or not be able to be fully corrected by glasses, to someone who is blind with little to no perception of light or color.

CognitiveADD/ADHDAutismDyslexia/DyscalculiaLearning Language

IBM Corporation

Cognitive disabilities also covers a wide spectrum: ADD, ADHD, to someone with language and learning disabilities, or dyslexia.This is the largest underserved community when it comes to making technology work for them. The needs of people with cognitive impairments vary widely and may conflict from one type of cognitive impairment to another. This is why the accessibility field is focusing on a future of adaptive user interfaces that can adapt to a specific users needs. If youre interested in learning more about cognitive disabilities, I suggest you go to the session this coming Wednesday on Closing the Knowledge Gap with Cognitive Design.

Add to the bullets as follows:Visual impairments a wide range from mild vision impairments like the yellowing of the cornea that occurs in the aging process, to someone who who is legally blind. Cognitive impairments

Empathy MapACTIVITY


Mark how much time on the slides

What is an Empathy Map?


Heres the basic grid.

In the center of your map, specify the user youll be focusing on. We recommend you choose the user that will be most effected by your upcoming release.

Sketch your user in the center and give them a name and a bit of description about who they are or what they do: What is their life situation? How long have theyve been on the job? Whats their educational background?

Everyone in the group should SILENTLY post their own ideas about what your user says, does, thinks, and feels.

Allow yourselves the luxury of getting you OWN individual ideas out of your head, onto sticky notes, and posted to the wall BEFORE talking about them with your teammates.

What do they say or need to say to others? How do they likely express themselves?What do they do to get their job done?How does this person feel about their job?What do they think about the situation? What is their worldview?QuotesExpectations & ReactionsActionsValues

Heres some more detail to help you with each quadrant.

Notice that the LEFT side of the Empathy Map (Says & Does) are things that we can implicitly OBSERVE. We could follow our user around with a tape recorder and know what she says, or we could follow her around with a video camera and know what she actually does.

But the RIGHT side (Thinks & Feels) are things that we might need to INFER. These ideas might be gleaned directly from user research maybe our user mentioned how shes thinking and feeling during an interview or a prototype walkthrough. But we might also have to make an educated guess here. Thats okay, as long as we go back later and validate our assumptions.

Please break into groups of 4 or 5 people. We will give you an empathy map template for you to place your sticky notes on. EMPATHY MAP


Ground RulesWrite before you talk.Write or sketch lots of your ideas on sticky notes before talking about them. During discussions, capture the main points on sticky notes and post to the wall. There are no bad ideas.Start bigdiverge to get everyones ideas out there. Remix to discuss, cluster, and seek patterns. Then converge to determine the strongest ideas. Stay focused on your users.Tell stories about users to keep them at the center of your attention. Everyone participates.Everyone has a Sharpie, everyone has a pad of sticky notes. Stay engaged.Avoid side conversations. Use a parking lot to capture issues that are off-topic. EMPATHY MAP


Think back to the goggle exercise and remember what you thought, said, felt, and did. Put these down on your empathy maps. EMPATHY MAP


If you feel adventurous pick another disability and write down your assumptions about that experience for a user.

Ok, now lets go!1. One of the members of your group should draw a picture of the user that you will build an empathy map around.2. Pick a disability from the following: blind, low vision, deaf, physical disability (unable to use a mouse).3. In the context of our scenario for this user, please start considering things this person says, does, thinks, and feels. Write each of your thoughts on a sticky and place it in the appropriate quadrant. * Duplicates on the map are fine. Dont let what the others write affect your thoughts, just spill them out as they come to you.

EMPATHY MAP


Designer roles and responsibilities

IBM Corporation


Research helps us understand and empathize with our users.


Design Research

Researchers must understand the nuances of including people with disabilities in the design thinking exercises.

To do accessible design, research must include people with disabilities. Researchers will be responsible for finding people with disabilities who can inform the design process along the way by becoming sponsor users. The researcher can also identify accessibility experts to collaborate with through each step of the design flow. Discussing an interface with a person with disabilities, or even an expert, is always enlightening. Always.


Design Research

- Finding resources- Sponsor users- Interviews - Testing

There are many intricacies to interviewing and running user tests on people with disabilities and the researcher will need to understand them. For instance, accommodations need to be made for assistive technology and assistive equipment that will be used, guide dogs may need water and a service area, and deaf users will need a sign language translator. Does your workstation allow wheelchair access? Can a user run JAWS or Voiceover the same way they do at home? Perhaps going to the user is best, but that brings forth another set of considerations. Remote testing may also be perfect, if done well.

Information Architecture

Information Architecture

The information architect is responsible for a structure and taxonomy that gives the best experience to everyone.


The information architect is responsible for a structure and taxonomy that gives the best experience to everyone. The information architect will work with the researcher and the rest of the team to understand the best experience for the target user demographic. While certain users may be suited for unique architectures, there are common heuristics for creating an easy to use interface for everyone.

Confidential :: IBM Corporation Information Architecture

- Architecture - Taxonomy - Regions - Tab Flow

An application should be easy to navigate forward and back and limit cognitive load wherever possible. Allow a user to go back to the last thing that was done. The flow should be transparent and intuitive, like being in an IKEA. You dont really know how you got into kitchen area, but you did, and it was effortless, and somehow theres a shortcut to the Swedish meatballs.

Taxonomy should be clear and consistent. A user should not have to remember or relearn things in order have a good experience.

The architect should understand WAI-ARIA regions to establish an understandable layout for assistive technology and consider the keyboard flow through the application. Knowing how assistive technology works can really inform the architecture design process a great deal. We may know that a blind user can jump to a region quickly and a mouse user can see it and click on it, but how does a keyboard user get there? You need to know.

Visual Design

Confidential :: IBM Corporation Visual Design

Visual designers have a huge responsibility to make interfaces understandable and enjoyable by people with disabilities.

Visual designers have a huge responsibility to make interfaces understandable and enjoyable by people with disabilities. Much of the work focuses on blind and low vision users but many aspects of visual design affect various cognitive disabilities as well. The visual designer should keep in mind the experience that they are trying to create and expand that experience to everyone who may consume the content in different ways.

We do not believe that an interface has to suffer to be accessible. I can repeat that again and again because I still have not seen a specific example where it has. Mainly, this issue comes up when interfaces are being retrofit for accessibility and the team doesnt want to refactor everything. Instead, they would rather create a secondary interface for accessibility. Not illegal. Not considered inaccessible. But not recommended. That same experience for everyone is our goal.

Confidential :: IBM Corporation Visual Design

- Color Contrast Ratio- Interaction states- Typography- Screen Magnifiers- Images

Visual designers will be tasked with creating a color palette that is not only beautiful, but accessible. A color palette that complies with accessibility guidelines will lead to an interface that is easier for everyone to read and follow.

Color contrast rules apply to text, links and icons. Text needs to have a 4.5:1 color contrast against its background. Links also need to have a color contrast of 3:1 compared to other text around it so they are discoverable. Gradients can pose problems when test is laid over the top of them. We recommend that icons have a 3:1 ratio, also.

Visual designers may define the states of interactive elements such as when elements are hovered, focused and selected. These states should all be distinct, so the user can tell the difference between selected state and what has current keyboard focus. This is true with all interactive elements like buttons and select boxes for example.

Visual designers should choose typography that is easy to read and has the right amount of leading and kerning so that it is easy to read. Serif fonts dont magnify well and are more difficult to read for some users. Words in all capital letters are more difficult to read, also. Heading sizes and colors should be designed hierarchically and used appropriately.

Does everyone know what a screen magnifier is? A screen magnifier increases the size of everything on a screen so that users with low vision are able to use applications more easily. Visual designers should understand what the screen will look like when magnified up to 50% larger. This has implications with white space and blocks of color, and making sure labels stay near to their counterparts. Items that may have appeared properly grouped, or clustered, may appear scattered when magnified.

Additionally, visual designers need to conscious of the meaning of images. If an image has meaning on an interface, all users should be able to see it and understand it. And when we say all users should be able to see an image, we do also mean blind users. If an image is meaningful, the meaning should be conveyed to assistive technology for screen readers in descriptions, captions and alt text. Images will also need to scale gracefully for screen magnification and that may mean using SVG or, at the least, making sure that the images look fine when larger. SVG2 is coming and that group is working on accessibility code within the SVG file itself that will send information to the accessibility API.

Clear scalable icons are best. Avoid subtle or color-only differences between icons. Icons with fine line may not be visible to someone with low vision. May need high contrast images/icons or text alternatives that can be readable in high contrast mode.


UX


User Experience

User experience designers likely have the broadest range of responsibilities when it comes to inclusive design.

User experience designers likely have the broadest range of responsibilities when it comes to inclusive design. In charge of interaction and usability, the UX-er needs to understand how assistive technologies work to relay interface elements to the people who use them.


User Experience

- Communicate structure- Choose appropriate interactions- Establish the tab order- Define and validate ARIA regions- Create a comparable experience

Descriptions of the elements and keyboard access to each must be established and then delivered to the developers in an understandable way. WAI-ARIA regions must also be defined and documented appropriately. If the Information Architect established the regions earlier in the flow, that information needs to continue with the UX designer. WAI-ARIA regions automatically give a screen reader user a table of contents so they can jump to the appropriate information.

Tab order should be established within each region, also. The tab order information has to be passed to the developer so that he understands how to order the elements.

The user experience designer often works closely with accessibility experts to validate the proposed interface with sketches and prototypes. The goal is to create a similar, if not equal, experience for everyone. They can also work closely with the front-end developer (FED) to create working prototypes to test with end users to create the best, most accessible solution. The goal is to create a similar, if not equal, experience for everyone.


Front end development

Front End Development

Front end developers must build the intended interface, usable by everyone.

Front end developers must build the interface as it was designed and also to be usable by everyone. Since the front end developer has been working closely with the design team during the whole process, the design is informed about what can and cant be done. Specs were created by the UX Designer for the regions and tab orders. Color codes were delivered. The dev is happy and gets to orchestrate a gloriously elegant interface.

Front End Development

-Assistive Technologies-Keyboard Access-WAI-ARIA-Meaningful Sequence

This means understanding the proper code to enable the navigation and how to provide the programmatic information for the technology and operating system platform, as well as knowledge of how this programmatic information is used and delivered to the user by various assistive technologies. FEDs must work closely with other designers through the whole process to inform and guide them toward using accessible elements that will work with the accessibility APIs. Content must be delivered in the right order, in a clear manner. FEDs must insure that the intent of the design is carried through and this requires intense collaboration and clear design instruction in order to get to a successful release.

Front end developers must build an interface that everyone can use, and this means understanding the proper code that enables the navigation and understanding of the interface by various assistive technologies. Often we see that teams who dont understand accessible design practices end up with an unhappy front end developer. This person is often tasked with doing all the accessibility, including sometimes changing design elements to those they are familiar with or are more accessible. Obviously, this causes friction between the designers and the developers, which, in turn, leads to an even more unhappy developer on your team.

Front end developers must work closely with other designers through the whole process to inform and guide them toward using accessible elements that will work with the accessibility APIs. Content must be delivered in the right order, in a clear manner. FEDs must insure that the intent of the design is carried through and this requires intense collaboration and clear design instruction in order to get to a successful release.


Matt King, accessibility advocate and expert at Facebook, expects the same experience that everyone else has. This quote may be a slight exaggeration. You may need more than 1%. Also, many responsible designers are thinking about accessibility throughout the process and do not run into issues. But the point is that WAI-ARIA allows us to give the same, or a very similar, experience to users who are blind or have low vision. Like Matt, people with disabilities desire to be productive and capable of competing, collaborating, and participating with their peers in the workplace, as well as in every day life.

Confidential :: IBM Corporation Matt KingPARALYMPIC CYCLIST99% of all flashy, modern page navigation designs can be made fabulously accessible with about 1% of WAI-ARIA.

Matt King, accessibility advocate and expert at Facebook, expects the same experience that everyone else has. This quote may be a slight exaggeration. You may need more than 1%. Also, many responsible designers are thinking about accessibility throughout the process and do not run into issues. But the point is that WAI-ARIA allows us to give the same, or a very similar, experience to users who are blind or have low vision. Like Matt, people with disabilities desire to be productive and capable of competing, collaborating, and participating with their peers in the workplace, as well as in every day life.

Q A

With the adoption of design thinking and agile frameworks in product development, especially over the last decade, we have learned that getting to market on time with a wonderful, usable product depends on a highly collaborative team that wont create more work, or debt, along the way. Eliminating debt comes down to addressing design and accessibility needs iteratively by the entire design team. Commitment to accessible design must be made by everyone including management so that the price of accessibility is understood and accepted.

A designer may play many design roles on a product team and each role has certain responsibilities to address. We dont always get a dream team of designers with one person, or even many people, to play each role. Its important for the entire team to understand the urgency of addressing the accessibility of the product at the right times. This frees each team member to do what they do best and eliminates expensive debt at the end of the design sprints. Accessible design thinking is achievable when an entire team is committed to the goal of releasing a fully accessible product and each person understands what that means for each role.

IBM Accessibility at SXSWAge and Ability in the Cognitive EraAn Accessibility Experience in the IBM Cognitive Studio 301 San Jacinto Blvd between 3rd and 4thMonday, March 14, from 9am-6pm

Aging Populations & the Internet of Caring ThingsJW Marriott Salon FGHTuesday, March 15, 11:00 a.m.-12:00 p.m.

IBM Accessibility and Design events at SXSWQ&A

Accessible Design Thinking | SXSW

March 12, 2016Bo CampbellAccessibility Design LeadIBM Accessibility

Mary Jo MuellerAccessibility Standards Program ManagerIBM Accessibility

Charu PandhiAccessibility Automation LeadIBM AccessibilityJoni SaylorExecutive Assistant to Phil Gilbert, GMIBM Design

ME MillerUser Experience DesignerIBM Design

Danielle KeeneSoftware Designer IBM Design

Date post:	11-Apr-2017
Category:	Design
Upload:	charu-pandhi
View:	66 times
Download:	0 times