構文強調配色の研究

ほとんどのプログラマーは、構文を強調するカラースキームに対して独自の個人的な好みを持っていますが、最高のカラースキームが何であるかについて実際の科学的研究を行ったことはありますか？このような研究では、コードの読みやすさ、プログラマーの目が最も重要な部分に向けられているかどうかなどに注目すると思います。

おそらく、これはデフォルトのVisual Studioテーマのようなものについてはすでに行われていますが、公開されている研究があるかどうか、そしてそれらが見つけたものを知りたいのです。

特定の配色は、他のすべての配色よりも客観的に優れていることはできません。それらのランキングは、味と文化的要因に基づいて個々に主観的です。

ただし、読みやすさ/明確さ、特定の環境光環境などでの使用などの特定のルールが適用され、これらはグラフィックデザイン/タイポグラフィ、ヒューマンコンピューターインターフェイス、およびその他の関連研究から引き継がれます。

Ethan SchoonoverのSolarizedプロジェクトは興味深い作品です：http ://ethanschoonover.com/solarized

彼らリモートで私の知っている主題に関連しているだけで適度に最近の研究は、2004年からのものです：「読みやすさ、保持、美学と行動意図にウェブページのテキストの背景色の組み合わせの影響」ホール＆ハンナによります。ただし、コード用ではなくWebページ用であり、考慮される唯一の配色は前景色と背景色です。

Skepics.SEのプログラマー向けの配色に関連する研究について質問しました。「コンピューター画面の明暗の配色は、プログラマーにとってより良いですか？」。現在、ほぼ2年以内に回答されていませんが、通常、このタイプの質問は非常に迅速に回答されます。そのため、そのような科学的研究はないと信じています。

最近、構文の強調表示よりも視覚的に豊かなコードプレゼンテーションに関するユーザー調査を行いました。構文の強調表示スキームに関する研究ではありませんが、洞察に満ちたものになるでしょう。

D.アセノフとO.ヒリゲスとP.ミュラー- コードの理解におけるリッチな視覚化の効果。 ここに、CHI 2016 での10分間の講演のビデオがあります。

標準のEclipse構文の強調表示と、次のような視覚的な追加機能を備えた2つのより豊かなコードのプレゼンテーションを比較しました。

• 中括弧の代わりにアウトライン
• リスト要素を区切るために、コンマではなく背景色を交互に使用
• 一部のキーワードではなくアイコン
• 一部のステートメントおよび式の追加の背景色

この調査では、プレゼンテーションの視覚的な多様性を高めると、開発者がコード構造を理解できる速度にかなり大きな影響を与えることが示されました。時間は最大75％短縮されました。これはコード構造に関する単純な質問に関するものであることに注意することが重要です（例：「メソッドにネストされたループがありますか？」）。複雑な思考を必要とするタスク（「この方法は何をするのか？」など）はテストしませんでした。これらは、コードプレゼンテーションの効果ではなく、個人のスキルに支配されるためです。

私たちの研究から興味深い発見は、より豊かな視覚化のために視覚的な過負荷を観察しなかったことです。多くの参加者が視覚的な過負荷や混乱を感じていると言っていたとしても、収集したデータ（回答を提供する時間とそれが正しいかどうか）は、より豊かな視覚化で改善を示しました。

構文の強調表示に関して、私たちの調査結果は、より視覚的な多様性（たとえば、より多くの色、より多くの種類のプログラミング構成要素の色）を使用することが有益であることを間接的に示唆しています。たとえば、組み込みタイプ、制御フローキーワード、および残りのキーワードに個別の色を使用したテーマは、すべての色に単一の色を使用する単純なテーマと比較して、場合によってはコード構造の理解を向上させる可能性がありますキーワード。

そのような研究は存在しないと思う。実際には、会社が新しいIDEを作成するとき、構文を強調表示するカラースキームは、他のI​​DEの既存のスキームに基づいています。

たとえば、デフォルトのVisual Studioテーマには、新しいものもオリジナルのものもありません。青い色は、古いAda IDEを含め、長年にわたってキーワードに使用されていました。緑のコメントについても同じです。クラス名のティールのように、多少「新しい」色もありましたが、これらの色の選択の背後にある理由を簡単に理解できます。予約語によく似ています：Int32.NET、intC＃など）、ただし、既に使用されている青とは異なる基本色のままにする必要があります。

