MA Studio: Readability
For our third project in MA Studio: Visual Communication Fundamentals, we were asked to choose a design principle and make a video no more than 3 or 4 minutes for it.
Using video, you will explain a design principle or method. You are encouraged to consider whether the idea needs a literal explanation or if you can communicate the idea purely through metaphor or analogy. You should consider the visual style, use of type, color, image, audio, and pacing as you create this project.
Phase 1: Choose a Design Principle and Write Script Outline
I chose Readability as the topic for my assignment. Readability is an essential part of user experience design but its role is often neglected by new designers. The draft script includes 8 parts:
- what is readability
- why is it important
- the difference between readability and legibility
- the factors of readability
- how to improve readability
- readability formulas
- keep your readers in mind
- concluding remarks
Script #1
Readability is the degree to which prose can be understood. It bases on the complexity of words and sentences.
Why is it important to designers? A common belief is that complex information requires complex presentation. But the fact is the more complex the information is, the simpler the presentation should be, so that the focus is on the information rather than the way it is presented.
Readability is different from legibility. Legibility is the visual clarity of text, deals with short text,scattered words,individual character, based on size, typeface, contrast, text blocks and spacing. While readability deals with blocks of type, and long prose. Good legibility generally enhance readability.
Readability also includes other factors, like words length, words commonality, sentence length, number of clauses, number of syllables. Let look at an example, the difference between a college level text and a 4th grade reading level text. They have same topic, each paragraph has 100 words, but different numbers of syllables, different numbers of sentences.
How to improve readability? You can omit needless words, avoid acronyms, jargon, sweep away untranslated quotations in foreign languages. Keep paragraph width and sentence length appropriate, try to use active voice, but consider using passive voice when the emphasis on the message rather messenger.
When attempting to produce text for a specific reading level, use published readability formulas and software application designed for this purpose. The readability rating is usually represented in the form of school levels ranging from 1st to 12th grade and college.
However, do not write for the formulas. Simple languages are preferred, but overly simple language obscure meaning.
When you consider about readability, always keep your target reader, context, media in your mind.
Now you understand Readability, a design principle can engage audience betters.
I drafted a rough storyboard to help me think about the visualization of the script.
Phase 2: Flesh Out Script, Think about Visual Style
I got some feedback for my draft script:
- The beginning and concluding remarks were a little bit awkward. (So I add a rhetorical question at the beginning and rewrote the concluding remark.)
- Some word orders need to be adjusted, like: from “keep your target reader, context, media in your mind” to “keep your target readers in mind, considering their reading skills…”. (There will be 3–4 scenes for this sentence.)
Script #2:
Have you ever asked a question: will the readers understand what I’m trying to communicate? That is readability, the degree to which prose can be understood.
Why is it important to designers? A common belief is that complex information requires complex presentation. But the fact is, when the information becomes more complex, the presentation should be simpler, so that the focus is on the information rather than the way it is presented.
Readability is different from legibility. Legibility is the visual clarity of text, deals with short text, scattered words, and individual characters, based on size, typeface, contrast, and text spacing. While readability deals with blocks of type and long prose, based on the complexity of words and sentences. It includes factors like words length, sentence length, number of clauses, number of syllables, etc.
Let’s look at an example of readability. there is a college level text, and a 4th grade reading level text. They have the same topic, each paragraph has 100 words, but different syllable counts, different numbers of sentences. So they have appropriate readability for two groups of target readers.
How to improve readability? From the visual perspective, you can enhance legibility. From the textual view, you can omit needless words, avoid acronyms and jargon, keep sentence length and paragraph width appropriate. You should try to use active voice, but consider using passive voice when the emphasis is on the message.
When attempting to produce text for a specific reading level, you can use a readability formula, a mathematical equation which measures the difficulty experienced by people reading a given text, and the linguistic characteristics of that text. The readability rating is usually represented in the form of school levels ranging from 1st to 12th grade and college.
Simplifying your writing to reach all reading levels is not always the best strategy. For example, if you write for professionals who readily understand technical information, then you probably do not want to cut out familiar hard words or “industry jargon”, otherwise the text will be found flat and dull.
To achieve appropriate readability, always keep your target readers in mind, considering their reading skills, body conditions, reading environment, media, and so on.
Now you understand Readability, a design principle which can engage your audience in better reading.
Then I add more details of the storyboard and start to think about the visual style. I decided to adopt a clean, flat style so that the visual effects won’t distract audience from the content. The typography should be clean, a little bit cute, but not too playful. I chose Avenir.
Phase 3: Refine Storyboard and Draw High-Fidelity Storyboard
I wrote sentence by sentence for each key frame. For every scene, there is key information that need to be delivered effectively. I began to consider questions like these:
- How to make each scene meaningful to audience?
- Is it easy for audience to absorb the information within several seconds?
- Is there any unnecessary distraction ?
- Is there any confusing things?
Then I moved to drawing High-Fidelity storyboard, the flat style:
Phase 4: Refine High-Fidelity Storyboard
In order to relieve the memory load of audiences, I changed human figures into little yellow jelly-shaped figures which has a simpler shape yet can highlight the differences well.
For the same purpose, I also removed some visual elements like button, scroll bar, dropdown menu etc.
The final HF Storyboard:
Phase 5: Revise Script and Storyboard
After listening the to voiceover, I decided to removed the part of “Readability Formula” which is a big concept and hard to explain well within several seconds. I also adjusted the speed and tone of the voiceover to match the music pace and visual style.
Script #3:
Have you ever asked a question: will the readers understand what I’m trying to communicate? That is readability, the degree to which prose can be understood.
Why is it important to designers? A common belief is that complex information requires complex presentation. But the fact is, when the information becomes more complex, the presentation should be simpler, so that the focus is on the information rather than the way it is presented.
Readability is different from legibility. Legibility is the visual clarity of text, deals with short text, scattered words, and individual characters, based on size, typeface, contrast, and text spacing. While readability deals with blocks of type and long prose, based on the complexity of words and sentences. It includes factors like words length, sentence length, number of clauses, number of syllables, etc.
Let’s look at an example of readability. there is a college level text, and a 4th grade reading level text. They have the same topic, each paragraph has 100
words, but different syllable counts, different numbers of sentences. So they have appropriate readability for two groups of target readers.
How to improve readability? From the visual perspective, you can enhance legibility. From the textual view, you can omit needless words, avoid acronyms and jargon, keep sentence length and paragraph width appropriate. You should try to use active voice, but consider using passive voice when the emphasis is on the message.
Simplifying your writing to reach all reading levels is not always the best strategy. For example, if you write for professionals who readily understand technical information, then you probably do not want to cut out familiar hard words or “industry jargon”, otherwise the text will be found flat and dull.
To achieve appropriate readability, always keep your target readers in mind, considering their reading skills, body conditions, reading environment, media, and so on.
Now you understand Readability, a design principle which can engage your audience in better reading.
Feedback and Room for revisions:
A common belief is that complex information requires complex presentation. But the fact is, when the information becomes more complex…
- Using the box and gift as visual approaches to illustrate concepts of presentation and information is nice. However, some students felt confused and wondered why to use a gift, some students questioned why there is a transition from 2D (gift box) to 3D (glass box).
- It would be better if the pace of the first half is faster.
- The target audience should be clearer. The tone and the visual style are friendly, but for college students, they may be a little bit playful.
- The Chicken Pox examples should be differentiate visually.
- There are a few things related to readability that need to be addressed, for example, width coms up at 2:23 almost as a side note.
