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
400
Front End Badassery with Sass
Avatar for Jessica Eldredge jessabean
9
390

Other Decks in Design

See All in Design
エンジニアでも捗る デザイナー的思考入門
Avatar for Tsubasa SEKIGUCHI tinykitten
0
710
portfolio_YumiYasuda
Avatar for yumi yasuda yum0418
0
240
aya_murakami_portfolio
Avatar for aya ayakaimi1101
0
1.6k
なぜ今必要？Figma×SmartHR×DMM.com×一休 エンジニア視点で考えるデザインシステム
Avatar for Hiroki Tani hilokifigma
1
890
成長する組織のナレッジベースのつくりかた_知識基盤のデザインとメタデザイン
Avatar for gaussbeam gaussbeam
0
1.1k
同人音声のための、 最高の視聴体験を求めて【サブカル×デザインMeetUP！】
Avatar for viviON Design vivion
0
500
一人ひとりのポテンシャルを活かしたナレッジマネジメントとは？
Avatar for Atsushi Homma atsushihomma
1
390
マルチプロダクトにおけるデザイナーの挑戦-デザイン初め新年会2025
Avatar for r.aoki u_ri_ta
2
190
“使いやすい”が生産性を変える！業務を効率化するためのUX/UI設計ポイント
Avatar for NCDC ncdc
2
290
ポートフォリオ_藤田歩希(ほまれ)
Avatar for Aki Fujita akifujita_homarecreate
0
460
Дизайн современной услуги с Картой процесса-опыта
Avatar for Andrew Shapiro ashapiro
0
170
The Very Small Creatures - dressing up warm sequence
Avatar for Lizzie lizziestoryboards
0
330

Featured

See All Featured
Fight the Zombie Pattern Library - RWD Summit 2016
Avatar for Marcelo Somers marcelosomers
233
17k
[RailsConf 2023 Opening Keynote] The Magic of Rails
Avatar for Eileen M. Uchitelle eileencodes
29
9.5k
XXLCSS - How to scale CSS and keep your sanity
Avatar for Zaharenia Atzitzikaki sugarenia
248
1.3M
Site-Speed That Sticks
Avatar for Harry Roberts csswizardry
6
540
Six Lessons from altMBA
Avatar for Skipper Chong Warson skipperchong
28
3.8k
Visualizing Your Data: Incorporating Mongo into Loggly Infrastructure
Avatar for mongodb mongodb
45
9.5k
Gamification - CAS2011
Avatar for David Bonilla davidbonilla
81
5.3k
RailsConf & Balkan Ruby 2019: The Past, Present, and Future of Rails at GitHub
Avatar for Eileen M. Uchitelle eileencodes
137
33k
Designing Dashboards & Data Visualisations in Web Apps
Avatar for Des Traynor destraynor
231
53k
Done Done
Avatar for chrislema chrislema
184
16k
Facilitating Awesome Meetings
Avatar for Lara Hogan lara
54
6.3k
Intergalactic Javascript Robots from Outer Space
Avatar for Vicent Martí tanoku
271
27k

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