color universal design online module printversion mya ... l!printversionpage2!of94! about&...
TRANSCRIPT
Color Universal Design for Educators
Instructional Design Research Project
Print Copy of the Module
Mya Eveland
SPRING 2015
Learning Design and Technology University of Hawai’i at Mānoa Project LINK: https://canvas.instructure.com/enroll/ANYGER
Des ig ned f or Y ou
by M .E .
Color Universal Design Module-‐ Print Version Page 2 of 94
About
The purpose of this research study was to create and evaluate the effectiveness of an online instructional module on Color Universal Design for post-‐secondary educators. This module aimed to increase awareness of students with colorblindness and teach Color Universal Design techniques. Color Universal Design techniques can assist educators with steps to improve their visual materials, decrease learning barriers for their students with colorblindness, and enhance the experience of all their students.
The main content of the module was developed and designed in Articulate Storyline, which is an e-‐learning authoring software. Once completed, the Articulate Storyline content was embedded into Canvas, a learning management system (LMS). The elements and process created in Canvas comprised of:
1. Informational landing page a. Participant consent information and form
2. Overview and directions page 3. Pre-‐survey and assessment 4. Module content (Articulate Storyline)
a. Consisting of an originally designed content and theme b. 5 sections with over 156 interactive layers
5. Post assessments and survey 6. Certificate of completion
Please Note: Because of the size of complete module and interactive areas not all areas
are shown in this print format.
Color Universal Design Module-‐ Print Version Page 3 of 94
Table of Contents
1 Landing Page ....................................................................................... 4 1.1 Overview & Directions page ...................................................................................... 5
2 Pre-‐Survey & Pre-‐Assessment ............................................................. 6
3 Module Content ................................................................................ 13 3.1 Welcome & Overview ............................................................................................. 13
4 Section 1: Food For Thought Restaurant ............................................ 17 4.1 Section 1 Intro ......................................................................................................... 17 4.2 Did you Know? ........................................................................................................ 18 4.3 Colorblindness ......................................................................................................... 19 4.4 Universal Design ...................................................................................................... 22 4.5 Color Universal Design ............................................................................................ 28 4.6 Section 1 Reflection Break ...................................................................................... 36
5 Movies [optional section] .................................................................. 40
6 Section 2 & 3: C&C Café ..................................................................... 45 6.1 Did you Know? ........................................................................................................ 47 6.2 Color Contrast ......................................................................................................... 48 6.3 Section 2 Reflection Break ...................................................................................... 53 6.4 Color to Convey Info ................................................................................................ 58 6.5 Section 3 Reflection Break ...................................................................................... 70
7 Section 4: CUD Academy ................................................................... 75 7.1 Section 4 Intro ......................................................................................................... 76 7.2 Did You Know? ........................................................................................................ 77 7.3 Section 4 -‐ Practice Test .......................................................................................... 79
8 Town Exit .......................................................................................... 83
9 Post Assessment & Survey ................................................................. 84
10 Certificate of Completion page .......................................................... 93
Color Universal Design Module-‐ Print Version Page 4 of 94
1 Landing Page
Color Universal Design Module-‐ Print Version Page 5 of 94
1.1 Overview & Directions page
Overview & Directions
You can take the module at your own leisure.
Participants will learn about improving their visual teaching materials for students with colorblindness.
Feedback from participants will be used to improve the design of the module.
3 Parts to Complete
1. Pre-Questions2. Module Content3. Post-Questions
Upon completion of all 3 parts you will have access to a downloadable Certificate of Completion.
Time
Approximately 30 - 45 minutes to complete. You can pause and return as you need
Tech Check
Make sure you have an updated flash player and please note browser information:
Download Flash Player 10 Or Later here: http://get.adobe.com/flashplayer/(http://http//get.adobe.com/flashplayer/)Browsers: (note: Google Chrome will work the best to view the module.)
Windows: Internet Explorer 6 And Later, Firefox 1.X And Later, Safari 3 And Later, Google Chrome,
Opera 9.5 And Later
Mac: Safari 3 And Later, Firefox 1.X And Later, Google Chrome, Linux: Firefox 1.X And Later
For Technical Difficulties:
If Canvas misbehaves - Click on the Help link on the upper right-hand corner of your screen and select"Report a Problem." Also, check that you have the correct technical requirements (http://guides.instructure.com/s/2204/m/4214/l/41056-which-browsers-does-canvas-support) to ensure you canaccess Canvas, successfully.
Canvas Resources:
Go to Canvas Student Quickstart Guide (http://guides.instructure.com/m/8470) , You'll can also find guidesfor the web, phone and tablet interfaces here.
Have fun & enjoy! Click the "NEXT" button (below) to continue to the Pre-Questions.
Color Universal Design Module-‐ Print Version Page 6 of 94
2 Pre-‐Survey & Pre-‐Assessment
Color Universal Design Module-‐ Print Version Page 7 of 94
Color Universal Design Module-‐ Print Version Page 8 of 94
Color Universal Design Module-‐ Print Version Page 9 of 94
Color Universal Design Module-‐ Print Version Page 10 of 94
Color Universal Design Module-‐ Print Version Page 11 of 94
Color Universal Design Module-‐ Print Version Page 12 of 94
Color Universal Design Module-‐ Print Version Page 13 of 94
3 Module Content
3.1 Welcome & Overview
Color Universal Design Module-‐ Print Version Page 14 of 94
3.1.1 Invitation Letter
Color Universal Design Module-‐ Print Version Page 15 of 94
Color Universal Design Module-‐ Print Version Page 16 of 94
3.1.2 Color Universal Design Town
Color Universal Design Module-‐ Print Version Page 17 of 94
4 Section 1: Food For Thought Restaurant
4.1 Section 1 Intro
Color Universal Design Module-‐ Print Version Page 18 of 94
4.2 Did you Know?
Color Universal Design Module-‐ Print Version Page 19 of 94
4.3 Colorblindness
Color Universal Design Module-‐ Print Version Page 20 of 94
4.3.1 Colorblindness
Color Universal Design Module-‐ Print Version Page 21 of 94
4.3.2 Colorblindness
Color Universal Design Module-‐ Print Version Page 22 of 94
4.4 Universal Design
Color Universal Design Module-‐ Print Version Page 23 of 94
4.4.1 Universal Design
Color Universal Design Module-‐ Print Version Page 24 of 94
Color Universal Design Module-‐ Print Version Page 25 of 94
Color Universal Design Module-‐ Print Version Page 26 of 94
Color Universal Design Module-‐ Print Version Page 27 of 94
4.4.2 Universal Design
Color Universal Design Module-‐ Print Version Page 28 of 94
4.5 Color Universal Design
Color Universal Design Module-‐ Print Version Page 29 of 94
4.5.1 Color Universal Design
Color Universal Design Module-‐ Print Version Page 30 of 94
Color Universal Design Module-‐ Print Version Page 31 of 94
Color Universal Design Module-‐ Print Version Page 32 of 94
4.5.2 Color Universal Design
Color Universal Design Module-‐ Print Version Page 33 of 94
Color Universal Design Module-‐ Print Version Page 34 of 94
Color Universal Design Module-‐ Print Version Page 35 of 94
Color Universal Design Module-‐ Print Version Page 36 of 94
4.6 Section 1 Reflection Break
4.6.1 Reflect Q1
(Multiple Choice, 10 points, unlimited attempts permitted)
Color Universal Design Module-‐ Print Version Page 37 of 94
Correct Choice
Students with colorblindness cannot see the difference of any colors.
Most students with colorblindness see only black and white.
X Not being able to distinguish between certain colors.
Students with colorblindness cannot see any colors.
Feedback when correct:
That's right! You selected the correct response.
Feedback when incorrect:
You did not select the correct response.
Color Universal Design Module-‐ Print Version Page 38 of 94
4.6.2 Reflect Q2
(Pick One, 10 points, unlimited attempts permitted)
Correct Choice
group 1_shoes
X Group 2_graph
Group 3_text
Feedback when correct:
That's right!
The colors in this image are being used to convey information.
Feedback when incorrect:
Color Universal Design Module-‐ Print Version Page 39 of 94
You did not select the correct response.
The colors in this image are decorative and not convey information.
4.6.3 Reflect Q3
(Pick Many, 10 points, unlimited attempts permitted)
Correct Choice
border
X Pie chart
X image title
Feedback when correct:
Color Universal Design Module-‐ Print Version Page 40 of 94
That's right! You selected the correct responses.
Pie Chart: a colorful pie chart representing information is important to evaluate and make sure
the colored areas have labels.
Title (Color Text on Colored Background): Correct, colored text on colored backgrounds is
important to evaluate if they are suitable for Individuals with Colorblindness.
Feedback when incorrect:
You did not select the correct response.
5 Movies [optional section]
Color Universal Design Module-‐ Print Version Page 41 of 94
Color Universal Design Module-‐ Print Version Page 42 of 94
Color Universal Design Module-‐ Print Version Page 43 of 94
Color Universal Design Module-‐ Print Version Page 44 of 94
Color Universal Design Module-‐ Print Version Page 45 of 94
6 Section 2 & 3: C&C Café
Color Universal Design Module-‐ Print Version Page 46 of 94
Color Universal Design Module-‐ Print Version Page 47 of 94
6.1 Did you Know?
Color Universal Design Module-‐ Print Version Page 48 of 94
6.2 Color Contrast
Color Universal Design Module-‐ Print Version Page 49 of 94
6.2.1 Color Contrast
Color Universal Design Module-‐ Print Version Page 50 of 94
6.2.2 Color Contrast
Color Universal Design Module-‐ Print Version Page 51 of 94
6.2.3 Color Contrast
Color Universal Design Module-‐ Print Version Page 52 of 94
6.2.4 Color Contrast
Color Universal Design Module-‐ Print Version Page 53 of 94
6.2.5 Section 2 Compete
6.3 Section 2 Reflection Break
6.3.1 Reflect Q1
(Multiple Choice, 10 points, unlimited attempts permitted)
Color Universal Design Module-‐ Print Version Page 54 of 94
Correct Choice
A color combination with very similar saturation.
X The difference between the light and dark area of an image.
Color combinations with very different shades.
A picture with one color and similar tints.
Feedback when correct:
That's right! You selected the correct response.
Feedback when incorrect:
You did not select the correct response.
Color Universal Design Module-‐ Print Version Page 55 of 94
6.3.2 Reflect Q2
(Pick One, 10 points, unlimited attempts permitted)
Correct Choice
sample 1 group
sample 2 group
sample 3 group
X sample 4 group
Feedback when correct:
That's right!
This image has low contrast is the most unsuitable for a student with colorblindness.
Color Universal Design Module-‐ Print Version Page 56 of 94
Feedback when incorrect:
You did not select the correct response.
The text and background in this image have suitable contrast.
6.3.3 Reflect Q3
(Pick Many, 10 points, unlimited attempts permitted)
Correct Choice
X Acting Class 101 -‐ Macbeth Act IV, Scene I
Please choose a character and practice the
following dialogue with your partners.
Characters:
Color Universal Design Module-‐ Print Version Page 57 of 94
1. Macbeth
2. First Witch
3. First Apparition
Macbeth: Tell me, thou unknown power,-‐-‐
First Witch: He knows thy thought:
Hear his speech, but say thou nought.
First Apparition: Macbeth! Macbeth! Macbeth! beware Macduff; Beware the
thane of Fife. Dismiss me. Enough.
Feedback when correct:
That's right! You selected the correct responses.
The colored text and a colored background have good contrast between them
Feedback when incorrect:
The colored text and a colored background have very good contrast (very light background
contrasting very dark text) between them.
Color Universal Design Module-‐ Print Version Page 58 of 94
6.4 Color to Convey Info
Color Universal Design Module-‐ Print Version Page 59 of 94
6.4.1 Color to Convey Info
Color Universal Design Module-‐ Print Version Page 60 of 94
6.4.2 Color to Convey Info
Color Universal Design Module-‐ Print Version Page 61 of 94
6.4.3 Color to Convey Info
(Drag and Drop, 10 points, unlimited attempts permitted)
Drag Item Drop Target
Map Drop 1
Border Drop 2
Bar Graph Drop 1
Infographic Drop 1
Text in Red Drop 1
Clip art Drop 2
Color Universal Design Module-‐ Print Version Page 62 of 94
Drag and drop properties
Return item to start point if dropped outside the correct drop target
Snap dropped items to drop target (Tile)
Delay item drop states until interaction is submitted
Feedback when correct:
Correct. Great Job!
Feedback when incorrect:
Incorrect.
6.4.4 Color to Convey Info
Color Universal Design Module-‐ Print Version Page 63 of 94
6.4.5 Color to Convey Info
Color Universal Design Module-‐ Print Version Page 64 of 94
6.4.6 Color to Convey Info
Color Universal Design Module-‐ Print Version Page 65 of 94
6.4.7 Color to Convey Info
Color Universal Design Module-‐ Print Version Page 66 of 94
Color Universal Design Module-‐ Print Version Page 67 of 94
Color Universal Design Module-‐ Print Version Page 68 of 94
Color Universal Design Module-‐ Print Version Page 69 of 94
Color Universal Design Module-‐ Print Version Page 70 of 94
6.5 Section 3 Reflection Break
6.5.1 Reflect Q1
(Multiple Choice, 10 points, unlimited attempts permitted)
Correct Choice Feedback
A calendar using different colored
circles to highlight important events.
Students with colorblindness may not
be able distinguish the difference
between the color and thus cannot
distinguish the different events.
A map with different colors to show
routes.
Students with colorblindness may not
be able to distinguish the difference in
colors and thus the different routes.
X A calendar using different shapes and Providing emphasis using color and
Color Universal Design Module-‐ Print Version Page 71 of 94
text to highlight important events. different shapes improves information
being conveyed for Students with
colorblindness and for all students
A pie chart that only conveys
percentages using different colors.
This is unsuitable because students
with colorblindness may not be able to
distinguish the colors and what the
areas represent.
6.5.2 Reflect Q2
(Pick One, 10 points, unlimited attempts permitted)
Correct Choice
Readings
Color Universal Design Module-‐ Print Version Page 72 of 94
X Graph
Feedback when correct:
That's right!
The graph is using color to convey information but also has labels for what the colors represent.
Feedback when incorrect:
The required readings are only identified using color. You could add * to help identify the
readings for students with colorblindness.
6.5.3 Reflect Q3
(Pick Many, 10 points, unlimited attempts permitted)
Correct Choice
Color Universal Design Module-‐ Print Version Page 73 of 94
CUD margin of commercial airlines 2020 -‐ 2030
X graph
plane
Feedback when correct:
That's right! You selected the correct responses.
The colored bars are using color to convey information but are not labeled.
Feedback when incorrect:
This area is not in need of Color Universal Design.
Please try again.
Color Universal Design Module-‐ Print Version Page 74 of 94
6.5.4 Section 3 complete
Color Universal Design Module-‐ Print Version Page 75 of 94
7 Section 4: CUD Academy
Color Universal Design Module-‐ Print Version Page 76 of 94
7.1 Section 4 Intro
Color Universal Design Module-‐ Print Version Page 77 of 94
7.2 Did You Know?
Color Universal Design Module-‐ Print Version Page 78 of 94
7.2.1 Review
Color Universal Design Module-‐ Print Version Page 79 of 94
7.2.2 Teachers Office
7.3 Section 4 -‐ Practice Test
7.3.1 Practice Q1
(Pick One, 10 points, unlimited attempts permitted)
Color Universal Design Module-‐ Print Version Page 80 of 94
Correct Choice
X sample 1 group
sample 2 group
sample 3 group
sample 4 group
Feedback when incorrect:
You did not select the correct response.
Color Universal Design Module-‐ Print Version Page 81 of 94
7.3.2 Practice Q2
(Pick One, 10 points, unlimited attempts permitted)
Correct Choice
sample 1 group
sample 2 group
X sample 3 group
sample 4 group
Feedback when incorrect:
You did not select the correct response.
Color Universal Design Module-‐ Print Version Page 82 of 94
7.3.3 Practice Q3
(Pick One, 10 points, unlimited attempts permitted)
Correct Choice
sample 1 group
sample 2 group
X sample 3 group
sample 4 group
Feedback when incorrect:
You did not select the correct response.
Color Universal Design Module-‐ Print Version Page 83 of 94
8 Town Exit
Color Universal Design Module-‐ Print Version Page 84 of 94
9 Post Assessment & Survey
Color Universal Design Module-‐ Print Version Page 85 of 94
Color Universal Design Module-‐ Print Version Page 86 of 94
Color Universal Design Module-‐ Print Version Page 87 of 94
Color Universal Design Module-‐ Print Version Page 88 of 94
Color Universal Design Module-‐ Print Version Page 89 of 94
Color Universal Design Module-‐ Print Version Page 90 of 94
Color Universal Design Module-‐ Print Version Page 91 of 94
Color Universal Design Module-‐ Print Version Page 92 of 94
Color Universal Design Module-‐ Print Version Page 93 of 94
10 Certificate of Completion Page
Certificate of Completion
(https://canvas.instructure.com/courses/903845/files/32759896/download?wrap=1) (https://canvas.instructure.com/courses/903845/files/32759896/download?wrap=1)
Congratulations!Please Download your fillable Certificate of Completion here
(https://canvas.instructure.com/courses/903845/files/32759896/download?wrap=1) (https://canvas.instructure.com/courses/903845/files/32759896/download?wrap=1)
Resetting the test student will clear all history for this student,
allowing you to view the course as a brand new student.
You are currently logged into Student View
Reset Student Leave Student View
Color Universal Design Module-‐ Print Version Page 94 of 94
This certif ies that
Color%UniversĂů DĞƐŝŐŶ!For$Postsecondary$Educators!
Has successfully completed a module on Color Universal design and has gained the keys to create more inclusively designed educational materia ls.
Date: