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

Sketchnoting: Creative Notes for Technical Content

Avatar for Jessica Eldredge Jessica Eldredge
April 24, 2014
Design
7
1.3k

Sketchnoting: Creative Notes for Technical Content

Avatar for Jessica Eldredge

Jessica Eldredge

April 24, 2014
Tweet

More Decks by Jessica Eldredge

See All by Jessica Eldredge
Prototyping Layout with CSS Grid - RevolutionConf 2018
Avatar for Jessica Eldredge jessabean
1
310
Prototyping Layout with CSS Grid - Refresh DC
Avatar for Jessica Eldredge jessabean
1
420
Front End Badassery with Sass
Avatar for Jessica Eldredge jessabean
9
390

Other Decks in Design

See All in Design
Starry | Storyboards | Scene 1-21
Avatar for Gio Fortunato giofortuna_story
0
280
AI動画生成ガチャ紹介
Avatar for Takatomo Torigoe piyo7
1
110
RAKSUL_DESIGN_DECK_20250319
Avatar for RAKSUL raksulrecruiting
0
360
読書シェア会 vol.5 / Yumemi.grow 20250526
Avatar for Rakus_Dev rakus_dev
0
1.6k
私とデザインの10年
Avatar for なつ iflection
0
130
A brief & incomplete history of 
UX Design for the World Wide Web: 1989–2019
Avatar for Jason CranfordTeague jct
1
200
Cyber Heart Online Book
Avatar for Hannah hjnasby
0
100
Haley's adventure chase
Avatar for Ivette Molina ivettetwin
0
220
誰もがAIエージェントを"操作"したがる〜AIエージェントに求められるUX〜
Avatar for Shota Ikeyatsu ikeyatsu
2
1.8k
無自覚なランクとその影響を紐解くワークショップ / Unpacking Unconscious Privilege Workshop
Avatar for Aki spring_aki
4
280
portfolio_YumiYasuda
Avatar for yumi yasuda yum0418
0
280
ポートフォリオ_藤田歩希(ほまれ)
Avatar for Aki Fujita akifujita_homarecreate
0
590

Featured

See All Featured
Chrome DevTools: State of the Union 2024 - Debugging React & Beyond
Avatar for Addy Osmani addyosmani
7
700
The Invisible Side of Design
Avatar for Vitaly Friedman smashingmag
299
51k
Fight the Zombie Pattern Library - RWD Summit 2016
Avatar for Marcelo Somers marcelosomers
233
17k
KATA
Avatar for Megan Lloyd mclloyd
29
14k
Adopting Sorbet at Scale
Avatar for Ufuk Kayserilioglu ufuk
77
9.4k
Faster Mobile Websites
Avatar for Dean Hume deanohume
307
31k
Designing for Performance
Avatar for Lara Hogan lara
609
69k
Fantastic passwords and where to find them - at NoRuKo
Avatar for Phil Nash philnash
51
3.3k
CSS Pre-Processors: Stylus, Less & Sass
Avatar for Bermon Painter bermonpainter
357
30k
I Don’t Have Time: Getting Over the Fear to Launch Your Podcast
Avatar for Joe Casabona jcasabona
32
2.3k
The Success of Rails: Ensuring Growth for the Next 100 Years
Avatar for Eileen M. Uchitelle eileencodes
45
7.4k
Stop Working from a Prison Cell
Avatar for Chris Michel hatefulcrawdad
270
20k

Transcript

  1. SKETCHNOTING CREATIVE NOTES FOR TECHNICAL CONTENT Jessica Eldredge Front End

    Developer, Shopify @jessabean

  2. What is sketchnoting?

  3. Visual notetaking.

  4. Jessica Eldredge // jessica-eldredge.com

  5. Jessica Eldredge // jessica-eldredge.com

  6. Mike Rohde // rohdesign.com

  7. Jessica Eldredge // jessica-eldredge.com DHH!

  8. Live vs. later.

  9. Veronica Erb // veronicaerb.com

  10. Sacha Chua // sachachua.com

  11. Daniel Kirsch // kirelabs.org

  12. Why sketchnote?

  13. Inspiration in analog.

  14. Focus.

  15. Improve memory.

  16. It’s just fun!

  17. But…I can’t draw!

  18. None

  19. Jessica Eldredge // jessica-eldredge.com

  20. None

  21. How to sketchnote

  22. –MARY OLIVER, “SOMETIMES” “Instructions for living a life: Pay attention.

    Be astonished. Tell about it.” sketchnoting

  23. Pay attention

  24. It’s not about drawing. It’s about listening.

  25. Follow the speaker, not the slides.

  26. Listen for key points.

  27. Live coding: don’t do it.

  28. Use post-it notes to retain ideas.

  29. Be astonished

  30. Capture what stands out to you.

  31. Carolyn Sewell // carolynsewell.com

  32. Jessica Eldredge // jessica-eldredge.com

  33. Jokes. Quotes. F-bombs!

  34. Erin Hawkins // erinmchardy.com

  35. Create your visual language.

  36. Eva-Lotta Lamm // evalotta.net

  37. Sometimes the content still doesn’t stick…

  38. None

  39. Tell about it

  40. Share your notes.

  41. Speakers will be grateful.

  42. People will be wowed.

  43. Some practical tips

  44. Get comfortable.

  45. Slow down.

  46. Play with layouts.

  47. Nirish Shakya // http://happinessisanexperience.com/

  48. Paul Soupiset // projeqt.com/soupiset

  49. Add the decoration last.

  50. Embrace mistakes.

  51. Jessica Eldredge // jessica-eldredge.com

  52. Practice makes better

  53. Practice with TED talks, meetings, reality TV.

  54. Jessica Eldredge // jessica-eldredge.com

  55. Craighton Berman // http://studio.craightonberman.com/

  56. Get “inspired” (copy).

  57. None
  58. None

  59. I can’t draw!

  60. But you can sketchnote.

  61. ! GO TAKE SOME NOTES! ! Jessica Eldredge, Shopify !

    @jessabean http://speakerrate.com/jessabean