Wprowadzenie

Celem opracowania jest omówienie elementów składowych języka informacji wizualnej, m.in.: hierarchii i tworzenia struktur informacyjnych, użycia koloru, kontrastu i kroju pisma, ze względu na specyfikę mediów elektronicznych. Analiza ta ma na celu przedstawienie skutecznych sposobów komunikacji wizualnej w e-materiałach dydaktycznych. Autor odnosi się do takich dziedzin nauki, jak architektura informacji i projektowanie graficzne oraz prezentuje dobre przykłady tzw. infografiki jako sposobu wyjaśniania procesów i zjawisk w sposób wizualny. Zjawiskiem socjologicznym, edukacyjnym, kulturowym, technologicznym i ekonomicznym, wynikającym z rozwoju nowych technologii informacyjnych, jest radykalna zmiana w sposobie czytania i pisania. Monitor i środowisko elektroniczne wypierają tradycyjne formy: książkę oraz kartkę papieru jako pierwotne środowisko czytelnicze¹. Według G. Kressa alfabetyzacja, jako umiejętność konstruowania tekstu oraz jego odczytywania, nie jest już wystarczającą umiejętnością człowieka w społeczeństwie informacyjnym. Nowe media wymagają posługiwania się obrazami jako równoległymi i równoważnymi kodami, obok umiejętności tradycyjnego pisania i czytania. Umiejętność ta wiąże się z pojęciem visual literacy², rozumianym jako alfabetyzacja wizualna, czyli poprawne stosowanie języka komunikacji wizualnej.

Gunther Kress uważa również, iż badania wielu typów mediów, takich jak: gazety codzienne, komiksy, magazyny, strony internetowe, oraz tekstów edukacyjnych (np. podręczniki) potwierdzają przewagę elementów graficznych nad tekstem tradycyjnym. Ale nie tylko massmedia zmieniają swój charakter - zauważalna jest różnica w edytorskiej formie dokumentów wydawanych przez korporacje, uczelnie wyższe, instytucje rządowe itp. Publikacje te posiadają często bardzo nowoczesny układ typograficzny czy stylistykę graficzną, zawierają wymyślne kroje pisma. Fakty te są przejawem wypierania kultury języka przez kulturę obrazu³.

Dostępność i łatwość używania aplikacji graficznych i prezentacyjnych oraz wykorzystanie ich dla potrzeb tworzenia materiałów do publikacji online sprawia, iż nauczyciel akademicki staje przed zadaniami, jakie jeszcze 15-20 lat temu przypadały w udziale zamkniętym i wyspecjalizowanym grupom zawodowym: grafikom, redaktorom technicznym, fotoedytorom czy projektantom grafiki użytkowej.

Większość dydaktyków w lepszy lub gorszy sposób radzi sobie z tymi wyzwaniami, tworząc kursy online, opracowując dane, wykresy, publikując zdjęcia, redagując broszury, przygotowując prezentacje w programie MS PowerPoint czy ilustracje zamieszczane na stronach internetowych. Wydaje się jednak, że pewien obszar demokracji mediów elektronicznych i łatwość stania się wydawcą nie idzie w parze z dobrą znajomością reguł, jakimi kieruje się sfera komunikacji wizualnej.

Aspekt komunikowania się przez obrazy (bez względu na to, czy są one traktowane jako ilustracje, czy tylko jako zakładki i nagłówki w strukturze kursu online) wiąże się z intensywnym rozwojem nowych dziedzin wiedzy, takich jak: architektura informacji, funkcjonalność (usability), projektowanie interaktywne i graficzne. Dają one odpowiedź na pytanie, jak przygotować informację w celu szybszego jej odszukania oraz łatwiejszego odczytania. Można powiedzieć, że projektowanie wizualnej informacji to balansowanie pomiędzy estetyką, technologią, kontekstem oraz interakcją twórcy i odbiorcy.

Jak projektować informację wizualną?

Mimo rewolucji cyfrowej łatwo zauważyć, że od czasów Gutenberga niezmienne pozostają podstawowe elementy składowe informacji wizualnej: obraz (rozumiany jako: ilustracja, fotografia, rysunek czy symbol) oraz tekst jako ciąg wyrazów. Wzajemne ustalenie relacji pomiędzy tymi składnikami powoduje strukturalizację informacji⁴, a w konsekwencji wpływa na sposób jej odczytywania. Dla potrzeb edukacyjnych szczególnie ważne jest utworzenie mniejszych jednostek informacyjnych i nadanie im pewnej struktury, wykraczającej poza wiersze tekstu.

