Design tools Archives - Page 2 of 4 -

Google spells out accessible, inclusive, usable

It would be good if all designers took their lead from the likes of Apple and Google: inclusion, accessibility and usability are about the design process. Apart from clearly explaining how these terms are linked and can be used together, Google spells out accessible, inclusive and usable in a half hour video

Infographic showing three groups of disability: permanent, temporary and situational. From Microsoft. — Microsoft infographic: Permanent, temporary, situational disability

The video also has some tips and tools for designers and shows how three different users have the same need: a man with a mobility disability (permanent), a boy with a broken arm (temporary) and a woman with an armful of shopping (situational). Microsoft designed an infographic to illustrate the point.

Individual situations might be different but they all have the same need for accessibility. And people have the same goals they want to achieve regardless of their situation.

This instructional presentation is aimed at an audience interested in designing apps, particularly the second half of the video. However, the messages in the first half can be applied to other design disciplines.

Designing for Diversity and Inclusion

Inclusive design is often misunderstood as designing specifically for people with disability. Similarly, the term “diversity and inclusion” is associated with people from diverse backgrounds. Designing for diversity means both – designing for as many people as possible across age, ability and background

Dan Jenkins makes an important point in his article – the number of excluded people is often underestimated and capability is frequently thought of in terms of “can do” and “can’t do”. However, this black and white approach doesn’t cater for those who “can do a bit” or “could do more” if the design was tweaked. But then there is the role of designers themselves.

The Role of Designers

How do we design for the full-spectrum of user experience, if the designers themselves do not present a variety of experience and perspectives? Inherent in their role, user experience designers, or UX designers, are required to design the overall experience of a person using the product.

Fabricio Teixeira and Caio Braga believe that diversity generates diversity. Touching on topics such as diversity in the design industry, inclusion, equality and equity and gender, this series of five articles explores design from within the industry to explore the impact that designers have on people’s lives.

There are five articles in the series, Design is diversity: it’s time to talk about our role as designers:

The benefits of a diverse team

Is diversity a problem in the design industry?

Celebrating our differences and showing you (truly) care about inclusion

The difference between Equality and Equity in design

Ladies That UX on women in design and diversity.

How “the user” frames what designers see

Universality in design gets a mention in the Handbook of Anthropology in Business. Megan Neese’s chapter raises a good point about terminology in the business world. She says, “Marketing teams talk about consumers. Research teams talk about respondents. Engineering teams talk about targets. Designers talk about users. These terms tend to be used simultaneously and somewhat interchangeably in corporations…”. So finding common ground is not always easy when developing a product.

Neese’s chapter discusses the many layers needed in any design, such as, culture, function, regulations, industry initiatives, and social trends. It is thoughtfully written and easy to read.

How “the User” Frames What Designers See: What Cultural Analysis Does to Change the Frame” is in the Handbook of Anthropology in Business, 2016.

Diversity, Design and Usability

The term ‘Diversity’ is often thought of as a cultural thing just as ‘Accessibility’ is thought of as disability thing. The concept of universal design doesn’t separate these and doesn’t separate them from what’s considered mainstream. That’s the meaning of inclusion and inclusiveness. But let’s not get hung up on the words.

Diversity covers gender, ethnicity, age, size and shape, income, education, language, culture and customs. There is no Mr or Ms Average – it’s a mythical concept. Dan Jenkins writes about diversity as inclusion for the Design Council and makes this observation;

“Often, it’s a perceived efficiency-thoroughness trade off – a variant of the 80:20 rule, that crudely suggests that you can get it right for 80% of the people for 20% of the effort, while it takes a further 80% of the effort to get it right for the remaining 20%. However, much of the time it is simply that the designers haven’t thought enough about the diversity of the people who wish to interact with the product that they are designing, often because it’s not in the culture of the company.”

Similarly to Kat Holmes, Jenkins says to think of capability on three levels:

1. Permanent (e.g. having one arm)
2. Temporary (e.g. an arm injury)
3. Situational (e.g. holding a small child)

“The market for people with one arm is relatively small, however, a product that can be used by people carrying a small child (or using one of their arms for another task) is much larger. As such, designing for the smaller market of permanent exclusions is often a very effective way of developing products that make the lives of a much wider group of customers more flexible, efficient and enjoyable.”

Jenkins reminds us that all our capabilities will be challenged eventually, either permanently or temporarily. That’s why designers need to think of the one arm analogy in their design thinking. Excellent easy read article from the Design Council. Infographics are taken from the article.

