Вивчення синтаксису кольорової схеми

Більшість програмістів мають свої особисті переваги щодо кольорових схем підсвічування синтаксису, але мені було цікаво, чи хтось коли-небудь робив фактичне наукове дослідження щодо того, якою буде найкраща кольорова схема? Я думаю, що таке дослідження виглядало б на таких речах, як читабельність коду, чи привертають погляд програміста до найважливіших частин тощо.

Можливо, це вже було зроблено для чогось на кшталт теми Visual Studio за замовчуванням, але я хотів би знати, чи є там загальнодоступні дослідження та що вони знайшли.

Конкретні кольорові схеми не можуть бути об'єктивно кращими, ніж усі інші кольорові схеми, їхнє ранжування було б індивідуально суб'єктивним на основі смакових та культурних факторів.

Однак застосовуються певні правила щодо читабельності / чіткості, використання в навколишніх світлих середовищах тощо тощо ..., які можуть переноситися з графічного дизайну / типографії, інтерфейсу людського комп'ютера та інших пов'язаних з цим досліджень.

Проект "Соляризований" Етана Шкуновер є цікавим твором: http://ethanschoonover.com/solarized

Вони мають лише помірковане нещодавнє дослідження, яке віддалено пов’язане з предметом, про який я знаю, - це дослідження з 2004 року: "Вплив поєднань кольорів тексту та фонових веб-сторінок на читабельність, збереження, естетику та поведінковий намір" від Холл та Ханни . Однак справа не в коді, а в веб-сторінках і єдиною кольоровою схемою, яку вони вважають, є кольори переднього плану та фону.

Я задавав питання щодо досліджень кольорових схем для програмістів на Skepics.SE: "Чи кращі кольорові схеми світлого та темного кольорів для екранів комп'ютерів для програмістів?" . На це вже не було відповіді майже 2 роки, хоча зазвичай на це питання досить швидко отримують відповідь. Що змушує мене вважати, що таких наукових досліджень немає.

Нещодавно ми провели дослідження користувача щодо презентацій коду, які візуально багатші за виділення синтаксису. Хоча це не зовсім дослідження схеми виділення синтаксису, ви можете зрозуміти це:

Д. Асенов, О. Хіллігес і П. Мюллер - Вплив багатших візуалізацій на розуміння коду, і ось відео 10-хвилинної розмови на CHI 2016.

Ми порівняли стандартне підсвічування синтаксису Eclipse з двома багатшими презентаціями коду з візуальними додатками, такими як:

• Контури замість фігурних брекетів
• Чергування кольорів тла замість коми для розділення елементів списку
• Піктограми замість деяких ключових слів
• Додаткові кольори фону для деяких висловлювань та виразів

Дослідження показало, що збільшення візуальної різноманітності презентації надало досить великий вплив на швидкість, з якою розробники могли зрозуміти структуру коду - час було скорочено до 75%. Важливо зазначити, що мова йде про прості запитання щодо структури коду (наприклад, "Чи є вкладені петлі в методі?"). Ми не перевіряли завдання, які потребують складного мислення (наприклад, "Що робить цей метод?"), Оскільки в них переважають навички людини, а не ефекти подання коду.

Цікавим висновком нашого дослідження є те, що ми не спостерігали жодної зорової перевантаження через багатші візуалізації. Незважаючи на те, що багато учасників сказали, що відчувають певну візуальну перевантаженість чи плутанину, дані, які ми зібрали (час, щоб дати відповідь і чи було це правильним), лише показали поліпшення з більш насиченою візуалізацією.

Щодо підсвічування синтаксису, наші висновки побічно говорять про те, що використання більшої візуальної різноманітності (наприклад, більше кольорів та кольорів для більшої кількості конструкцій програмування) буде корисним. Наприклад, тема з окремими кольорами для вбудованих типів, ключових слів контрольного потоку та інших ключових слів, ймовірно, покращить розуміння структури коду в деяких випадках, порівняно із звичайною темою, яка використовує один колір для всіх ключові слова.

Я не думаю, що такі дослідження існують. На практиці, коли компанія створює нову IDE, кольорова схема виділення синтаксису базується на існуючих схемах інших IDE.

