Why 5 Million People Are OBSESSED With Excalidraw

Why 5 Million People Are OBSESSED With Excalidraw ![rw-book-cover](https://i.ytimg.com/vi/CkoGWHyLTsk/sddefault.jpg) 🔗 **Source:** [Why 5 Million People Are OBSESSED With Excalidraw](https://www.youtube.com/watch?v=CkoGWHyLTsk) > [!note]+ Document Notes > tags: #visual-thinking #obsidian #note-taking #creativity #productivity > author: Carlos - Obsidian Tutorials > source: YouTube > reference: https://www.youtube.com/watch?v=CkoGWHyLTsk > date created: 2024-12-19 12:30 > > # 🏷️ Title: Why 5 Million People Are OBSESSED With Excalidraw >  ## 🧰 Action Inbox - [H1] Install Excalidraw plugin in Obsidian — most popular plugin with 5M users #obsidian - [H2] Learn keyboard shortcuts instead of clicking icons — saves hours over time #productivity - [H3] Set up visual thinking workflow with embedded drawings — connects sketches to notes #visual-thinking ## 🧭 Table of Contents - [[#📝 Summary]] - [[#📖 Main Content]] - [[#🗒️ Notes]] - [[#📚 References]] - [[#🗣️ Paraphrase]] - [[#📰 Newsletter]] - [[#✅ Action Items]] - [[#🧪 Hypotheses]] - [[#📊 Methodology]] - [[#❓ Questions]] - [[#🔮 Future Research]] - [[#💡 Implications]] - [[#🧠 Learning Styles Assessment]] - [[#📊 Accessibility Assessment]] - [[#🌍 DEIB Assessment]] - [[#✅ Logical Validity]] - [[#🛡️ DARVO Analysis]] - [[#🎯 Conclusion]] ### 🔗 References - [Obsidian Official Site](https://obsidian.md) - [Excalidraw Plugin](https://github.com/zsviczian/obsidian-excalidraw-plugin) - [Brilliant Digital Circuits Course](https://brilliant.org/carlosobsidian-tutorials) ## 📝 Summary - Excalidraw is the most downloaded Obsidian plugin with 5 million users, enabling visual thinking within note-taking - Unlike isolated sketching tools, Excalidraw connects drawings directly to your knowledge vault through linking and embedding - The plugin transforms static note-taking into dynamic visual brainstorming with infinite canvas capabilities - Key features include shape tools, linking between drawings and notes, embedding capabilities, and extensibility through scripts - Proper setup requires understanding Obsidian basics (linking, embedding) before diving into visual features ## 📖 Main Content Excalidraw represents a paradigm shift from traditional isolated sketching tools to integrated visual thinking. The plugin's popularity stems from solving a core problem: creative sketches typically remain disconnected from written knowledge, creating information silos. The tool provides an infinite canvas with vector-based drawing capabilities, supporting shapes, arrows, text, and freehand drawing. More importantly, it integrates seamlessly with Obsidian's linking system, allowing drawings to reference notes and vice versa. Visual thinking capabilities extend beyond basic drawing through features like grouping elements into reusable libraries, importing external resources (PDFs, web pages, images), and creating presentation modes. The "back of note card" feature enables taking traditional notes within drawing contexts. Advanced functionality includes script extensions for specialized workflows, dark mode optimization, and export capabilities for sharing visual thinking outputs. The plugin maintains Obsidian's core philosophy of owning your data while adding powerful visual dimensions. ## 🗒️ Notes #### ⏱️ [00:00](https://youtu.be/CkoGWHyLTsk?t=0) — [H1] Visual thinking revolution with 5M users - Key idea: Excalidraw is the most popular Obsidian plugin enabling visual thinking - Evidence: "5 million users added Excalidraw to their Obsidian vault. It's by far the most downloaded plug-in of all time" #### ⏱️ [01:15](https://youtu.be/CkoGWHyLTsk?t=75) — [H2] Installation and setup process - Key idea: Installing Obsidian and Excalidraw requires specific steps for optimal workflow - Evidence: "You click on the gear icon on the bottom left and then on the left menu go to community plugins" #### ⏱️ [04:30](https://youtu.be/CkoGWHyLTsk?t=270) — [H1] Obsidian fundamentals before Excalidraw - Key idea: Understanding Obsidian's linking and embedding is crucial for Excalidraw success - Evidence: "A giant trap a lot of users walk into is to just skip the basics of obsidian itself" #### ⏱️ [06:45](https://youtu.be/CkoGWHyLTsk?t=405) — [H2] Linking and embedding mechanics - Key idea: Square brackets create links, exclamation marks create embeds - Evidence: "We can use two opening square brackets and two closing square brackets... put an exclamation mark in front" #### ⏱️ [09:20](https://youtu.be/CkoGWHyLTsk?t=560) — [H1] Canvas basics and navigation - Key idea: Infinite canvas with multiple tools requires keyboard shortcuts for efficiency - Evidence: "Do not click any of these icons by hand. I beg you... they will cost you hours down the line" #### ⏱️ [11:30](https://youtu.be/CkoGWHyLTsk?t=690) — [H2] Essential drawing tools and shortcuts - Key idea: Master keyboard shortcuts for selection (V), rectangle (R), circle (O), arrow (A), text (T) - Evidence: "Rectangle can also be R... Ellipse tool uses O because O apparently looks like a circle" #### ⏱️ [14:45](https://youtu.be/CkoGWHyLTsk?t=885) — [H2] Styling and customization options - Key idea: Styling palette enables color, fill, stroke, and sloppiness adjustments - Evidence: "You can change the sloppiness... high sloppiness level makes it even messier" #### ⏱️ [17:30](https://youtu.be/CkoGWHyLTsk?t=1050) — [H3] Library system for reusable elements - Key idea: Group elements and save to library for reuse across drawings - Evidence: "Right clicking them and then clicking on group selection... add to library" #### ⏱️ [20:15](https://youtu.be/CkoGWHyLTsk?t=1215) — [H1] Embedding drawings in notes - Key idea: Drawings can be embedded in notes, connecting visual and textual thinking - Evidence: "Our drawing is inside of our note... this connects what we draw to what we write" #### ⏱️ [23:00](https://youtu.be/CkoGWHyLTsk?t=1380) — [H1] Linking system within drawings - Key idea: Notes can be dragged into drawings and elements can link to specific notes - Evidence: "Dragging my note about the internet in here on the canvas... we have our link as a visual element" #### ⏱️ [26:30](https://youtu.be/CkoGWHyLTsk?t=1590) — [H2] Advanced linking to drawing sections - Key idea: Copy links to specific elements for precise navigation in large drawings - Evidence: "Copy link for the selected elements... this link will immediately let me jump to our giraffe element" #### ⏱️ [29:45](https://youtu.be/CkoGWHyLTsk?t=1785) — [H2] Adding images, PDFs, and web content - Key idea: Insert external files as images or embeddable interactive content - Evidence: "Insert any file... choose duck.jpeg... we actually get the option as image" #### ⏱️ [35:20](https://youtu.be/CkoGWHyLTsk?t=2120) — [H2] Back of note cards feature - Key idea: Add traditional notes to the back of visual drawings - Evidence: "Add back of note card... this is a note that I took on nature and giraffes in this drawing" #### ⏱️ [38:45](https://youtu.be/CkoGWHyLTsk?t=2325) — [H1] Drawings as nested compositions - Key idea: Drawings can be embedded within other drawings for complex visual thinking - Evidence: "Import it as an image... you can break down big ideas into smaller components" #### ⏱️ [42:30](https://youtu.be/CkoGWHyLTsk?t=2550) — [H3] Excalidraw scripts for extensions - Key idea: Install additional scripts for slideshow, dark mode, and specialized features - Evidence: "Excalidraw itself also has extensions... slideshow... invert colors" ## 📚 References - [Obsidian Community Plugins](https://obsidian.md/plugins) - [Excalidraw GitHub Repository](https://github.com/excalidraw/excalidraw) - [Zolt's Excalidraw Tutorials](https://www.youtube.com/results?search_query=zolt+excalidraw) ## 🗣️ Paraphrase - Excalidraw transforms isolated sketching into connected visual thinking by integrating drawings with Obsidian's knowledge management system - The tool requires mastering keyboard shortcuts and Obsidian fundamentals before diving into advanced visual features - Advanced capabilities include embedding external content, linking between visual and textual elements, and extending functionality through scripts ## 📰 Newsletter Visual thinking just got a major upgrade! Excalidraw, the most popular Obsidian plugin with 5 million users, transforms your notes from static text into dynamic visual canvases. Unlike standalone drawing tools, Excalidraw connects your sketches directly to your knowledge vault. Key benefits include infinite canvas brainstorming, seamless linking between drawings and notes, and the ability to embed external content like PDFs and web pages. The "back of note card" feature lets you take traditional notes within visual contexts, creating truly integrated thinking workflows. Getting started requires mastering Obsidian's linking system first, then learning essential keyboard shortcuts to avoid productivity traps. Advanced users can extend functionality with scripts for presentations and specialized workflows. Resources: [Download Obsidian](https://obsidian.md), [Excalidraw Plugin](https://github.com/zsviczian/obsidian-excalidraw-plugin), [Visual Thinking Techniques](https://en.wikipedia.org/wiki/Visual_thinking) ## ✅ Action Items #### DevRel - Developer advocacy: Create visual architecture demos using Excalidraw for technical presentations - Education: Develop visual learning paths combining diagrams with documentation - Developer experience: Design flowchart templates for common development workflows - Developer marketing: Use visual storytelling for feature announcements and tutorials - Community management: Create visual guidelines and templates for community contributions #### OSPO - Policy & Governance: Visualize contribution workflows and decision-making processes - License Compliance: Create visual compliance checklists and dependency trees - Security Management: Design visual threat models and vulnerability response flows - Software Inventory: Map component relationships and ownership structures visually - Developer Support: Develop visual troubleshooting guides and best practice diagrams - Community Engagement: Create visual project roadmaps and collaboration frameworks - Strategic Alignment: Design visual dashboards for KPI tracking and OKR planning #### Community - Maintainers: Provide visual project roadmap templates and governance diagrams - Contributors: Create visual onboarding flows and contribution pathway maps - Sponsors: Design transparent visual budget reports and impact illustrations - Ecosystem: Map cross-project dependencies and collaboration opportunities visually #### WordPress - Core: Visualize feature development workflows and architecture decisions - Core Performance: Create performance budget diagrams and optimization flowcharts - Core AI: Design visual guardrails and evaluation frameworks - Documentation: Enhance DevHub/HelpHub with visual learning elements - Training: Develop visual lesson plans combining diagrams with hands-on practice - Design: Create visual style guides and component relationship diagrams - Community: Design visual templates for meetup presentations and WordCamp talks ## 🧪 Hypotheses - Visual note-taking increases idea generation and concept retention compared to text-only approaches - Integrated drawing tools reduce context switching overhead in knowledge work - Linking visual and textual elements creates stronger memory associations than isolated formats - Collaborative visual thinking tools improve remote team communication and alignment ### 📊 Methodology - A/B testing comparing visual vs text-only brainstorming sessions for idea quantity and quality - Time-tracking studies measuring context switching costs between separate drawing and note-taking tools - Memory retention tests comparing linked visual-textual content vs separate formats ### ❓ Questions - How does visual thinking capability correlate with creative problem-solving performance? - What visual elements most effectively enhance learning retention in technical documentation? - How can visual thinking tools be optimized for accessibility across different cognitive styles? ### 🔮 Future Research - Integration patterns between visual thinking tools and other knowledge management systems - Collaborative real-time visual thinking workflows for distributed teams - AI-assisted visual thinking and automated diagram generation from textual content ### 💡 Implications - Practice: Visual thinking tools become essential for knowledge workers requiring creative problem-solving - Policy: Organizations should provide visual thinking training alongside traditional documentation skills - Security: Visual knowledge representations may expose sensitive information through unintended pattern recognition - Education: Curriculum design should integrate visual and textual learning modalities systematically - Funding: Investment in visual thinking infrastructure supports innovation and creative collaboration ### 🧠 Learning Styles Assessment Reading level estimate: 8th Grade (accessible technical content with clear explanations) #### 👀 Visual learners - Present: Extensive demonstration of drawing tools, interface elements, and workflow examples - Improve: Add architectural diagrams showing Obsidian-Excalidraw integration patterns #### 🔊 Aural learners - Present: Comprehensive video tutorial with narrated explanations - Improve: Provide downloadable audio summary with key shortcuts and concepts #### 🗣️ Verbal learners - Present: Clear definitions of technical terms and analogies (infinite canvas, back of note card) - Improve: Add glossary of Obsidian and Excalidraw terminology with examples #### 🧩 Kinesthetic learners - Present: Step-by-step installation guide and hands-on exercises - Improve: Provide downloadable practice vault with guided exercises #### 🧠 Logical learners - Present: Sequential workflow progression from basics to advanced features - Improve: Add decision tree for choosing between different drawing and embedding options #### 🧑‍🤝‍🧑 Social learners - Present: Community plugin ecosystem and collaboration features - Improve: Create community challenges and shared visual thinking projects #### 🧘‍♀️ Solitary learners - Present: Individual practice exercises and self-paced learning structure - Improve: Add reflection prompts for personal visual thinking development #### 🌿 Naturalistic learners - Present: Nature-themed examples (giraffes, ducks, forest) throughout tutorial - Improve: Connect visual thinking to natural pattern recognition and organic thought processes ### 📊 Accessibility Assessment #### Screen reader semantics - Present: Video content with spoken narration describing visual elements - Improve: Provide detailed alt text for interface screenshots and descriptive transcripts #### Keyboard navigation - Present: Emphasis on keyboard shortcuts over mouse clicking - Improve: Document complete keyboard navigation paths for all Excalidraw features #### Contrast and readability - Present: Demonstrates both light and dark mode options - Improve: Test contrast ratios for all interface elements and drawing styles #### Text resizing and reflow - Present: Vector-based graphics maintain quality at all zoom levels - Improve: Ensure UI elements remain accessible when drawings are scaled #### Media and captions - Present: Video tutorial with clear narration - Improve: Add comprehensive closed captions and downloadable transcript #### Forms and interactions - Present: Clear labeling of tools and interface elements - Improve: Ensure all interactive elements have accessible names and roles #### Standards reference - Map interface elements to WCAG 2.2 AA requirements for interactive content ### 🌍 DEIB Assessment #### Cultural breadth - Present: Universal visual thinking concepts applicable across cultures - Improve: Include examples from different cultural visual communication traditions #### Inclusive language - Present: Gender-neutral terms and clear technical vocabulary - Improve: Avoid cultural idioms and provide plain-language alternatives for jargon #### Neurodiversity support - Present: Multiple learning modalities and self-paced progression - Improve: Provide content organization options and cognitive load management techniques #### Representation - Present: Focus on capabilities rather than specific user types - Improve: Include examples from diverse professional contexts and use cases #### Psychological safety - Present: Encouraging tone emphasizing creativity over perfection - Improve: Address potential intimidation factors for non-visual learners ### ✅ --- ## Full Transcript [00:00] 5 million users added Excaliraw to their [00:03] Obsidian vault. It's by far the most [00:05] downloaded plug-in of all time, and it [00:08] makes total sense. Da Vinci's notebooks [00:10] weren't essays, they were diagrams. [00:12] Einstein sketched his theories. Visual [00:15] thinking is the key to your best ideas. [00:18] I wanted this for my notes, too. Years [00:20] of paying for Notability or One Note [00:22] were a waste. You see, each sketch was [00:25] isolated. I couldn't draw connections [00:27] and they were all separate from my [00:29] obsidian vault, my second brain. So when [00:32] I discovered Xcolyraw, it felt illegal. [00:34] I could visualize literally anything. I [00:37] [music] could add those sketches to my [00:38] notes and everything connects. It's all [00:40] free and I own it forever. But I had one [00:44] giant problem. The first time I used [00:46] Excaliraw, I felt totally overwhelmed. [00:48] Too many tools and too many settings. [00:51] Thousands of original ideas I could have [00:53] had lost just like that. But after [00:56] giving it a second shot, I finally got [00:58] it. My brainstorming went from staring [01:00] at a [music] blank page to sketching [01:02] ideas that build on each other. [01:04] Confusing concepts finally made sense [01:06] once I put them on the [music] canvas. [01:08] This video will take you from someone [01:09] who drastically underestimates their [01:11] creativity to that one seen in Iron [01:14] [music] Man kind of thinking. It won't [01:15] matter if you're a beginner or expert. [01:18] We will upgrade your thinking. [01:23] So, here's the Excaliraw canvas. [01:25] Infinite space. [01:28] You will love this view, this freedom [01:30] very [music] soon. But hold up. How did [01:33] we even get here? You're probably [01:34] missing the Excalor [music] plugin. [01:36] Maybe you don't even have Obsidian [01:38] installed. So, let's actually do that [01:39] first. But no, you can skip the steps [01:41] that you have already done. Just use the [01:43] video chapters. So, first you're going [01:45] to install Obsidian on the official [01:47] Obsidian homepage, typing obsidian.md [01:50] and clicking on getting Obsidian for [01:52] your OS and opening the file that you've [01:54] downloaded. [music] Then upon first [01:56] opening Obsidian, you will get this view [01:58] and you will just like click create [02:00] under create new vault and give it a [02:02] name. For example, Xcaliraw demo and [02:05] then pick a location. I'm just going to [02:07] make a new folder for it. Xcaliraw vault [02:10] demo and I'm going to choose it because [02:12] an Obsidian vault is literally just a [02:14] folder of text files. So click create. [02:17] So now within a blank Obsidian vault, [02:19] but also in any vault that you have, you [02:21] click on the gear icon on the bottom [02:23] left and then on the left menu go to [02:26] community plugins. And here, if you [02:28] never installed community plugins [02:29] before, you have to click turn on [02:31] community plugins so that you can browse [02:33] the kind of plugins that the community [02:35] of Obsidian has built to extend [music] [02:38] the capability of the software. And you [02:40] don't even have to search long to find [02:42] Excaliraw, the most popular plug-in of [02:44] all time. Then click on install and [02:47] enable. And we get a nice welcome [02:49] message that we can click away. But [02:51] already, shout out to Z for making such [02:53] an amazing plugin. Now you can close [02:55] this menu. And with the new button in [02:57] the ribbon menu, click on new drawing. [03:01] And bam, I'm going to close the graph [03:02] view here. And also I'm going to [03:04] collapse the sidebar. And here we have [03:07] our canvas. Okay. So the first Wait a [03:10] minute guys. A giant trap a lot of users [03:12] walk into is to just skip the basics of [03:14] obsidian itself. If we immediately dive [03:16] into Excaliraw, we risk missing 90% of [03:19] its potential. So what I'm going to [03:20] recap now is crucial so that XC draw is [03:24] not just another drawing [music] tool [03:25] but a visual extension of your mind. So [03:27] let's close our drawing like a browser [03:30] window first [music] and get our sidebar [03:32] back because this is Obsidian. And here [03:34] we have our file explorer where we can [03:36] create new notes by clicking this [03:38] button. We can give them a title and in [03:41] it [music] we write text specifically [03:43] markdown. So markdown can be formatted [03:47] in specific ways. We can make text bold. [03:49] We can make bullet lists. But that's not [03:51] the important part. I'm going to rename [03:53] my welcome note to [music] [03:55] giraffe. And I'm going to name my just [03:58] newly created note awesome adventure. [04:00] And now when I write on my awesome [04:02] adventure, I've seen a. And now we can [04:06] just write giraffe. But also we can use [04:09] two opening square brackets and two [04:12] closing square brackets. Obsidian [04:14] immediately autocomp completes this for [04:15] us. And now we can create a link. So [04:17] here [music] I can type in giraffe it [04:19] has autocomplete and now we have a link [04:23] between our notes because when I [04:25] controllclick on giraffe we're actually [04:27] going to open giraffe and also if like [04:29] in my left ribbon menu I go into graph [04:31] view we can see that we have connected [04:34] awesome adventure with giraffe now let [04:36] me actually add a note on giraffes I've [04:38] added two lines here and now going back [04:40] to our awesome adventure [music] we [04:42] can't just link to giraffe we can also [04:45] embed giraffe [04:47] What does that mean? So again, we create [04:49] a link with two opening square brackets [04:51] and link to giraffe. But now I put an [04:54] exclamation mark in front of giraffe. [04:57] And now we have the content from giraffe [05:00] within our other note. So we can link to [05:03] another note and we can display its [05:05] content from this link. And I mean [05:07] obviously if I go into giraffe now and [05:10] put awesome adventure to the side and [05:12] now I add something else to giraffes. [05:15] I've seen two [music] to browse so far. [05:18] Like if we add something, it will [05:19] immediately update in our embedded link. [05:22] So yeah, that was the essential thing I [05:24] wanted you to remember. Having [05:25] remembered links and embedding, let's [05:27] start using Xcolor Draw. We will go over [05:29] the basics in a perfect non-overwhelming [05:31] order. And also I will warn you about [05:33] something that will cost you hours down [05:35] the line and how to fix it of course. So [05:37] recap, we created our first drawing by [05:40] clicking the new drawing button on the [05:41] left, which also like this drawing. [05:44] Okay, now we have two because we already [05:45] made one. I'm going to delete the older [05:47] drawing. But, you know, for creating a [05:49] drawing, there's actually a much faster [05:50] way. You can open the so-called command [05:53] pallet by clicking here on the ribbon [05:55] menu. But, if you're even cooler, you're [05:57] going to use control P on Windows or [06:00] command P on Mac. And this immediately [06:03] opens the command pallet. [music] And [06:05] now, if I type in Xcaliraw, and as you [06:07] can see, we have a lot of things at our [06:09] disposal. But what we care about right [06:11] now is theoretically if we also type in [06:14] create we could also create a new [06:16] drawing also for example in an adjacent [06:18] window. But let's close one for now and [06:21] delete one again. You know that will [06:23] save us some time down the line but [06:24] that's not even the thing I wanted to [06:25] point out. Note how creating this [06:27] drawing creates a new drawing like in [06:29] the Xcaliraw folder and I will show you [06:32] how to change that later. Okay guys, now [06:34] it's time to learn visual thinking. I [06:36] first have like close the side pane and [06:38] we're looking at our drawing. and [06:40] welcome to your infinite canvas. The [06:42] first thing I want you to learn is how [06:43] to sketch something [music] simple and [06:44] move around freely. Most elements here [06:47] are pretty obvious to use. And by the [06:49] way, don't worry about this view. It [06:51] will literally disappear if you just [06:52] intend to draw something. Okay, so let's [06:54] create a rectangle. So for that, I have [06:56] create like selected the rectangle tool. [06:59] And now here we go. We have our [07:00] rectangle. We can just drag them and [07:03] like select between them. We can also [07:05] scale them with each corner like [07:06] individually or rotate them by using [07:08] this extra handle. Now, if we click [07:11] outside of it, we can't really move [07:12] around. That is because we can use the [07:14] hand tool on the right to move around. [07:16] So, here we can like, you know, move or [07:19] you can scroll up and down with the [07:20] scroll wheel and you can hold either [07:22] control or command to either scroll [07:24] inward where your cursor is pointing or [07:26] to scroll away. Okay, now let's use the [07:29] diamond tool. Okay, wait guys, you see [07:31] what I did there? This is a huge [07:33] mistake, guys. Do not click any of these [07:36] icons by hand. I beg you. And as Cali [07:39] draw, your cursor is your pencil. The [07:41] pencil to draw your mind. Like if you [07:44] constantly hop over to the icons, they [07:47] will cost you hours down the line. So [07:49] immediately start learning shortcuts. [07:51] And I mean, you can immediately see them [07:53] here. So you have one for the selection [07:55] tool that we already sort of looked at [07:56] or two for the rectangle tool. Or you [07:59] can also click certain letters that make [08:01] sense. For example, for the hand, you [08:03] can click H for hand and immediately [08:05] move around. And also, if you hover over [08:07] any icon, [music] it reveals a secondary [08:10] and again like intuitive letter for each [08:13] of these tools. So, rectangle [music] [08:14] can also be R, which I can use. And [08:17] also, by the way, to also use the hand, [08:19] you can click on your scroll wheel if [08:21] your mouse supports that. Then there's [08:23] the diamond tool. You know the drill. [08:25] Also, I'm not using my mouse. I'm [08:27] clicking three or D for diamond. [music] [08:30] And with this, I can drag diamonds into [08:32] my canvas. Circle tool. Uh, sorry guys. [08:35] [music] Ellipse tool, of course. And no, [08:37] it doesn't use E. It uses O because O [08:40] apparently looks like a circle. I mean, [08:41] I I get it. Of course, you can also [08:43] scale everything again. And like, of [08:45] course, you can rotate a circle, but why [08:47] would you rotate a circle? Never mind. [08:49] Also on like Windows you can control on [08:51] uh Mac command plus Z your actions [08:55] actually to like reverse things or like [08:58] combined with shift you can go forward [09:01] in time again. Also with your selection [09:03] tool that by the way also uses the [09:04] letter V to be selected. You [music] can [09:07] select multiple elements at the same [09:09] time and transform them at the same [09:11] time. You [music] can also command C [09:14] commandV any objects to duplicate them. [09:18] I'm going to delete [music] them with [09:19] the backspace key. And the more superior [09:21] way to copy is to on Windows hold alt [09:24] and on Mac hold option and then drag [09:27] your element and bam, you have [music] [09:30] copies of it if you just hold Yeah. [09:32] Okay. Control Z. Control Z. Uh command Z [09:34] I meant. Okay. Yeah, we can create [09:36] arrows by hitting five or A. And now if [09:39] you click anywhere, you create an [09:41] anchoring point for the path of the [09:43] arrow. So if I click again, we actually [09:46] make another point. This arrow should go [09:48] through and like a few more points. [09:50] Click. Click. And if we want the arrow [09:52] to stop, [music] we need to click again [09:54] on our last point that anchors it. So, [09:56] I'm going to go back to my last point. [09:58] And we see that it sort of, you know, [10:00] snaps back to it. And if I click again, [10:02] this finalizes our arrow. And now, you [10:05] can't just adjust and transform it like [10:07] the other elements, but you can also [10:09] adjust the path that you made with it. [10:11] Now, all shapes that you've created so [10:14] far support that if you click them and [10:16] then doubleclick them that actually you [10:19] will add a sticky note. Sticky notes are [10:21] just text that stays inside the shape. [10:24] So, you see it's like inside my shape. [10:26] You can achieve the same thing by [10:28] selecting your shape and then hitting [10:30] enter. Beautiful. By the way, again, I [10:32] set every element that we covered so [10:33] far. So, also arrows. If I hit enter on [10:35] it, a relation. Bam. We have an arrow [10:38] with a relation. [music] Now by hitting [10:41] six or L, you can also select the line [10:44] tool which sort of behaves like the [10:47] arrow tool. And you can also end it by [10:50] clicking on your last point. But if you [10:52] hit enter here, you will actually enter [10:54] a mode where you can add more points to [10:57] the line. Oh damn, I just created a big [10:59] arrow. Now if you hit seven or P, you [11:01] will select the drawing tool which has a [11:05] bit of this like dynamic scaling of the [11:07] brush stroke. Each stroke that you make [11:09] is its own element that you can [11:12] transform individually. And of course, [11:14] this enables hand like handwriting, but [11:17] of course I find it pretty hard with my [11:20] like mouse. Like if you use obsidian and [11:22] then x color draw on your iPad for [11:24] example, this would work much smoother. [11:26] Now hitting 8 or T lets us select the [11:29] text tool which if we just click [11:31] anywhere on the canvas, we can write [11:33] some text. And the text also supports [11:35] all the operations that all the other [11:37] elements allow. And if we hit zero or E, [11:41] we can actually choose the eraser tool. [11:43] And that is just basically a touch of [11:46] death that just removes any objects that [11:49] we've made. And like it only removes [11:51] entire objects. Lastly, a little pro [11:53] tip. [music] When you create arrows, [11:55] they will actually sort of stick to [11:57] elements as you can see here with this [11:59] circle. And you know you can do it from [12:01] nothing or also like connect one element [12:04] with another element and you know then [12:07] the arrow will actually stick to these [12:09] elements. Very handy for mind maps. [12:11] Yeah. And I want you to know that all of [12:12] these things are vector graphics if that [12:14] wasn't obvious. So that means no matter [12:16] how far you zoom in, they won't really [12:18] be pixelated. Always sharp, always [12:21] amazing. Now that is only the shaping [12:23] and transforming part of Excali raw. To [12:25] really align your visual thinking with [12:27] your actual thinking, you have to learn [12:30] about styling. By the way, if this has [12:32] been hard on your eyes so far, you can [12:34] hit shift alt D or shift option D and [12:38] then you will switch to dark [music] [12:40] mode. It will run into issues with [12:41] certain elements. So, I will show you a [12:43] better way later. But for now, you can [12:46] switch if you want to. I'm going to [12:47] switch back though. Okay. As you can [12:49] see, I have prepared a new scene. And [12:51] the cool thing is you already know how [12:52] to make this. But now, let's make it [12:54] even better. If I select my giraffe [12:56] element, you actually see this painting [12:59] palette icon on the bottom left. And if [13:02] I hover over it, it says edit. So, if I [13:04] click on it. Ooh, interesting. So, here [13:07] we can actually adjust lots of different [13:09] things. For example, the color of our [13:11] stroke, if the background should be [13:13] filled. For example, here yellow might [13:15] fit. You can also change the filling [13:18] style to sort of fit this scribbly [13:20] sketching aesthetic. You can also change [13:22] the stroke style and you can also adjust [13:24] the sloppiness. So for example, okay, [13:27] maybe this for the giraffe would be [13:29] would be the best. But for example, [13:31] sloppiness might make sense for an [13:33] arrow. So if I click on the arrow, we [13:35] can change the sloppiness. And as you [13:37] can see, the high sloppiness level makes [13:40] it even messier. Or, you know, it can be [13:42] really, really clean. You can also [13:44] adjust the font and also make the edges [13:47] more edgy. And you can also let's go to [13:49] nature actually make the background [13:51] green. And I want the font to be bigger. [13:54] And now we can actually align the text [13:55] on the left or on the right and on the [13:58] bottom or at the top. [music] Let's [13:59] center it again. And also adjust the [14:02] opacity. So the visibility of the [14:04] object. I'm also going to make the [14:06] giraffe font bigger. [clears throat] [14:07] Also something for arrows I forgotten is [14:09] that you can also adjust the different [14:10] arrow heads. For example, we can just [14:12] remove it. And in the same way adjust [14:14] the arrow tail. So with this we could [14:16] also flip an arrow. Now, another pro [14:18] tip. If you rightclick the canvas, you [14:21] can also click on toggle grid, which as [14:24] you can see gives you a grid to orient [14:27] your elements in to make sure everything [14:30] is a bit more aligned. or you right [14:32] click on the canvas again and instead [14:34] choose snap to objects. Which means that [14:38] if I create a new object, you can see on [14:40] my cursor there are these reference [14:41] lines because snap to objects lets you [14:44] create objects in relation to other [14:47] objects which can also result in more [14:50] symmetrical sketches. And again these [14:51] are modes you activate or deactivate. So [14:53] I'm going to deactivate snap to objects. [14:55] Now, also a general tip that like even [14:58] before you create images, you can [15:00] predefine their styling. For example, if [15:03] you only want to create super super [15:05] sloppy drawn elements, you just choose [15:07] the like strongest sloppiness. And maybe [15:10] also you want all of them to be red and [15:13] then all the elements you create sort of [15:15] have this specific style. There will be [15:19] some elements that we want to reuse [15:22] across our thinking sometimes [music] or [15:23] in general. Wouldn't it be nice to have [15:26] some sort of like icons that we can [15:28] always use? Of course, there is a way. [15:30] So, I've actually created this leaf [15:32] object out of multiple elements. So, you [15:35] can group multiple elements by sort of, [15:37] you know, making anything and then [15:39] selecting all of them and then right [15:42] clicking them and then clicking on group [15:44] selection. And you know, that's how I [15:45] created this leaf. And now, if I want to [15:47] use this leaf in other drawings, I can [15:49] just rightclick it again and click on [15:51] add to library. So, where did our leaf [15:53] actually go to? If we go to the side [15:56] pane, we can actually see this icon [15:58] right here, which stands for library. [16:00] So, let's extend this. And oh, there it [16:04] is in our personal library. And we can [16:06] literally just drag it into our drawing, [16:09] out of this library, and use it as much [16:10] as we want also in other drawings. But [16:12] what I also want to direct your [16:14] attention to is the browse libraries [16:16] button. So, if we click on there, you [16:18] actually see numerous Excalibraw [16:20] libraries. for example, software [16:22] architecture. But the add to Excaliraw [16:25] button will not work. You have to click [16:27] on download. [music] Then you will get [16:29] this file and then you go back to [16:31] Excaliraw. Click on the three dots and [16:34] then [music] click on open. And here [16:36] downloads you will find this library. [16:39] You will open it and oh now I got these [16:41] cool server architecture icons that I [16:44] could theoretically use. So let's [16:46] actually drag this in here. Now I make [16:48] this. I'm going to group it with command [16:49] or controlG. [music] Now, all of what we [16:52] just learned still wasn't revolutionary [16:54] because all this drawing has still just [16:57] been drawing. Well, what I'm going to [16:59] show you now is one of the main reasons [17:01] why Scaly Draw is loved by millions [17:04] because you can actually embed your [17:06] drawings. So, let's actually get our [17:08] sidebar back. And now, let's go back to [17:11] our giraffe note. Now, if we create a [17:13] new link here with two opening square [17:15] brackets, we actually see our drawing as [17:18] one of the options. So I'm going to [17:20] choose it. And now I'm going to put an [17:23] exclamation mark in front of it. And [17:25] there we go. Our drawing is inside of [17:28] our note. So again, why is this useful? [17:31] Okay, first I want to I want you to know [17:32] that you can also skip this [music] by [17:35] just using the command palette. So [17:36] command P and then here if you search [17:38] for embed and then you will see [17:40] Excaliraw embed the most recently edited [17:42] drawing. I'm [music] going to click that [17:45] and bam. That also immediately puts it [17:47] in our note. doing that what we just did [17:49] by hand for us. [music] And yeah, this [17:51] is immensely useful because it connects [17:53] what we draw like what we sketch to what [17:56] we write. And also any links to this [17:59] note that has this drawing in it will [18:02] also if we embed them include this [18:05] visual information. And like another [18:08] example, let's say we're collecting [18:11] ideas, ideas for a new zoo. [music] And [18:14] now we can use the command pallet and [18:16] type in create embed. So we will [18:18] actually create a new drawing let's say [18:21] in an adjacent window. So in a second [18:24] window and embed it into the active [18:26] document. So I'm going to click this. [18:28] [music] So this one creates a drawing [18:31] and two puts it in our note. And now I [18:34] have my visual drawing here. And now [18:36] I've done something visual. Did some [18:38] visual brainstorming. And I come back to [18:40] my note and you see it's immediately in [18:43] there. [music] And like you can do a [18:44] word cloud, you can also just do like a [18:46] flowchart software architecture if [18:48] you're a programmer. I mean the [18:50] possibilities are endless. And you know [18:51] if you want to share this with a client [18:53] or just make it like look more [18:55] professional, you can always multi [18:57] select all the elements. Let me actually [18:59] do this like make this bigger. And then [19:01] here you can make the arrows like more [19:03] uh blocky and uh decrease the [19:05] sloppiness. And now I have this like [19:07] really fancy diagram in such a short [19:10] time. [music] And like again if I go [19:11] back to my note notice how it's [19:12] immediately updated like this is [19:14] directly linked. This is this is [19:16] connected. Like also if I make a new [19:18] element somewhere very far away and go [19:20] back to my note. You see the framing is [19:23] dynamic. [music] So again this is 100 [19:25] times better than just a screenshot from [19:28] like another software that we like put [19:31] in our notes. Also a little pro tip. So [19:33] again, because we embedded this in here, [19:34] this is an exclamation mark and a link. [19:37] But also, if we go inside of the link, [19:39] we can add a pipe character and then for [19:42] example at [music] 800. And this will [19:44] adjust the sizing of our embed. So this [19:47] actually makes it bigger. But you know [19:49] guys, embedding is not the only magical [19:51] feature interconnecting your drawings [19:53] and your vault because links within our [19:56] drawing take this to a whole new level. [19:59] So what do I mean exactly? Let's say we [20:02] have a plain text node. Okay. So now [20:04] here I took some notes as like a bullet [20:06] point list. And now if I go back to my [20:08] old drawing and I actually want our like [20:11] visual thing here to also sort of be a [20:14] map toward our knowledge that is [20:16] related. I can just drag my note about [20:19] the internet [music] in here on the [20:22] canvas. And now with the selection tool [20:24] I can like drag it around. And well, we [20:26] have our link as a visual element. You [20:30] can also notice this like prefix, just [20:32] like a little pin. And it maybe has some [20:35] square brackets for you like a normal [20:37] link in Obsidian. If you want to change [20:39] that, I will also show you how to do [20:40] that later. But this is a link if we [20:42] just regular click it, but holding [20:45] [music] like command on Mac or control [20:48] on Windows and we will actually go [20:50] inside of it. or just hovering over it [20:52] and holding command or control will [20:54] actually expose its content. But now I'm [20:57] going to share a pro tip because you [20:58] don't even need to drag something into [21:01] the canvas to create a link. You can [21:03] just add a link to an element that you [21:05] already have on your canvas. So if I [21:07] select giraffe and then rightclick it [21:09] and then at the bottom click add link, I [21:13] can then [music] type in two opening [21:14] square brackets to then search for [21:16] giraffe. And there it is. So I'm going [21:18] to click enter and the giraffe link is [21:20] added. [music] So now there's also this [21:23] tiny blue icon on the top right and I [21:25] can also hover and then hold control and [21:27] we get the content for giraffe and also [21:29] this is kind of inception because you [21:32] know uh but but never mind like this is [21:34] really cool but you know apart of adding [21:36] a link to an element there is an even [21:39] cooler way to add links which is to go [21:42] on our element [music] and then copy a [21:45] link to this element. So we can copy [21:48] here, copy link for the selected [21:49] elements and we can give it an alias but [21:51] we won't do that right now and click on [21:54] link [music] and now we have copied it [21:56] to our clipboard. So now I can go into [21:58] the giraffe node and I can then paste [22:00] this link and you know this link now if [22:02] I click on it will immediately let me [22:05] jump to our giraffe element. So if you [22:08] have like a giant drawing you can [22:10] immediately make links that send you to [22:12] a specific part of your visual thinking. [22:14] And also I've added something to this [22:16] other drawing. If we want to link to a [22:20] specific part of a drawing, so like [22:22] because if we now have, you know, [22:24] [music] embedded this drawing, we will [22:26] have all of it. But if for example, we [22:30] only want to actually embed the top [22:32] right. We go to our drawing, we select [22:35] all of our elements, we group all of [22:37] them, and then we copy a link for the [22:40] selected elements, but we choose the [22:42] group button. That is really important. [22:44] And now if we go back to our ideas for a [22:46] new zoo brainstorming, I've added this [22:49] header but also for theme parks. And [22:51] then I can actually paste this link and [22:55] it also has the embedding exclamation [22:57] mark in front of it. And bam, we have [22:59] the specific part. And also if we click [23:01] on it, we immediately jump in this part [23:04] of our drawing. Again, really useful if [23:06] your visual thinking gets very big and [23:08] you want to reference specific non-s [23:10] singular parts. I think you're starting [23:12] to see why Excaliraw linking with your [23:13] Obsidian vault is so incredibly [23:15] powerful. But we forgot about an [23:17] essential part of visual thinking so [23:19] far. How do we add images? So, the first [23:22] and most obvious way might be this image [23:24] icon on the top right. If we click it, [23:26] we can import from our system, which [23:28] means from our file explorer. I got it [23:31] in my downloads a picture of an [23:33] axelottle. And bam, we have our image, [23:36] which I can now drag around and add to [23:39] my axelottles. Or maybe you already have [23:42] the image in your vault. So here in the [23:44] sidebar, I already have duck because I [23:47] just dragged it into Obsidian. But [23:48] dragging it in here won't actually show [23:51] an image because it's as if we dragged a [23:54] note in here. It will just create a [23:56] literal link to the file. But you know, [24:00] I mean, this is also a link, but a [24:02] [music] link as an image or sort of a [24:04] reference of the image. So to actually [24:06] get that to work, we need to use one of [24:09] the most important buttons. So keep this [24:11] one in mind, it's insert any file here [24:14] on the right. And if we click insert any [24:16] file and then choose duck.jpeg, [24:19] then we actually get the option as [24:21] image. And bam, we have our duck image. [24:24] But you know what I just meant with like [24:26] references to something? For example, if [24:29] we go into our giraffe node and want to [24:30] say this is a friend of duck and then [24:34] add a add like the image of the duck. We [24:38] can also add the duck.jpeg and put an [24:41] exclamation mark in front. And now we [24:42] have an image of the duck here. But just [24:46] this is again just a link to the image. [24:50] So we can open it with a control-click. [24:53] And in our drawing, this is also just a [24:56] link to the image which we can open with [24:59] a control-click, you know. And now if we [25:01] create a new folder [music] and call it [25:03] images to just be more tidy and we open [25:05] it again, it will still be opened but in [25:08] our images directory. And like an even [25:10] better way to show you this is that if I [25:13] now rename duck to duck Jeff. And now [25:18] Obsidian will ask me if it has to like [25:21] update all the references which well [25:24] yeah obviously it should it should [25:26] actually always do that. So we're going [25:28] to activate that and the duck will still [25:30] work. But if we now look in our giraffe [25:33] where we said this is a friend of duck [25:36] and look at the link. The link is not [25:38] just the link of duck.jpeg but of duck [25:41] Jeff, you know, like like this is just [25:42] really important that like things use [25:44] references. We can also add GIFs, by the [25:47] way. So, animated images. For that, I'm [25:49] first going to go to my downloads, take [25:51] the GIF, drag it into my vault like [25:54] this. Now, I have forest [25:56] inspiration.gif. And now inside my [25:58] drawing, I'm going to use insert any [26:00] file again and use my forest [26:02] inspiration.gif GIF and not as an image [26:04] because as an image it will just be [26:06] static but instead you're going to use [26:09] it as [music] an embedible. And you know [26:11] now it has weird borders. You can just [26:13] remove them by going here and you know [26:15] in stroke color just choosing the no [26:17] color. And now we can actually add our [26:20] zoo inspiration and have something [26:22] animated here. And you know images are [26:25] cool but there are so many cooler things [26:28] you can add. for example, PDFs, web [26:30] pages, or direct markdown notes from [26:33] within your note. You can draw all [26:35] sources of knowledge. And I'm going to [26:37] show you how. So, I actually got my PDF [26:39] here, and I'm going to put it in my [26:41] vault. And now the move for PDFs is [26:43] again to use the insert any file from [26:47] vault. So, we can now choose ducks at [26:50] distance PDF. And now we have two [26:52] options. For example, PDF as image. Now, [26:55] we would have a lot of options. for [26:57] example, import the first three pages as [27:00] images, [music] which okay, yeah, it [27:03] kind of works. Let me actually reverse [27:06] that because what I think is cooler here [27:09] is to choose our PDF and add it as an [27:11] embedible. [27:13] So now when actually clicking this, we [27:16] have our duck essay beside our ducks and [27:20] from which we could pull our [27:21] information. But obviously if you import [27:23] it as images you can annotate things on [27:26] the PDF. That is something you can't do [27:27] when it is like embeddible. We can also [27:30] add web pages. So we just [music] take [27:32] the web page like exactly the link and [27:35] then if we hold it in our canvas it [27:37] tells us try shift option or control to [27:40] try different like drag and drop actions [27:42] because right now it wants to turn it [27:44] into a YouTube thumbnail with URL which [27:46] won't work. But instead we're going to [27:49] hold on Windows it's alt on Mac it's [27:52] option and now it says insert [27:54] interactive frame. So if we do that bam [27:57] we actually have our website here [28:00] through which we can scroll and sort of [28:02] we have our 10 amazing facts that we can [28:04] also draw from with our duck here but [28:07] also the same way. So let's go back to [28:09] our other drawing. [music] We can add [28:11] markdown files from within our vault. So [28:14] again, insert any file from vault and [28:17] now we're going to take our notes from [28:19] the internet MD. Markdown and then not [28:22] as an image because again that will be [28:24] static but as an embedible and wo we got [28:27] our markdown notes. So also if we add [28:31] something about the internet [28:34] is awesome. And then we go back to our [28:37] drawing. You see that this is also added [28:41] to this interactable markdown node and [28:44] through which we can also add things [28:45] within our drawing. And also if we click [28:47] outside of it, it sort of changes from [28:49] like an edit mode to this display mode [28:51] which is stylable. So right now it [28:54] actually has a fill that doesn't really [28:55] make any sense to me. So I'm going to [28:57] remove the background and actually make [28:59] the stroke a bit [music] bigger. And [29:01] that's pretty pretty awesome. Now I want [29:03] to show you another really strong [29:05] feature that will give you an insane bit [29:07] of understanding about Excaliraw which [29:09] will help you a lot down the line [29:11] because right now I mean what are we [29:13] actually doing? So we have these [29:15] different browser tabs here on obsidian [29:18] which usually is our text notes and if [29:21] we click on a drawing we have a drawing [29:24] but what actually is this drawing? So [29:27] let's actually treat this drawing for [29:30] once like imagine it is like imagine it [29:34] is literally a physical canvas a [29:37] physical canvas that we now drew on like [29:40] I drew on this canvas. Wouldn't it be [29:42] cool if we can draw on the front and [29:44] then just turn it around and take our [29:46] notes on the back. And this is exactly [29:49] what back of the note cards are. This [29:51] visual thinking we did here, this is [29:53] visual brainstorming for a new zoo. But [29:56] this drawing right here is kind of its [29:59] own thing, right? Its own visual [30:01] thinking, which is totally fine, but [30:03] maybe we actually have some insights [30:05] about this that we don't want to capture [30:07] somewhere else, but right here on the [30:09] back of this drawing. So, we're [music] [30:13] just going to right click on the canvas [30:15] and then we're going to click add back [30:17] of note card. And [music] now we need to [30:19] name our section. So, for example, maybe [30:23] I have some philosophy insight. So, I'm [30:26] going to just name this action [30:27] philosophy. And now this thing appears. [30:30] I'm going to click outside of it to [30:32] actually be able to move it around. And, [30:35] you know, I'm going to, you know, put it [30:36] a bit further to the side. And, you [30:38] know, now I'm clicking inside of it to [30:40] actually add some thoughts. So, for [30:42] example, nature and and giraffes are [30:45] [music] [30:45] interconnected. So, this is a note that [30:48] I took on nature and giraffes in this [30:51] drawing. But you know where does this [30:54] actually also this writing where does [30:56] this go to? And now here comes the giant [30:58] [music] kicker. If we go on the three [31:01] dots on the top right we see the more [31:04] options right like we can do a lot of [31:06] things with any note. Like this is just [31:08] with any other note like we can just [31:09] click on the three dots and like delete [31:11] the file for example. But if we go back [31:14] to the drawing so an Excaliraw drawing [31:17] is actually also just a markdown note. [31:19] >> [music] [31:20] >> If we click on the three dots on the top [31:21] right, I can click on open as markdown. [31:25] And what you will see is that what [31:27] [music] where's our drawing and you know [31:30] for that exact scenario if you by [31:32] accident open this this tells you oh god [31:34] switch to extra x color draw view in [31:36] more [music] options. So we can just [31:38] open our drawings now like these are our [31:41] drawings and they're just this right [31:44] [music] and if we want to go back we can [31:45] click on the three dots and click on [31:47] open saw drawing. So again we switch [31:49] back like these are two dimensions [31:52] but now remember that we took our back [31:56] of note notes here. So if we switch to [32:00] the markdown view like our other drawing [32:02] won't have anything because by the way [32:03] we can just [music] theoretically delete [32:05] this warning and that wouldn't do [32:07] anything like here is all the data of [32:09] Excaliraw but now in our drawing where [32:11] we took the back of note notes you see [32:15] here that there is markdown here is our [32:17] philosophy section and I could [32:19] theoretically write more philosophy like [32:22] like animals have intrinsic value like I [32:25] wrote this in a plain markdown note [32:27] [music] but now if Go back to our [32:30] drawing. Oh, damn. It actually appeared [32:33] because again, we're taking notes on the [32:34] back of our drawing. But guys, from the [32:36] basics, I've saved the best thing to [32:39] mention last. I'm going to show you [32:41] Excaliraw's most powerful feature. Okay, [32:44] guys, watch this. So, I've gone back to [32:45] my ideas for a new zoo. And maybe I also [32:48] want to add all my thoughts that I have [32:51] about giraffes to this because a zoo [32:53] obviously needs some giraffes. And I [32:55] already have some visual thinking on [32:57] giraffes. And that is also connected [32:59] with nature. Like it's all it could fit [33:01] well into this visual thinking. So just [33:04] click on insert any file and then you [33:07] know we're just going to find our other [33:09] Xcolor drawing and then we're [music] [33:12] going to import it as an image. And do [33:14] you see this? I mean yeah our like [33:16] embedible things on the sides like our [33:19] extra info is not really rendering. Let [33:23] me just connect that real quick. So, [33:24] I've connected these, but but but you [33:26] see what this means. I can even go back [33:30] into my other drawing. And now here, [33:32] like I don't know, add the text note. [33:34] It's the coolest animal just like as a [33:36] little extra. [music] And now, if we go [33:39] back to our big drawing where we added [33:41] this drawing, this gets added as well. [33:44] Like again, in the end, you just get [33:45] this big picture view and you can break [33:47] down big ideas into smaller components. [33:50] It's absolutely amazing. And you know [33:52] now we're actually understand some [33:54] important settings about Excaliraw by [33:57] opening the Obsidian settings. And I [33:59] will also show you a thing that can make [34:01] Excaliraw 10x more capable. But first, [34:04] there's another visual place to [34:05] understand awesome concepts. Brilliant, [34:08] the sponsor of this video. I highly [34:09] recommend Brilliant to anyone deeply [34:11] curious. Like you're not just watching [34:13] boring lectures. You're actually solving [34:16] problems through interactive graphics. [34:18] math, coding, science, all broken down [34:21] into these super fun, bite-sized lessons [34:23] that adapt to you. Like, I'm genuinely [34:26] addicted to their digital circuits [34:28] course. It lets me revise science basics [34:30] through these fancy handcrafted visuals [34:32] designed by worldclass teachers from [34:34] Harvard, Stanford, and MIT. And it's fun [34:37] regardless of age. To learn for free on [34:39] Brilliant for a full [music] 30 days, go [34:41] to brilliant.org/carlosobsidian [34:44] tutorials. Scan the QR code on screen or [34:46] click the first link in the description. [34:48] You will also get 20% off an annual [34:50] premium subscription, which means [34:52] unlimited daily access to everything [34:54] that Brilliant has to offer. Okay, so [34:56] let's dive into the settings. So again, [34:57] go to the bottom left, then click on the [35:00] gear icon, and you will find like on the [35:02] left menu under community plugins that [35:04] you've installed. Click on Excaliraw. [35:06] And here you have [music] way too many [35:09] things. But a thing that immediately [35:11] interests you under basic is [music] [35:13] just Xcaliraw folder which is [35:15] case-sensitive. So here you can see that [35:18] Xcaliraw is like the selected folder. [35:21] But you could also rename this to [35:23] drawings for example. And now if I [35:25] create a new folder called drawings and [35:28] now create a new drawing it will spawn [35:30] in my drawings folder. Okay. But I'm [35:33] going to reverse that. Also note that [35:36] you can search for any settings which is [35:38] very practical. So let's actually search [35:40] for like opening square like like [35:43] brackets. [35:45] Oh yeah, for example, show brackets [35:46] around links. This is something we could [35:48] enable. And now if we look into our [35:53] drawing where we had like our manual [35:55] lonely link of uh like our internet [35:58] note, it now has these used to square [36:00] brackets around it. But yeah, getting [36:02] deep into these settings can take a [36:03] while, but in a way, you don't really [36:05] need to worry about them too much. Okay, [36:06] to get Excaliraw on steroids, here's [36:09] what I haven't shown you so far. You see [36:12] that Obsidian icon on the right? That is [36:14] the Obsidian tools panel for Excaliraw. [36:17] And here you have numerous utility [36:19] tools, for example, for adding math [36:21] equations. But the most powerful button [36:24] of them all is actually this one. It's [36:26] to install or update Excalor scripts. [36:30] So, Excaliraw is already an extension [36:33] for Obsidian. But what if I told you [36:35] that Excaliraw itself also has [36:37] extensions, lots of them. And like here, [36:40] for example, we're going to grab like we [36:43] have a search bar on the top again. And [36:44] this is basically just a giant node. [36:46] We're going to search for the slideshow. [36:49] Click on there. And there it is, the [36:51] slideshow. And click on install the [36:52] script. And also, we're going to search [36:54] for invert colors. That is something I [36:57] have actually [36:59] uh like teased because invert colors is [37:03] like if you click on install the script [37:05] [music] is basically the better dark [37:07] mode for Excaliraw if you are a dieh [37:10] hard [music] dark mode user. Now that's [37:12] all we need for now. And now again [37:14] clicking the obsidian icon at the bottom [37:17] we have our downloaded tools which we [37:18] can also pin to the right by [37:21] right-clicking them. And now for example [37:23] if we enable the dark mode here like [37:25] that I shown you here uh then you will [37:28] see that the im that the drawing inside [37:31] the drawing that we've added actually [37:33] doesn't work or like is hard to [37:35] recognize. So if I now turn off and go [37:38] back to light mode and use invert [37:40] colors. Now you see that this is [37:43] actually properly dark modeed with the [37:46] presentation script. I'm teasing the [37:48] last major thing that I want to show you [37:49] guys, which is now that we can think so [37:52] freely and connect everything, we might [37:55] also want to share this in some way like [37:58] maybe for our blogs, our clients, social [38:00] media, whatever. So, we can go to the [38:02] bottom left of our tray menu and we can [38:06] actually click on export image. Like [38:08] this lets us export this as an image or [38:10] as a PDF or just do a dynamic screenshot [38:14] with like a lot of different settings. [38:15] >> [music] [38:15] >> So let's actually turn this into a [38:17] presentation. We can just take the arrow [38:19] tool. We can first go over the ducks, [38:23] then over the axelottles, and then end [38:26] with our theme park. You know, if we [38:28] select this arrow and click on the [38:30] presentation script, bam, we actually [38:33] can jump to these things as like slides [38:35] and like go from element to element, [38:37] which [music] is I know it might be kind [38:39] of janky, but it's like a super [38:42] effective, loweffort way to just bit by [38:44] bit reveal your thought process [38:46] visually. And yeah, now I have to give [38:49] massive credit to Zult. He's been [38:50] building this entire plug-in for more [38:52] than 4 years. If you want to dive into [38:55] even more advanced features of [38:57] Excaliraw, check out one of his numerous [38:59] tutorials. And yeah, if you want the [39:01] vault that I've used for the [39:02] demonstration, you can download it with [39:04] the link below or like right here [39:06] because yeah, maybe you want to play [39:07] around with the things we created in [39:09] this tutorial. And yeah, just apply your [39:10] [music] knowledge more. But that's it. [39:12] See you soon.  📄 **Full text:** ![[Full Document Contents/Articles/Why 5 Million People Are OBSESSED With Excalidraw.md|Why 5 Million People Are OBSESSED With Excalidraw by YouTube]] ## Highlights - And bam, I'm going to close the graph view here. And also I'm going to collapse the sidebar. And here we have our canvas. Okay. So the first Wait a minute guys. A giant trap a lot of users walk into is to just skip the basics of obsidian itself. If we immediately dive into Excaliraw, we risk missing 90% of its potential. So what I'm going to recap now is crucial so that XC draw is not just another drawing [music] tool but a visual extension of your mind. So let's close our drawing like a browser window first [music] and get our sidebar ([View Highlight](https://read.readwise.io/read/01krnxa4fbrmbfy712m97by4j3)) - Tags: 👻 ai highlighted - within our other note. So we can link to another note and we can display its content from this link. And I mean obviously if I go into giraffe now and put awesome adventure to the side and now I add something else to giraffes. I've seen two [music] to browse so far. Like if we add something, it will immediately update in our embedded link. So yeah, that was the essential thing I wanted you to remember. Having remembered links and embedding, let's start using Xcolor Draw. We will go over the basics in a perfect non-overwhelming ([View Highlight](https://read.readwise.io/read/01krnxa4fxpkbthwpw0cvjy90b)) - Tags: 👻 ai highlighted - Excaliraw. Click on the three dots and then [music] click on open. And here downloads you will find this library. You will open it and oh now I got these cool server architecture icons that I could theoretically use. So let's actually drag this in here. Now I make this. I'm going to group it with command or controlG. [music] Now, all of what we just learned still wasn't revolutionary because all this drawing has still just been drawing. Well, what I'm going to show you now is one of the main reasons ([View Highlight](https://read.readwise.io/read/01krnxa4hg1p6w64vgneveq80h)) - Tags: 👻 ai highlighted - Okay, first I want to I want you to know that you can also skip this [music] by just using the command palette. So command P and then here if you search for embed and then you will see Excaliraw embed the most recently edited drawing. I'm [music] going to click that and bam. That also immediately puts it in our note. doing that what we just did by hand for us. [music] And yeah, this is immensely useful because it connects what we draw like what we sketch to what we write. And also any links to this note that has this drawing in it will ([View Highlight](https://read.readwise.io/read/01krnxa4jz8y5kft94h252v237)) - Tags: 👻 ai highlighted - this link and you know this link now if I click on it will immediately let me jump to our giraffe element. So if you have like a giant drawing you can immediately make links that send you to a specific part of your visual thinking. And also I've added something to this other drawing. If we want to link to a specific part of a drawing, so like because if we now have, you know, [music] embedded this drawing, we will have all of it. But if for example, we ([View Highlight](https://read.readwise.io/read/01krnxa4qy63wsmhyc1q8eswvj)) - Tags: 👻 ai highlighted - that's pretty pretty awesome. Now I want to show you another really strong feature that will give you an insane bit of understanding about Excaliraw which will help you a lot down the line because right now I mean what are we actually doing? So we have these different browser tabs here on obsidian which usually is our text notes and if we click on a drawing we have a drawing but what actually is this drawing? So let's actually treat this drawing for ([View Highlight](https://read.readwise.io/read/01krnxa4z9897g5e5gt9682wbg)) - Tags: 👻 ai highlighted - dots on the top right we see the more options right like we can do a lot of things with any note. Like this is just with any other note like we can just click on the three dots and like delete the file for example. But if we go back to the drawing so an Excaliraw drawing is actually also just a markdown note. >> [music] >> If we click on the three dots on the top right, I can click on open as markdown. And what you will see is that what [music] where's our drawing and you know ([View Highlight](https://read.readwise.io/read/01krnxa54srzdb484jsr4x78m8)) - Tags: 👻 ai highlighted - like I don't know, add the text note. It's the coolest animal just like as a little extra. [music] And now, if we go back to our big drawing where we added this drawing, this gets added as well. Like again, in the end, you just get this big picture view and you can break down big ideas into smaller components. It's absolutely amazing. And you know now we're actually understand some important settings about Excaliraw by opening the Obsidian settings. And I will also show you a thing that can make ([View Highlight](https://read.readwise.io/read/01krnxa5c1af8tc8rc29wghxsp)) - Tags: 👻 ai highlighted