Much of Jenkins’ content is similar to Kat Holmes material and the Microsoft Inclusive Design Toolkit. There are three articles on this website that feature Kat Holmes:

Typewriters: A device for vision loss.

What does inclusion actually mean?

What is the meaning of inclusion in inclusive technology?

Also Kat Holmes book, Mismatch: How Inclusion Shapes Design,

Colour blindness not just genetic

Colour blindness is an eye condition that changes the way people see colours. It doesn’t seem like a big thing to people who have normal colour vision. But when it comes to reading things like maps, it matters a lot. Graphs, maps, diagrams and other graphic information types often rely on colour to differentiate between elements and features.

With genetic colour blindness, men are about 16 times more likely to be affected than women. Injury or disease can also affect the ability to see certain colours.

A pile of brightly coloured squares sit untidily on top of each other. The colours are very bright.

Apart from genetic reasons, some health conditions increase the risk of developing colour blindness later in life. Macular degeneration, glaucoma, diabetes, dementia, and Parkinson’s disease can all affect colour vision. Because it happens later in life it often gets unnoticed and undiagnosed. Some medications might affect colour vision too. For more, see My Vision guides.

You are at greater risk of colour blindness if you are a white male and have family members with colour blindness.

Red-green colour vision deficiency occurs in 1 in 12 males with Northern European ancestry. For women it’s 1 in 200.

The Axess Lab website has some great tips for making graphics more inclusive. For example, putting text into pie charts, and labelling goods with colours not just showing them. Colour contrast matters too as you can see in the picture below.

Pie chart with different colours and their respective labels. — A pie chart with labels

A group of people standing holding a pink banner with the words You are Not Alone, but you can't see the word NOT because it is in pale red and blends into the background colour — A serious colour contrast fail in real life

Colours that are accessible

Colour diagram showing the three different types of colour vision deficiency

Colour is an important part of designers’ creative work. When it comes to colour accessibility the creative path takes a few twists and turns. That’s because people who say they are ‘colour blind’ are not all the same. Most can see some colours, but not all of them. So how can designers choose colours that are accessible, especially in digital communications?

Adobe has a blog page that explains the importance of choosing colours. Four images show the three different versions of colour vision deficiency, which are:

Protanopia: Referred to as “red weakness,” this variation of red/green color blindness results in individuals being unable to perceive red light.
Deuteranopia: Also known as “green weakness,” this type of red/green color blindness renders people unable to perceive any green light.
Tritanopia: People who suffer from blue/yellow color blindness have difficulty distinguishing between blue and yellow colors. This form of color blindness is far less common than its red and green counterparts.

Graphic designers will appreciate the colour wheels and ways to avoid a conflict of colours. Examples of good colour choices show that designs can still be attractive as well as functional. You can try out the online Material Design accessible colour tool that provides information on colour contrasts for visual material.

Readability and colour choice

Colour choice is also a factor in readability. The video below shows how easily we can be deceived by our eyes. It shows how two different shades of grey are actually the same. That’s why you can’t rely on judging contrast by eye.

Danish Design Ladder and universal design

Discussing universal design and inclusive practice helps individuals to understand the concept of inclusion. But it’s organisational culture where the change is needed. Everyone has to have the same universal design mindset. The Danish Design Ladder is one way to apply universal design to organisations.

The 6 steps of the Danish Design Ladder — Extended Danish Design Ladder

Design isn’t just for products and websites. Design thinking is also good for designing business strategies and operations. It shapes the brand and business concept. In short, it is good for business, as Matt Davies says.

The Danish Design Ladder is useful for understanding the power of design within organisations. Universal design thinking comes onto the ladder at Rung 3 – Design as a Process.

Rungs of the Danish Design Ladder

1 Non-Design: Design is invisible, product development is done by untrained designers. The user or customer has no part in decisions.

2 Design as Styling: After the product is developed it is given to a designer to make it look nice.

3 Design as Process: This is where design is not the result but a way of thinking. Customers are now the focus of the design process.

4 Design as Strategy: Design is embedded in the leadership team to shape the overall business.

5 Design as Systemic Change: Design is a way of changing systems to solve complex social problems.

6 Design as Culture: Design is a common mindset, as a way to innovate, a way to listen and and a way to lead.

An article by Bryan Hoedemaeckers, Are you getting the most out of Design explains more on this. The Ladder is a good way of conceptualising how to weave universal design thinking into the fabric of organisations.