Przykładem widocznej zmiany w formach komunikowania wizualnego jest tzw. infografika - traktowana jako połączenie tradycyjnej ilustracji z tekstem liniowym. Jej celem jest wyjaśnianie zjawisk, danych statystycznych lub skomplikowanych pojęć - poprzez odwołanie się do logicznego myślenia odbiorcy i jego pamięci wizualnej, która jest zazwyczaj lepsza niż pamięć werbalna. Celem twórców tak zwizualizowanej informacji jest zwiększenie stopnia jej odczytania. Elementem wyróżniającym dobrą infografikę jest brak nacechowania emocjonalnego - w przeciwieństwie do grafiki użytkowej, np. plakatów, reklam prasowych, które odnoszą się do uczuć lub przeżyć odbiorców.

Infografika nie jest zjawiskiem nowym. Pewne jej formy zamieszczane są od setek lat w licznych publikacjach drukowanych, takich jak: mapy, rysunki, wykresy, schematy. Rozwój mediów elektronicznych oraz zmiana sposobów komunikowania się spowodowały powstanie nowego, bardziej zaawansowanego wizualnie środka wyrazu, łączącego w sobie cechy informacyjne zarówno tekstu, jak i obrazu. Prawdopodobnie nie mniejsze znaczenie w rozwoju tej dziedziny miały także zaawansowane aplikacje graficzne 2D i 3D.

Strukturalizowanie i wizualna hierarchia

Projektowanie informacji to proces nadawania wizualnego porządku określonym treściom komunikatu oraz ustalenie hierarchii ważności poszczególnych składników. W dobrze opracowanych projektach graficznych znajdziemy zazwyczaj element, który jest sygnałem do rozpoczęcia procesu czytania - punktem startu, a następnie kieruje wzrok odbiorcy na mniejsze jednostki informacyjne. Najlepszym tego przykładem są portale internetowe, gdzie kolumny tekstu, śródtytuły, lidy, ikony, ilustracje, infografika oraz zdjęcia wyznaczają nawigację wzrokową. Jej badanie, jak i rozpoznanie preferencji wzrokowych odbiorców, jest integralną częścią projektowania aplikacji internetowych. Dla celów analizy ruchów oka stosuje się urządzenia służące do eye trackingu, które pozwalają określić np. ścieżki podążania wzroku czy kolejność odczytywania informacji.

Podstawową strukturę infografiki na przykładzie przedstawionym na rysunku 1 wyznaczają ramki tekstowe oraz ich zróżnicowana kolorystyka, która jest powiązana z elementami centralnego schematu. Rysunek 1a jest przykładem jeszcze innego sposobu wizualizacji abstrakcyjnych pojęć. Jego konstrukcja odnosi się do uprzednich doświadczeń i struktur, które już zaistniały w umyśle odbiorcy. Uwzględnianie zależności zjawisk w internecie jest wizualnym nawiązaniem do sieci metra, wraz ze stacjami i przecinającymi się liniami, podążającymi w różnych kierunkach.

Rysunek 1. Przykład infografiki Źródło: http://www.xplane.com/#/publications, [10.11.2008]

Rysunek 1a. Przykład infografiki Źródło:http://informationarchitects.jp/ia-trendmap-2007v2, [10.11.2008]
Innym spotykanym sposobem nadania wizualnej hierarchii jest zastosowanie siatki modułowej projektu, zaprezentowanej na rysunku 2. Jest to wyznaczenie na płaszczyznach poziomych i pionowych określonego sposobu ustawienia składników informacyjnych. Taki rodzaj strukturalizacji występuje np. w portalach internetowych, jak również w tradycyjnych materiałach drukowanych. Rysunek 2. Siatka modułowa wraz z projektem Źródło: opracowanie własne
Poszczególne poziome lub pionowe moduły stwarzają wizualną spójność obiektów graficznych - zarówno tekstów, jak i ilustracji. Wzajemna relacja, występująca na poszczególnych stronach publikacji, w zależności od kreatywnego posługiwania się siatką, wytwarza określony rytm przekazu, który w wizualny sposób ilustruje rysunek 3.

Rysunek 3. Różnorodne zastosowanie siatki modułowej i jej wpływ na rytm przekazu Źródło: opracowanie własne
Układ graficzny na przykładzie zależności (rysunek 3) odczytywany jest przez odbiorcę jako monotonny (A), powtarzalny (B) lub harmonijnie planowany, wzmacniający przekaz (C). Formalnym zabiegiem, wpływającym na budowanie hierarchii przekazu wizualnego, jest kontrastowanie poszczególnych elementów względem siebie na poziomie:

• wielkości elementów,
• ich kształtu,
• ich kolorystyki.

Większe elementy wydają się być umieszczone na pierwszym planie, bliżej odbiorcy, zaś mniejsze struktury znajdują swoje miejsce w tle, przez co stają się słabsze wizualnie. Dotyczy to zarówno grafiki, jak i elementów literniczych (rysunek 2). Kolejnym zabiegiem formalnym, łamiącym monotonię powtarzających się kształtów w strukturze projektu graficznego, może być zastosowanie kształtu radykalnie odmiennego.

