Badania schematów kolorów podkreślających składnię


39

Większość programistów ma swoje osobiste preferencje dotyczące schematów kolorów podkreślających składnię, ale zastanawiałem się, czy ktoś kiedykolwiek przeprowadził rzeczywiste badania naukowe nad tym, jaki byłby najlepszy schemat kolorów? Wyobrażam sobie, że takie badanie dotyczyłoby takich rzeczy, jak czytelność kodu, to, czy oczy programisty są przyciągane do najważniejszych części itp.

Być może zostało to już zrobione dla czegoś takiego jak domyślny motyw Visual Studio, ale chciałbym wiedzieć, czy istnieją dostępne publicznie badania i co znaleźli.


Nie sądzę, żeby ktokolwiek specjalnie studiował schematy kolorowania składni, ale zasady z innych dziedzin wciąż się utrzymują. Na przykład kolor czerwony zwraca uwagę.
Maks.

+1 Zastanawiam się nad tymi samymi lub kolorami aplikacji i systemu operacyjnego.
stijn

Odpowiedzi:


17

Określone schematy kolorów nie mogą być obiektywnie lepsze niż wszystkie inne schematy kolorów, ich ranking byłby indywidualnie subiektywny w oparciu o smak i czynniki kulturowe.

Obowiązują jednak pewne zasady dotyczące czytelności / przejrzystości, stosowania w szczególnych warunkach oświetlenia otoczenia itp. Itd., Które zostałyby przeniesione z projektu graficznego / typografii, interfejsu człowiek-komputer i innych powiązanych badań.

Intrygujący projekt Ethana Schoonovera jest interesującym dziełem: http://ethanschoonover.com/solarized


Możliwe jest uzyskanie obiektywnie najlepszej kolorystyki lub przynajmniej subiektywnej dla grupy. Kiedy mówimy „najlepiej”, mamy na myśli średnio dla większości populacji lub naszej subkultury / populacji. Wszystko, czego potrzebujemy, to jakiś sposób zamawiania przedmiotów i odpowiedzi na wyjaśnienia („X najlepiej jest podać Y”). W przeciwnym razie „najlepszy” traci sens. Istnieje również realna możliwość stworzenia najlepszych generatorów schematów kolorów, które uwzględniają każde osobliwe dziwactwo, skanując mózg (dekady w przyszłości).
Annan

@Annan: Robienie tego w grupie przeciętnie, choć zwykle prowadzi do doświadczenia, które jest zdecydowanie gorsze niż nawet przeciętne dla ludzi na skrajach spektrum. Skanowanie mózgu ... tak, byłoby miło, ale przewiduję, że WW3 nastąpi wcześniej.
Darren Ringer

7

Jedynie umiarkowanie niedawne badania, które są zdalnie związane z tematem, o którym wiem, pochodzą z 2004 roku: „Wpływ kombinacji tekstu i tła strony internetowej na czytelność, retencję, estetykę i intencje behawioralne” Hall & Hanna . Nie dotyczy to jednak kodu, ale stron internetowych, a jedynym schematem kolorów, jaki uważają, są kolory pierwszego planu i tła.

Zadałem pytanie na temat schematów kolorów związanych z badaniami dla programistów na Skepics.SE: „Czy schematy kolorów jasnych na ciemnych ekranów komputerowych są lepsze dla programistów?” . Odpowiedzi nie udzielono od prawie 2 lat, podczas gdy zwykle na tego typu pytania uzyskuje się dość szybką odpowiedź. Co prowadzi mnie do przekonania, że ​​nie ma takich badań naukowych.


7

Niedawno przeprowadziliśmy badanie użytkowników dotyczące prezentacji kodu, które są wizualnie bogatsze niż wyróżnianie składni. Chociaż nie jest to studium na temat schematów podświetlania składni, może okazać się wnikliwe:

D. Asenov i O. Hilliges i P. Müller - Wpływ bogatszych wizualizacji na rozumienie kodu. Oto wideo z 10-minutowej rozmowy na CHI 2016.

