Storytelling through Creative Coding - PCD,2019

My deck from the Processing Community Day 2019, at the Bangalore edition. A journey of my work across data visualization and generative art, exploring storytelling as a practice in visualization.

Storytelling is not merely the narration of events, but also a tool to breakdown complex phenomena for easier comprehension. The new age of data allows the maker now to delve deeper and gain richer insights on the stories, often telling us facts we would not have chanced upon.

Transcript

1. Storytelling through Creative Coding Hardik Chandrahas ( @18Hardik) Information Design @ NID, Bangalore Processing Community Day // 19
2. intro( ) // Hardik Chandrahas (@18Hardik) Processing Community Day // 19 Currently pursuing Post Grad NID,Bangalore - Information Design Graduation: BITS Pilani Goa Campus - EEE + Phy Work Exp: 2 yrs UX Designer Data Viz || Generative Art sift it . clean it . sketch it. make it
3. .storytelling ( ) Storytelling is the act of describing narratives generally comprising of a beginning, middle and an end resolution. Breaking down a larger event (novels, larger essays) into comprehensible bits // Hardik Chandrahas (@18Hardik) Processing Community Day // 19 Allows viewer to develop meaning by their own impact (self-choosing stories). // Harry Potter Book 1 - JKR // // Bandersnatch - Charles Brooker //
4. .narrative ( ) A narrative is a framework through which a story is presented to the reader. The structure of a narrative represents the form and structure: the protagonist, his journey, the climax, conquest and final resolution. Storytelling // Hardik Chandrahas (@18Hardik) Processing Community Day // 19
5. // Hardik Chandrahas (@18Hardik) Processing Community Day // 19 Call to Action Meets Guardian Crossing 1st Threshold Tests, trials - friends, enemies Challenge - Reward Resurrection Final Trial Return with Elixir //Start// //End// .harrypotter-1 ( )
6. “ Data is the new soil, because for me, it feels like a fertile, creative medium. Over the years, online, we've laid down a huge amount of information and data, and we irrigate it with networks and connectivity.” - David McCandles / / .data driven Narrative / / // Hardik Chandrahas (@18Hardik) Processing Community Day // 19
7. Insights derived through data enable a newer angle to look at the story; Allowing the reader to absorb in a better manner. / / .data driven Narrative / / // Hardik Chandrahas (@18Hardik) Processing Community Day // 19
8. // Hardik Chandrahas (@18Hardik) Processing Community Day // 19 / / .data driven Narrative / / // https://flowingdata.com/2016/10/12/all-the-harry-potter-spells-when-they-were-used/ // // https://imgur.com/a/ytNmb //
9. // Hardik Chandrahas (@18Hardik) Processing Community Day // 19 Code as a tool aids us to delve deeper into stories to unearth newer insights; What does { CODE * } do ? Allowing an elaborate understanding of the story.
10. // Hardik Chandrahas (@18Hardik) Processing Community Day // 19 creative.coding( ) { * } “Creative coding refers to a practice where the artist uses a system, such as; // A set of natural language rules, A computer program, A machine, or other procedural invention, set into motion with some degree of autonomy creating a design piece. //
11. // Hardik Chandrahas (@18Hardik) Processing Community Day // 19 Creative coding as a practice to delve deeper into stories, deriving insights to aid comprehension. // Algorithm as the protagonist, Variables as the conditions, Inputs as the events shaping it and final multiple resolutions on choices taken. // { creative.coding ( ) * } Tracks { c.c ( ) } to derive insights { c.c ( ) } as a framework
12. // Hardik Chandrahas (@18Hardik) Processing Community Day // 19 { Creative Coding * } Tracks Data Visualisation. Generative Art Range of Expression President Speeches - Sentiment Analysis : https://emotions.periscopic.com/inauguration/
13. // Hardik Chandrahas (@18Hardik) Processing Community Day // 19 { Creative Coding * } Tracks Simulated Dendrochronology - Pedro Cruz (2018) - https://web.northeastern.edu/naturalizing-immigration-dataviz/ Data Visualisation. Generative Art Range of Expression
14. // Hardik Chandrahas (@18Hardik) Processing Community Day // 19 { Creative Coding * } Tracks Casa da Musica Identity Design - Sagmeister & Walsh: https://sagmeisterwalsh.com/work/all/casa-da-musica/ Generative Art Data Visualisation Range of Expression
15. // Hardik Chandrahas (@18Hardik) Processing Community Day // 19 { Creative Coding * } Tracks Generative Artwork - Manuel Gamboa Naon: https://www.behance.net/manoloide Generative Art Data Visualisation Range of Expression
16. // Hardik Chandrahas (@18Hardik) Processing Community Day // 19 Data Visualisation What is the intent behind visualising ? Describe ( ) Detail ( ) Explore ( ) The lens guiding our visualisation’s framework is often based on a story, we are trying to put forth before our users. List out Data Answer Questions Seek multiple interpretations
17. // Hardik Chandrahas (@18Hardik) Processing Community Day // 19 Quantified Self Visualising Personal Data “In all of these patterns, I do think there is an essential idea of who we are,” - Laurie Frick Mood + Quantify - Laurie frick: http://www.lauriefrick.com/mood-quantify
18. // Hardik Chandrahas (@18Hardik) Processing Community Day // 19 Quantified Self Visualising Personal Data Visualising cycle rides over the past two years Motivations in this endeavour were to observe seasonal variation in my cycling rides.
19. // Hardik Chandrahas (@18Hardik) Processing Community Day // 19 Quantified Self Visualising Personal Data How do I use my bike for commuting ? How often and how much do I train on my cycle? Train enough to claim myself as a serious cyclist ? How does the community respond to my cycling ? How has college life affected my training routine ?
20. // Hardik Chandrahas (@18Hardik) Processing Community Day // 19 Quantified Self Visualising Personal Data // Initial Analysis //
21. // Hardik Chandrahas (@18Hardik) Processing Community Day // 19 Quantified Self Visualising Personal Data // Code Renders // //2016// //2017//
22. // Hardik Chandrahas (@18Hardik) Processing Community Day // 19 Quantified Self Visualising Personal Data // Viz. Key //
24. // Hardik Chandrahas (@18Hardik) Processing Community Day // 19 Karna has always been righteous, yet never fortunate. Whereas Arjuna has been consistently favoured by the gods. A story of contrast between the two epic warriors. A tale of fate // Grant Morrison’s 18 Days // Visualising the World’s Longest Poem Decoding an Epic
25. // Hardik Chandrahas (@18Hardik) Processing Community Day // 19 Which characters are frequently mentioned with Karna and Arjuna? What events in the book cause these associations and interactions ? How are Karna and Arjuna described qualitatively in the book? What events brought them closer ? Visualising the World’s Longest Poem Decoding an Epic
26. // Hardik Chandrahas (@18Hardik) Processing Community Day // 19 python + spaCY Using spaCy to find out mentions around the protagonist and the adjectives used to describe them. Visualising the World’s Longest Poem // Initial Analysis // Decoding an Epic
27. // Hardik Chandrahas (@18Hardik) Processing Community Day // 19 Visualising the World’s Longest Poem // Code Renders // Decoding an Epic
28. // Hardik Chandrahas (@18Hardik) Processing Community Day // 19 Visualising the World’s Longest Poem Decoding an Epic // Code Renders //
29. // Hardik Chandrahas (@18Hardik) Processing Community Day // 19 Visualising the World’s Longest Poem Decoding an Epic // Code Renders // Plotting the counts of the protagonists & their acquaintances.
30. // Hardik Chandrahas (@18Hardik) Processing Community Day // 19 Visualising the World’s Longest Poem // Visualisation Key // Decoding an Epic Bhima Vasudeva Krishna mighty illustrious
32. // Hardik Chandrahas (@18Hardik) Processing Community Day // 19 Data Visualisation Generative Art / / > > > / /
33. // Hardik Chandrahas (@18Hardik) Processing Community Day // 19 Generative Art Computer Generated // Artist Generated algo( ) random( ) modular.patterns( ) Determine base form and behaviour of artwork. An avenue for chance ,to add an element of surprise. Smaller patterns that depend on static + live inputs. The laws to setup a framework generating multiple variants of an artwork using data (preset/live) as the variable
34. // Hardik Chandrahas (@18Hardik) Processing Community Day // 19 Evolving perceptions on cultural art Keep it Today Depicting the impact on a traditional art form in modern times , using contemporary production techniques Ajrakh block & resist printing technique Lippan Mirror & White Clay relief wall art
35. // Hardik Chandrahas (@18Hardik) Processing Community Day // 19 Evolving perceptions on cultural art Keep it Today Projecting Lippan patterns to a surface from a distorted arrangement of mirrors in its base form. Visualising live sound input to depict the changing perception of people on the craft.
36. // Hardik Chandrahas (@18Hardik) Processing Community Day // 19 Evolving perceptions on cultural art Keep it Today Broken Mirror patterns -> Artform Disorganisation -> fragmented state of the craft in current times. As people appreciate Ajrakh, its perception evolves; modernisation causing decreased authenticity.
37. // Hardik Chandrahas (@18Hardik) Processing Community Day // 19
38. // Hardik Chandrahas (@18Hardik) Processing Community Day // 19 Processing Video Stroke thickness = Amplitude of sound
39. // Hardik Chandrahas (@18Hardik) Processing Community Day // 19 Face reflecting the self Abstractionism Welcoming the Information Design juniors ,@ NID. Generative Identity artworks embedded in an abstract face.
40. // Hardik Chandrahas (@18Hardik) Processing Community Day // 19 Face reflecting the self Abstractionism Crowd Filled datasheets. Marks developed to signify the aspects // Initial Analysis//
41. // Hardik Chandrahas (@18Hardik) Processing Community Day // 19 Face reflecting the self Abstractionism // Visualisation Key//
42. // Hardik Chandrahas (@18Hardik) Processing Community Day // 19 // Code Render//
43. // Hardik Chandrahas (@18Hardik) Processing Community Day // 19 “Most of us need to listen to the music to understand how beautiful it is. But often that’s how we present statistics: we just show the notes, we don’t play the music.” - Hans Rosling
44. Processing Community Day // 19 Thank You! .exit() Github Twitter Behance github.com/IllusionInk @18Hardik behance.net/HardikChandrahas