Kolor jest kluczowym składnikiem w projektowaniu informacji, strukturyzującym informacje w najskuteczniejszy z możliwych sposobów. Wpływa on na szybkość oraz kierunek ich odczytywania. Na rysunku 2, mimo zastosowania odcieni szarości jako elementu różnicującego, można w łatwy sposób odseparować poszczególne informacje.

Tworzenie hierarchii informacji, poprzez nadawanie jej pewnej struktury wizualnej, jest charakterystyczne dla mediów elektronicznych i ich hipertekstowej właściwości. Elementy wizualne stają się w niej zarówno ścieżkami wejściowymi dla podążającego wzroku, jak również nawigacją służącą do wejścia na niższe warstwy tekstu. Należy zauważyć, iż elementy, które mają pozornie charakter tekstu (słów), stają się faktycznie paratekstem i funkcjonują jako komunikat wizualny (obrazowy). Wyznaczają ściśle określone kierunki i sposoby przemieszczania się wzroku odbiorcy.

Rysunek 4. Wizualne relacje strukturalizacji informacji oraz klasycznego tekstu liniowego Źródło: opracowanie własne

Krój pisma

Codziennie miliony ludzi otwierają przeglądarki internetowe i czytają dziesiątki tekstów na ekranach monitorów. Powszechność tego sposobu przekazu każe zastanowić się nad jego właściwościami, np. nad łatwością czytania mierzoną czasem, przez który czytelnik jest w stanie skupiać się na tekście, nie męcząc się, komfortowo i bez wysiłku. Jedną z konsekwencji publikowania dla potrzeb mediów elektronicznych jest ograniczenie korzystania z małych rozmiarów pism szeryfowych, takich jak popularny Times New Roman. Spowodowane jest to dużo niższą rozdzielczością ekranową względem rozdzielczości druku. Jakie ma to konsekwencje? Małe kroje pisma szeryfowego wpływają na słabą odróżnialność znaków wyświetlanych na ekranie. Wynika to z budowy fizycznej tego kroju pisma. W połowie lat 90. XX wieku projektanci fontów przygotowali na potrzeby publikacji internetowych krój Verdana, jako optymalny do czytania w środowisku elektronicznym. Dalszymi konsekwencjami zaistnienia mediów elektronicznych i ich wpływu na typografię (liternictwo) była zmiana w długości wierszy tekstu. W tradycyjnej typografii przyjmowano, że wiersz optymalnej długości powinien liczyć 60-79 znaków. Nadmiar znaków powoduje utratę kontroli wzrokowej i gubienie odczytywanych wierszy. Czytelnik w środowisku elektronicznym może objąć wzrokiem obszar od 8 do10cm. Przy dłuższych wierszach musi wykonać ruch głową. W praktyce oznacza to zalecenie skrócenia wiersza w materiałach online do długości odpowiadającej 40-45 znakom. Powyższe uwagi dotyczące liternictwa są jedynie zasygnalizowaniem konsekwencji zmian, jakie zachodzą w mediach elektronicznych.

Podsumowanie

Media elektroniczne zmniejszają rolę książki i publikacji papierowych jako dominującego nośnika informacji. W tym samym czasie rewolucja cyfrowa wypiera kulturę języka i liniowość tekstu. Pisanie i czytanie, jako aktywności naturalnie związane z książką i papierem, zmieniają swój charakter i środowisko na korzyść ekranu monitora. Fakt ten ma wpływ na zwiększenie roli komunikowania wizualnego i posługiwania się obrazem jako pełnoprawnym kodem komunikacyjnym, posiadającym własną gramatykę i reguły składniowe.

Bibliografia

• K. Baer, Information Design Workbook, Rockport Publishers, Massachusetts 2008.
• B. Bergstrom, Essentials of visual communication, Laurence King Publishing, Londyn 2008.
• R. Carter, Typographic Design: Form and Communication, John Wiley &Sons Inc, Nowy Jork 1993.
• S. Dylak, Wizualizacja w kształceniu nauczycieli, Wydawnictwo Naukowe UAM, Poznań 1995.
• N. Frey, D. Fisher, Teaching Visual Literacy, Corwin Press, 2008.
• G. Kress, Literacy in the New Media Age, Routledge, Nowy Jork 2007.
• G. Kress, T. van Leeuwen, Reading Images. The grammar of visual design, Routledge, Nowy Jork 2008.
• D.A. Lauer, Design basics, Harcourt College Publisher, 2000.
• G. Rose, Visual methodologies. An introduction to the Interpretation of Visual Materials, Sage Publications, Londyn 2007.
• N. Wardrip-Fruin, Nick Montfort, The new media reader, MIT Press, Massachusetts 2003.
• P. Wildbur, M. Burke, Information Graphics, Thames and Hudson, Londyn 1998.