Наприклад, тема Visual Studio за замовчуванням не має нічого нового, ані оригіналу . Синій колір роками використовувався для ключових слів, в тому числі в старих програмах ID ID. Те саме стосується зелених коментарів. Деякі кольори були більш-менш "новими", як чирок для назв класів, але ви легко можете зрозуміти причину вибору цих кольорів: було б розумно встановити колір, який не є далеко від синього (оскільки вони є дуже схожі на зарезервовані слова: Int32для .NET, intдля C # тощо), але він повинен залишатися основним кольором, відмінним від уже використовуваного синього.

А що робити з альтернативними схемами, як, наприклад, популярний світлий текст на темному тлі? Вони не створені вченим, який роками вивчав цю тему і робив кілька складних обчислень, щоб отримати точну ідеальну відповідність. Натомість розробник створює схему, читану для нього. Він ділиться ним на веб-сайті, і він стає популярним . Ось і вся магія.

Останнє: чи існують правила читабельності? Не надто багато.

• Здебільшого це щось суб’єктивне : ви не можете стверджувати, що синє ключове слово читабельніше, ніж фіолетове ключове слово, тому що хтось міг би відповісти, ніж за нього, на його моніторі фіолетове ключове слово набагато читабельніше синього .

• З іншого боку, це просто логічно . Чорно-біла схема не була б такою читабельною, як стандартна. Таким же чином ви не можете встановити ключові слова світло-жовтими, а коментарі - світло-сірими (скажімо #eee) на білому тлі, оскільки вони не читаються, і вам навіть не потрібно пояснювати, чому. Це ті самі правила, коли ви робите веб-сайт або друкуєте книгу чи будь-що інше.

Як вид грубого дослідження, на наведених нижче екранах показані 3 кольорові теми, які використовуються для виділення синтаксису XSLT. Я вибрав XSLT, оскільки він створює особливу проблему через велику кількість мовних елементів, а також тому, що багато розробників описують його як некрасиве.

Соляризований

Нічна ніч

Гітуб

Спостереження

Кількість кольорів, використаних у зразку, допомагає розрізнити різні мовні елементи, але це може виявити відволікання розробника.

Це допомагає перейти від холодних до теплих кольорів, якщо можливо, використовуючи холодні кольори для більш нейтральних частин мови. Альтернативою є перехід від пастельних відтінків до більш яскравих (насиченість відтінку).

Колір фону робить величезну різницю у сприйнятті кольорів переднього плану.

Деякі сусідні кольори переднього плану можуть спричинити погані зіткнення, які турбують око, зокрема, червоний і зелений не здаються добре.

З темним фоном легше забезпечити широкий спектр кольорів переднього плану з достатнім контрастом між собою та фоном.

Нарешті, зовнішні фактори, такі як навколишнє світло та якість та калібрування монітора, мають величезну зміну.

Висновок

Найкраще використовувати інструменти, які пропонують розширюваний спосіб встановлення кольорових тем, оскільки навряд чи якась одна кольорова тема буде задовольняти потреби всіх розробників, і навіть той самий розробник може часто змінювати свої переваги залежно від різноманітних факторів.

Ну, мабуть, першим питанням буде те, чи є білий фон такою чудовою ідеєю. Тільки тому, що вона наближається до справжнього паперу, і ми можемо знайти їх всюди в Інтернеті в ці дні, не обов'язково робить це хорошим (або, можна сказати, ідеальним) вибором.

Я пам’ятаю, що (багато-багато) років тому у нас була лише жовто-чорна «колірна гамма». І я також пам’ятаю, що це було не так вже й погано. Він не мав такого контрасту, як чорно-білий. Не так давно я дізнався, що це також краще для людського ока.

Іноді мені дуже цікаво, хто розробляє кольорові схеми, які, наприклад, постачаються з операційними системами. Зазвичай я їх ігнорую, але пам’ятаю, що бачив справді приголомшливі суміші рожевого та зеленого та чого іншого. Ну, я не вживаю наркотики ...

Існує кілька досліджень про те, які кольори роблять для вашої підсвідомості (заспокойтесь, викликайте агресію, ...). Я думаю, що загальновживані кольорові схеми дещо засновані на цьому. Можливо, вони просто додали читабельності. Кодування не повинно бути місією самогубства.

Але що стосується кольорової гами поточних ІДЕ, я з цим добре. Давайте зіткнемося з цим: проста ідея, що стоїть за ним, - це полегшити пошук чогось, що відрізняється від загального «кодового шуму». І якщо чесно, мені не дуже важливо, які кольори вони використовують, щоб це допустити. Це просто не повинно зашкодити моїм очам або спалити частину коду на потилиці, як яскраво-червоний на якомусь зеленому тоні.

Кодування повинно бути розслаблюючим. І саме це мені.