Upgrade to Pro — share decks privately, control downloads, hide ads and more …

The Black and Blue Dress

jongthechemist
October 08, 2020

The Black and Blue Dress

jongthechemist

October 08, 2020
Tweet

More Decks by jongthechemist

Other Decks in Design

Transcript

  1. KHAIRUL NIZAM SAIFUL
    It’s about accessibility
    BLACK AND BLUE
    OR WHITE AND GOLD?

    View full-size slide

  2. - Khairul Nizam Saiful
    - From Kuching, Sarawak
    - Chemical Engineer
    - Hobby - Programming (Until it became a job)
    - Full-stack Developer @feat-stores
    - Colorblind (Diagnosed at 15 yo)
    ABOUT ME

    View full-size slide

  3. ISHIHARA TEST

    View full-size slide

  4. COLORBLINDNESS
    Red? Pink? Grey?
    Yellow? Green? Orange?
    Blue?
    Purple?
    Green? Grey? Maroon?

    View full-size slide

  5. DEFINITION
    Color blindness (color vision deficiency) is the decreased ability to
    see color or differences in color.
    CAUSES
    Hereditary and sex-linked, affecting predominantly
    males.
    Acquired
    - Trauma - Brain/retinal damage
    - Diseases - age-related macular degeneration,
    diabetes, Vit A deficiency
    - Drugs and chemicals

    View full-size slide

  6. - Trichromacy - Human - 10M colors
    - Monochromacy - Whales, sharks, sea lions - 200
    - Dichromacy - Placental mammals - 40k
    - Tetrachromacy - Bird, fish, amphibians - 100M
    - Pentachromacy - Butterflies - 10B
    COLOR VISION

    View full-size slide

  7. SPECTRUM
    Trichromacy Deuteranopia Protanopia Tritanopia
    Monochromacy
    Dichromacy
    Achromatopsia

    View full-size slide

  8. SPECTRUM
    Deuteranopia Protanopia Tritanopia
    Monochromacy
    Dichromacy
    Achromatopsia
    1 in 30 000
    1 in 12
    1 in 200
    75% 25% > 1%
    Affect equally

    View full-size slide

  9. SPECTRUM
    10%
    5%
    4%

    View full-size slide

  10. https://www.youtube.com/watch?v=3Mg_galcbA4

    View full-size slide

  11. - Contrast
    ACCESSIBILITY
    https://coolors.co/contrast-checker

    View full-size slide

  12. - Palette
    ACCESSIBILITY ❌

    View full-size slide

  13. - Patterns and Shapes
    ACCESSIBILITY http://www.coloradd.net/

    View full-size slide

  14. - Simulators
    ACCESSIBILITY
    https://www.color-blindness.com/
    coblis-color-blindness-simulator/

    View full-size slide

  15. 57% saw the dress as blue and black; 30% saw it as white and gold
    Chromatic adaptation

    View full-size slide

  16. - Visual impairment
    - 246M low vision, 39M total blindness
    - Eg. Web Accessibility Initiative (WAI-ARIA): https://www.w3.org/WAI/standards-guidelines/aria/
    - How a blind person uses a phone: https://www.youtube.com/watch?v=c0nvdiRdehw
    - Deafness
    - 466M hearing loss
    - Eg. Sign language, Closed captioning
    - Physical disability
    - 2 in 1000 liveborn with cerebral palsy
    - Eg. Xbox Adaptive Controller
    BEYOND COLOUR-BLINDNESS

    View full-size slide

  17. Q&A
    THANK YOU

    View full-size slide

  18. Farnsworth–Munsell 100 hue test

    View full-size slide