Una petita guia d’estil

Recomanacions pràctiques

Organitzeu la documentació i els panells de dades amb un fluix narratiu lògic. Comenceu amb una visió general o resum a dalt, donant context, i continueu amb la informació més detallada a sota. Això ajuda els usuaris a comprendre el context general abans d’endinsar-se en els detalls específics.

Als panells de dades, una possible estructura lògica seria:

Títol del panell

Igualment, estructureu el panell de manera que la importància visual reflecteixi la importància informativa de cada element. En general, la informació més important hauria d’estar en targetes més grans i prominents, atraient l’atenció immediata. Una bona jerarquia visual ajuda a guiar els usuaris intuïtivament a través del panell, millorant la seva comprensió i interacció.

Crideu l’atenció a les mètriques i tendències més importants utilitzant indicadors visuals com ara fonts en negreta o mides més grans. Destacar aquestes dades facilita que els usuaris trobin la informació clau més aviat.

Eviteu sobrecarregar les targetes amb massa informació. Cada targeta ha de centrar-se en un punt únic.

Assegureu’vos que la relació d’aspecte dels teus gràfics no distorsiona els patrons de les dades. Gràfics massa amples o massa estrets poden portar a interpretacions errònies. El format 4×3 (apaïsat) o 3×4 (vertical) potser són els més comuns i prudents, però també podeu fer servir l’1×1 pels diagrames de dispersió, o formats més extrems: molt vertical si són moltes barres horitzontal apilades, molt apaïsat si és una sèrie temporal molt llarga i detallada.

Col·loqueu els filtres, desplegables i altres elements d’input dins de la mateixa targeta que el gràfic que modifiquen. Això fa que sigui intuïtiu per als usuaris veure com la interacció amb aquests elements afecta la visualització de dades, fent l’experiència més fluida i eficient 🥰

Els elements interactius han de tenir instruccions clares sobre el seu ús per asegurar la seva accessibilitat.

Cada gràfic ha de tenir títol clar i descriptiu, així com una llegenda si és necessari. Els títols ajuden els usuaris a entendre què estem mostrant, mentre que les llegendes expliquen el significat dels colors i altres elements. Aquest context és crucial per a una interpretació precisa de les dades.

Incorporar les etiquetes directament els elements gràfics permet una interpretació més intuïtiva i directa de les dades, eliminant la necessitat de cercar referències en altres parts de la visualització. Utilitzar títols descriptius ajuda els usuaris a comprendre ràpidament el contingut dels gràfics. A més, aplicar etiquetatge ARIA és essencial per garantir que les visualitzacions siguin accessibles per a persones que utilitzen tecnologies d’assistència, proporcionant una experiència inclusiva i comprensible per a tots els usuaris.

Els gràfics de dalt són una broma, ja sabeu que cal tenir compte amb les correlacions espúries (mireu el blog d’en Tyler Vigen) i, si us plau, no feu servir doble eix.

Tampoc oblideu les taules! Són una eina molt valuosa per presentar dades de manera organitzada i accessible. Quan permeten la cerca, faciliten als usuaris trobar informació específica ràpidament, i enriquides amb sparklines poden proporcionar una visió ràpida de les tendències sense necessitat de gràfics separats. Són una manera alternativa per als usuaris de consumir la informació en una visualització i, en general, els lectors de pantalla naveguen més fàcilment per les taules que per les visualitzacions.

Tipografia i edició

Observable Framework ja ofereix tots els elements de disseny que necessiteu per formatar el vostre panell. Llegiu sobre això aquí.

Els estils de lletra ja estan predefinits al projecte. (La iniciativa va de desbloquejar dades obertes mitjançant la visualització, no de genialitats tipogràfiques: no cal afegir nous tipus o estils de lletra.)

Títol h1

Títol h2

Títol h3

Títol h4

Text de paràgraf a l’informe