From  storymaps  to  notebooks  -­‐  do  your  compu3ng  one  bit  at  a  3me.    In  this  presenta3on  I  will  review  various  ways  in  which  we  can  engage  with  linear  narra3ves  for  both  explanatory  and  exploratory/inves3ga3ve  Purposes.    In  the  first  case,  storymaps  can  be  used  to  visualise  a  linear  explana3on  of  the  connec3ons  and  rela3ons  between  a  set  of  geotemporally  distributed  events.    In  the  second  case,  interac3ve  computa3onal  notebooks  provide  a  powerful  way  of  construc3ng  and  interac3ng  with  digital  resources  in  a  process  that  might  be  described  as  having  "a  conversa3on  with  data”.  

1  

We  are  wired  to  listen  to  stories.  Narra3ves  serialise  and  contextualise  a  series  of  events.  

2  

We  listen  to  stories  in  linear  3me.  We  write  our  stories  in  linear  3me.  Stories  may  relate  a  linear  sequence  of  events  or  they  may  relate  a  series  of  out  sequence  events.  In  the  laJer  case,  narra3ve  devices  are  used  to  join  one  event  to  another  so  that  the  serialised  telling  of  the  tale  is  coherent  and  makes  sense.  

3  

I  want  to  consider  two  sorts  of  serialised  narra3ve.  

4  

Story  maps  are  interac3ve  maps  that  can  be  constructed  or  animated  such  that  the  serialisa3on  of  the  telling  is  sequenced  using  “loca3ons”.  Loca3ons  may  be  places,  or  more  generally,  scenes.    The  presenta3on  of  a  geographical  story  need  not  force  a  unique  serialised  reading  of  it.  We  need  to  learn  how  to  read  such  texts.  

5  

