Excelente el Episodio #7 sobre “Color” del podcast Data Stories

Episode #7 – Color (feat. Gregor Aisch)

Play
moritzstefaner

Folks,

Here is another great episode … honestly I think it’s one of the best we have ever recorded (-Enrico). We talk about color, and color you know … it’s huge. To get some help we invited Gregor Aisch from Driven By Data and asked him to talk about his experience with color and his super useful library chroma.js.

We have to apologize for a number of things. The episode came out late, the quality is not super high and we have no transcribed chapters this time. No worries, this won’t happen again (or too often) and we have no intention to neglect DS. Moritz has been traveling and taking days off in beautiful Greece and Enrico was just having another baby.

Update: Here is the chapter list! We just could not let such a great episode go without proper chapter marks…

[00:00] Intro: Today with Gregor Aisch from http://driven-by-data.net
[02:04] Computational Visualistics
[03:32] Today’s topic: Color
[03:46] Family drama interlude
[04:08] Colors: Powerful, but tricky to get right
[04:50] Color perception
[09:55] Color spaces
[15:39] Colors for categorical data
[17:20] What’s the maximum number of categorical colors to be used?
[19:40] Equidistance
[20:15] Colorbrewer
[23:13] chrome.js
[25:56] Colors for continuous data
[26:41] Mo’s six word advice
[27:04] Color for continuous data – usually not advisable
[30:14] Rainbow scales
[30:48] …and how to avoid them
[33:17] Color is difficult
[35:07] More tips on how to do it right
[37:29] Is there a method behind ugly visualization in science?
[38:58] Paper: Evaluation of artery visualizations
[42:39] How to deal with skewed distributions
[46:19] Learn about the data, highlight the interesting insights
[48:12] Redundant encoding and interaction between visual variables
[51:13] Use for secondary dimensions, or small number of categories
[52:57] Mo’s tips
[54:04] Don’t forget the legend
[54:34] Gregor’s tips
[56:07] Above all, do no harm.
[56:43] Enrico’s tips
[58:27] Wrapping it up

And stay tuned for another episode soon! We will have Jeff Heer on board! If you have any questions for him add a comment below or send us an email (see address in the right).

Take care and have fun!

Enrico and Moritz.

This entry was posted in Episodes and tagged  by moritzstefaner. Bookmark the permalink.

Manuel Lima y el poder de las redes de conocimiento en la época de concetividad infinita

by 

Manuel Lima, founder of data visualization portal Visual Complexity, author of the indispensableinformation visualization bible of the same name, and one of the most intelligent people I know, recently gave an excellent talk on the power of networks at the RSA. Using examples that span from the Dewey Decimal System to Wikipedia, Manuel explores the evolving organization of knowledge and information, and the shift from hierarchical structures to distributed lateral networks.


Networks are really becoming a cultural meme in their own right. We could even argue, is this the birth of a new movement, is this the birth of ‘networkism’?” ~ Manuel Lima

Further reading: Visual Complexity: Mapping Patterns of Information.

Brain Pickings has a free weekly newsletter and people say it’s cool. It comes out on Sundays and offers the week’s best articles. Here’s what to expect. Like? Sign up.

 

Construcción de un relato visual a través del fotoperiodismo

Por José Antunes
Traducción: Nora Morales

Les dejo un pequeño artículo sobre la construcción de narrativas visuales a través de la fotografía para tomarlo en cuenta durante nuestro curso.

Hacer un relato de forma visual es uno de los principales quehaceres de el fotoperiodismo. Muchos periodistas visuales recuerdan aun cual ha sido su primera historia que les abrió la puerta a este dominio. Tal es el caso de José Antunes. Quién en 1980 tomo las fotografías de un robo de banco que definió su futuro en el fotoperiodismo.

En esta ocasión, a través de su blog José Antunes, nos comenta algunos aspectos del relato grafico por considerar, a partir de un ejemplo sobre un rescate en el océano, el mismo día que un prominente pianista portugués murió al caer al mar Atlántico al estar tomando fotos.

