Share
Embed
iOSDC Japan 2019 60 mins for color
色の難しい話に負けない体づくり60分 #iosdc #b
https://iosdc.jp/2019/
https://fortee.jp/iosdc-japan-2019/proposal/760a3747-b7d3-4b1a-a141-85a93a31f66d
Shigure Shimotori
September 06, 2019
Transcript
123 slides
-
@S_Shimotori_pub ▸ μʔΫϞʔυ ▸ ৭Λશʹ †ཧղ† ͨ͠ʢͯ͠ͳ͍ʣ ▸ σβΠϯΘ͔Γ·ͤΜ ▸
ࠓωοτϫʔΫͯ͠·͢ 2 -
5 (R, G, B)co mpo n en t = CC
sRGB 12.92 , if CC sRGB ≤ 0.03928 ( CC sRGB + 0.055 1.055 ) 2.4 , otherwise co n trast = L 1 + 0.05 L2 + 0.05 lu min an ce = 0.2126 × R + 0.7152 × G + 0.0722 × B https://raw.githubusercontent.com/emarley/ColorContrast/master/ColorContrast.pdf -
৭ͷ͍͠ʂ ࢲͨͪΛ·ͤΔ৭ͷ͍͠ ▸ ΠϥϨʹiPhoneͷεΫγϣΛஔͨ͠ΒϠόΠ৭ʹͳͬͨ ॿ͚ͯʂ ▸ HIG Colorʹࡌ͍ͬͯΔṖͷ৭ը૾Կऀʁ ▸ ৭֮ҟৗͷํԿ৭ͷ۠ผ͕ۤखͳΜ͚ͩͬ……ʁ
▸ ͰɺίϯτϥετൺͬͯԿͰ͚ͨͬ͠ʁ ▸ μʔΫϞʔυ͍ͬͯ͏ͷ͕࠷ۙͷྲྀߦΓͳͷʁͳΜͰʁ 9 -
෮शɾޫͷࡾݪ৭ͱUIColor ޫͷࡾݪ৭ ▸ & & ੨ͷ3৭Ͱ΄ͱΜͲͷ৭Λ࡞Γग़͢͜ͱ͕Ͱ͖Δ ▸ ৭ΛՃ͑Δͱ໌Δ͘ͳΔʢՃ๏ࠞ৭ʣ
▸ cf. CMYKʹΑΔݮ๏ࠞ৭ 11 Α͘ݟ͔͚ΔՃ๏ࠞ৭ͷਤ -
෮शɾޫͷࡾݪ৭ͱUIColor UIColorͰ৭Λࢦఆ͢Δ ▸ γεςϜΧϥʔ໊ ▸ RGBίϯϙʔωϯτ ▸ HSBίϯϙʔωϯτ ▸ ଞɺͳΜ͔Α͘Θ͔ΒΜ͕͍͔ͭͭ͘ɻ
▸ SwiftUI Color.initʮNo overview available.ʯ 12 -
෮शɾޫͷࡾݪ৭ͱUIColor RGBίϯϙʔωϯτͰ৭Λࢦఆ ▸ & & ੨ͷͦΕͧΕʹ0.0ʙ1.0ͷΛ༩͑ͯࢦఆ ▸ υΩϡϝϯτʹͬͱ͍ΖΜͳ͜ͱ͕ॻ͍ͯ͋Δ͕
ςΩτʔʹ͑Δ 13 ྩ - കɹ#EAADBD UIColor(red: 234/255, green: 173/255, blue: 189/255, alpha: 1) -
ΠϥϨʹiPhoneͷεΫγϣΛஔͨ͠ΒϠό͍৭ʹͳͬͨॿ͚ͯʂ ͍͕ͣ੨͘ͳͬͯ͠·͏୯৭ը૾Λͭ͘Δ 21 → $ brew install imagemagick $ magick
-size 100x100 xc:#FF00000000FF output.png -
ΠϥϨʹiPhoneͷεΫγϣΛஔͨ͠ΒϠό͍৭ʹͳͬͨॿ͚ͯʂ ͍͕ͣ੨͘ͳͬͯ͠·͏୯৭ը૾Λͭ͘Δ 22 → $ brew install imagemagick $ magick
-size 100x100 xc:#FF00000000FF output.png -
ΠϥϨʹiPhoneͷεΫγϣΛஔͨ͠ΒϠό͍৭ʹͳͬͨॿ͚ͯʂ ৭ਂ / color depth ▸ 1pixel͋ͨΓʹର͠ԿbitΛ༻͍ͯ৭Λදݱ͍ͯ͠Δ͔ ▸ 24bits per
pixelͷͱ͖ͷͷΧϥʔίʔυ#FF0000 ▸ 48bits per pixelͷͱ͖ͷͷΧϥʔίʔυ#FFFF00000000 ▸ iPhoneͷσΟεϓϨΠ48bits per pixelରԠ ▸ දݱͰ͖Δ৭ͷͳΜͱ65536^3छʂ ▸ imagemagickͷidentifyͰௐΒΕΔ 23 -
ΠϥϨʹiPhoneͷεΫγϣΛஔͨ͠ΒϠό͍৭ʹͳͬͨॿ͚ͯʂ ʮiPhone48bppରԠͳΜͩΑʂʯ ▸ When appropriate, use the Display P3 color
profile at 16 bits per pixel (per channel) and export images in PNG format. 29 https://developer.apple.com/design/human-interface-guidelines/ios/visual-design/color/ -
ΠϥϨʹiPhoneͷεΫγϣΛஔͨ͠ΒϠό͍৭ʹͳͬͨॿ͚ͯʂ ΠϥϨʹiPhoneͷεΫγϣΛஔͨ͠ΒϠό͍৭ʹͳͬͨॿ͚ͯʂ ▸ iPhoneʢͷεΫγϣʣ৭ਂ48bpp ▸ ΠϥϨ֤৭ͷԼҐ8bit͚ͩݟͯը૾ΛಡΈࠐΉ ▸ ରॲ๏ͦͷ1ɿఘΊͯϑΥτγϣΛ͏ ▸ ରॲ๏ͦͷ2ɿ24bppʹམͱ͢
▸ ਓؒͷʹΘ͔Βͳ͍ɺଟ ▸ $ magick input.png -define png:bit-depth=8 output.png 30 -
৭ͷ͍͠ʂ ࢲͨͪΛ·ͤΔ৭ͷ͍͠ ▸ ΠϥϨʹiPhoneͷεΫγϣΛஔͨ͠ΒϠόΠ৭ʹͳͬͨ ॿ͚ͯʂ ▸ HIG Colorʹࡌ͍ͬͯΔṖͷ৭ը૾Կऀʁ ▸ ৭֮ҟৗͷํԿ৭ͷ۠ผ͕ۤखͳΜ͚ͩͬ……ʁ
▸ ͰɺίϯτϥετൺͬͯԿͰ͚ͨͬ͠ʁ ▸ μʔΫϞʔυ͍ͬͯ͏ͷ͕࠷ۙͷྲྀߦΓͳͷʁͳΜͰʁ 31 -
෮शɾޫͷࡾݪ৭ͱUIColor ਲ਼ମࡉ๔ ▸ ৭Λೝࣝ͢ΔͨΊͷࡉ๔ ▸ Sਲ਼ମɺMਲ਼ମɺLਲ਼ମͷ3छྨ ▸ short͔medium͔long͔ ▸ چ໊ɿ੨ਲ਼ମɺਲ਼ମɺਲ਼ମ
36 https://commons.wikimedia.org/wiki/File:Cone-response-en.svg -
෮शɾޫͷࡾݪ৭ͱUIColor ৭࣮ݧ - ݁Ռ ▸ ࡞Εͳ͍৭͕͋Δ͜ͱ͕ൃ֮ͨ͠ ▸ ͔ͳ৭Λ࡞Δ͜ͱ͕Ͱ͖ͳ͔ͬͨ ▸ ৭Λݟຊʹࠞͥͯ͘͢Μͩ৭ʹ͢Δ͜ͱͰಉ͡৭ʹͳͬͨ
39 https://commons.wikimedia.org/wiki/File:CIE1931_RGBCMF.svg ↑ Ͳ ͷ ͘ Β ͍ ࠞ ͥ ͨ ͔ -
෮शɾޫͷࡾݪ৭ͱUIColor ͜ͷ̏ͭΛ͓͑͞Α͏ʂ ▸ ࡾܹ ͱ͍͏ύϥϝʔλͰߟ͑Δ ▸ σΟεϓϨΠͱ͍Θͣ৭ͷݟ͑ํશൠʹ͏ͷ ▸ ܭࢉ͍͢͠ੈքʢ XYZද৭ܥ
ʣΛ࡞Γग़ͯ͠ߟ͑Δ ▸ ֶతͳௐΛࢪ͚ͨͩ͠ͷͷ ▸ ৭ਤ ͱݺΕΔάϥϑͰͯ͢ͷ৭Λཧ 41 -
XYZͷੈքΑ͏ͦ͜ʂ RGBܹΛվͯ͠XYZܹʹ͢Δ ▸ XYZܹRGB൛ͷܹΛͪΐͬͱ͍͚ͬͨͩ͡ͷͷ ▸ ܭࢉ͍͢͠Α͏ʹௐ ▸ Yً͕୲ʹͳΔΑ͏ʹௐ ʲॏཁɾςετʹग़·͢ʳ ▸
৭͕1൪໌Δ͘ݟ͑ΔͷͰɺ࣮࣭৭ͷ୲Ͱ͋Δ ▸ Z͕ʢ੨৭ʣͷ୲ʹͳΔΑ͏ʹௐ ▸ ͳͲͳͲ ▸ XYZܹΛͬͯͦΕͧΕͷ৭ΛදݱʢXYZද৭ܥʣ 45 -
XYZͷੈքΑ͏ͦ͜ʂ ًʁ໌ʁ ▸ ًͱ໌ಉ͡͡Όͳ͍ʂ ▸ ً / luminance ▸ ৺ཧཧྔ
▸ ໘ੵͰޫͷڧ͞Λׂͬͨͷ ▸ ໌ / brightness ▸ ৭ͷࡾଐੑͷ1ͭ ▸ RGBͷ͔ΒٻΊΔ 46 -
XYZͷੈքΑ͏ͦ͜ʂ XYZܹΛར༻ͯͯ͢͠ͷ৭Λάϥϑʹ͢Δ ▸ 3ͭͷύϥϝʔλΛͦͷ··ࡾ࣍ݩάϥϑʹϓϩοτ ▸ ʮͲͷ͘Β͍ͷൺͰ৭Λࠞͥͯ࡞͔ͬͨʯͳΒ ฏ໘ͰදݱͰ͖Δʢ xy৭ਤ ʣ ▸
3࣍ݩάϥϑΛಡΉͷ͍͠ͷͰɺͪ͜Βͷํ͕ศར 47 -
XYZͷੈքΑ͏ͦ͜ʂ xy৭ਤ ▸ ʢ΄΅ʣͯ͢ͷ৭Λࡌͤͨάϥϑ ▸ ໌Δ͞ͷҧ͏৭ࡌ͍ͬͯͳ͍ ▸ ࠲ඪΛݴ͑ਖ਼֬ʹ৭ΛൺΒΕΔ ▸ σΟεϓϨΠ͕දࣔͰ͖Δ৭Λ
ࣔ͢ͷʹศར ▸ ͷํͷ৭ਖ਼֬ʹදࣔͰ͖ͳ͍ 48 https://commons.wikimedia.org/wiki/File:CIE1931xy_blank.svg -
XYZͷੈքΑ͏ͦ͜ʂ ࡾܹXYZͱ৭xyʢఆٛVer.ʣ 49 X = K ∫ 780 380 S(λ)R(λ)¯
x(λ)dλ Y = K ∫ 780 380 S(λ)R(λ)¯ y(λ)dλ Z = K ∫ 780 380 S(λ)R(λ)¯ z(λ)dλ ͨͩ͠ ∫ 780 380 dλ ࠷େࢹײޮՌʢఆʣ Մࢹޫ380nmʙ780nm S(λ) ޫݯͷޫ R(λ) ମͷޫࣹ or ಁա ¯ x(λ), ¯ y(λ), ¯ z(λ) ଌ৭ඪ४؍ଌऀͷ৭ؔ ߹Α͘༻ҙͨ͠ͷܹͰͳ͘ίϨ K x = X X + Y + Z y = Y X + Y + Z z = Z X + Y + Z = 1 − x − y -
XYZͷੈքΑ͏ͦ͜ʂ ৭ۭؒ / color space ▸ σΟεϓϨΠϓϦϯλ͕ѻ͏৭ͷൣғํ๏Λࣔͨ͠ͷ ▸ ݪ৭ /
primariesɿݪ৭͕ͦΕͧΕͲͷ৭͔ ▸ ৭Ҭ / color gamutɿѻ͑Δ৭ͷൣғͲ͔͜ ▸ ΨϯϚ / gamma transfer functionɿ໌Δ͞ʹؔ͢Δௐ۩߹ ▸ ͞·͟·ͳن͕֨͋Δ 50 -
XYZͷੈքΑ͏ͦ͜ʂ ΨϯϚ / gamma transfer function ▸ ৭ʹͲͷ͘Β͍ͷิਖ਼ΛՃ͑Δ͔ ▸ ิਖ਼͕ՃΘ͍ͬͯͳ͍৭ઢܗ
/ linearͱݺΕΔ ▸ ݹ͘ϒϥϯʹΑΔ৭ͷมԽΛमਖ਼͢Δͷ ▸ ਓؒ໌Δ͍৭ΑΓ҉͍৭ͷํͷมԽʹහײ 51 ↓ ݟΔڥʹԠͨ͡ิਖ਼ΛՃ͑Δʂ -
▸ ্ิਖ਼Λ͢Δ͜ͱͰ៉ྷʹݟ͍͑ͯΔ ▸ ΧϥʔίʔυΨϯϚิਖ਼ޙͷঢ়ଶʹ߹Θͤͨύϥϝʔλ ▸ Լิਖ਼Λ͍ͯ͠ͳ͍ͷͰҰݟෆࣗવ ▸ ܹYʹର࣮ͯ͠ XYZͷੈքΑ͏ͦ͜ʂ ΨϯϚิਖ਼ͱઢܗ
53 άϨʔεέʔϧ ܹY 0.0 ʛ ʛ 0 1.0 ʛ ʛ 1.0 -
XYZͷੈքΑ͏ͦ͜ʂ sRGB৭ۭؒ / standard Red Green Blue ▸ IEC͕1998ʹ੍ఆͨ͠ن֨ ▸
࣌ͷΧϥʔCRTσΟεϓϨΠʢϒϥϯʣΛҙࣝͨ͠ͷ ▸ ఆ൪ɺΑ͘ݟΔ ▸ iPhoneجຊతʹ͜ͷ৭ۭؒΛ͏ 54 -
XYZͷੈքΑ͏ͦ͜ʂ DCI P3৭ۭؒ ▸ Digital Cinema InitiativeʹΑΔ৭ۭؒɻཁ͢Δʹөը༻ ▸ ৭ҬsRGBΑΓ͍ ▸
ΨϯϚsRGBͱҟͳ͓ͬͯΓɺ҉͍ڥͰݟΔ͜ͱΛ ఆͨ͠ͷ 55 -
XYZͷੈքΑ͏ͦ͜ʂ Display P3৭ۭؒ ▸ Apple͕࡞ͬͨ৭ۭؒͰɺiPhone7Ҏ߱Ͱ༻Մೳ ▸ > This color space
uses the DCI P3 primaries, a D65 white point, and the sRGB transfer function. ▸ ҙ༁ɿ৭ҬDCI P3ͱಉ͡ͰΊɺͰσΟεϓϨΠΛݟΔ ڥsRGBͱಉ͡ఆʂ 56 https://developer.apple.com/documentation/coregraphics/cgcolorspace/1408916-displayp3 -
XYZͷੈքΑ͏ͦ͜ʂ sRGBͱDisplay P3ͰͲͷ͘Β͍ҧ͏ͷʁ ▸ Display P3ͷ΄͏͕ͨ͘͞Μͷछྨͷ৭ΛදࣔͰ͖Δ ▸ ࡾ֯ܗͷ͕֤৭ۭؒͷݪ৭ ▸ ࡾ֯ܗͰࣔͨ͠ΤϦΞ͕֤৭ۭؒͷ৭Ҭ
57 https://developer.apple.com/design/human-interface-guidelines/ios/visual-design/color/ -
XYZͷੈքΑ͏ͦ͜ʂ #00FF00ΛݟൺͯΈΔ - UIColor.init ▸ UIColor( red: 0, green: 1,
blue: 0, alpha: 1) ▸ UIColor(displayP3Red: 0, green: 1, blue: 0, alpha: 1) 59 sRGB Display P3 ͪΐͬͱ͔ʁ -
XYZͷੈքΑ͏ͦ͜ʂ Color.initͷυΩϡϝϯτΛಡΜͰΈΔ ▸ init(Color.RGBColorSpace, red: Double, green: Double, blue: Double,
opacity: Double) ▸ ͑ʁNo overview availableʁ ▸ ৭ۭؒͱͯ͠.displayP3ɺ.sRGBɺ.sRGBLinear͕ࢦఆͰ͖Δ 60 https://developer.apple.com/documentation/uikit/uicolor/1621925-init -
XYZͷੈքΑ͏ͦ͜ʂ ExtendedͳsRGB ▸ UIColorͷΠχγϟϥΠβϚΠφεͷ1.0ΑΓେ͖͍ ΛऔΔ͜ͱ͕Ͱ͖ΔʢiOS10ʙʣ ▸ Display P3্ͰදݱͰ͖Δ͕sRGBͰදݱͰ͖ͳ͍৭ͳͲ 61 red:
0 green: 1 blue: 0 red: -0.511767 green: 1.01831 blue: -0.310667 CGColorSpace.extendedSRGB CGColorSpace.displayP3 -
XYZͷੈքΑ͏ͦ͜ʂ UIColor.initͷઆ໌ΛಡΜͰΈΔ ▸ > On applications linked for iOS 10
or later, the color is specified in an extended color space, and the input value is never clamped. ▸ ҙ༁ɿෳͷ৭ۭؒΛಉ࣌ʹѻ͑ΔҎ্ɺຊདྷ͋Γ͑ͳ͍ ΛೖΕͯखΛՃ͑ͣͦͷ··ѻ͏Αɻ 62 https://developer.apple.com/documentation/uikit/uicolor/1621925-init -
৭ͷ͍͠ʂ ࢲͨͪΛ·ͤΔ৭ͷ͍͠ ▸ ΠϥϨʹiPhoneͷεΫγϣΛஔͨ͠ΒϠόΠ৭ʹͳͬͨ ॿ͚ͯʂ ▸ HIG Colorʹࡌ͍ͬͯΔṖͷ৭ը૾Կऀʁ ▸ ৭֮ҟৗͷํԿ৭ͷ۠ผ͕ۤखͳΜ͚ͩͬ……ʁ
▸ ͰɺίϯτϥετൺͬͯԿͰ͚ͨͬ͠ʁ ▸ μʔΫϞʔυ͍ͬͯ͏ͷ͕࠷ۙͷྲྀߦΓͳͷʁͳΜͰʁ 66 -
ͷͷݟ͑ํʹݸਓ͕ࠩ͋Γ·͢ ߟྀ͖͢ࢹ֮ಛੑ͍Ζ͍Ζ ▸ ৭֮ / Color vision ▸ ίϯτϥετײ /
Contrast sensitivity ▸ ࢹ֮աහ / Light sensitivity, Photophobia ▸ ࢹྗ / Visual acuity ▸ ࢹ / Field of vision 71 https://www.w3.org/TR/low-vision-needs/ -
ͷͷݟ͑ํʹݸਓ͕ࠩ͋Γ·͢ ߟྀ͖͢ࢹ֮ಛੑ͍Ζ͍Ζ ▸ ৭֮ / Color vision ▸ ίϯτϥετײ /
Contrast sensitivity ▸ ࢹ֮աහ / Light sensitivity, Photophobia ▸ ࢹྗ / Visual acuity ▸ ࢹ / Field of vision 72 https://www.w3.org/TR/low-vision-needs/ -
৭֮ʮҟৗʯͬͯʁ ʮ৭ͷݟ͑ํ͕ଞͷଟ͘ͷਓͱҟͳΔঢ়ଶʯ ▸ ৭ɺ৭ऑ ▸ ෆਖ਼͔֬ͭࠩผతͳͨΊΘΕͳ͘ͳͬͨ ▸ ৭֮ҟৗ ຊҩֶձɺ2005ʙ ▸
৭֮ଟ༷ੑ ຊҨֶձɺ2017ʙ ▸ ੜֶతʹҟৗͰͳ͘ଟ༷ੑͰ͋Δ 74 -
৭֮ʮҟৗʯͬͯʁ ৭֮ҟৗͷݪҼ͍Ζ͍Ζ ▸ ઌఱੑ৭֮ҟৗʢஉੑ4.5%ʙ10%ɺঁੑ0.2%ʙ0.4%ʣ ▸ Lਲ਼ମػೳෆશʹΑΔͷʢ1ܕ৭֮ / Protanopiaʣ ▸ Mਲ਼ମػೳෆશʹΑΔͷʢ2ܕ৭֮
/ Deuteranopiaʣ ▸ Sਲ਼ମػೳෆશʹΑΔͷʢ3ܕ৭֮ / Tritanopiaʣʢඇৗʹ·Εʣ ▸ ޙఱੑ৭֮ҟৗ ▸ ؟࣬ױʹΑΔͷ ▸ தਆܦܥ࣬ױʹΑΔͷ ▸ ΄͔͍Ζ͍Ζ 75 -
৭֮ʮҟৗʯͬͯʁ ઌఱੑ৭֮ҟৗ - ਲ਼ମͱછ৭ମ ▸ Lਲ਼ମͱMਲ਼ମʹҟৗ͕ൃੜ͢Δͱ͖ ▸ ৭ͱ৭ͷ۠ผ͕͘͠ͳΔ ▸ Xછ৭ମ্Ͱྡಉ࢜ʹฒΜͰ͍ΔͨΊɺෆަ伹͍͢͠
▸ ੑજੑҨΛ͢ΔͨΊɺஉੑͷํ͕ස͕ߴ͍ ▸ Sਲ਼ମʹҟৗ͕ൃੜ͢Δͱ͖ ▸ ੨৭ͱԫ৭ͷ۠ผ͕͘͠ͳΔ ▸ ৗછ৭ମ্ͰݦੑҨΛ͢Δ͕සͱͯগͳ͍ 76 -
৭֮ʮҟৗʯͬͯʁ ޙఱత৭֮ҟৗͷ۩ମྫ ▸ നোͰਫথମ͕ԫ৭͘ม৭͢Δ ▸ ੨৭͕ບʹಧ͖ʹ͘͘ͳΔ ▸ ؟࣬ױͰਲ਼ମࡉ๔͕ӨڹΛड͚Δ ▸ ಛʹSਲ਼ମ͔Β
▸ ࣬ױͰ৭ͷผ͕Ͱ͖ͳ͘ͳΔ ▸ നࠇͷੈքʹͳͬͯ͠·͏ͳͲ 77 -
৭֮ʮҟৗʯͬͯʁ ۤखͳ৭ͷΈ߹Θͤ ▸ ৭֮ҟৗʢ1ܕɺ2ܕʣ ▸ தؒʙ͍ͷ৭͕ۤख ▸ ੨ԫ৭֮ҟৗʢ3ܕʣ ▸ ͍ͷ৭͕ۤख
78 https://commons.wikimedia.org/wiki/File:Cone-response-en.png -
৭֮ҟৗͷํԿ৭ͷ۠ผ͕ۤखͳΜ͚ͩͬ……ʁ ৭֮ҟৗͷํԿ৭ͷ۠ผ͕ۤखͳΜ͚ͩͬ……ʁ ▸ ৭֮ҟৗͷݪҼఔʹΑͬͯҟͳΔ ▸ ৗੜ׆ʹࢧো͕ͳ͍ਓ͍Δʢଟ༷ੑͷ1ͭͱߟ͑ΒΕΔʣ ▸ ݈ৗऀͰಉ͡৭ͷݟ͑ํΛ͢ΔͱݶΒͳ͍ ▸ ৭Ͱ͔۠͠ผͰ͖ͳ͍UIάϥϑʹ͠ͳ͍
▸ ܗঢ়ͷҧ͍ృΓͭͿ͠ͷ༗ແͳͲΛซ༻ͯ͠Θ͔Γ͘͢͢Δ ▸ ϢχόʔαϧΧϥʔͱݺΕΔΧϥʔηοτΛ͏ͷΞϦ 81 -
৭֮ҟৗͷํԿ৭ͷ۠ผ͕ۤखͳΜ͚ͩͬ……ʁ iPhoneͱMacΛάϨʔεέʔϧԽͯ͠ΈΔ ▸ ৭ͷใ͕ͳͯ͘ཧղͰ͖Δ͔Ͳ͏͔֬ೝ ▸ XcodeɿOverride Environments > Accessibility ▸
iPhoneɿSettings > Accessibility > Display Accommodations > Color Filters ▸ MacɿSystem Preferences > Accessibility > Use grayscale 84 -
৭ͷ͍͠ʂ ࢲͨͪΛ·ͤΔ৭ͷ͍͠ ▸ ΠϥϨʹiPhoneͷεΫγϣΛஔͨ͠ΒϠόΠ৭ʹͳͬͨ ॿ͚ͯʂ ▸ HIG Colorʹࡌ͍ͬͯΔṖͷ৭ը૾Կऀʁ ▸ ৭֮ҟৗͷํԿ৭ͷ۠ผ͕ۤखͳΜ͚ͩͬ……ʁ
▸ ͰɺίϯτϥετൺͬͯԿͰ͚ͨͬ͠ʁ ▸ μʔΫϞʔυ͍ͬͯ͏ͷ͕࠷ۙͷྲྀߦΓͳͷʁͳΜͰʁ 86 -
ίϯτϥετɺײʁ WCAGͷඪϨϕϧ ▸ ϨϕϧAʢ࠷খɺΏΔ͍ඪʣ ▸ ϨϕϧAA ▸ ϨϕϧAAAʢݫ͍͠ඪʣ ▸ ͜ΕΛgeneral
policyʹ͢ΔͷΦεεϝ͞Ε͍ͯͳ͍ 90 -
ίϯτϥετɺײʁ ίϯτϥετײʹ͓͚Δඪ ▸ ϨϕϧAA ▸ 17ptະຬ4.5 : 1Ҏ্ʹ͢Δ ▸ 14ptҎ্ͷଠࣈͱ18ptҎ্3
: 1 ▸ ϨϕϧAAA ▸ 7 : 1Ҏ্ʹ͢Δ ▸ 14ptҎ্ͷଠࣈͱ18ptҎ্4.5 : 1 91 -
ίϯτϥετɺײʁ sRGB৭ۭؒʹ͓͚Δίϯτϥετൺͷఆٛ 1. ઢܗRGBʹ͢Δ 2. RGB͔ΒܹYΛग़͢ 3. ϑϨΞ / Typical
Viewing FlareΛߟྀͯ͠ൺΛग़͢ 95 RsRGB ≤ 0.03928 R = RsRGB 12.92 R = ( RsRGB + 0.055 1.055 ) 2.4 L = 0.2126R + 0.7152G + 0.0722B L1 + 0.05 L2 + 0.05 if then else -
ͰɺίϯτϥετൺͬͯԿͰ͚ͨͬ͠ʁ ͰɺίϯτϥετൺͬͯԿͰ͚ͨͬ͠ʁ ▸ ेͳίϯτϥετൺ͕ͳ͍ͱಡΈͮΒ͘ͳΔ ▸ എܠ৭ͱจࣈ৭ͷ໌Δ͞۩߹͕ಉ͡ʹͳΒͳ͍Α͏ʹ͢Δ ▸ μʔΫϞʔυ༻ͷσβΠϯܭࢉ͓ͯ͘͠ ▸ ίϯτϥετൺͷܭࢉࣜʹͪΌΜͱҙຯ͕͋Δ
▸ άάͬͯग़ͯ͘Δܭࢉπʔϧ͕ศརʂ ▸ ୡϨϕϧʹΑͬͯඪҟͳΔ ▸ ·ͣ4.5 : 1Λࢦͯ͠ؤுΔ 97 -
৭ͷ͍͠ʂ ࢲͨͪΛ·ͤΔ৭ͷ͍͠ ▸ ΠϥϨʹiPhoneͷεΫγϣΛஔͨ͠ΒϠόΠ৭ʹͳͬͨ ॿ͚ͯʂ ▸ HIG Colorʹࡌ͍ͬͯΔṖͷ৭ը૾Կऀʁ ▸ ৭֮ҟৗͷํԿ৭ͷ۠ผ͕ۤखͳΜ͚ͩͬ……ʁ
▸ ͰɺίϯτϥετൺͬͯԿͰ͚ͨͬ͠ʁ ▸ μʔΫϞʔυ͍ͬͯ͏ͷ͕࠷ۙͷྲྀߦΓͳͷʁͳΜͰʁ 98 -
ࢹ͕֮աහʁ ࢹ֮աහͱ ▸ ໌Δ͍ޫΛݟΔͱ಄͕௧͘ͳΔ ▸ υϥΠΞΠɺനোͳͲͷ؟࣬ױ ▸ ൃୡোʹΑΔײ֮աහ ▸ ͳͲͳͲ
▸ ݈ৗऀͰ໌Δ͍৭Λݟଓ͚Δͱ͕ർΕ͍͢Έ͍ͨ 100 ↓ ҉͍৭ͷσβΠϯͰରॲʂ -
ࢹ͕֮աහʁ iPhoneͰͰ͖ΔσΟεϓϨΠௐ ▸ ΧϥʔϑΟϧλʔΛઃఆ͢Δ ▸ ϕʔδϡͳͲ͓Έͷ৭߹͍ʹͰ͖Δ ▸ ʢ৭֮ҟৗͷਓ͚ͷઃఆ͋Δʣ ▸ ৭Λస͢Δ
▸ େͷΞϓϦനഎܠͳͷͰɺస͢Εࠇ͘ͳΔ ▸ μʔΫϞʔυʹ͢Δ 102 -
μʔΫϞʔυ͍ͬͯ͏ͷ͕࠷ۙͷྲྀߦΓͳͷʁͳΜͰʁ μʔΫϞʔυͷϝϦοτ ▸ ʹ༏͍͠ ▸ ʮ৭Λసʯͱҧ͍ɺҙਤ͠ͳ͍৭ʹ͞ΕͣʹࡁΉ ▸ Smart InvertͰ͋ͬͯը૾ແࣄ ▸
μʔΫϞʔυͳΒίʔϙϨʔτΧϥʔΛकΕΔ ▸ όοςϦʔফඅྔΛݮͰ͖Δ ▸ OLEDͷΈ 105 -
μʔΫϞʔυ͍ͬͯ͏ͷ͕࠷ۙͷྲྀߦΓͳͷʁͳΜͰʁ σΟεϓϨΠͷछྨ ▸ ӷথσΟεϓϨΠ ▸ डޫܕʢόοΫϥΠτ͋Γʣ ▸ iPhone XRʮLiquid Retina
HDσΟεϓϨΠʯʮIPSςΫϊϩ δʔࡌʯ ▸ ༗ػELσΟεϓϨΠ ▸ ࣗൃޫܕʢόοΫϥΠτͳ͠ʣ ▸ iPhone XSʮSuper Retina HDσΟεϓϨΠʯʮOLEDʯ 106 -
μʔΫϞʔυ͍ͬͯ͏ͷ͕࠷ۙͷྲྀߦΓͳͷʁͳΜͰʁ ྆ํͷػೳΛͬͨ࣌ͷڍಈ ▸ μʔΫϞʔυͱ৭స͕߹Θͬͯ͞ന͘ͳΔ ▸ Slack.app ▸ ৭సΛແޮʹͯ͠μʔΫϞʔυσβΠϯΛҡ࣋ ▸ Twitter.appɺYouTube.app
▸ var accessibilityIgnoresInvertColors: Bool { get set } 110 -
৭ͷ͍͠ʂ ࢲͨͪΛ·ͤΔ৭ͷ͍͠ ▸ ΠϥϨʹiPhoneͷεΫγϣΛஔͨ͠ΒϠόΠ৭ʹͳͬͨ ॿ͚ͯʂ ▸ HIG Colorʹࡌ͍ͬͯΔṖͷ৭ը૾Կऀʁ ▸ ৭֮ҟৗͷํԿ৭ͷ۠ผ͕ۤखͳΜ͚ͩͬ……ʁ
▸ ͰɺίϯτϥετൺͬͯԿͰ͚ͨͬ͠ʁ ▸ μʔΫϞʔυ͍ͬͯ͏ͷ͕࠷ۙͷྲྀߦΓͳͷʁͳΜͰʁ 111 -
ࢀߟจݙͱ͔ ΠϥϨͱ৭ਂ ▸ ৭ਂͱ - IT༻ޠࣙయ e-Words ▸ RGB Ϗοτਂͷ͏Μͪ͘
(લฤ) ʙ લఏࣝ - Qiita ▸ Why are the colors of certain PNG files getting distorted when opened in Illustrator? - Graphic Design Stack Exchange 115 -
ࢀߟจݙͱ͔ ΨΠυϥΠϯྨ ▸ Color and Contrast - Accessibility - Human
Interface Guidelines - Apple Developer ▸ Color - Visual Design - iOS - Human Interface Guidelines - Apple Developer ▸ Make apps more accessible | Android Developers ▸ Web Content Accessibility Guidelines (WCAG) 2.0 ▸ Understanding Success Criterion 1.4.3 | Understanding WCAG 2.0 ▸ Accessibility Requirements for People with Low Vision 116 -
ࢀߟจݙͱ͔ ࠞ৭ͱද৭ܥͱ৭֮ͱଞ͍Ζ͍Ζ ▸ ຊ৭࠼ֶձฤʢ2011ʣʰ৽ฤɹ৭࠼ՊֶϋϯυϒοΫɹୈ3൛ʱ౦ژେֶग़൛ձ ▸ Ճ๏ࠞ৭ - ͔΄͏͜Μ͠ΐ͘ | ଂඒज़େֶ
ܗϑΝΠϧ ▸ ޫͱ৭ͷ ୈҰ෦ʛςΫχΧϧΨΠυɾίϥϜʛCCSɿγʔγʔΤεגࣜձࣾ ▸ ༻ޠू ▸ XYZද৭ܥʛ৭ͷදΘ͠ํʛDIC Color Design, Inc. ▸ XYZ৭ۭؒʹഭΔ(2) - Qiita ▸ ৭ͷԽʹɺද৭ܥΛ༻͠·͢ɻ1-ֶָ͘͠Δܙା | ίχΧϛϊϧλ 117 -
ࢀߟจݙͱ͔ ΧϥʔϚωδϝϯτ ▸ ৭ۭؒ - ө૾ใϝσΟΞֶձ ▸ sRGB ▸ σδλϧөըͷΧϥʔϚωδϝϯτ
- ౦ژࠃཱۙඒज़ؗ ▸ ୈ7ճ "ۂઢඒ"͕৭࠶ݱੑͷܾΊखʹͳΔʁʕʕӷথσΟεϓϨΠͷʮΨϯϚʯΛΖ͏ | EIZOגࣜձࣾ ▸ ཧϕʔεϨϯμϦϯά -ϦχΞϫʔΫϑϩʔฤ (1)- | Cygames Engineers' Blog ▸ ΨϯϚิਖ਼ͷ͏Μͪ͘ - Qiita 118 -
ࢀߟจݙͱ͔ ৭֮ҟৗ ▸ ຊҩֶձ ҩֶ༻ޠࣙయ WEB൛ɿཧ͞Εͨ༻ޠʻ৭֮ؔ࿈༻ޠʹ͍ͭͯʼ ▸ ʮ༏ੑʯʮྼੑʯ༻ޠΘͣɹຊҨֶձ͕ݴ͍͑ɹɹ:ຊܦࡁ৽ฉ ▸ ৭֮ݕࠪද
ংจ – ެӹࡒஂ๏ਓ Ұ৽ձ ▸ ͜Εͬͯݟؒҧ͍ʁͷҟৗ͕Ҿ͖ى͜͢େࣄ݅ - NHK Ψοςϯʂ ▸ 2.৭֮োऀͷ࣮ଶͷѲ ▸ ৭֮ҟৗҨࢠͷݚڀʛ࣎լҩՊେֶɹ؟Պֶߨ࠲ ▸ ৭֮ҟৗ - ͷපؾඦՊʛࢀఱༀ ▸ ྆ଆޙ಄༿පมʹΑΔେੑ৭֮োͷ1ྫ - J-Stage ▸ ΧϥʔϢχόʔαϧσβΠϯͷͨΊͷ৭ऑγϛϡϨʔγϣϯ ▸ ৭֮ͷଟ༷ੑͱࢹ֮όϦΞϑϦʔͳϓϨθϯςʔγϣϯ 119 -
ࢀߟจݙͱ͔ ϢχόʔαϧσβΠϯͱ͔ 120 ▸ ΧϥʔϢχόʔαϧσβΠϯਪ৭ηοτ ▸ ౦ژΧϥʔϢχόʔαϧσβΠϯΨΠυϥΠϯ ▸ ҆શ৭ٴͼ҆શඪࣝʹؔ͢Δ JIS
վਖ਼ ▸ ҩֶੜֶऀ͖ ৭ͷਓʹΘ͔ΔόϦΞϑϦʔϓϨθϯςʔγϣϯ๏ ▸ ͔Θ͍͍ϑϦʔૉࡐू ͍Β͢ͱ ▸ ʰ͍Β͢ͱʱͷૉࡐΛ৭֮ো͕͍ͷࢹ͔ΒݟͯΈͨ | ͘Ζͻͭ͡ͷϝϞா -
ࢀߟจݙͱ͔ ίϯτϥετ ▸ ίϯτϥετൺͱ - IT༻ޠࣙయ e-Words ▸ ίϯτϥετײݕࠪ –
य़Ҫࢢɾখࢢͷ؟ՊͳΒฏా؟Պ ▸ ίϯτϥετײଌఆɾάϨΞݕࠪ | ͖͘ͳ౬ా؟Պ ެࣜαΠτ ▸ Understanding Success Criterion 1.4.3 | Understanding WCAG 2.0 ▸ A close look at the sRGB formula ▸ A Standard Default Color Space for the Internet - sRGB ▸ E: Viewing Flare - Digital Color Management - Wiley Online Library 121 -
ࢀߟจݙͱ͔ ࢹ֮աහͱμʔΫϞʔυͱ৭స ▸ ࢹ͕֮աහʮޫʯʮ৭ʯ͕ετϨεɿࠔΓ͝ͱͷτϦηπʢऔѻઆ໌ॻʣʛൃୡোϓϩδΣΫτ ▸ ᠤ໌ʢ·Ϳ͠͞ʣɿΑ͋͘Δ؟Պ࣬ױͷղઆ | ͭͭΈ؟ՊΫϦχοΫʢ࿅അ۠ʣ ▸ accessibilityIgnoresInvertColors
- UIView | Apple Developer Documentation ▸ iPhone XR - ༷ - Appleʢຊʣ ▸ iPhone XS - ༷ - Appleʢຊʣ ▸ ୈ4ճ TNʁVAʁIPSʁᴷᴷӷথύωϧۦಈํࣜͷΈͱಛΛΖ͏ | EIZOגࣜձࣾ ▸ ͍·͞Βฉ͚ͳ͍σδλϧٕज़ͷΈΛղઆɿເͷബܕςϨϏɺେܕ༗ػEL (1/3) - EDN Japan ▸ ༗ػEL࣌ʹʮμʔΫϞʔυʯΛੵۃ࠾༻͖͢ᴷᴷGoogle͕։ൃऀʹݺͼ͔͚ - Engadget ຊ൛ 122