目に優しいプログラミング環境

自分はプログラミングしていても全く目が疲れず、徹夜した次の日でも平気でパソコンを見続けられる人間でした。

しかし、今年に入って目のトラブルが相次ぎ、見えるということが当たり前でないということを気付かされました。
これからは目を労っていきたい。

ということで、目に優しいプログラミング環境を目指し、色々と調べたことをまとめました。

※ 以下は、私個人が集めた情報を元に判断・実践していることです。参照資料の蓋然性も独断で評価しています。有効性評価がなされた解決策でもありません。各個人でご判断ください。


# コンピュータービジョン症候群

コンピュータを利用することで起こる症例の総称。

日本語の情報がとても少ないのですが、日本ではほとんど同じ症状を指す言葉『VDT 症候群』『IT眼症』『テクノストレス眼症』の方が一般的なようです。一般向けとしては『デジタル眼精疲労』『スマホ症候群』などと呼ばれることも。

[コンピュータービジョン症候群 - POSTD](https://postd.cc/computer-vision-syndrome/)

> この症候群は、Wikipediaでは次のように定義されています。
> 
> > コンピュータービジョン症候群（CVS）とは、コンピュータなどの表示装置に長時間途切れることなく目の焦点を合わせた結果の疾患である。CVSの症状には、頭痛、かすみ目、首の痛み、目の充血、疲労、眼精疲労、ドライアイ、目のかゆみ、複視、めまい、多視、目の焦点を再調節しにくいことなどがある。これらの症状は不適切な照明条件（すなわち、眩しい・明るい天井照明）や、目の周りの空気の流れ（例えば、天井換気、ファンからの直接風）によって悪化することがある。

[IT眼症の実際とその治療法 - 神奈川産業保険交流会](http://www.kanagawas.johas.go.jp/files/libs/102/201711211746574437.pdf)

色々と資料を見ていると、大体以下の 3 つが大きな要因のようです。

## 原因 1: 目の乾燥

集中して画面を見ることで、瞬きの回数が低下する。
また、ディスプレイ位置が高いと目が上を向き露出される眼球表面積が増え、蒸発する水分量が増える。

これらによりドライアイが起こると、目のかすみや眼精疲労、目の違和感 等へとつながっていきます。

- [ドライアイ - 日本眼科学会](http://www.nichigan.or.jp/public/disease/hoka_dryeye.jsp)
- [ドライアイとは - ドライアイ研究会](http://www.dryeye.ne.jp/dryeye/index.html)
- [ドライアイとは - Santen](https://www.santen.co.jp/ja/healthcare/eye/library/dryeye/)

## 原因 2: 視力の矯正度合い

近視の場合、メガネで遠くがきちんと見えるよう調整されているケースも多いらしく、そのメガネで近くを見続けることで目のピント調節機能を担う筋肉 ( 毛様体筋 ) に疲労が起こる。

調節性眼精疲労というらしいです。

- [調節性眼精疲労 - IT眼症の実際とその治療法 - 神奈川産業保険交流会](http://www.kanagawas.johas.go.jp/files/libs/102/201711211746574437.pdf)
- [屈折異常と眼精疲労 - 日本眼科医会](https://www.gankaikai.or.jp/health/28/06.html)
- [眼精疲労とは - かとう眼科](https://www.katoganka.net/%E7%9C%BC%E7%B2%BE%E7%96%B2%E5%8A%B4%E3%81%A8%E3%81%AF/)
- [目が疲れるあなたへ - 酒井病院](http://sakai24.org/publics/index/37/b_id=156/r_id=226/detail=1)

根本的な解決策は、眼科のお医者さんに検査してもらい、パソコンなどの近距離作業に適切なメガネを作ることでしょう。

## 原因 3: 明るすぎ、眩しすぎ ( 高い輝度 )

眩しすぎると、目のストレスが掛かる為、目が疲れる。

これを眼精疲労の原因としている情報はとても多くあったが、どういった原因でそれが起こるのか、尤もらしい情報源を見つけることはできなかった。

## 対策

[IT眼症の実際とその治療法 - 神奈川産業保険交流会](http://www.kanagawas.johas.go.jp/files/libs/102/201711211746574437.pdf)
[VDT作業における労働衛生管理のためのガイドライン - 厚生労働省労働基準局](https://www.mhlw.go.jp/file/06-Seisakujouhou-11200000-Roudoukijunkyoku/0000184703.pdf)
[新VDT作業ガイドラインのポイント -厚生労働省東京労働局](https://jsite.mhlw.go.jp/tokyo-roudoukyoku/jirei_toukei/anzen_eisei/toukei/anzen-vdt.html)

様々資料を見ていると、

- 一定間隔での目の休憩 ( 20-20-20, 1時間毎に5分 )
- 乾燥対策
- 視力矯正具合の検査・調整

などが上げられています。

### ● Pomodoro Tracker

Pomodoro Tracker は、ポモドーロテクニックを実現するための Web アプリケーション。
Web ページを開いて開始をするだけで使えるとても簡単なポモドーロタイマーで、デスクトップ通知もしてくれるので気が付きやすいです。
https://pomodoro-tracker.com/?lang=ja

ポモドーロテクニックとは、**25 分集中したら、5分休憩する** という仕事術です。
[今日から始める生産性アップ術。ポモドーロ・テクニック再入門ガイド - lifehacker](https://www.lifehacker.jp/2014/07/140714pomodoro.html)

Pomodoro Tracker 以外にも、ポモドーロテクニックを実現するためのデスクトップアプリ, Web アプ, スマホアプリ, ブラウザ拡張など様々作成されていますので、自分にあったものを選ぶと良いとおもいます。

どの資料でも、20分~1時間毎に一度休憩を挟むのが目に良いと言われていますので、ポモドーロテクニックで十分代用できると思います。

### ● Awair

Awair は、化学物質, 微細なホコリ, CO2, 温度, 湿度を監視し、既定値を超えたら通知してくれる IoT デバイス。
https://getawair.com/

Wifi 接続機能を持ち、スマートフォンと連携も可能。IFTTT 連携や Alexa スキルもあります。

湿度監視の為だけに導入するには少しコストがかかりすぎている気はしますが、環境管理の一貫で導入するのはありかと思います。

湿度監視機能を持った IoT 機器は多いので、他のデバイスでも実現は可能でしょう。
また、湿度監視はとても簡単で安価にできるので、RaspberryPi や Arduino で自作することも容易です。

### ● Blink Detection

瞬き自体を検出するという試みもあります。

https://github.com/brownhci/WebGazer
https://github.com/justadudewhohacks/face-api.js

WebGazer は、左右の瞬きの検知まで行ってくれます。
サンプルを作りたかったのですが、顔検出の学習データの問題か、私の顔では検出されず、白いシャツの襟の部分にずっと Face Landmark が張り付くという状態でした。残念。

face-api は、内部的には Tensorflow.js を利用して、高精度に Face Landmark までは検出してくれますが、瞬き検出には対応してないようで、自作する必要があります。

この辺は、もう少し頑張ってみたいと思います。

### ● それ以外の対策

まず重要な事は、**明確な異常を感じているなら、直ぐに眼科へ行くべき** ということです。
たとえ明確な異常が無くとも、1年に1度くらいは眼科で検診を受けたほうが良いとされています。

また、眼科での検診とは別に、メガネの度数が合っているかは一度詳細に調べてもらったほうが良いと思います。
私も検査の結果、プログラムするのには強すぎるメガネをしていると指摘され、メガネを作り直すことになりました。

#### おまけ : レッド・グリーンテスト

矯正度合いを確認する為の簡易的な検査として、レッド・グリーンテストというものがあります ( TDD の用語ではありません )。
赤色と緑色の屈折率の違いから、赤は後ろ側に、緑は手前側に少しずれて焦点を結ぶ ( 色収差 ) ので、赤が見やすければ近視矯正が弱く、緑が見やすければ近視矯正が強いということになるという原理です。

これは、Web でも簡単に体験できるので、試しにやってみてください。『レッドグリーンテスト』で検査すると山程出てきます ( このテストをパスしたとしても、それでメガネが合っているという事ではなく、あくまで目安です )。

# ブルーライト

悪名高きブルーライト。

可視光の中でも短波長でエネルギーが強く、散乱もしやすいため目に悪影響を与えるんだと言われると、なるほどその通りだと信じてしまいそうですが、果たしてどの程度の影響があるのでしょうか。

## 原因

ブルーライトが及ぼす悪影響としては、主に以下の 3 点が上げられます。

1. 網膜への影響
2. 目の疲れを誘発
3. サーカディアンリズム ( 概日リズム、いわゆる体内時計 ) への影響

- [ブルーライトが私たちの眼に及ぼす影響 - JINS](https://www.jins.com/jp/jins-screen/issue/index.html)
- [ブルーライトとは - ブルーライト研究会](http://blue-light.biz/about_bluelight/)

## 疑問 : 本当にブルーライトは悪者なのか

実は少し前に、米国眼科学会 ( AAO ) が『ブルーライトは網膜の損傷を進めないし、加齢黄斑変性症を進行させたり失明させたりはしない』という発表をしたそうです。

- [「ブルーライトは目を傷めない」「PC用メガネは推奨しない」…米眼科学会が表明 - ビジネスジャーナル](https://biz-journal.jp/2018/10/post_25015.html)
- [米国眼科学会｢ブルーライトは失明させない。PC用メガネも推奨しない｣](https://www.lifehacker.jp/2018/10/smartphones-arent-ruining-your-eyes.html)

医学的に証明されているのは睡眠への影響であり、網膜や黄斑に対しての悪影響については科学的根拠は無いとのこと。

## 原因 : 目の疲れ

上記で否定されているのは、網膜の損傷や加齢黄斑変性症の進行についてですが、目の疲れについては明確に否定がなされているわけではありませんでした。

よくよく調べてみると、網膜への悪影響を明記している所は案外少なく、色収差による見づらさや散乱によるにじみが引き起こすピント調整への影響のみを載せているページも多いです。

- [ブルーライト対策、していますか？ - 武田薬報Web](https://takeda-kenko.jp/yakuhou/feature/bluelight/vol01.html)
- [LED・ブルーライトについて - Santen](https://www.santen.co.jp/ja/healthcare/eye/products/otc/sante_pc/light/)

## 対策 : f.lux

これは、一日通してディスプレイのブルーライトの量を適切に調節してくれるツールです。
自分が利用するパソコンには、全てこの f.lux を導入しています。
https://justgetflux.com/

緯度経度を入力すると、自動で『昼は明るく、夜は暗く』と調節してくれます。カスタマイズも可能です。

また、ブルーライトの概日リズム ( circadian rhythm ) への影響について、独自に論文等をまとめてくれていてとても参考になります。
https://justgetflux.com/research.html

面白いことに、Hue 等の IoT 証明デバイスの操作をできるらしいです。
https://justgetflux.com/lighting/

## 結論 : ブルーライトを減らすことは、目に優しいのか

どうやら、網膜や特定疾患への悪影響に関しては、ブルーライトカットに科学的根拠は今の所無いようです。
眼精疲労に関しても、取り立てて青い光だけが強く眼精疲労を起こすという資料も見つけられていません。

しかし、夕方に向けて f.lux で画面がどんどん黄色くなっていくのは夕日が沈んでいくみたいでとても気持ちよく、プラシーボ効果も相当ありそうです。
良い睡眠を取って、体全体を休めることで、間接的に目を労りたいと思います ( 自己正当化 )。


# ダークテーマ

『目に優しいのでダークテーマにしてます』
よく聞くセリフで、自分もそう考えていました。

しかし、何故ダークテーマは目に優しいのか。本当に目に優しいのか。目に優しいのなら、どの様に優しいのか。

## 議論 : ダークテーマは本当に目に優しいのか

**Light THeme ( Dark-on-Light ) or Dark Theme ( Light-on-Dark )**

どちらが良いのかについて科学的にまとめられた資料を見つけることはできませんでした。
しかし、ユーザの間で科学的成果を援用しながら議論されている場面はいくつか見つけることができました。

例えば、Stack Exchange にて以下のような議論がなされています。

- [What are the negative and positive aspects of dark color scheme? - Stack Exchange](https://ux.stackexchange.com/questions/8153/what-are-the-negative-and-positive-aspects-of-dark-color-scheme)
- [Dark or white color theme is better for the eyes? - Stack Exchange](https://ux.stackexchange.com/questions/53264/dark-or-white-color-theme-is-better-for-the-eyes)
- [Which color scheme to choose for applications that require long work hours? -  - Stack Exchange](https://ux.stackexchange.com/questions/52833/which-color-scheme-to-choose-for-applications-that-require-long-work-hours?noredirect=1&lq=1)

これら以外にも、様々な議論を見て、いくつかの視点が浮かび上がってきました。

### 視点 1 : 視認性の良さ

テキストの視認性が良ければ、目に負担をかけないという考え方です。

ライトテーマの方が視認しやすいという意見が多かったように思います。
書籍は通常白地に黒文字ですし、この視点だけで考えれば納得です。

乱視があるとダークテーマは視認し辛いという意見もありました。
ただ、色に関してはダークテーマの方が見分けやすいともあります。

### 視点 2 : 周辺環境との明るさの差

周囲とディスプレイの明るさが違いすぎると、虹彩が周辺に合わせつつディスプレイを見るので負担となるという考え方です。

周囲が明るいと、虹彩が閉じてダークテーマの白文字と灰色文字を見分けるのは難しくなる。
周囲が暗いと、虹彩が開いてライトテーマの白背景部分が強く目に入り眩しくなる。

### 視点 3 : 明るさの絶対値 ( 輝度 )

ライトテーマの白背景部分の強い光が目に入り続けること自体が負担を生むという考え方です。
ただ、これには前述のブルーライトも絡んでややこしくもあります。

これに関しては、感覚的にはとても理解できます。
どの程度の強さの光であればどの程度負担がかかるのかの定量的な議論は今後も探していきたいと思います。

### 視点 4 : グレア

ディスプレイがグレアの場合、ダークテーマだと周辺が映り込み無駄に目に負担がかかるという考え方です。
そもそも画面がグレアであることが既に問題な気はしますが。

### 視点 5 : 飛蚊症

特殊な例かも知れませんが、飛蚊症があるとライトテーマでは目立って気になるという意見もあります。
私自身もいくつか飛んでおりますが、この点では圧倒的にダークテーマの方が楽です。

### 結局、どちらが良いのか

断片的には実験結果を元にした説得力のある意見もあるのですが、総合してどっちが良いのかというまとまった研究結果などは見つけられませんでした。

てっきり、ダークテーマの方が目に優しんだと思いこんでいましたが、意外とそうでも無いのかも知れません。

**もうこれは、好みの問題なのでは**。

以下ではプログラミング環境をダークテーマにする事についてまとめました。

## 対策 : エディタ

プログラマがおそらく最も長い時間向き合うこととなる VS Code や Atom, IntelliJ などのエディタ, IDE はそのほとんどがテーマ機構を持っており、ダークテーマが提供されています。

- [VS Code Themes](https://marketplace.visualstudio.com/search?target=VSCode&category=Themes&sortBy=Downloads)
- [Atom Themes](https://atom.io/themes)
- [Sublime Text Theme](https://packagecontrol.io/browse/labels/theme)
- [IntelliJ Theme](http://color-themes.com)

## 対策 : OS

最近は macOS も Windows もダークテーマに対応しています。

- [Windows 10のエクスプローラ「ダークテーマ」が完成へ　Macとともに2018年秋は暗いUIがトレンドに - IT media](http://www.itmedia.co.jp/pcuser/articles/1808/09/news104.html)

## 対策 : ブラウザ

一番難しいのがブラウザです。他のアプリケーション同様、ブラウザ自身の見た目はテーマ機構により変更可能ですが、**肝心のコンテンツは白地に黒ばかり**。Qiita も StackOverflow も Github も全て。

Chrome 拡張の中には、コンテンツのテーマを強制的にダークテーマにするものもいくつかあります。

- [Dark Reader](https://chrome.google.com/webstore/detail/dark-reader/eimadpbcbfnmbkopoojfekhnkhdbieeh/related)
- [Darkness](https://chrome.google.com/webstore/detail/darkness-v2-beautiful-dar/imilbobhamcfahccagbncamhpnbkaenm/related)

しかし、試してみましたが、暗いアイコンやラインが見えなくなったり、動的に生成されるコンテンツが一旦白くなってから黒くなってを繰り返したりと、正直実用は辛そうでした。

## 結論 : ダークテーマは目に優しいのか

『見やすさ』を客観的にどう扱うのかはとても難しいので、もう人それぞれでも良い気がします。
昼と夜で最適なテーマが違うということであれば、、昼夜で変化するようなテーマ機構が各アプリケーションにあればなぁとか思っています。

# まとめ

現在は、f.lux と Pomodoro Tracker を利用しています。ポモドーロの 5 分休憩は長すぎるので、1 分に変更して使ってます。
Blink Detection はあと少しで実現しそうなので、もう少しやってみようと思っています。

# 感想

プログラムをする上で最も重要と言っても良い器官である目。
これからも末永くプログラミングを行うためにも、目を大事にしていきたいと心から思いました。

# 追記

プログラミングにおいて目は確かに重要なのですが、目が見えなくともプログラミングはできます。

- [目が見えなくてもプログラミングできるよ - Qiita](https://qiita.com/moutend/items/2696139d0b96805ea415)
- [生まれつき盲目の男性がAmazonでソフトウェアエンジニアとして働く - Gigazine](https://gigazine.net/news/20180424-blindness-writing-code-amazon/)

VS Code はアクセシビリティにも配慮がなされています。

- [Accessibility - VS Code](https://code.visualstudio.com/docs/editor/accessibility)

また、色覚異常の方でも見やすいテーマもあります。

- [Light Theme for Color Blind People - VS Code Theme](https://marketplace.visualstudio.com/items?itemName=harai.light-theme-for-color-blind-people)
- [colorblind-syntax - Atom Theme](https://atom.io/themes/colorblind-syntax)

# あとがき

※ この記事は個人の見解であり、所属する組織を代表するものではありません。