Porównaliśmy standardowe podświetlanie składni Eclipse do dwóch bogatszych prezentacji kodu z dodatkami wizualnymi, takimi jak:

  • Kontury zamiast nawiasów klamrowych
  • Naprzemienne kolory tła zamiast przecinków do oddzielania elementów listy
  • Ikony zamiast niektórych słów kluczowych
  • Dodatkowe kolory tła dla niektórych instrukcji i wyrażeń

Badanie wykazało, że zwiększenie różnorodności wizualnej prezentacji miało dość duży wpływ na szybkość, z jaką programiści mogli zrozumieć strukturę kodu - czas został skrócony nawet o 75%. Należy zauważyć, że chodzi o proste pytania dotyczące struktury kodu (np. „Czy w metodzie są zagnieżdżone pętle?”). Nie testowaliśmy zadań wymagających złożonego myślenia (np. „Co robi ta metoda?”), Ponieważ są one zdominowane przez umiejętności danej osoby, a nie efekty prezentacji kodu.

Interesującym wnioskiem z naszego badania jest to, że nie zaobserwowaliśmy żadnego wizualnego przeciążenia z powodu bogatszych wizualizacji. Mimo że wielu uczestników stwierdziło, że odczuwa pewne wizualne przeciążenie lub zamieszanie, dane, które zebraliśmy (czas na udzielenie odpowiedzi i czy była poprawna), pokazały poprawę jedynie dzięki bogatszym wizualizacjom.

W odniesieniu do podświetlania składni, nasze ustalenia pośrednio sugerują, że użycie większej różnorodności wizualnej (np. Więcej kolorów i kolorów dla większej liczby typów konstrukcji programistycznych) będzie korzystne. Np. Motyw z osobnymi kolorami dla wbudowanych typów, słów kluczowych z kontrolą przepływu i resztą słów kluczowych może w niektórych przypadkach poprawić zrozumienie struktury kodu, w porównaniu do zwykłego motywu, który używa jednego koloru dla wszystkich słowa kluczowe.


2

Nie sądzę, że takie badania istnieją. W praktyce, gdy firma tworzy nowe IDE, schemat kolorów podświetlania składni oparty jest na istniejących schematach innych IDE.