The Brisbane Olympic Games are less than 10 years away. There is talk of wanting them to be the most accessible games ever. The top three rungs of the Ladder, universal design as strategy, change and culture, will be essential for this outcome. The Legacy Strategy moves to the 4th step of the ladder, but the strategy is about places and things, not culture change.

Australian researchers used the Danish Design Ladder in an action research project. The title of their paper is, Climbing the Design Ladder; Step by step. The researchers discuss other intermediate “steps” for bringing about culture change. The article is open access.

Advances in Design for Inclusion

This book covers several topics in design: universal design; design for all; digital inclusion; universal usability; and accessibility of technologies regardless of users’ age, financial situation, education, geographic location, culture and language.

It has a special focus on accessibility for people with auditory, cognitive, neurological, and visual impairments, ageing populations, and mobility for those with special physical needs.

The title of the book is Advances in Design for Inclusion. It is an academic text, published by Springer, from the proceedings of the International Conference on Design for Inclusion held in Washington DC in July 2019.

The chapters are diverse and specific. For example, yacht design; automated vending machines; prisons; parking meters; garden objects; housing; city maps, built environment and much more. Chapters can be purchased separately if you don’t have institutional access.

Easy English: Same as Easy Read?

Australian Easy English is for people with low or few literacy skills. It is not the same as Easy Read.

Girl sits with a book flicking pages and looking a little unhappy. She needs Books for Everyone.

According to Cathy Basterfield, Easy English is not the same as Easy Read. Her comparison of the two highlights some important differences.

Australian Easy English assumes almost no literacy skill. Material is presented with just three or four short sentences of 5 words on a page. Each sentence is accompanied by a relevant picture or graphic. This means there is a lot of white space which prevents visual confusion caused by lots of words. The aim of Easy English is to tell the reader what to do. It is not about conveying information.

Australian Easy Read on the other hand has an average of 10 words in a sentence. The document includes information which can make if difficult to find the “what to do” instruction. This format assumes a reading level of Grade 4. Unlike Easy English, images are used without headings and there is little white space.

44% of Australian adults do not have the literacy skills for everyday reading tasks such as reading product labels.

Rows of snack food line the supermarket shelves.

Long documents often have an Easy Read version which makes it easier for competent readers as well. After all, why read a long and complex report when you can get the same information with less words?

Making a document easy to read and understand is not itself an easy process. The development of Easy English and Easy Read is a mix of language, sentence structure, images and user testing. It’s a design challenge to analyse each element to see what works best.

Comparing the two

The examples below show some of the differences between Easy English and Easy Read. Cathy Basterfield has a succinct three page comparison of the two styles with clear examples.

page from Access Easy English on COVID. — Example of Easy English

A screenshot of the homepage of the website. — Example of Easy Read

More resources

Cathy Basterfield has developed several free Easy English versions of important information. She has a blog page that explains Easy English and Easy Read if you want to know more.

Editor’s note: Even as a person with good literacy skills, I find Easy English a quick and easy way to understand the key points. I think much of the confusion in the community is due to politicians and others using lots of words when fewer would do, and speaking quickly. When journalists ask questions of politicians they add to the confusion because the politician says the same thing again only using different words.

Universal design as ‘symbiosis’

Symbiosis is not a word usually associated with universal design, but it’s another way of looking at it. Symbiosis means interaction between two different organisms living in close physical association to the advantage of both.

An article from Malaysia uses symbiosis in the context of designs for the disabled body advantage the non-disabled body – it’s a win-win.

The article covers the usual introductory material about universal design and then moves into a discussion on indoor spaces. The research questions focus on the application of universal design to achieve integration.

The paper recounts three case studies to show how people with disability can get the same sense of belonging as non-disabled people. The use of materials, space function and space planning each have a role to play.

Case studies

Bill and Melinda Gates Discovery Center showing people looking at exhibits.

Bill and Melinda Gates Discovery Centre

The first case study is the Bill and Melinda Gates Discovery Center in Seattle. The centre fosters a collaborative working environment to educate people about global issues including disability.

The second case study is the Cooper Hewitt Smithsonian Design Museum. This building is a studio of visual and accessible sensory experiences.

The third case study is Hazelwood School in the UK which transformed a school for children with disability into one for all children.

Hazelwood School

All three projects posed challenges to designers to find ways in which everyone could feel welcome and use the spaces. The article provides more detail on each case study and useful references.

The authors conclude that universal design played an important function in aiding architects to design for people with and without disability.

The purpose of universal design is to create symbiotic relationships between people

The title of the article is, Universal design (UD) in indoor space: Symbiosis between disabled bodies and abled bodies. The abstract uses some confusing language and terms, but the article follows universal design thinking. The links to the case studies are also worth a look.

