Color Universal Design_Online

Color Universal Design for Educators Instructional Design Research Project Print Copy of the Module Mya Eveland Desig ned for You
by
M.E.
SPRING 2015 Learning Design and Technology University of Hawai’i at Mānoa Project LINK: https://canvas.instructure.com/enroll/ANYGER 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 2 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
4.2
4.3
4.4
4.5
4.6
Section 1 Intro ......................................................................................................... 17
Did you Know? ........................................................................................................ 18
Colorblindness ......................................................................................................... 19
Universal Design ...................................................................................................... 22
Color Universal Design ............................................................................................ 28
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 3 of 94 1 Landing Page Color Universal Design Module-‐ Print Version Page 4 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-Questions
2. Module Content
3. 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 can
access Canvas, successfully. Canvas Resources:
Go to Canvas Student Quickstart Guide (http://guides.instructure.com/m/8470) , You'll can also find guides
for 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 5 of 94 2 Pre-‐Survey & Pre-‐Assessment Color Universal Design Module-‐ Print Version Page 6 of 94 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 3 Module Content 3.1 Welcome & Overview Color Universal Design Module-‐ Print Version Page 13 of 94 3.1.1 Invitation Letter
Color Universal Design Module-‐ Print Version Page 14 of 94 Color Universal Design Module-‐ Print Version Page 15 of 94 3.1.2 Color Universal Design Town
Color Universal Design Module-‐ Print Version Page 16 of 94 4 Section 1: Food For Thought Restaurant 4.1 Section 1 Intro Color Universal Design Module-‐ Print Version Page 17 of 94 4.2 Did you Know? Color Universal Design Module-‐ Print Version Page 18 of 94 4.3 Colorblindness Color Universal Design Module-‐ Print Version Page 19 of 94 4.3.1 Colorblindness
Color Universal Design Module-‐ Print Version Page 20 of 94 4.3.2 Colorblindness
Color Universal Design Module-‐ Print Version Page 21 of 94 4.4 Universal Design Color Universal Design Module-‐ Print Version Page 22 of 94 4.4.1 Universal Design
Color Universal Design Module-‐ Print Version Page 23 of 94 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 4.4.2 Universal Design
Color Universal Design Module-‐ Print Version Page 27 of 94 4.5 Color Universal Design Color Universal Design Module-‐ Print Version Page 28 of 94 4.5.1 Color Universal Design
Color Universal Design Module-‐ Print Version Page 29 of 94 Color Universal Design Module-‐ Print Version Page 30 of 94 Color Universal Design Module-‐ Print Version Page 31 of 94 4.5.2 Color Universal Design
Color Universal Design Module-‐ Print Version Page 32 of 94 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 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 36 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 37 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 38 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 39 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 40 of 94 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 6 Section 2 & 3: C&C Café Color Universal Design Module-‐ Print Version Page 45 of 94 Color Universal Design Module-‐ Print Version Page 46 of 94 6.1 Did you Know? Color Universal Design Module-‐ Print Version Page 47 of 94 6.2 Color Contrast Color Universal Design Module-‐ Print Version Page 48 of 94 6.2.1 Color Contrast
Color Universal Design Module-‐ Print Version Page 49 of 94 6.2.2 Color Contrast
Color Universal Design Module-‐ Print Version Page 50 of 94 6.2.3 Color Contrast
Color Universal Design Module-‐ Print Version Page 51 of 94 6.2.4 Color Contrast
Color Universal Design Module-‐ Print Version Page 52 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 53 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 54 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 55 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 56 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 57 of 94 6.4 Color to Convey Info Color Universal Design Module-‐ Print Version Page 58 of 94 6.4.1 Color to Convey Info
Color Universal Design Module-‐ Print Version Page 59 of 94 6.4.2 Color to Convey Info
Color Universal Design Module-‐ Print Version Page 60 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 61 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 62 of 94 6.4.5 Color to Convey Info
Color Universal Design Module-‐ Print Version Page 63 of 94 6.4.6 Color to Convey Info
Color Universal Design Module-‐ Print Version Page 64 of 94 6.4.7 Color to Convey Info
Color Universal Design Module-‐ Print Version Page 65 of 94 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 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 Students with colorblindness may not circles to highlight important events. be able distinguish the difference between the color and thus cannot distinguish the different events. A map with different colors to show Students with colorblindness may not routes. 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 70 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 This is unsuitable because students percentages using different colors. 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 71 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 72 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 73 of 94 6.5.4 Section 3 complete
Color Universal Design Module-‐ Print Version Page 74 of 94 7 Section 4: CUD Academy Color Universal Design Module-‐ Print Version Page 75 of 94 7.1 Section 4 Intro Color Universal Design Module-‐ Print Version Page 76 of 94 7.2 Did You Know? Color Universal Design Module-‐ Print Version Page 77 of 94 7.2.1 Review
Color Universal Design Module-‐ Print Version Page 78 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 79 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 80 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 81 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 82 of 94 8 Town Exit Color Universal Design Module-‐ Print Version Page 83 of 94 9 Post Assessment & Survey Color Universal Design Module-‐ Print Version Page 84 of 94 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 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)
 You are currently logged into Student View
Reset Student
Leave Student View
Resetting the test student will clear all history for this student, allowing you to view the course as a brand new student.
Color Universal Design Module-‐ Print Version Page 93 of 94 Color%Univers D
!
For$Postsecondary$Educators!
This certif ies that
Date:
Has successfully completed a module on Color Universal design and has gained the keys
to create more inclusively designed educational materials.
Color Universal Design Module-‐ Print Version Page 94 of 94

Download Report