Visualnarrative01_ja

Los pescadores en la costa portuguesa arriesgan su vida para obtener el mejor lugar para la pesca, y en el transcurso dan a los fotógrafos la oportunidad de tomar fotos sorprendnetes.

 Las fotografías de este artículo fueron tomadas en la misma costa del evento, pero unas cuantos kilómetros al norte, y cubren la situación que tuvo un final feliz. Hay una historia en estas imágenes y  una lección para aquellos que exploran la idea de el fotoperiodismo o simplemente relatar gráficamente algún evento familiar o historia.

 

Un Robo de banco.

Había sido un largo día, fotografiando la costa de Sintra (checar en Google para tener una idea de el área costera), y ya estaba regresando a casa, aun no estaba seguro si debía quedarme para la puesta se sol; Cuando una ambulancia pasó sonando su sirena en dirección opuesta a mi, poniéndome en alerta.

Una segunda sirena se escuchaba aproximándose, esta vez correspondía al equipo de buzos de rescate del departamento de bomberos, eso reforzó la decisión de quedarme, y fui detrás de ellos. Ya estaba cansado, pero si alguna vez has cubierto alguna noticia hay una especie de “cosquilleo” que se queda dentro de ti para siempre.

Visualnarrative02_ja

Una vez que has definido una historia que quieres contar, necesitas tener las tomas generales que serán la base de ésta. Necesitan estar técnicamente bien resuletas y al mismo tiempo mostrar contenido relevante.

 

Tuve una experiencia similar hace 32 años, el 5 de mayo de 1980, cuando un grupo de terroristas portugueses llamados FP-25 robó un banco y mató a un policía. Yo estaba cerca, siempre con una cámara y fui el primero en fotografiar la escena.

Tomé todas las imágenes que pude en el banco, contacté a un periódico de Lisboa, acordé que podían publicar la historia, y proseguí a entrevistar a la gete en la estación de policía para tener mas detalles. Así fue como mi relato se publicó en le primera plana del periódico al siguiente día.


Adrenalina corriendo por las venas.

Había estado moviéndome entre la fotografía y la escritura desde los años setenta, con algo de trabajo publicado, pero ese momento definitivamente definió mi futuro profesional. La idea de escribir o hacer fotoperiodismo era algo que me entusiasmaba, y lo sigue haciendo hasta la fecha

Visualnarrative03_ja

La imagen del pescador, esperando a ser rescatado, contrasta con la de la embarcación de rescate naval prácticamente volando sobre las olas. No hay duda del poder de ambas imágenes en la mente del lector.

 

De un asalto terrorista a una embajada, o una estación de policía bombardeada, he estado en situaciones que fuerzan a definir prioridades en términos de decisión de tomas fotográficas. A pesar de que he usado estas habilidades en otras situaciones mucho mas tranquilas, en esta ocasión volví a sentir la adrenalina corriendo por mis venas.

Mientras el equipo de buceo se preparaba para entrar al agua, una embarcación naval apareció en el horizonte y se dirigió hacia el pescador, llegando unos minutos después y salvándolo del agua. Un final feliz.

Visualnarrative04_ja

Otros pescadores en un risco cercano, muestran al piloto de la embarcación el lugar donde cayó el pescador. Una imagen que ayuda al relato de la historia.


Sigue disparando!

Nunca dejo de tomar fotos. Empecé a tomar fotografías del camión de bomberos y de la gente cerca de el acantilado. Después proseguí con algunas imágenes de los pescadores.  A pesar de saber que mi cámara de 400 mm, con cuerpo APS-C no podía acercarse tanto, mi siguiente prioridad fue la embarcación naval, al hacerlo tuve oportunidad de detectar a los bomberos que habían alcanzado la base del acantilado y señalaban a la embarcación la dirección del hombre que esperaba ser rescatado.

Pronto terminó el rescate. Sin embrago seguí tomando imágenes del pescador al momento de subir a la embarcación y alzando sus brazos hacia la audiencia en tierra firme, algunos de ellos aplaudieron en respuesta. Lentamente la embarcación se dirigió al puerto mas cercano y la vida volvió a su normalidad.