Na przykład domyślny motyw programu Visual Studio nie ma nic nowego ani oryginalnego . Kolor niebieski był używany przez lata od słów kluczowych, w tym przez stare IDE Ady. To samo dotyczy zielonych komentarzy. Niektóre kolory były mniej więcej „nowe”, np. Turkusowy dla nazw klas, ale łatwo zrozumieć przyczynę wyboru tych kolorów: rozsądnie byłoby ustawić kolor, który nie jest daleko od niebieskiego (ponieważ są to prawie jak zastrzeżone słowa: Int32dla .NET, intdla C # itp.), ale musi pozostać podstawowym kolorem, różnym od już używanego niebieskiego.

A co z alternatywnymi schematami, takimi jak popularny jasny tekst na ciemnym tle? Nie są tworzone przez naukowca, który przez lata studiował ten temat i wykonał skomplikowany rachunek różniczkowy, aby uzyskać dokładnie idealne dopasowanie. Zamiast tego programista tworzy schemat, który jest dla niego czytelny. Udostępnia go na stronie internetowej i staje się popularny . To cała magia.

Ostatnia rzecz: czy istnieją zasady czytelności? Nie za dużo.

  • W przeważającej części jest to coś subiektywnego : nie można argumentować, że niebieskie słowo kluczowe jest bardziej czytelne niż fioletowe słowo kluczowe, ponieważ ktoś byłby w stanie odpowiedzieć niż dla niego, na jego monitorze, fioletowe słowo kluczowe jest znacznie bardziej czytelne niż niebieskie .

  • Z drugiej strony jest to po prostu logiczne . Schemat czarno-biały nie byłby tak czytelny jak domyślny. W ten sam sposób nie można ustawić słów kluczowych na jasnożółte, a komentarze na jasnoszare (powiedzmy #eee) na białym tle, ponieważ są nieczytelne i nawet nie trzeba wyjaśniać, dlaczego. Te same zasady obowiązują przy tworzeniu strony internetowej, drukowaniu książki czy cokolwiek innego.


1

Jako rodzaj zgrubnego studium, zrzuty ekranu poniżej pokazują 3 motywy kolorystyczne użyte do podświetlenia składni XSLT. Wybrałem XSLT, ponieważ stanowi szczególne wyzwanie ze względu na dużą liczbę elementów językowych - a także dlatego, że wielu programistów opisuje to jako brzydkie.

Solarized

wprowadź opis zdjęcia tutaj

Jutro noc

wprowadź opis zdjęcia tutaj

Github

wprowadź opis zdjęcia tutaj

Spostrzeżenia

Liczba kolorów użytych w próbce pomaga rozróżnić różne elementy językowe, ale może okazać się rozpraszająca dla programisty.

Pomaga w miarę możliwości przechodzić od zimnych do ciepłych kolorów, stosując zimne kolory dla bardziej neutralnych części języka. Alternatywą jest przejście z odcieni pastelowych na bardziej żywe (nasycenie odcienia).

Kolor tła ma ogromny wpływ na postrzeganie kolorów pierwszego planu.

Niektóre sąsiednie kolory pierwszego planu mogą powodować złe zderzenia, które zakłócają oko, w szczególności czerwone i zielone nie wydają się dobrze pasować.

Na ciemnym tle łatwiej jest zapewnić szeroką gamę kolorów pierwszego planu z wystarczającym kontrastem między sobą i tłem.

Wreszcie czynniki zewnętrzne, takie jak światło otoczenia oraz jakość i kalibracja monitora, mają ogromną różnicę.

Wniosek

Najlepiej jest używać narzędzi, które zapewniają rozszerzalny sposób ustawiania motywów kolorów, ponieważ jest mało prawdopodobne, że jakikolwiek pojedynczy motyw koloru zaspokoi potrzeby wszystkich programistów, a nawet ten sam programista może często zmienić swoje preferencje w zależności od różnych czynników.


0

Wydaje mi się, że pierwszym pytaniem będzie, czy białe tło jest świetnym pomysłem. Tylko dlatego, że zbliża się do prawdziwego papieru i możemy znaleźć wszędzie w Internecie, w dzisiejszych czasach niekoniecznie sprawia, że ​​jest to dobry (lub mogę powiedzieć, idealny) wybór.

Pamiętam, że (wiele, wiele lat temu) mieliśmy tylko żółto-czarną „kolorystykę”. Pamiętam też, że nie było tak źle. Nie miał tego kontrastu jako czarno-biały. Nie tak dawno temu dowiedziałem się, że jest to również lepsze dla ludzkiego oka.

Czasami naprawdę zastanawiam się, kto projektuje schematy kolorów, które np. Są dostarczane z systemami operacyjnymi. Zwykle je ignoruję, ale pamiętam naprawdę niesamowite mieszanki różu i zieleni i tak dalej. Nie biorę narkotyków ...

Istnieją badania dotyczące tego, jakie kolory wpływają na twoją podświadomość (uspokój się, powoduj agresję ...). Myślę, że powszechnie stosowane schematy kolorów są w pewnym stopniu oparte na tym. Może po prostu dodali czytelność. Kodowanie nie powinno być misją samobójczą.

Ale jeśli chodzi o kolorystykę obecnych IDE, nie mam nic przeciwko. Spójrzmy prawdzie w oczy: prosty pomysł polega na ułatwieniu znalezienia czegoś innego niż ogólny „szum kodu”. I szczerze mówiąc, tak naprawdę nie dbam o to, jakich kolorów używają, aby na to pozwolić. Nie powinno to zranić moich oczu ani wypalić części kodu w tylnej części mojej głowy, jak rażąca czerwień na jakimś odcieniu zieleni.

Kodowanie powinno być relaksujące. I to jest dla mnie to.

Korzystając z naszej strony potwierdzasz, że przeczytałeś(-aś) i rozumiesz nasze zasady używania plików cookie i zasady ochrony prywatności.
Licensed under cc by-sa 3.0 with attribution required.