Visual map of content in Obsidian Excalidraw plugin
- When you first start using Obsidian,because there's such an emphasisin it being Markdown-based,you might think that it's
just text everywhere.And there's a reason for that.Text can be really useful.It's easy to type, it's
viewable on all devices,and it's searchable.But what if you're just
one of those peoplewho needs something a
little bit more visualthan a bunch of words on a screen?Well, there's a plugin for that.It's called Excalidraw.And it's something that
I've been using for a while,
but I'm still finding extremely
useful in my daily life.In this video, I'm gonna take you with meas I create a sort of visual dashboardor map of content for my Obsidian notes.Something that's pretty much all text.A map of content is a
single place in your vaultor in your personal
knowledge management system,where you start to consolidateall these tiny little atomic notesthat you've got all over the placeand put them in one place if
they're about a certain topic.
Now that topic could be very specific,like load testing on the protocol level,or it could be very general.And the idea is that if you have someof these maps of content in your notesaround topics that you're interested in,it's a lot easier for you
to see the big picture.In this case, I want a very general,very broad map of content.I want all of the areas
that I usually write about,that I'm interested in in my life,
and I want it to be kind
of like a jumping off placeso I can go there and
like go to each sectionand hopefully, be able to decidewhat I need to work on next.Now Excalidraw is a tool that
exists outside of Obsidian.You can use Excalidraw
without ever using Obsidian.Primarily, it is a tool for drawing,but specifically with the purposeof communicating informationrather than really creating,
you know, works of art.Although sometimes,
for some very creative intelligent people,the two do overlap.Now the Obsidian Excalidraw pluginis made by someone who's not
a developer of Excalidraw,but just wanted to integratethat whole Excalidraw experience
into an Obsidian plugin.That way, you don't even
have to leave your vault.And it has some cool features as wellthat are specific to Obsidian notes,which we'll get into in a second.Now let's get to using Excalidraw.Now I typically show you
how to install a plugin,
but it's really pretty much the same thingfor every community plugin.So you just go into settings
and then community plugin.And then you installand enable the plugin called Excalidraw.Once Excalidraw is installed,you can open it up by hitting Command + Por Control + P to get to the command pane.And then I'm going to type in Excalidraw.And for this one,I'm just going to create a new drawingin the current active pane.So as you see, my vault
is in dark mode right now,
but because I want you
to be able to see it,I'm going to switch to light modejust to make it a little bit easier.This is an Excalidraw drawingand there are a few things here.This tool panel has pretty
much all the things you needto create different elements.This is to select things.This is for creating rectangles.This one is for diamonds and circles.And then there's also
arrows, lines, drawing,
text, and images, but let's remove thisand I'm going to start out with an imagethat I found online.So I have this idea of getting an iconof a woman with red hair
or something in the middleand then all around her
are going to be iconsfor every area of interest.So I did find this one.I think I'm just going to get this.I'm gonna hit Copy and then
I'll go back to Obsidianand I'm just going to paste it.That was just a Command + V.
So I'll put her like there.I don't know, looks like
it's in the middle for me.Now I want a few things around her.So maybe something about YouTube,but I want to actually create
the YouTube little icon.Now this Tools panel, it has,I don't know if you can see that,but it's got like numbers
on the bottom hereand that's just for keyboard
shortcuts if you'd like it.So I'm going to hit number 2,which selected the rectangle.
And I'm going to create
like a thing like that,but I want it with like curved edges,like the YouTube thing.And I definitely want it to be red.So I'll choose red here as the strokeand then also as the background.Now by default, Excalidraw has this,like cool aesthetic of
it being hand-drawn.But for some things, it doesn't work.So I'm going to change it over here
to just be like a solid thing.Now I need a triangle.So I'm going to select this line here.And so that is one line.I'm going to double click on itand that kind of opens up this editing,special editing thing.And then I'll hold down
the Alt or Option keysince I'm on a Mac.I'm going to do like a
rough kind of triangle.Now that automatically made it curvedbecause that's what I had.
So I'll change the edges
back to the straight one.And then I don't want it to be red.I want it to be white,because we are going to put it over here.Whoops, too big.So I can just resize that.Right now, that kind of
looks like YouTube, right?I'm going to select that.Right click and group or Command + G,just so that they aren't moved separately
'cause I kind of want that triangleto be perfectly positioned
in the center there.That's if I want to, like
position it somewhere else.Now let's just put it here
and I'm going to un-group itso that I can click on this red thingand then add a link because
I already have somethingabout producing videos.So that's already a note that I've got.So I've got that.And let me just show you,
now it links to that.So if I click on it, aha!
Now it goes to my note on producing videosand I'll just head back
to the Excalidraw drawing.To zoom in, there are
the zoom controls hereor you can just hold
the Command button downwhile you're changing your mouse wheel.And then to move the canvas itself,you can either hold down the Space barand then drag it as normal.Or in my case, I just
click on the mouse wheeland then just drag it.
So I've got YouTube there.What else do I have?Well, maybe my work.So I'll definitely want a line for that.I'm going to create a
line, but now it's white.So I can't actually see it.So let me head over here.I'm going to put a hexadecimal code here.This is something that I copy.This is my company's logo.So now this line is going to
go a little bit like this.Then I'll double click on it
and then hold down the Option key again,kind of like what I did
with the YouTube logo,and then make something that
resembles like a mountain'cause that's my company's logo.And just close it up hereand that automatically got filled in.So that's great.Oh, it's not even really straight.So I'll just move it a little bit there.And then I just double clicked
anywhere on the screen,but you can also hit the
A there and I'll put k6.
But I don't want to
make that the same color'cause then I won't be able to see it.So select thatand I'll make this whiteand I'll make it XL.All right.Can't see it, but now I can see itand actually I'll make it even bigger.Okay, and this one will have
to be turned a little bitand then I'm going to make a link again.And this will be k6 Tool
'cause that's the page
that I want to link it to.To test that, I'm just
going to click on it.Yep, it went to the right page.And I'm going to go back.Now because I know this is right,I can just group this and move it around.So maybe I'll put it over here.What else do I like to do?Performance testing
definitely has to be in there.That is my day job.
I've been doing it for over a decade nowand I kind of want that to be,like some sort of charts or something.So I'm going to pick this one, sure.I'll come back and then paste it.And then of course, resize
that 'cause that is too bigand that can get a link as well.And it'll be performance testing.Okay, let's see what that looks like.Yeah, perfect.
So now I've got those three things.What else do I want?So something else that
probably should be herebecause it's so top of my
mind right now is Portugal.My move to Portugal is impendingand I'm hoping to do it like
in the next month or so.So let's go look for a,
like a flag of Portugalor something.I'm gonna choose this one'cause it looks kind of like
it was hand-drawn, right?I'm gonna copy that
image and paste it here.
Too big, so maybe we'll put that here.I'll put Portugal.And when I hover over it,
this is my Portugal noteswith a bunch of places
that we've already been to'cause we were looking for
houses, for cities to move to.And here are regions and everything.So, yeah, that's good.Honestly, RPGs are somethingthat I'd like to be here as well.So let me get, let's say a D20.
All right, I'm gonna pick this onebecause it's a natural 20.Copy that, paste it here.This one will go to my
TTRPGs Games Index file.Check that that comes up.Yeah, that's all the
games that I'm playingand that I have played.So that's good.Maybe make this a little bit smaller.I definitely should have
something in here about Obsidianand personal knowledge management.So I'm going to go over here
and you'll see that Excalidrawactually has a bunch of things
that you can put in hereand I've already imported these,but I'm looking for
something in particular.So I'm gonna go ahead
and browse libraries.And these are all a bunch of thingsthat are freely available.You just have to download themand put it into your
Obsidian Excalidraw plugin.So what am I looking for?I'm looking for, like a graph, maybe.
This looks kind of cool.Can't really see it too well,but I think it's what I'm looking for.I'm gonna try it out.So don't do Add to
Excalidraw because if you do,that'll add it to the
excalidraw.com web app.What we want us to actually download it.Then I'm going to go back to Obsidianand then hit the Load button here.And I'm going to select
graphs.excalidraw library,
which is what I had.Now, it's going to load
it into my libraries here.So when I click on it again,
those drawings are here now.So I think I want, like
this wild one here.Whoa, that's too big for sure.Let me resize that.And because the advantage
of using somethingfrom the Excalidraw libraryrather than like an already created imageis that you can still
change things about it.Like I don't like that green,
so I'm going to make it, I don't know,kind of make it orange?And I'm going to have it
completely filled like that.Maybe I'll put like a
circle underneath it.Just kind of give it more Obsidian flavorand I'm going to put Send to Back here.And then I'll click on this one againand this time, I'll make
it, like white or something,or maybe yellow.Yeah.That works out well.
And then on this circle,I'm going to link it to
personal knowledge management.And that's a note of mine.And when I hover over it,
yeah, it's my PKM notes.And then I'm going to select
this and then group them.Now I also want to add thisnow that I've created this k6 one.I'm pretty sure I'm gonna use that again,
so I'm going to right click on itand then add to the library.So now when I click on the library,in my personal library is this
little k6 thing that I did.I'm going to do the same
for this YouTube one'cause pretty sure I'm
going to use that again.Then I probably want
something for like gear.I'm actually going to change
this one to, maybe white.I'll make it a little bit bigger.Then I think the next big
one is going to be gear,like computer gear.
Yeah, I'm gonna copy that.Looks like a MacBook as well.And then I'm gonna paste it right hereand make that way smaller.This is gonna be like for
computers and gear and technologyand all those things that I love.Put it there and then I'm
going to create a linkto my software development one.Now Excalidraw drawings
are going to be savedin the format .excalidraw,
but you can also turn this into a PNG.So let me open a new note hereand I'm going to hit Command
- P again and hit Excalidraw.And this time, I'm looking for
transclude embed a drawing.So I'm going to click on thatand I'm going to type dashboard
and it found it already.So now it is embedded in this file.There's even like a little
Edit in Excalidraw herethat when I switch it to preview mode,it's going to disappear.So all I'm gonna see is
the actual Excalidraw image
which is really cool.But let's see what happens
if I change something,like, maybe I'll put some text here.This is my life.Highlight all of that
and make it centered.And then, I mean, I could
even make this biggerif I'd like, but this is only
to show you a cool feature.And if I go to more options here,I can actually open it as a Markdown file.
A cool thing is that anything
that you type in therewill show up here and it looks
a little bit wonky, right?But you can double check all of the links.You can add things here.Here's my this is my life hereand there's a whole bunch
of like the actual images.And this is a lot of information
about where to put what,but a cool side effect
of this is that now,I can add front matter to it.So I can say, type a drawing.And then when we go back to that note,
which was a dashboard note
and we go to preview mode,you'll see that that
automatically updated.So this way, you can just keep changingthe Excalidraw drawing and
not worry about it updatingbecause it always will.Here's a simple drawing.This is an Excalidraw drawingof like different software layer.So the application layers hereand then the kernel and I
put CPU, memory, and devices.I also heavily use this in
RPGs, as you might imagine.
So if we go to the Otari Fishery,I'm the kind of playerthat really likes to map
things out as we're going.So this is to show that we are
now in the Troglodyte cave.And each one of these is linked
to a section in my notes.Like this is what that looked like.And there's some things about
that particular location.So this is something that
I do after the sessionand I send it to the
other players as well,so that they're not lost.There are so many things
that Excalidraw can do
that I just didn't get
a chance to show you.There's a script library full of scriptsthat other people have writtenthat automate repetitive
actions in Excalidrawand you can create your
own scripts as well.The iPad experience for Excalidraw
is really pretty amazing.I've spent quite a bit
of time on my iPad Prowith the Obsidian app on it
and Excalidraw installed on it.And I'm able to write and draw in freehand
using my Apple pencil.And then those notes, including the image,just gets synced to my
laptop using Obsidian Sync.So it turns Excalidraw into like,my on-the-go capturing device
rather than just somethingthat I do when I'm
sitting down at my desk.And probably the most interesting
application of them allis an entirely new plugin.The developer of the
Excalidraw Obsidian plugin,Zsolt Viczian, I'm not sure
if I'm pronouncing that right,
but he has this other
plug-in called Excalibrainwhich is not fully out yet.Excalibrain is a new and fully visual wayto explore your notes.So just think Graphue,
but more interactive.And that I can't wait
to talk to you about.I don't even really consider
myself a visual person.I thought I was happy with text,but every time I use Excalidraw,
I just wanna use it more.I feel like I'm just
scratching the surface here.
So if you'd like to know more
about Excalidraw in particularor just about other more visual methodsof taking notes, drop me a commentso that I know to make
more videos about that.And if you'd like to know
more about other plugins,check out this one that
I made on DataView.A plugin that has changed the way I createand rediscover my notes.As always, thank you to the Patreonsthat made this possible.And obrigada!Thanks for watching.