- 24
- 40 701
Excalidraw
Приєднався 16 сер 2022
Welcome to the official Excalidraw UA-cam channel!
Your go-to destination for video content related to Excalidraw - our forever-free and online whiteboarding editor that helps you quickly create diagrams, wireframes, mind maps, designs, and much more in a unique, handwritten style. 🖋️ No sign-up, no ads - just get your work done! #KeepItSimple #ProgressOverPerfection
If you're looking for additional features such as cloud storage ☁️, seamless team collaboration 👥, advanced permissions 🔐, read-only links 📜, or presentations 📊, make sure to check out Excalidraw Plus!
On this channel, you'll find:
🎨 Step-by-step tutorials: Practical guides to help you navigate Excalidraw.
💡 Tips & Tricks: Discover handy features and shortcuts.
📢 Updates: Stay informed about the latest improvements.
... and much more!
Subscribe to stay in the loop and join us in exploring the possibilities of Excalidraw(+)! Thanks for being here! 🚀
Your go-to destination for video content related to Excalidraw - our forever-free and online whiteboarding editor that helps you quickly create diagrams, wireframes, mind maps, designs, and much more in a unique, handwritten style. 🖋️ No sign-up, no ads - just get your work done! #KeepItSimple #ProgressOverPerfection
If you're looking for additional features such as cloud storage ☁️, seamless team collaboration 👥, advanced permissions 🔐, read-only links 📜, or presentations 📊, make sure to check out Excalidraw Plus!
On this channel, you'll find:
🎨 Step-by-step tutorials: Practical guides to help you navigate Excalidraw.
💡 Tips & Tricks: Discover handy features and shortcuts.
📢 Updates: Stay informed about the latest improvements.
... and much more!
Subscribe to stay in the loop and join us in exploring the possibilities of Excalidraw(+)! Thanks for being here! 🚀
💡5 Tips & Tricks for drawings in Excalidraw that STAND OUT 👀 | T&T #2
In the second video in our Tips & Tricks series, we'll show you some basic features and settings to help you take your scenes and drawings to the next level! 💪
=========================
⬇️ CHAPTERS & INSTRUCTIONS ⬇️
0:00 | Adjusting element settings to brighten your drawing
- As the name suggests, sometimes you don't need much to take your drawing to the next level. With Excalidraw, you basically just need to play around with the element/object settings.
- Simply select the object you want to modify. A preference panel will open on the left side of the editor.
- Browse through the available settings and adjust them to your liking. You can choose to set:
* Color (stroke / background),
* Fill pattern (hatched / cross-hatched / solid)
* Stroke width (thin / bold / extra-bold)
* Stroke style (solid / dashed / dotted)
* Sloppiness = handwritten style (architect / artist / cartoonist)
* Edges (sharp / round)
* Opacity
- Once you are happy with the setting of the selected element, move on to another and repeat the process!
1:52 | Setting element order for highlights and shadows
- Sometimes you just need to highlight a section of text or another element. You can use all the shape tools available, such as rectangle, diamond, circle or line and arrow for that. What is most important, however, is to use the correct order of the element.
- Create the element to be used for highlighting. Customize it as needed (as in the previous tip and trick). Keep this element selected and right click with a mouse (or trackpad) on it and select either:
* Send backward (Ctrl/Cmd+[)
* Send forward (Ctrl/Cmd+])
* Send to the back (Ctrl+Shift+[ or Cmd+Option+[)
* Send to the front (Ctrl+Shift+] or Cmd+Option+])
- The last element created is at the top of all the elements on the canvas (and the first element created is at the bottom of them). So if you need to place it behind a particular element, the easiest way to do it is to use Send to the back (if you want to move that element behind another element) or Send to the front (if you want to move that particular element before all of them).
- If you're not sure how this works, we recommend trying it multiple times to get an idea of how these "layers" and their positions work.
- Repeat the process until you are happy with the result.
4:55 | Choosing the right font to elevate your scene
- If there is any text in your scene, select it. If not, select the Text tool from the toolbar at the top of the editor, click on the canvas where you want to place the text, and start typing.
- Then go to the Preferences panel on the left side of the editor and either select from the quick picks in the Font family section, or click on NEW font picker next to it and choose the font that best suits your drawing from the available fonts.
- You can then adjust its size in the Font size section of the Preferences panel, or use the handles around the text to resize the text manually.
5:52 | Using the line tool to add extra polish
- With the Line tool, you can easily create any complex object you need.
- Select the Line tool from the toolbar at the top of the editor, and click on the canvas where you want to place the first vertex of the line you want to create. Then move the mouse to where you want to continue with the next vertex and click on the canvas again. You can easily create a multi-point line this way, and if you want to have a closed, complex object, make sure the last point is where you have the first (to make it close).
- Once the object is created, you can edit its visual appearance in the preference panel on the left side of the editor (as you are used to with other elements).
7:36 | Incorporating web embeds for more interactivity
- First you need to copy a link (Ctrl/Cmd+C) to the media (e.g. UA-cam video or Twitter post) you want to embed in the scene.
- Then go back to the editor and click on the More tools option on the toolbar at the top of the editor and select Web embed.
- Set the area on the canvas (by dragging) where you want to place the embed, and when you're done, paste the link you previously copied (via Ctrl/Cmd+V).
- Once the media is loaded, you can adjust its visual appearance as you are used to with other elements.
8:21 | Bonus
- See an example of using all of the above tips and tricks to enhance your drawing!
=========================
🔗 Try it out for yourself at excalidraw.com
🔗 Explore the premium Excalidraw+ at plus.excalidraw.com
👇 CONNECT WITH US 👇
🐦 Follow us on X: x.com/excalidraw
👔 Follow us on LinkedIn: linkedin.com/company/excalidraw
💬 Join our community on Discord: discord.gg/Q9Z5re52
#tipsandtricks #productivity #excalidraw
=========================
⬇️ CHAPTERS & INSTRUCTIONS ⬇️
0:00 | Adjusting element settings to brighten your drawing
- As the name suggests, sometimes you don't need much to take your drawing to the next level. With Excalidraw, you basically just need to play around with the element/object settings.
- Simply select the object you want to modify. A preference panel will open on the left side of the editor.
- Browse through the available settings and adjust them to your liking. You can choose to set:
* Color (stroke / background),
* Fill pattern (hatched / cross-hatched / solid)
* Stroke width (thin / bold / extra-bold)
* Stroke style (solid / dashed / dotted)
* Sloppiness = handwritten style (architect / artist / cartoonist)
* Edges (sharp / round)
* Opacity
- Once you are happy with the setting of the selected element, move on to another and repeat the process!
1:52 | Setting element order for highlights and shadows
- Sometimes you just need to highlight a section of text or another element. You can use all the shape tools available, such as rectangle, diamond, circle or line and arrow for that. What is most important, however, is to use the correct order of the element.
- Create the element to be used for highlighting. Customize it as needed (as in the previous tip and trick). Keep this element selected and right click with a mouse (or trackpad) on it and select either:
* Send backward (Ctrl/Cmd+[)
* Send forward (Ctrl/Cmd+])
* Send to the back (Ctrl+Shift+[ or Cmd+Option+[)
* Send to the front (Ctrl+Shift+] or Cmd+Option+])
- The last element created is at the top of all the elements on the canvas (and the first element created is at the bottom of them). So if you need to place it behind a particular element, the easiest way to do it is to use Send to the back (if you want to move that element behind another element) or Send to the front (if you want to move that particular element before all of them).
- If you're not sure how this works, we recommend trying it multiple times to get an idea of how these "layers" and their positions work.
- Repeat the process until you are happy with the result.
4:55 | Choosing the right font to elevate your scene
- If there is any text in your scene, select it. If not, select the Text tool from the toolbar at the top of the editor, click on the canvas where you want to place the text, and start typing.
- Then go to the Preferences panel on the left side of the editor and either select from the quick picks in the Font family section, or click on NEW font picker next to it and choose the font that best suits your drawing from the available fonts.
- You can then adjust its size in the Font size section of the Preferences panel, or use the handles around the text to resize the text manually.
5:52 | Using the line tool to add extra polish
- With the Line tool, you can easily create any complex object you need.
- Select the Line tool from the toolbar at the top of the editor, and click on the canvas where you want to place the first vertex of the line you want to create. Then move the mouse to where you want to continue with the next vertex and click on the canvas again. You can easily create a multi-point line this way, and if you want to have a closed, complex object, make sure the last point is where you have the first (to make it close).
- Once the object is created, you can edit its visual appearance in the preference panel on the left side of the editor (as you are used to with other elements).
7:36 | Incorporating web embeds for more interactivity
- First you need to copy a link (Ctrl/Cmd+C) to the media (e.g. UA-cam video or Twitter post) you want to embed in the scene.
- Then go back to the editor and click on the More tools option on the toolbar at the top of the editor and select Web embed.
- Set the area on the canvas (by dragging) where you want to place the embed, and when you're done, paste the link you previously copied (via Ctrl/Cmd+V).
- Once the media is loaded, you can adjust its visual appearance as you are used to with other elements.
8:21 | Bonus
- See an example of using all of the above tips and tricks to enhance your drawing!
=========================
🔗 Try it out for yourself at excalidraw.com
🔗 Explore the premium Excalidraw+ at plus.excalidraw.com
👇 CONNECT WITH US 👇
🐦 Follow us on X: x.com/excalidraw
👔 Follow us on LinkedIn: linkedin.com/company/excalidraw
💬 Join our community on Discord: discord.gg/Q9Z5re52
#tipsandtricks #productivity #excalidraw
Переглядів: 150
Відео
💡 How to work with E2EE VOICE HANGOUTS in Excalidraw+ 👀 | TUTORIAL #11
Переглядів 373Місяць тому
In mini-tutorial #11 of our series, you'll learn how to work with the voice hangouts in Excalidraw . This feature is a must if you need to effectively communicate and collaborate with your colleagues during a whiteboarding session or share more in-depth thoughts during a presentation. No more third-party apps! Creating voice hangouts is just as easy as you're used to in Excalidraw. Plus, our vo...
💡 How to work with PRESENTATIONS in Excalidraw+ 👀 | TUTORIAL #10
Переглядів 1,1 тис.2 місяці тому
In mini-tutorial #10 or our series you'll learn how to work with presentations in Excalidraw . The presentation tool is especially useful if you want to quickly share ideas for an existing scene or just need a presentation and want to have it in our unique handwritten style. Creating presentations is just as easy as you're used to in Excalidraw. Check out our mini-tutorial and get to know all i...
💡 How to use SNAPPING in Excalidraw 👀 | TUTORIAL #9
Переглядів 1,9 тис.5 місяців тому
In mini-tutorial #9 of our series, you'll learn how to properly use snapping in Excalidraw, which is especially useful if you need to be more precise. Not that we're asking you to, but we know there are cases where it's pretty important. And with our snapping feature, you can achieve a little perfection in seconds. ⬇️ CHAPTERS & INSTRUCTIONS ⬇️ 0:01 | Enable snapping either from the context men...
💡5 Tips & tricks for PRODUCTIVITY in Excalidraw 👀 | T&T #1
Переглядів 7 тис.5 місяців тому
In video #1 of the Tips & Tricks series, we'll show you some features and functions that are great for better productivity in Excalidraw, and that were selected by our team members themselves 💪 ⬇️ CHAPTERS & INSTRUCTIONS ⬇️ 0:00 | Text-to-diagram for quick diagramming (AI feature) AI features are a great time saver, especially our text-to-diagram feature! Go to the last item in the toolbox at t...
💡 How to work with EMBEDDABLE LINKS in Excalidraw+ 👀 | TUTORIAL #8
Переглядів 1,3 тис.5 місяців тому
Mini-tutorial #8 in our series focuses on the embeddable (read-only) links available in Excalidraw . These links are especially useful if you want to share your scene in some documentation and want to have a live and updated preview of it based on changes you make to the scene itself. Embedding is fairly easy and works similarly with tools like Confluence, Notion, Docusaurus, Slite and more! Ch...
💡 How to create CHARTS in Excalidraw 👀 | TUTORIAL #7
Переглядів 2,3 тис.5 місяців тому
In mini-tutorial #7, we'll show you how you can easily convert tables to charts using our Excalidraw editor (pssst, it's easier than you think). ⬇️ CHAPTERS & INSTRUCTIONS ⬇️ 0:05 | Copying data from the source table - First, you need to get the source data in order to create the chart in Excalidraw. So open the document with your table, copy (either via the context menu or Ctrl/Cmd C) the enti...
💡 How to create WIREFRAMES using LIBRARIES in Excalidraw 👀 | TUTORIAL #6
Переглядів 2,7 тис.6 місяців тому
In mini-tutorial #6, we'll show you how easy wireframes can be if you use the right tools! Of course, you can also create them yourself from scratch. But why should you waste your precious time when our libraries are ready to help you? 📚 Check them out at libraries.excalidraw.com! 💡 The library used in this video can be found at libraries.excalidraw.com/?theme=light&sort=default#gabrielamacakov...
💡 How to create DIAGRAMS using basic tools in Excalidraw 👀 | TUTORIAL #5
Переглядів 2,5 тис.6 місяців тому
In mini-tutorial #5, you will use all the basic shapes you have learned in the previous mini-tutorials to create diagrams as diagrams are the most common use case for which Excalidraw is being used. And with our basic toolset and available settings, it's very easy to create one! ⬇️ CHAPTERS & INSTRUCTIONS ⬇️ 0:03 | Creating diagrams using basic tools - Select one of the available shape tools in...
💡 How to work with TEXT TOOL in Excalidraw 👀 | TUTORIAL #4
Переглядів 5 тис.6 місяців тому
Mini-tutorial #4 in our series focuses on the text tool - the essential tool for anotating your objects, explaining things with words or making notes. Check out this tutorial to find out all the ways for creating text in Excalidraw! ⬇️ CHAPTERS & INSTRUCTIONS ⬇️ 0:03 | Creating separate text (with text tool) - Select the Text tool in the toolbar at the top of the editor (or press the 8 key on y...
💡 How to work with LINE TOOL in Excalidraw 👀 | TUTORIAL #3
Переглядів 3,1 тис.9 місяців тому
💡 How to work with LINE TOOL in Excalidraw 👀 | TUTORIAL #3
💡 How to create ARROWS in Excalidraw 👀 | Step-by-step TUTORIAL #2
Переглядів 4,2 тис.9 місяців тому
💡 How to create ARROWS in Excalidraw 👀 | Step-by-step TUTORIAL #2
💡 How to create BASIC SHAPES in Excalidraw 👀 | TUTORIAL #1
Переглядів 3,7 тис.10 місяців тому
💡 How to create BASIC SHAPES in Excalidraw 👀 | TUTORIAL #1
Introducing Our New Logo | Excalidraw
Переглядів 86410 місяців тому
Introducing Our New Logo | Excalidraw
Please create a layer feature that can draw text or lines on top of an mp4 or gif.
Can you make an animation in excalidraw? I want to make animated home page in excalidraw.
No, you currently can’t.
How do you convert to multi point on mobile ?
Long tap on a two point line -> Edit line 😊
@@excalidraw Thanks
How i can change the next slide animation. In Obsidian there is path that we follow is there something like that in the browser ?
The animation works with the layout of the slides on the screen + the order of the slides in the sidebar of the presentation. So if you want to have a specific animation movement, you need to position the slides to support that movement.
how do you make the text on top/outside of the diagram and not center/inside?
If you mean to add it as a bound text, but outside the shape, that's not possible at the moment. You can just create the text outside and maybe group it together with the shape (cmd/ctrl+G).
Sorry how can i add libraries to excalidraw inside obsidian app please?
To install libraries in Obsidian you'll have to download the library file (instead of clicking on 'add to Excalidraw'), and then open it by clicking on the `...` in the library sidebar.
For anyone wondering like me how to easily duplicate selected objects, hold Alt Button and drag the object/text.
Or Cmd/Ctrl+D!
Muito obrigado. Essa função poderá chegar no excalidraw obsidian?
Hey! Obsidian plugin should have this option (but you have to use a script for this). However, this integration is not our work, so we can’t give you a proper advice and you either have to ask the creator directly or look for more info here on UA-cam. You can also use our Discord server (discord.gg/8yuXRk9V), where we have a dedicated channel just for Obsidian, which is managed by Zsolt (the creator of the integration).
@@excalidraw Thanks!!
Awesome tutorial. However, a voice-over would've been a nicer demo. ✌
Yep, voiceovers are definitely planned for the future, once we get everything set up 💪
What’s about search by elements which already added to the library? Are going to add it ?
Yes!
Can you make free hand draw tool more slim
It’s planned for the future, please bear with us in a meantime 🙌
@@excalidraw I mean hand writing is really hard to do with stylus because of ink being so thick.
Yep, we're aware of that. Just too busy with other tasks at the moment, but we're slowly working on improving the overall UX on mobile devices.
best tool i've found in awhile.
Love to hear that ❤️
I am afraid the broken-line drawing is not intuitive for me. Perhaps it is because I work from a keyboard without a mouse (laptop). When I do one click at the end of the line (the first vertex), the line tool is deselected and then if I click at another vertex in the plane, no line is drawn. Perhaps I have to clik at a key to keep the line tool selected while selecting other vertexes ? As soon as the 3 points appear on the segment, I cannot draw the multi-point broken line.
Hey! We're not quite sure what you mean. Could you please send us more details (ideally with a recording of what you are doing) to support@excalidraw.com so we can take a proper look? Thank you!
@@excalidraw It is strange, I have just discovered that I should click on the locker in order to draw the broken-line with the tool straight-line (on a Mac). I am sorry, but I am slow in discovering the good combination of keys/options. Thanks you anyway !
I'm completely sold on this now that I know about grid mode. Thanks for these great tutorials. The bonus sections are much appreciated 💡
Love to hear that! ❤️
Nice tool! I copied some data from MS Excel, and when I pasted it on Excali, it transformed the data somehow. It doesn't look like a linear regression anymore; it looks more like an exponential function.
Hmm, can you send us an example of what it looks like to support@excalidraw.com? 🧐
How did you make the zig zag line with the arrows. Is it with a key combination? I tried all that but not working. Please help. Captions would have helped since the videos don't have sounds.
Hi David, for this reason there are actually written instructions in the video description. :) But if you mean a multi-point arrow, you can do it simply by clicking on the canvas instead of dragging. Then each click creates a separate arrow vertex.
@@excalidraw Thanks, that was cool and easy too. 😂
The secret is to not hold the mouse button while dragging the line. Select the Arrow tool, click on the canvas where you want the arrow to start, release the mouse button and the line would just follow the mouse pointer. Simply click the points on the canvas where you want to introduce a separate arrow vertex and finally press Esc. to end the arrow.
@@sayantanmanna1360 Thanks for the useful tip.
@@samersammour6801 glad it helped
i have excali on Obsidian.. anywya to change font?? i dont mind the OG font it comes with but its too "much" imo
Obsidian integration is not our work, so we can’t give you a proper advice and you have to ask the creator directly. You can do so on our Discord server (discord.gg/8yuXRk9V), where we have a dedicated channel just for Obsidian, which is managed by Zsolt (the creator of the plugin).
Excalidraw rocks!
How can i add the new logo before the excalidraw file names in obsidian?
Honestly, I'm not sure what you mean. Like adding a logo in the form of an icon to the filename?
Fruit Ninja
Yass! 🔥
I am unable to draw a curved arrow using macbook trackpad. how to do it . thanks.
Hello, in order to create a curve, you first need to create a multi-point arrow (or line). Once you've done that, you can set the edges in the preferences panel on the left to the round option. Check out the tutorial for how to create arrows here: ua-cam.com/video/XW2ydQLKM6I/v-deo.html
@@excalidraw Thanks. Actually posted wrong question. I would like to draw a zigzag arrow. How to do that in macbook using its trackpad. I saw you tutorial, but I am unable to do so.
It's basically the same as with a mouse, but you have to use the bottom left side of the trackpad to click. So you click on the canva, move to where you want the next vertex, click again, and repeat this process until the desired shape is complete. Then press the Escape key to finish creating the arrow. The only difference between a single line/arrow and a multi-point line/arrow is that with a single arrow you will be dragging from one point to another. However, you have to click (not drag) to create a complex line/arrow.
I'm trying to write on pdfs in portrait mode.... is it possible to move the stroke box?
I'm not sure what you mean by "stroke box". The preferences panel on the left?
Thanks for the Demonstration,if we could actually straighten the arrowhead lines automatically,it would be amazing 7:23 🙏👌
You mean like having automatically arrows with 90 degrees when switching to straight edges?
Is it possible to use a table with more than two columns? For example to show a simple cost vs revenue line graph over time?
Not at the moment, but we definitely plan to improve this feature in the future! 🙏
Why does breaking text with enter not work in Logseq with embedded Excalidraw?
It’s hard to say. Can you please send us more details about it at support@excalidraw.com? 🙏
@@excalidrawThere isn't much I can say. I try hitting enter and it does nothing. Shift+Enter also does nothing. I recall it working when I started using Logseq. I love your software by the way.
@supernova6553 Unclear what is going on in Logseq. We'd recommend raising an issue/bug report with them. If it turns out it's an issue we can fix ourselves, they'll let us know! 🙏
Nice
Hope there’s official Chinese font support
We would love to have it! Just can’t tell when now.
This looks amazing! Where I can find those icon? Which library?
Thank you! 🙏 Either look for the Basic Wireframing/UX elements or use this link: libraries.excalidraw.com/?theme=light&sort=default#gabrielamacakova-basic-ux-wireframing-elements
really is such a nice diagrammer
Thanks! ❤️
I love this s2
🫶
Thanks! This helped out heaps.
We love to hear that!
Didn't even know you can do this thank you for showcasing this.
You’re welcome, and there’s more coming! 💪
Very useful
This tool is amazing, but I wish you could draw both round edges and sharp edges in the same line as you can do with the pen tool from illustrator.
Hey. This is actually coming! You can try here (double click a point to switch): excalidraw-git-multi-curve-paths-excalidraw.vercel.app
@@excalidraw Yes that is exactly what I was looking for. Thank you excalidraw team
@@excalidraw Btw not related to the line tool but I was curious if the layer feature from photoshop is also under the roadmap?
@@Hi-sc1dw not on the current roadmap. We're thinking it might be a too complex feature for Excalidraw.
@@excalidraw I think layers could be a great feature. For example, we can use layer 1 as the diagram and layer 2 for extra information and annotations on the diagram and then if needed we can hide layer 2 for presentation purposes. Would love if this feature can become a thing in future.
Interesting