large_Crossover Series NFTs.png

medium_Crossover Series NFTs.png

small_Crossover Series NFTs.png

thumbnail_Crossover Series NFTs.png

From Photography to NFT Art: Twisted Digital Landscapes with Nate Hill

From Design System to ‘NFT Design System’: Creating TinyFaces

Neurodiversity and Inclusion: Choosing Kinder Design

medium_652ccf22c8853584bde5553986a4eed0.png

small_652ccf22c8853584bde5553986a4eed0.png

thumbnail_652ccf22c8853584bde5553986a4eed0.png

Web5 is here. Goodbye Web3? TBD.

Published on <a href="https://blog.prototypr.io/my-first-conscious-sketchnote-172b4e2c1f0?source=rss----eb297ea1161a---4">| Prototyping: From UX to Front End &mdash; Medium</a> Anca Croitoru 
Taking notes is something we start doing at a very early stage in our lives, as teachers show us how to structure the information they convey in order for us to be able to remember it easily. Unfortunately, we are always prompted with words organised in paragraphs and lists, tables, bullet points, etc.
Later on in life, we are faced with more complex problems that are easier to describe drawing some lines, diagrams and using simple geometrical forms.
<img alt="" src="https://cdn-images-1.medium.com/max/1024/1*L8tnkCtuzsZoqoRZlgYa6A.png">Source: Dan Roam — “The Back of the Napkin”
Up until now, I’ve been using sketchnotes unconsciously to give “how to get there” instructions, show how a dress looks like, etc. At work, I always rely on pen and paper when I need to express my ideas about how a certain feature should work for the user, what information should be included on a specific page of the website, etc.
Having enrolled in the <a href="https://www.ironhack.com/en/ux-ui-design-bootcamp-learn-ux-design">UX/UI Design Bootcamp at Ironhack</a>, my first assignment is to take visual notes while watching a TED Talk: “ How Giant Website Design For You ” by Margaret Gould Stewart (Facebook’s director of product design).
<iframe src="https://cdn.embedly.com/widgets/media.html?src=https%3A%2F%2Fwww.youtube.com%2Fembed%2FPv99Lu9Jzzs%3Ffeature%3Doembed&amp;url=http%3A%2F%2Fwww.youtube.com%2Fwatch%3Fv%3DPv99Lu9Jzzs&#038;image=https%3A%2F%2Fi.ytimg.com%2Fvi%2FPv99Lu9Jzzs%2Fhqdefault.jpg&amp;key=a19fcc184b9711e1b4764040d3dc5c07&amp;type=text%2Fhtml&amp;schema=youtube" width="854" height="480" frameborder="0"><a href="https://medium.com/media/21a8681b2a8ad0999c3678aa9e801268/href">https://medium.com/media/21a8681b2a8ad0999c3678aa9e801268/href</a></iframe>
I call this exercise “My first conscious sketchnote” because it’s the first time I ever “force” myself to take notes without relying on words, but on images.
<h4>Take 1: Sketching in real time</h4>
I decided to throw myself into the task and just sketch as I was watching the video for the first time. I did not pause the video, I did not think too much of the way I organised the information, I just drew. Here’s what I got:
<img alt="" src="https://cdn-images-1.medium.com/max/1024/1*x_nca-TvCmx10MF9BfGWRA.jpeg">
A bit messy, right?
<h4>Take 2: The Cleanup</h4>
I watched the video again, this time I paused it several times and took a bit more time to draw things in a more legible manner. I also focused on organising the information for a better understanding of the discourse flow.
<img alt="" src="https://cdn-images-1.medium.com/max/1024/1*YFvG3Eqi-PoQ9JrWtMVvmA.jpeg">
But still, I wasn’t satisfied with the outcome. Something was still missing: a structure.
<h4>Take 3: Indexing Ideas</h4>
This time I watched the video without taking any notes, as I wanted to grasp the main points she was trying to make in her presentation. I asked myself: what are the main findings / takeaways of the talk? In an attempt to avoid the messiness of my sketch, I changed the orientation of the paper from landscape to portrait.
<img alt="" src="https://cdn-images-1.medium.com/max/1024/1*fu0RsbCtSjlcVJ_ajatQIA.jpeg"><img alt="" src="https://cdn-images-1.medium.com/max/1024/1*9k6Z6SjR_zFGUC1p-lbrBw.jpeg">
Unfortunately, I wasn’t able to fit everything on the same page. Still, I managed to better organise the information and made it easier to understand for an outside reader.
What do you think? Which sketch conveys the message best?
<img src="https://medium.com/_/stat?event=post.clientViewed&amp;referrerSource=full_rss&amp;postId=172b4e2c1f0" width="1" height="1" alt="stat?event=post.clientViewed&amp;referrerSou">
<hr>
<a href="https://blog.prototypr.io/my-first-conscious-sketchnote-172b4e2c1f0">My first “conscious” sketchnote</a> was originally published in <a href="https://blog.prototypr.io">prototypr</a> on Medium, where people are continuing the conversation by highlighting and responding to this story.

My first “conscious” sketchnote

My first “conscious” sketchnote

Top Stories