では、暗い背景に人気のある明るいテキストのような代替スキームはどうでしょうか？それらは、何年も対象を研究し、完全に完全に一致するように複雑な計算を行った科学者によって作成されたものではありません。代わりに、開発者は自分が読み取り可能なスキームを作成します。彼はそれをウェブサイトで共有し、人気を博しています。それがすべての魔法です。

最後に、読みやすさのルールはありますか？多すぎない程度に。

• ほとんどの場合、それは主観的なものです。青のキーワードは紫のキーワードより読みやすいと主張することはできません。 。

• 別の部分については、論理的です。白黒のスキームは、デフォルトのスキームほど読みやすくありません。同様に、#eee白い背景ではキーワードを明るい黄色に設定し、コメントを明るい灰色に設定することはできません（たとえば）、それは読みにくいため、理由を説明する必要さえありません。これらは、ウェブサイトを作成するときや本を印刷するときなど、同じルールです。

一種の大まかな研究として、以下のスクリーンショットは、XSLTの構文強調に使用される3つのカラーテーマを示しています。XSLTを選択したのは、言語要素が多数あるため、また多くの開発者がXSLTをいものと表現しているため、XSLTが特定の課題を引き起こすためです。

ソラリゼーション

トムモローナイト

Github

観察

サンプルで使用されている色の数は、さまざまな言語要素を区別するのに役立ちますが、開発者の気を散らすものになる可能性があります。

可能であれば、言語のよりニュートラルな部分に冷たい色を使用して、冷たい色から暖かい色に進むのに役立ちます。別の方法は、パステル調の色調からより鮮やかな色調に変えることです（色相の彩度）。

背景色は、前景色の知覚に大きな違いをもたらします。

いくつかの隣接する前景色は、目を乱す悪い衝突を引き起こす可能性があり、特に赤と緑はうまく調和しないようです。

背景が暗いと、相互および背景との十分なコントラストを備えた幅広い前景色を提供しやすくなります。

最後に、環境光やモニターの品質とキャリブレーションなどの外部要因は大きな違いをもたらします。

結論

単一のカラーテーマがすべての開発者のニーズを満たす可能性は低いため、カラーテーマを設定する拡張可能な方法を提供するツールを使用することをお勧めします。同じ開発者でさえ、さまざまな要因に応じて設定を頻繁に変更する場合があります。

まあ、私は最初の質問は白い背景がそのような素晴らしいアイデアであるかどうかだと思います。それが本物の紙に近づき、最近インターネット上のあらゆる場所を見つけることができるからといって、必ずしもそれが良い（または完璧と言ってもよい）選択になるわけではありません。

（多くの）何年も前には、黒地に黄色の「配色」しかなかったのを覚えています。そして、それはそれほど悪くなかったことも覚えています。黒と白のコントラストはありませんでした。少し前に、人間の目にも良いことを学びました。

たとえば、オペレーティングシステムに同梱されている配色を誰が設計しているのか、本当に疑問に思うことがあります。私は通常それらを無視しますが、私はピンクと緑とその他の本当に素晴らしい混合物を見たことを覚えています。まあ、私は薬をしません...

色があなたの潜在意識にどのような影響を与えるかについていくつかの研究があります（落ち着いて、攻撃を引き起こします...）。私は、一般的に使用されている配色は、それにある程度基づいていると考えています。読みやすさを追加しただけかもしれません。コーディングは自殺任務であってはなりません。

しかし、現在のIDEの配色に関する限り、私はそれで問題ありません。それに直面しましょう：その背後にある単純なアイデアは、一般的な「コードノイズ」とは異なるものを見つけやすくすることです。そして正直に言うと、私は彼らがそれを可能にするためにどの色を使用するかはあまり気にしません。目を傷つけたり、コードの一部を私の頭の後ろに燃やしたりしないでください。緑の色調に赤く光るようなものです。

コーディングはリラックスする必要があります。それが私にとってのことです。