Visualnarrative05_ja

El momento en que el pescador es sacado del agua. La posición de la embarcación, me ayudó a obtener una buena imagen, ya que no había manera de moverme a otro ángulo.

 

Practicar, practicar y practicar.

Eventos como este pasan todo el tiempo en cualquier lugar. No necesitas tener gran equipo, con cualquier cámara basta. Sólo tienes que conocerla bien para definir la exposición y el resto sin titubeos. El otro lado de la historia será el de contactar un medio informativo, periódico, revista, etc., y venderles las imágenes. Nunca las regales, eso es lo que ha empobrecido la labor del foto periodista. SI tus fotos son buenas, aun que seas un amateur, te deben de pagar por ellas, no con una mención de créditos en el medio sino con dinero real.

Sé rápido. Piensa rápido cuales serán las tomas que necesitaras para crear una narrativa, realiza esas tomas en un principio y continua disparando, no pares cuando todo parezca terminar. Si yo hubiera hecho eso, no tendía las dos imágenes que hicieron la diferencia en esta historia.

El pescador, alzando los brazos en una toma y el hombre tomando una fotografía con su celular al igual que la mujer bombero hablando por su celular.  Estas imágenes muestran una cosa: la naturaleza humana, son importantes para hacer que el lector se detenga y vuelva a mirar una y otra vez. Y tal vez sonría, especialmente porque este evento tuvo un final feliz.

Visualnarrative06_ja

Las dos tomas finales ayudan al lector a juntar todo el relato, con elementos humanos.

Practica construir narrativas con todo lo que te rodea. No tomes imágenes individuales únicamente, trata de construir historias. Este es un “tip” que aprendí en los ochentas, y nunca he dejado.

Toma tus imágenes al momento que estén ocurriendo las cosas, trata de construir una narrativa, porque no hay una segunda oportunidad en cuanto a noticias se trata. Si yo lo puedo hacer, tu lo puedes hacer. Después de todo es sólo como andar e bicicleta, una vez que aprendes a hacerlo nunca olvidas el especto esencial sobre esa destreza.

 

 

 

 

 

 

 

 

Nuevos enfoques en visualización de datos

Visualization: Modern Approaches

By  August 2nd, 2007 ChartsDiagrams 154 Comments

 


Data presentation can be beautiful, elegant and descriptive. There is a variety of conventional ways to visualize data – tables, histograms, pie charts and bar graphs are being used every day, in every project and on every possible occasion. However, to convey a message to your readers effectively, sometimes you need more than just a simple pie chart of your results. In fact, there are much better, profound, creative and absolutely fascinating ways to visualize data. Many of them might become ubiquitous in the next few years.
 So what can we expect? Which innovative ideas are already being used? And what are the most creative approaches to present data in ways we’ve never thought before?
Let’s take a look at the most interesting modern approaches to data visualization as well as related articles, resources and tools.

 

1. Mindmaps

Trendmap 2007

Webtrends2007 in Data Visualization: Modern Approaches

Informationarchitects.jp presents the 200 most successful websites on the web, ordered by category, proximity, success, popularity and perspective in a mindmap. Apparently, web-sites are connected as they’ve never been before. Quite comprehnsive.

2. Displaying News

Newsmap is an application that visually reflects the constantly changing landscape of the Google News news aggregator. The size of data blocks is defined by their popularity at the moment.

Newsmap in Data Visualization: Modern Approaches

Voyage is an RSS-feader which displays the latest news in the “gravity area”. News can be zoomed in and out. The navigation is possible with a timeline.

Voyage in Data Visualization: Modern Approaches

Digg BigSpy arranges popular stories at the top when people digg them. Bigger stories have more diggs.

Diggbigspy in Data Visualization: Modern Approaches

Digg Stack: Digg stories arrange themselves as stack as users digg them. The more diggs a story gets, the larger is the stack.