Design toolkit for social inclusion

Inclusive Signs Toolkit front cover. — Front cover of the Toolkit.

Social inclusion is a complex topic mainly because it’s not something you can make and touch. It requires a new way of approaching design that avoids bias, stereotypes, and established methods. Emilio Rossi has developed a card-based toolkit to generate creative inclusive design concepts. It’s titled Inclusive Signs and is based on a visual card system. One set has a different picture or symbol, and the second set has text labels. The cards are used to stimulate creative thinking in brainstorming sessions.

A short video on the welcome page of the online version on the toolkit provides a great overview of the basic concepts.

The first part of the handbook explains the background and how to use the the toolkit. The second part has 180 cards and a worksheet. The toolkit is useful for both design practitioners and educators. It would also be good in co-design processes. The goal is to stimulate deep reflections on social inclusion in all design processes.

Overview

Although disability is one of the topics, design for social inclusion goes further. It tackles issues of social wellbeing, rights, human values, and inequalities. Designers often struggle to create inclusive products and services beyond access codes. Rossi says moving beyond access codes is crucial for enabling solutions.

The key is gaining insights in the design conception stage. “Otherwise designers will continue to use biased concepts in their creative practice. That is, designing what is known, rather than what may work.”

You can download the 120 MB PDF document. The 60 descriptive cards have current keywords relating to social inclusion. The aim of the 120 visual cards is to stimulate reflection, emotion, and lateral thinking. The images provide both negative and positive representations.

Designers should find the content of the toolkit interesting even if they don’t use it in practice or teaching.

The online version of the Toolkit is also available in several languages. Below are three examples of the text cards.

Readability and colour choices

Colour contrasts can be deceiving because we are subject to optical illusions. The video below shows how two different shades of grey are actually the same. That’s why you can’t rely on judging contrast by eye. Fortunately there are colour checkers to help with colour choices especially for websites. And why do you need colour contrast checkers? Because more than 8% of the population has colour vision deficiency (colour blindness).

Colour choice is one factor in readability. Others include using sentence case. Using upper case or capitals does not convey important messages more urgently. The image shows that using upper case to indicate a low bridge did not stop a truck driver from driving under it. Upper case is harder to read because the shape of the words are unfamiliar.

The most accessible websites are those that have an Easy Read option. A good example is the My Allied Health Space. At the top of the home page is the symbol for Easy Read and this is where you click to turn it on.

Screenshot of Allied Health Space standard format. — My Allied Health Space home page with option for Easy Read at the top of the page

Screenshot my allied health space in easy read format. — My Allied Health Space with Easy Read option turned on

Thanks to Dr Em Bould, Senior Research Fellow at Monash University for the inspiration for this post. Dr Bould has great advice on this topic based on research.

Understanding typefaces for accessibility

Example of typefaces images. — Image courtesy Medium

More people have difficulty reading than most people think. Low vision, dyslexia, low literacy, and learning disabilities are some of the reasons. Previous posts have covered the topic of plain language and Easy Read. But choosing the right typeface is also important for communicating successfully. Without understanding typefaces, things like colour contrast will make little difference.

Gareth Ford Williams explains key elements in his article. He says claims of some typefaces being more accessible than others are not backed up by evidence.

lower case 'i' and upper case 'L' and '1' look the same. — Gill Sans upper case ‘i’, lower case ‘L’ and ‘1’

Different typefaces provide different styles in how letters are formed. For example, Gill Sans upper case ‘i’ and lower case ”l’ and ‘1’ look the same. However, in Verdana they are distinct from each other.

Mirroring is something than young children do. For example, muddling ‘b’ and ‘d’ and ‘p’ and ‘q’. However, the letter flipping effect can be lifelong.

Spacing or ‘visual crowding’ is another consideration. Some typefaces have the same space between letters regardless of letter width. Helvetica is one example. Calibri has different spacing between letters. A wide letter like m has more space around it than an i or a t. In some cases the letters can look joined up such as ‘ol’ or ‘vv’. Tight letter spacing is not great for people with good vision either.

The article has several good examples to illustrate points made. The title is, A Gu ide to Understanding What Makes a Typeface Accessibl e. Williams makes the point that there is no one right typeface. As always, it depends on your audience. However, this article provides great insights into yet another aspect of communicating accessibly. The article is technical in some places.

Thanks to Dawn Campbell on Linked In for alerting me to this article.

Category: Design tools

Google spells out accessible, inclusive, usable

Like this: