Upgrade to Pro — share decks privately, control downloads, hide ads and more …

SketchTheDocs: How Visual Storytelling Can Impr...

SketchTheDocs: How Visual Storytelling Can Improve Your Learning & Communication Skills

Talk at #IWD2021 to GDGSF
Livestream archive here:
https://youtu.be/qVEUbOdQvqg?t=12829

Did you know 65% of us are visual learners? And that writing things down, and using visual vocabularies, can improve your understanding, retention, and recall, of complex information?

Join me as we explore the world of visual storytelling from building your own visual toolkit ("learn to sketch") to creating rich visual guides ("sketch to learn") that make technology feel more relatable.
We'll explore a visual storytelling roadmap from note-taking to metaphors, from digital to physical, and passive to interactive, usage.

Nitya Narasimhan, PhD

April 30, 2021
Tweet

More Decks by Nitya Narasimhan, PhD

Other Decks in Technology

Transcript

  1. @NITYA NARASIMHAN | 2021 VISUAL STORYTELLING & TECH @SKETCHTHEDOCS |

    HTTPS://CLOUD-SKILLS.DEV #SketchTheDocs Why How Visual Storytelling Can Improve Your Learning & Communication Skills @NITYA NARASIMHAN | 2021 VISUAL STORYTELLING & TECH @SKETCHTHEDOCS | HTTPS://CLOUD-SKILLS.DEV
  2. @NITYA NARASIMHAN | 2021 VISUAL STORYTELLING & TECH @SKETCHTHEDOCS |

    HTTPS://CLOUD-SKILLS.DEV Abstract Did you know 65% of us are visual learners? And that writing things down, and using visual vocabularies, can improve your understanding, retention, and recall, of complex information? Join me as we explore the world of visual storytelling from building your own visual toolkit ("learn to sketch") to creating rich visual guides ("sketch to learn") that make technology feel more relatable. We'll explore a visual storytelling roadmap from note-taking to metaphors, from digital to physical, and passive to interactive, usage.
  3. @NITYA NARASIMHAN | 2021 VISUAL STORYTELLING & TECH @SKETCHTHEDOCS |

    HTTPS://CLOUD-SKILLS.DEV What is Visual Storytelling? Using a Visual Vocabulary To Communicate Complex Ideas To Assist With Understanding Retention Recall
  4. @NITYA NARASIMHAN | 2021 VISUAL STORYTELLING & TECH @SKETCHTHEDOCS |

    HTTPS://CLOUD-SKILLS.DEV Why Visual Storytelling? Every person processes information differently 2 out of 3 humans learn visually Our brains absorb spatial & visual information faster, detecting patterns, making connections improving retention From: "How to Spot Visual, Auditory and Kinesthetic Learning Executives..", Inc Online
  5. @NITYA NARASIMHAN | 2021 VISUAL STORYTELLING & TECH @SKETCHTHEDOCS |

    HTTPS://CLOUD-SKILLS.DEV My Visual Storytelling Journey Became Journaling evolved to a way of capturing key memories Started As Self-Care drawing helped me cope with anxiety Then Storytelling visualizing technology to grow awareness, understanding & recall @nitya | @sketchthedocs
  6. @NITYA NARASIMHAN | 2021 VISUAL STORYTELLING & TECH @SKETCHTHEDOCS |

    HTTPS://CLOUD-SKILLS.DEV Visual Storytelling : Tech & DevRel Visual Storytelling apply your skills to other areas (public speaking), learn from community Sketchnoting 101 jumpstart your journey by building your visual toolkit for note-taking Amplify Messaging visualizing takeaways for attention & recall Personal Branding document user tech journeys memorably
  7. @NITYA NARASIMHAN | 2021 VISUAL STORYTELLING & TECH @SKETCHTHEDOCS |

    HTTPS://CLOUD-SKILLS.DEV What is Sketchnoting? Rapid Note-taking Visual Capture of Ideas Information Summarization & Synthesis
  8. @NITYA NARASIMHAN | 2021 VISUAL STORYTELLING & TECH @SKETCHTHEDOCS |

    HTTPS://CLOUD-SKILLS.DEV Rapid Note-taking Visual Capture of Ideas Information Summarization & Synthesis What is Visual Storytelling?? Explain Metaphorically (analogies) Connect Emotionally (anthropomorphism) Visualize Consistently (vocabularies)
  9. @NITYA NARASIMHAN | 2021 VISUAL STORYTELLING & TECH @SKETCHTHEDOCS |

    HTTPS://CLOUD-SKILLS.DEV Learn To Sketch: @nitya | @sketchthedocs
  10. @NITYA NARASIMHAN | 2021 VISUAL STORYTELLING & TECH @SKETCHTHEDOCS |

    HTTPS://CLOUD-SKILLS.DEV 1. Stretch your sketching muscles daily! Rediscover the joy of doodling making visual marks will help you think and increases your focus Without lifting your pen, doodle a line over and around, crisscrossing in many places. Color or pattern enclosed areas. How did that feel? @nitya | @sketchthedocs
  11. @NITYA NARASIMHAN | 2021 VISUAL STORYTELLING & TECH @SKETCHTHEDOCS |

    HTTPS://CLOUD-SKILLS.DEV 2. Build a Visual Storytelling Toolkit FONTS QUOTES PEOPLE ICONS CONTAINERS LAYOUTS DIRECTION COLORS Typography & Imagery Colors & Composition
  12. @NITYA NARASIMHAN | 2021 VISUAL STORYTELLING & TECH @SKETCHTHEDOCS |

    HTTPS://CLOUD-SKILLS.DEV 3. Visual Toolkit : Fonts FONTS QUOTES PEOPLE ICONS CONTAINERS LAYOUTS DIRECTION COLORS Types = Visual Interest Sizes = Hierarchy Fast for Capture, Slow for Clarity
  13. @NITYA NARASIMHAN | 2021 VISUAL STORYTELLING & TECH @SKETCHTHEDOCS |

    HTTPS://CLOUD-SKILLS.DEV 4. Visual Toolkit : Quotes FONTS QUOTES PEOPLE ICONS CONTAINERS LAYOUTS DIRECTION COLORS Listen for repetitions Select for resonance Learn to listen with intent!
  14. @NITYA NARASIMHAN | 2021 VISUAL STORYTELLING & TECH @SKETCHTHEDOCS |

    HTTPS://CLOUD-SKILLS.DEV 5. Visual Toolkit : People FONTS QUOTES PEOPLE ICONS CONTAINERS LAYOUTS DIRECTION COLORS Start with basic figures Build up to faces Make a cheatsheet!
  15. @NITYA NARASIMHAN | 2021 VISUAL STORYTELLING & TECH @SKETCHTHEDOCS |

    HTTPS://CLOUD-SKILLS.DEV 6. Visual Toolkit : Icons FONTS QUOTES PEOPLE ICONS CONTAINERS LAYOUTS DIRECTION COLORS Focus on the familiar Just enough to recognize Inspiration: Noun Project!
  16. @NITYA NARASIMHAN | 2021 VISUAL STORYTELLING & TECH @SKETCHTHEDOCS |

    HTTPS://CLOUD-SKILLS.DEV 7. Visual Toolkit : Containers FONTS QUOTES PEOPLE ICONS CONTAINERS LAYOUTS DIRECTION COLORS Composition for clarity Groups & Boundaries Cultivate a sense of whimsy
  17. @NITYA NARASIMHAN | 2021 VISUAL STORYTELLING & TECH @SKETCHTHEDOCS |

    HTTPS://CLOUD-SKILLS.DEV 8. Visual Toolkit : Layouts FONTS QUOTES PEOPLE ICONS CONTAINERS LAYOUTS DIRECTION COLORS Think about how your audience consumes info Book, Webpage, Workflow, Table
  18. @NITYA NARASIMHAN | 2021 VISUAL STORYTELLING & TECH @SKETCHTHEDOCS |

    HTTPS://CLOUD-SKILLS.DEV 9. Visual Toolkit : Direction FONTS QUOTES PEOPLE ICONS CONTAINERS LAYOUTS DIRECTION COLORS Help your reader navigate Use familiar signals Arrows, Maps, Trails
  19. @NITYA NARASIMHAN | 2021 VISUAL STORYTELLING & TECH @SKETCHTHEDOCS |

    HTTPS://CLOUD-SKILLS.DEV 10. Visual Toolkit : Colors FONTS QUOTES PEOPLE ICONS CONTAINERS LAYOUTS DIRECTION COLORS Create visual separation Create contextual connect Challenge: Think accessibility!!
  20. @NITYA NARASIMHAN | 2021 VISUAL STORYTELLING & TECH @SKETCHTHEDOCS |

    HTTPS://CLOUD-SKILLS.DEV Sketch To Learn: @nitya | @sketchthedocs
  21. @NITYA NARASIMHAN | 2021 VISUAL STORYTELLING & TECH @SKETCHTHEDOCS |

    HTTPS://CLOUD-SKILLS.DEV Capture Talks Live: Share & Recall https://twitter.com/arunulag/status/1335990361768902656 @nitya | @sketchthedocs
  22. @NITYA NARASIMHAN | 2021 VISUAL STORYTELLING & TECH @SKETCHTHEDOCS |

    HTTPS://CLOUD-SKILLS.DEV https://twitter.com/nitya/status/1351765213796851712 Share in near-real time Reinforce core messaging @nitya | @sketchthedocs Capture Ahead, Share Live: Amplify
  23. @NITYA NARASIMHAN | 2021 VISUAL STORYTELLING & TECH @SKETCHTHEDOCS |

    HTTPS://CLOUD-SKILLS.DEV Learning Guides: Pre-Read, Post-Review @nitya | @sketchthedocs https://aka.ms/visual-azure-cmu-elasticity
  24. @NITYA NARASIMHAN | 2021 VISUAL STORYTELLING & TECH @SKETCHTHEDOCS |

    HTTPS://CLOUD-SKILLS.DEV Chalk The Talk: Before, During, After @nitya | @sketchthedocs
  25. @NITYA NARASIMHAN | 2021 VISUAL STORYTELLING & TECH @SKETCHTHEDOCS |

    HTTPS://CLOUD-SKILLS.DEV Zine The Scene – Giveaway your message! Summarize content in 8 cells (on a single page) Paper or Digital Templates (speed up execution) @nitya | @sketchthedocs
  26. @NITYA NARASIMHAN | 2021 VISUAL STORYTELLING & TECH @SKETCHTHEDOCS |

    HTTPS://CLOUD-SKILLS.DEV #ABSee – Visual Vocabulary Games @nitya | @sketchthedocs
  27. @NITYA NARASIMHAN | 2021 VISUAL STORYTELLING & TECH @SKETCHTHEDOCS |

    HTTPS://CLOUD-SKILLS.DEV Resources: Learn, Copy, Contribute! https://cloud-skills.dev https://dev.to/t/visualizeit Free, 6-part online workshop series (skill yourself up!) Repository of tech sketchnotes (contributions welcome!) @nitya | @sketchthedocs
  28. @NITYA NARASIMHAN | 2021 VISUAL STORYTELLING & TECH @SKETCHTHEDOCS |

    HTTPS://CLOUD-SKILLS.DEV Resources: People, Books & Practice On Creativity | Austin Kleon Letters, Maps, Processes Eva-Lotta Lamm Sketchnoting Ideas Denise Yu | Anthropomorphism Maggie Appleton Visual Metaphors Mike Rohde | #SketchnoteArmy @nitya | @sketchthedocs
  29. @NITYA NARASIMHAN | 2021 VISUAL STORYTELLING & TECH @SKETCHTHEDOCS |

    HTTPS://CLOUD-SKILLS.DEV @nitya | @sketchthedocs Own your Takeaway! – @sketchthedocs
  30. @NITYA NARASIMHAN | 2021 VISUAL STORYTELLING & TECH @SKETCHTHEDOCS |

    HTTPS://CLOUD-SKILLS.DEV Thank You! Follow @sketchthedocs | Chat @nitya Share your journey: #SketchTheDocs Sketchnotes: https://cloud-skills.dev Workshops: https://dev.to/t/visualizeit @NITYA NARASIMHAN | 2021 VISUAL STORYTELLING & TECH @SKETCHTHEDOCS | HTTPS://CLOUD-SKILLS.DEV