Stack in Data Visualization: Modern Approaches

3. Displaying Data

Amaztype, a typographic book search, collects the information from Amazon and presents it in the form of keyword you’ve provided. To get more information about a given book, simply click on it.

Amaztype in Data Visualization: Modern Approaches

Similar idea is being used by Flickrtime. The tool uses Flickr API to present the uploaded images in real-time. The images form the clock which shows the current time.

Flickrtime in Data Visualization: Modern Approaches

Time Magazine uses visual hills (spikes) to emphasize the density of American population in its map.

Us in Data Visualization: Modern Approaches

CrazyEgg lets you explore the behavior of your visitors with a heat map. More popular sections, which are clicked more often, are highlighted as “warm” – in red color.

Heatmap in Data Visualization: Modern Approaches

Hans Rosling TED Talk is a legendary talk of the Swedish professor Hans Rosling, in which he explains a new way of presenting statistical data. His Trendalyzer software (recently acquired by Google) turns complex global trends into lively animations, making decades of data pop. Asian countries, as colorful bubbles, float across the grid — toward better national health and wealth. Animated bell curves representing national income distribution squish and flatten. In Rosling’s hands, global trends — life expectancy, child mortality, poverty rates – become clear, intuitive and even playful.

Hansrosling in Data Visualization: Modern Approaches

Three Views shows three views of the earth, in which each country is represented by a circle that shows the amount of money spent on the military (size of circle) and what fraction of the country’s earnings that uses (colour). Compact and beautiful presentation of data.

Arms in Data Visualization: Modern Approaches

We Feel Fine shows human feelings, calculated from a large number of weblogs.

Madness in Data Visualization: Modern Approaches

Visualizing the Power Struggle in Wikipedia displays the most popular articles and the most frequent search queries in the heatmap.

Wikipedia1 in Data Visualization: Modern Approaches

Wikipedia2 in Data Visualization: Modern Approaches

Websites as graphs. An HTML DOM Visualizer Applet, which displays sites as graphs depending on the amount of links, tables, div tags, images, forms and other tags.

Graphs in Data Visualization: Modern Approaches

Interactive History Timeline presents the history of Great Britain, divided into interactive data blocks. The density of events is displayed on the map.

British in Data Visualization: Modern Approaches

Winning Lotto Numbers is supposed to present the frequency of appearance of every number from one year to the next one. This graph is definitely not one of the most clear ones.

Lotto in Data Visualization: Modern Approaches

Elastic Lists demonstrates the “elastic list” principle for browsing multi-facetted data structures. You can click any number of list entries to query the database for a combination of the selected attributes. The approach visualizes relative proportions (weights) ofmetadata by size and visuzalizes characteristicness of a metadata weight by brightness. Author’s blog regularly informs about new experiments in the area of data visualization. Nice to observe, useful to bookmark.

Elasticlists in Data Visualization: Modern Approaches

The JFK Assassination TimelineAn Ajax-based approach vor visual presentation of historical events. John F. Kennedy assassination as timeline with numerous presentation options. The related article with further examples.

4. Displaying connections

Munterbund showcases the results of research graphical visualization of text similarities in essays in a book. “The challenge is to find forms of graphical and/or typographical representation of the essays that are both appealing and informative. We have attempted create a system which automatically generates graphics according to predefined rules.”

Buurman2 in Data Visualization: Modern Approaches

Buurman in Data Visualization: Modern Approaches

Buurman3 in Data Visualization: Modern Approaches

Burst Labs suggests similar or connected items to your search queries (favourite artists, tv shows, movies, genres etc.) in a bubble. Not really new, but still inspiring.

Burstlabs in Data Visualization: Modern Approaches

Universe DayLife displays events, connections and news as circles which gravitate around the topic they are related to.

Universe in Data Visualization: Modern Approaches

Musiclens gives music recommendations and presents your current mood and musical taste as a diagram.

Musiclens in Data Visualization: Modern Approaches