This  famous  map  in  visualisa3on  circles  by  Charles  Minard,  popularised  by  Edward  TuUe,  who  described  it  as  “[p]robably  the  best  sta3s3cal  graphic  ever  drawn”,  tells  the  story  –  if  you  know  how  to  read  it  -­‐  of  Napoleon’s  1812-­‐13  Russian  campaign.  (There’s  at  least  one  good  reading  of  it  on  Youtube:  a  search  for  /numberphile  greatest  ever  infographic/  should  turn  it  up.  Another  great  chart  storytelling  video  on  Youtube  is  Kurt  Vonnegut’s  “Shapes  of  Stories”,  but  that’s  part  of  a  slightly  different  story.    The  forward  mo3on  in  the  reading  of  the  chart  is  to  read  the  brown  line  from  leU  to  right  as  a  progression  across  space  –  the  coordinate  system  is  a  geographical  one  –  through  3me,  followed  by  the  black  line  from  right  to  leU,  again,  across  space  and  over  3me.  The  line  thicknesses  are  also  meaningful.  

6  

Another  way  of  telling  stories  through  maps  is  to  animate  a  story  through  a  sequence  of  scenes  that  take  place  in  different  geographical  loca3ons.    Timemapper  is  an  open  source  online  applica3on  that  takes  data  hosted  in  a  Google  spreadsheet  and  generates  a  3me  map  from  it.    Each  scene  is  comprised  of  a  loca3on,  a  date,  a  3tle  and  a  descrip3on  (which  may  include  an  image).    The  calendar  shows  the  events  along  a  3meline,  and  on  a  map.  Highligh3ng  an  event  in  the  3meline  also  highlights  it  one  the  map.    Events  on  the  3meline  are  actually  ranges,  rather  than  point  events.  (As  an  aside,  geographical  representa3ons  can  in  general  –  though  not  in  Timemapper  –  take  three  forms:  point  loca3ons,  paths  (points  connected  by  lines,  or  regions/shapes  (that  is,  areas  bounded  by  a  closed  line  –  one  that  starts  where  it  ends.)    Other  variants  of  this  theme  include  the  Simile  Timemap.  There,  the  map  display  shows  loca3ons  rela3ng  to  only  those  events  that  are  visible  in  the  calendar.  

7  

Storymap.js    -­‐  developed  under  the  auspices  of  the  Knight  Founda3on  –  provides  a  similar  mechanic  to  Timemapper,  although  this  3me  lines  connec3ng  loca3ons  in  the  serlalisa3on  of  the  story  are  also  displayed.    The  world  of  “data  journalism”,  in  which  the  Knight  Founda3on  is  a  key  mover,  is  currently  one  of  the  driving  areas  for  the  development  of  data  driven  storytelling  devices  (where  “device”  is  meant  in  the  most  general  sense).  

8  

Another  applica3on  –  currently  under  development,  but  one  I  think  to  watch  out  for  –  is  Odyssey.js,  from  online  mapping  providers  CartoDB.    The  “slides  or  scroll”  mechanic  is  something  worth  bearing  in  mind  when  looking  for  a  way  of  stepping  between  scenes  in  a  serialised  narra3ve.  

9  

A  few  weeks  ago,  I  got  a  tweet  from  @fantas3clife  –  BBC  R&D  hacker  Michael  Smethurst  –  asking  if  I  knew  how  to  generate  “narra3ve  charts”  as  popularised  by  a  par3cular  cartoon  on  the  XKCD  web  comic.  Michael  actually  provided  the  answer    in  his  request  –  in  the  form  of  this  example  from  Canada  –  but  hadn’t  read  the  source  code  properly.    The  narra3ve  chart  –  and  there  are  easily  discovered  examples  on  the  web  (Star  Wars,  Lord  of  the  Rings,  you  get  the  picture)  –  sequences  a  from  of  3me  along  the  horizontal  x-­‐axis  and  a  nominal  scale  on  the  ver3cal  y-­‐axis  represen3ng  different  characters.  Ver3cal  bars  represent  scenes.  Scenes  take  place  at  a  certain  3me  (in  the  storyworld)  and  loca3on  and  incorporate  par3cular  characters.    Michael  was  interested  in  the  way  this  sort  of  representa3on  might  be  able  to  support  con3nuity  checking  in  the  development  of  a  new  radio  drama  (I  think?),  and  it’s  something  I  think  could  be  worth  exploring  in  more  detail,  not  just  for  the  representa3on  of  drama3c  texts,  but  also  in  support  of  inves3ga3ons,  for  example,  criminal/police  inves3ga3ons,  or  inves3ga3ve  journalism.    Issues  we  might  one  to  dig  into  further  are  how  to  represent  different  3me  scales.  For  example,  telling-­‐3me,  that  is,  where  a  scene  happens  x  minutes  through  episode  1,  or  Act  3,  or  ‘story-­‐3me’,  twenty  years  into  the  future  in  scene  1,  flashback  100    

10  

“Sentence  Drawing”  is  a  beau3ful  liJle  technique  –  if  you  like  that  sort  of  thing  –    (originated  by  data  ar3st  Stefanie  Posavec?)  for  serialising  the  turns  taken  by  speakers  in  a  drama3c  text.    [There’s  an  implementa3on  in  R  at  hJp://trinkerrstuff.wordpress.com/2013/12/08/sentence-­‐drawing-­‐func3on-­‐vs-­‐art/  ]    In  this  case,  the  colours  represent  the  family  origins  of  the  speakers  in  Romeo  and  Juliet.  Turns  in  the  line  represent  new  sentences  (though  I  would  like  to  see  them  represent  changes  in  speaker,  with  line  length  rela3ve  to  line(s)  length…  As  it  is,  the  length  of  the  line  indicates  number  of  words  in  each  sentence.    Sentence  drawing  represents  a  macroscopic  view  over  a  text.    Whereas  microscopes  allow  you  to  look  at  the  very  small,  macroscopes  allow  you  to  look  at  the  all  in  a  single,  glanceable  view.  

11  

Notebook  compu3ng  is  my  great  hope  for  the  future.  Notebook  compuIng  is  like  spreadsheet  compuIng,  a    democra3sa3on  of  access  to  and  the  process  of  prac3cally  based,  task  oriented  compu3ng.    Spreadsheets  help  you  get  stuff  done,  even  if  you  don’t  consider  yourself  to  be  a  programmer.  My  hope  is  that  the  notebook  metaphor  –  and  it’s  actually  quite  an  old  one  –  can  similarly  encourage  people  who  don’t  consider  themselves  programmers  to  do  and  to  use  programmy  things.  

12  

Notebook  compuIng  buys  us  in  to  two  ways  of  thinking  that  I  think  are  useful  from  a  pedagogical  perspec3ve  –  that  is,  pedagogy  not  just  as  a  way  of  teaching  but  also  as  a  way  of  learning  in  the  sense  of  learning  about  something  through  invesIgaIng  it.    Here,  I’m  thinking  of  an  inves3ga3on  as  a  form  of  problem  based  learning  –  I’m  not  up  enough  on  educa3onal  or  learning  theory  to  know  whether  there  is  a  body  of  theory,  or  even  just  a  school  of  thought,  about  “inves3ga3ve  learning”.    These  two  ways  of  thinking  are  literate  programming  and  reproducible  research.  

13  

In  case  you  haven’t  already  realised  it,  code  is  an  expressive  medium.  Code  has  its  poets,  and  ar3sts,  as  well  as  its  architects,  engineers  and  technicians.  One  of  the  grand  masters  of  code  is  Don  –  Donald  –  Knuth.    Don  Knuth  said  “A  literate  programmer  is  an  essayist  who  writes  programs  for  humans  to  understand”  as  part  of  a  longer  quote.  Here’s  that  longer  quote:    “Literate  programming  is  a  programming  methodology  that  combines  a  programming  language  with  a  documenta3on  language,  making  programs  more  robust,  more  portable,  and  more  easily  maintained  than  programs  wriJen  only  in  a  high-­‐level  language.  “Computer  programmers  already  know  both  kind  of  languages;  they  need  only  learn  a  few  conven3ons  about  alterna3ng  between  languages  to  create  programs  that  are  works  of  literature.  A  literate  programmer  is  an  essayist  who  writes  programs  for  humans  to  understand,  instead  of  primarily  wri3ng  instruc3ons  for  machines  to  follow.  When  programs  are  wriJen  in  the  recommended  style  they  can  be  transformed  into  documents  by  a  document  compiler  and  into  efficient  code  by  an  algebraic  compiler.”    Notebooks  are  environments  that  encourage  the  programming  of  wri3ng  literate  code.  Notebooks  encourage  you  to  write  prose  and  illustrate  it  with  code  –  and  the    

14  

The  other  idea  that  the  notebooks  buy  is  into  is  reproducible  research.  I  love  this  idea  and  think  you  should  too.  It  lets  archiving  make  sense.    Do  I  really  have  to  say  any  more  than  just  show  that  quote?    Now  you  may  say  that  that’s  all  very  well  for,  I  don’t  know,  physics  or  biology,  or  science,  or  economics.  Or  social  science  in  general,  where  they  do  all  sorts  of  inexplicable  things  with  sta3s3cs  and  probably  should  try  to  keep  track  of  what  they  doing.    But  not  the  humani3es.    But  that’s  not  quite  right,  because  in  the  digital  humaniIes  there  are  computa3onal  tools  that  you  can  use.  Par3cularly  in  the  areas  of  text  analysis  and  visualisa3on.  Such  as  some  of  the  visualisa3ons  we  saw  in  the  first  part  of  this  presenta3on.    But  you  need  a  tool  that  democra3ses  access  to  this  technology.  You  need  an  environment  that  the  social  scien3sts  found  in  the  form  of  a  spreadsheet.    But  beJer.    

15  

(I  also  like  to  think  of  notebooks  as  a  place  where  I  can  have  a  conversaIon  with  data.).  

16  

So  how  do  notebooks  help?    The  tool  I  want  to  describe  is  –  are  –  called  IPython  Notebooks.    IPython  Notebooks  let  you  execute  code  wriJen  in  the  Python  programming  language  in  an  interac3ve  way.  But  they  also  work  with  other  languages  –  Javascript,  Ruby,  R,  and  so  on,  as  well  as  other  applica3ons.  I  use  a  notebook  for  drawing  diagrams  using  Graphviz,  for  example.    They  also  include  words  –  of  introduc3on,  of  analysis,  of  conclusion,  of  reflec3on.    And  they  also  include  the  things  the  code  wants  to  tell  u,  or  that  the  data  wants  to  tell  us  via  the  code.  The  code  outputs.    (Or  more  correctly,  the  code+data  outputs.)  

17  

The  first  thing  notebooks  let  you  do  is  write  text  for  the  non-­‐coding  reader.  Words.  In  English.  (Or  Spanish.  Or  French.  I  would  say  Chinese,  but  I  haven’t  checked  what  character  sets  are  supported,  so  I  can’t  say  that  for  definite  un3l  I  check!)    “Literate  programming  is  a  programming  methodology  that  combines  a  programming  language  with  a  documenta3on  language”.  That’s  what  Knuth  said.  But  we  can  take  it  further.  Past  code.  Past  documenta3on.  To  write  up.  To  story.    The  medium  in  which  we  can  write  our  human  words  is  a  simple  text  markup  language  called  markdown.    If  you’ve  ever  wriJen  HTML,  it’s  not  that  hard.    If  you’ve  ever  wriJen  and  email  and  wrapped  asterisks  around  a  word  or  phrase  to  emphasise  it,  or  wriJen  a  list  of  items  down  by  puzng  each  new  item  onto  a  new  line  and  preceding  it  with  a  dash,  it’s  that  easy.  

18  

Here’s  a  notebook,  and  here’s  some  text.    There’s  also  some  code.    But  note  the  text  –  we  have  a  header,  and  then  some  “human  text”.    You  might  also  no3ce  some  up  and  down  arrows  in  the  notebook  toolbar.  These  allow  us  to  rearrange  the  order  of  the  cells  in  the  notebook  in  a  straigh{orward  way.    In  a  sense,  we  are  encouraged  to  rearrange  the  sequence  of  cells  into  an  order  that  makes  more  sense  as  a  narra3ve  for  the  reader  of  the  document,  or  in  the  execu3on  of  an  inves3ga3on.    The  downside  of  this  is  that  we  can  author  a  document  in  a  ‘non-­‐linear’  way  and  then  linearise  it  for  final  distribu3on  simply  by  reordering  the  order  in  which  the  cells  are  presented.    There  are  constraints  though  –  if  a  cell  computaIonally  depends  on  the  result  of,  or  state  change  resul3ng  from,  the  execu3on  of  a  prior  cell,  their  rela3ve  ordering  cannot  be  changed.  

19  

As  well  as  human  readable  text  cells  –  markdown  cells  or  header  cells  at  a  variety  of  levels  –  there  are  also  code  cells.    Code  cells  allow  you  to  write  (or  copy  and  paste  in)  code  and  then  run  it.    Applica3ons  give  you  menu  op3ons  that  in  the  background  copy,  paste  and  execute  the  code  you  want  to  run,  or  apply  to  some  par3cular  set  of  data,  or  text.    Code  cells  work  the  same  way,  but  they’re  naked.  They  show  you  the  code.    At  this  point  it’s  important  to  remember  that  code  can  call  code.    Thousands  of  lines  of  code  that  do  really  clever  and  difficult  things  can  be  called  from  a  single  line  of  code.  OUen  code  with  a  sensible  func3on  name  just  like  a  sensible  menu  item  label.  A  self-­‐describing  name  that  calls  the  masses  of  really  clever  code  that  someone  else  has  wriJen    behind  the  scenes.    But  you  know  which  code  because  you  just  called  it.  Explicitly.    Let’s  see  an  example  –  not  a  brilliant  example,  but  an  example  nonetheless.  

20  

Here’s  some  code.    It’s  actually  two  code  cells  –  in  one,  I  define  a  func3on.  In  the  second,  I  call  it.    (Already  this  is  revisionist.  I  developed  the  func3on  by  not  wrapping  it  in  a  func3on.  It  was  just  a  series  of  lines  of  code  that  wrote  to  perform  a  par3cular  task.    But  it  was  a  useful  task.  So  I  wrapped  the  lines  of  code  in  a  func3on,  and  now  I  can  call  those  lines  of  code  just  by  calling  the  func3on  name.    I  can  also  hide  the  func3on  in  another  file,  outside  of  the  notebook,  then  just  include  it  in  any  notebook  I  want  to…    …or  within  a  notebook,  I  could  just  copy  a  set  of  lines  of  code  and  repeatedly  paste  them  into  the  notebook,  applying  them  to  a  different  set  of  data  each  3me…  but  that  just  gets  messy,  and  that’s  what  being  able  to  call  a  bunch  of  lines  of  coped  wrapped  up  in  a  func3on  call  avoids.  

21  

As  far  as  reproducible  research  goes,  the  ability  of  a  notebook  to  execute  a  code  element  and  display  the  output  from  execuIng  that  code  means  that  there  is  a  one-­‐to-­‐one  binding  between  a  code  fragment  and  the  data  on  which  it  operates  and  the  output  obtained  from  execu3ng  just  that  code  on  just  that  data.  

22  

The  output  of  the  code  is  not  a  human  copied  and  pasted  artefact.    The  output  of  the  code  –  in  this  case,  the  result  of  execu3ng  a  par3cular  func3on  –  is  only  and  exactly  the  output  from  execu3ng  that  func3on  on  a  specified  dataset.    

23  

The  output  of  a  code  cell  is  not  limited  to  the  arcane  outputs  of  a  computa3onal  func3on.    We  can  display  data  table  results  as  data  tables.  

24  

We  can  also  generate  rich  HTML  outputs  –  in  this  case  an  interac3ve  map  overlaid  with  markers  corresponding  to  loca3ons  specified  in  a  dataset,  and  with  lines  connec3ng  markers  as  defined  by  connec3ons  described  in  the  original  dataset.    We  can  also  delete  the  outputs  of  all  the  code  cells,  and  then  rerun  the  code,  one  step  –  one  cell  –  aUer  the  other.  Reproducing  results  becomes  simply  a  maJer  of  rerunning  the  code  in  the  notebook  against  the  data  loaded  in  by  the  notebook  –  and  then  comparing  the  code  cell  outputs  to  the  code  cell  outputs  of  the  original  document.    Tools  are  also  under  development  that  help  spot  differences  between  those  outputs,  at  least  in  cases  where  the  outputs  are  text  based.  

25  

To  summarise,  technologies  such  as  story  maps  and  computa3onal  notebooks  encourage  you  to  create  a  story  –  or  analysis  –  one  frame  at  a  3me,  one  cell  at  a  3me.    But  that  is  not  to  say  that  the  result  of  that  construc3on  need  necessarily  be  presented  in  the  same  linear  order.    Story  maps  powered  by  data  construct  3melines  based  on  3mestamps,  and  may  generate  connec3ng  lines  between  loca3ons  based  on  data  that  either  explicitly  maps  from  one  loca3on  to  another  (from  and  to  column  cells  in  the  same  row  of  a  dataset)  or  that  implies  a  step  from  loca3on  to  another  (such  as  moving  from  a  loca3on  in  one  row  to  the  loca3on  specified  in  the  next  row).    As  with  all  networks  constructed  from  a  set  of  independently  stated  connec3ons,  some3mes  the  gross  level  structure  and  paJerns  only  become  evident  when  you  look  at  everything  all  at  the  same  Ime.  

26  

As  well  as  construc3ng  stories  one  step  at  a  3me,  can  they  also  be  read  one  step  at  a  3me.    And  if  so,  how  is  that  sequencing  managed?  Is  the  reader  lead  down  a  single  path?    Are  there  decision  points  whey  they  can  change  the  direc3on  of  the  story?    Is  it  obvious  even  where  the  star3ng  point  of  the  story  reading  is,  and  when  the  end  has  been  reached?    If  your  notebook  –  or  story  –  was  constructed  in  a  conversa3on-­‐like  way,  does  it  read  back  well  as  one?  

27  

To  learn  more  about  working  with  data,  as  well  as  finding  and  telling  stories  in  data,  visit  the  School  of  Data  website  at  SchoolOfData.org    The  website  includes  a  regularly  updated  blog  featuring  news,  events  and  stories  from  the  world  of  data,  as  well  as  a  growing  body  of  openly  licensed  free  courses  and  tutorials  on  working  with  data.    The  School  of  Data  also  runs  an  ac3ve  fellowship  programme  for  prac33oners  who  regularly  work  with  open  data.  Visit  SchoolOfData.org  to  learn  more.  

28