Figd’t Visualizer allows you to play around with your network. You interface with the Visualizer through Flickr and LastFM tags, using any tag to create a Magnet. Once a Tag Magnet is created, members of the network will gravitate towards it if they have photos or music with that same Tag. Available for Mac OS X, Windows and Linux. Alpha-version.

Fidgt in Data Visualization: Modern Approaches

What have I been listening to?: Lee Byron describes his approach of creating a histogram about his music listening history.

Lastfm in Data Visualization: Modern Approaches

Shape Of Song: What does music look like? The Shape of Song is an attempt to answer this seemingly paradoxical question. The custom software in this work draws musical patterns in the form of translucent arches, allowing viewers to see – literally – the shape of any composition available on the Web.

Shapeofsong in Data Visualization: Modern Approaches

Musicmap: connections are represented as connected lines; they create a web.

U2 in Data Visualization: Modern Approaches

Musicovery displays music taste connections and lets you listen to the song and browse through similar songs.

Musicovery in Data Visualization: Modern Approaches

Lanuage Poster proves that even simple lines can be descriptive enough. The History of Programming Languages as an original timeline.

Program in Data Visualization: Modern Approaches

5. Displaying web-sites

Spacetime offers Google, Yahoo, Flickr, eBay and images in 3D. The tool displays all of your search results in an easy to view elegant 3D arrangement. Company promises that the days of mining through pages and pages of tiny thumbnails in an effort to find the item you are looking for are over.

Spacetime in Data Visualization: Modern Approaches

UBrowser is an open source test mule that renders interactive web pages onto geometry using OpenGL® and an embedded instance of Gecko, the Mozilla rendering engine.

Ubrowser in Data Visualization: Modern Approaches

6. Articles & Resources

  • Visualcomplexity.com
    Vc in Data Visualization: Modern Approaches
    The project presents the most beautiful methods of data visualization as well as further references and book suggestions. The gallery has over 450 entries.
  • In his article Infosthetics: the beauty of data visualization Andrew Vande Moere, well-known through his blog Infosthetics, discusses the aesthetics of data visualization and modern apparoaches in this area. Creative design ideas combine form and content and generate fascinating graphs – is it a new area in the art of next generation?Infosthetics02 in Data Visualization: Modern ApproachesInfosthetics08 in Data Visualization: Modern ApproachesInfosthetics09 in Data Visualization: Modern ApproachesThe article presents 13 new techniques of data visualization, with examples and further references.
  • 16 Awesome Data Visualization Tools
    “From navigating the Web in entirely new ways to seeing where in the world twitters are coming from, data visualization tools are changing the way we view content. We found the following 16 apps both visually stunning and delightfully useful.” An extensive overview by Mashable.com.
  • Dataesthetics
    Eric Blue provides some references to unusual Data Visualization methods.
  • infosthetics – information aesthetics
    Docuburst in Data Visualization: Modern Approaches
    Andrew Vande Moere about data visualization, latest development and design ideas.
  • Visualizing Delicious Roundup
    An overview of Del.icio.us tools you can use to visualize your bookmarks.
  • Periodic Table
    A periodic table of visualization methods.
    Periodic in Data Visualization: Modern Approaches

7. Tools and Services

  • You can create your own timelines with Xtimeline and Circavie.
  • IBM Many Eyes
    Ibm in Data Visualization: Modern Approaches

    This Java-based service visualizes data online and helps to create pie charts, diagrams, tree maps, bar charts and histograms. Registration is required. Some examples are simply amazing.
  • prefuse | the prefuse visualization toolkit
    Presents the beta-version of a Java-based toolkit for programming of application with integrated data visualization methods
  • Swivel
    This service creates pie charts, diagrams and histograms “on the fly”. It also provides a Swivel API you can use to improve already existing visualization methods.
  • You can find even more tools for designing your own diagrams and charts online in our article Charts and Diagrams Tools.

Tags

Vitaly Friedman loves beautiful content and doesn’t like to give in easily. Vitaly is writer, speaker, author and editor-in-chief of Smashing Magazine, an online magazine dedicated to designers and developers.