Draw.io (aka diagrams.net) Basics

Поділитися
Вставка
  • Опубліковано 23 гру 2024

КОМЕНТАРІ • 147

  • @253637zero2
    @253637zero2 Рік тому +8

    Although this tutorial is 3 years old, nothing in this video is outdated. Very useful.

  • @BarryCraft
    @BarryCraft 4 роки тому +25

    WOW! You REALLY know this program! I did quite a bit of research to find a free online mind map / flow chart tool that had features I was looking for. When I found this tool, it looked a little intimidating, but you have really covered the basics extremely well I will be referring to this video again for sure! Thank you for taking the time to share this.

    • @Abdullah-mg5zl
      @Abdullah-mg5zl  4 роки тому +2

      You're very welcome! You can't go wrong with choosing this tool! It has a lot more cooler/advanced features that I didn't even cover, in case you need them in the future. I think the program does a very good job of being relatively easy to use, but having advanced features if you need them.

    • @darren6202
      @darren6202 2 роки тому

      @@Abdullah-mg5zl Its not a compliment - Barry is extracting the urine. This video didnt solve the question I had over connectors. How do you make a connector cross ontop of or underneath another connector using a loop for example?

  • @zabiullat4584
    @zabiullat4584 2 роки тому +1

    Its very informative video and made my life easy. As I was searching for this tool for long time.

  • @faisalrahman327
    @faisalrahman327 7 місяців тому

    Thanks you for explaining this with all the micro details.

  • @HansvanDam1944
    @HansvanDam1944 4 роки тому +2

    Very good basic explanation. Thanks a lot.

  • @pvk3103
    @pvk3103 3 роки тому +1

    Awesome. Excellent. Made my life is easy.

  • @DonnaFranklin-l8c
    @DonnaFranklin-l8c 9 місяців тому

    Abdullah can you help me please? I cant seem to export to a 1 page pdf. My download is spread across 6 pages. thanks

  • @zenganow
    @zenganow 2 роки тому

    great video. dow do you number the shapes?

    • @Abdullah-mg5zl
      @Abdullah-mg5zl  2 роки тому

      Can't you double click them and set the text to a number? Or am I misunderstanding your question?

  • @aunmanoi
    @aunmanoi 2 роки тому

    Can we add text on both end of line? , Such as we have 2 connectted cable and want to mark up port name on both side.

  • @hammarahma3218
    @hammarahma3218 4 роки тому +1

    hello,i made a use case diagram and wanted to export it as pdf but because of these waypoint lignes my diagram was on 18 pages instaid of one, how can i remove the waypoint or how can i adjust my diagram to fit into only one page

    • @sherinadauz8810
      @sherinadauz8810 4 роки тому

      This is exactly my problem please answer this please

  • @bivek_shiwakoti
    @bivek_shiwakoti 5 місяців тому

    Loved this tutorial my man🎉

  • @nabis2424
    @nabis2424 Рік тому +1

    Thank you! Just discovered this today!

  • @jonlbs7
    @jonlbs7 3 роки тому

    Absolute EXCELLENT tutorial. Thank you and Lord bless you

  • @penriquez99
    @penriquez99 4 роки тому +1

    hi, I created a file but there are 3 pages ( 2 of them empty) - I did not know how to erase them . When I converted to pdf the empty pages are there... please help. This is a great tool Thanks for your guidance.

    • @Abdullah-mg5zl
      @Abdullah-mg5zl  4 роки тому +2

      Hello!
      1) Try to enable "page view" (check the checkbox on the right). And then make sure all ur drawings are on one page
      2) Did you export via File->Export As->PDF or some other way?
      Usually if you have multiple pages, it's because you have some invisible object in some other pages or something like that. Try to copy your shapes to another instance of draw.io and see if that helps.

  • @PurplePixi77
    @PurplePixi77 3 роки тому

    Great video. It's so helpful for my school assignment. Thanks

  • @bassinguilly
    @bassinguilly 4 роки тому +1

    Can you have a multiple page diagram/flowchart?

    • @Abdullah-mg5zl
      @Abdullah-mg5zl  4 роки тому

      Yes, you can. New pages are added automatically to fit your drawing.
      Also, look on the bottom, you have multiple "tabs". You can create new tabs for new drawings, in the same document.

  • @SIDCRZ
    @SIDCRZ 4 роки тому +1

    i have one question, i can't find the widht and height setting. can you tell me?, because when i export it, the result cropped

    • @Abdullah-mg5zl
      @Abdullah-mg5zl  4 роки тому

      It shouldn't be cropped..., you can put in a "border" value when you export, try that.

    • @SIDCRZ
      @SIDCRZ 4 роки тому

      @@Abdullah-mg5zl ok, thank you man

  • @yedlapalliphani4631
    @yedlapalliphani4631 4 роки тому +1

    How can I wraw bell shaped curve(Normal curve ) by using Draw.IO

    • @Abdullah-mg5zl
      @Abdullah-mg5zl  4 роки тому

      I don't think you can do that, it's not a plotting (graphing) library. You can use a Computer Algebra System like sympy (python module) or wolfram alpha to plot symbolic equations. You can use tools like excel, etc if you just want to plot some x,y points. Then you can just screenshot the plot into draw.io :)

  • @metime2406
    @metime2406 3 роки тому

    Thank you so much Abdullah. Your video saved me a lot of time, very helpful!

  • @333tuberob
    @333tuberob 4 роки тому +1

    Very useful - saved me a lot of time

  • @ChandraShekhar-by3cd
    @ChandraShekhar-by3cd 4 роки тому +1

    Nice tutorial. Thanks it made it easy to use this tool

  • @blessyponnachen9528
    @blessyponnachen9528 2 роки тому

    What to do if I want to change the shape of already inserted shape ?

    • @Abdullah-mg5zl
      @Abdullah-mg5zl  2 роки тому

      Copy your old text, delete the shape, insert new shape, paste new text onto shape :)

  • @anarosmanov2200
    @anarosmanov2200 3 роки тому

    Can we show data types in table? Like varchar,nvarchar

  • @RKGraves
    @RKGraves 2 роки тому

    Thank You! Great Tutorial - I appreciate you took the time to make it.

  • @sathishshetty9371
    @sathishshetty9371 3 роки тому

    When I double click text , in the box text was written in by default I can't change that . Please help me

    • @Abdullah-mg5zl
      @Abdullah-mg5zl  3 роки тому

      Select the text and start typing. Does that work?

    • @sathishshetty9371
      @sathishshetty9371 3 роки тому

      @@Abdullah-mg5zl yes that works but before what we typing "text" is written there

  • @zaheemschemnad5377
    @zaheemschemnad5377 3 роки тому

    1 parent box and 5 child box, how to do it?

  • @user-jp4bj8xe4f
    @user-jp4bj8xe4f 4 роки тому +1

    Can I add pictures?

    • @Abdullah-mg5zl
      @Abdullah-mg5zl  4 роки тому

      Yes! Just drag the picture in. Or you can copy/paste it in.

  • @gumballdarwin6572
    @gumballdarwin6572 3 роки тому +1

    Thanks for simple explanation. 👍

  • @Spidz2k
    @Spidz2k 4 роки тому +6

    This was incredibly helpful, thank you!

  • @akshaynm
    @akshaynm 4 роки тому +4

    Hello Abdullah, Many thanks for the comprehensive tutorial. Just having one question. How can we add animated shapes in to the drawings? For example. Hiding un-hiding any objects or lines on clicks ?

    • @Abdullah-mg5zl
      @Abdullah-mg5zl  4 роки тому +3

      Hey Akshay! I think you meant "interactive" shapes. You can do that by using what is called "actions". Every shape that you draw in draw.io has an associated id. Every shape also has a "link". The link can be to a webpage, or it can be an "action". An "action" can be things like showing/hiding another shape! That's the concept. This page walks you through how to actually do it:
      www.diagrams.net/doc/faq/custom-links
      Be sure to read the last sentence in that page, as it gives you a tool to make creating actions much easier.

    • @akshaynm
      @akshaynm 4 роки тому +1

      @@Abdullah-mg5zl Thanks a lot Abdullah. I will surely try that and will get back on the results. Many thanks again...!

    • @Abdullah-mg5zl
      @Abdullah-mg5zl  4 роки тому

      @@akshaynm not a problem!

  • @gemmaclarke9463
    @gemmaclarke9463 2 роки тому

    I'm trying to create a swim lane diagram but I'm not sure how I should represent an activity that two teams (lanes) both do together? What is the correct way to show that?

    • @Abdullah-mg5zl
      @Abdullah-mg5zl  2 роки тому

      Unfortunately, I'm not familiar with that diagram! Sorry!

    • @gemmaclarke9463
      @gemmaclarke9463 2 роки тому

      @@Abdullah-mg5zl no worries, in the end I just placed the output across the swimlane line with the flow arrows from both lanes pointing to it.

  • @benjamjohn9690
    @benjamjohn9690 4 роки тому +2

    Hi Abdullah great content. I learn a lot. I have one question. Quite often When I click the background a text box is created automatically. Is there a way to disable it.?

    • @Abdullah-mg5zl
      @Abdullah-mg5zl  4 роки тому

      Hello! You should have to *double* click to create a text box, not single click. This behavior isn't too annoying to me, and I don't know of a way to turn it off unfortunately.

  • @manuthada9392
    @manuthada9392 3 роки тому

    Thanks for this helpful video but I wonder how to download the edited version diagram from this dash board?

    • @Abdullah-mg5zl
      @Abdullah-mg5zl  3 роки тому +2

      When you export to PNG, there is an option to keep an editable version of the diagram INSIDE the PNG. In other words, you can use Draw.IO to open the same PNG and edit the diagram.

  • @princepcn6909
    @princepcn6909 2 роки тому

    it was worth the time. Thanks for the video

  • @sechabamotaung8552
    @sechabamotaung8552 3 роки тому +1

    Thank you, great simple video.

  • @nathaliestruve1742
    @nathaliestruve1742 3 роки тому +1

    You helped me a lot with this tutorial. Thanks a lot!

  • @jfarr206
    @jfarr206 3 роки тому +2

    Fantastic- thank you!

  • @sonu1patel
    @sonu1patel 3 роки тому

    How do you get arrow with yes /no text

    • @Abdullah-mg5zl
      @Abdullah-mg5zl  3 роки тому

      Any shape can have text added to it by double clicking the drawn shape and then typing.
      So first draw an arrow shape (select it from the shapes library on the left), then double click it and type yes/no.

  • @zachthomas3908
    @zachthomas3908 4 роки тому +2

    this is a fabulous tutorial! thanks!

  • @zahrasiddiqui1313
    @zahrasiddiqui1313 3 роки тому

    Thank you for the very helpful video. Does anyone know if draw.io can sync up with referencing software like endnote/zotero?

    • @Abdullah-mg5zl
      @Abdullah-mg5zl  3 роки тому

      No problem. And unfortunately, I don't have an answer for your question, maybe someone else can chime in

  • @Esem854
    @Esem854 4 роки тому +1

    Hi Abdullah, Thank you for this great video, helped alot. However, i have a question please. How do you connect the diagram using a double connected arrow, the ones listed are too wide for my diagram, i need a slim one but cant seem to find it. I will appreciate it if you could help please. Thank you again

    • @Abdullah-mg5zl
      @Abdullah-mg5zl  4 роки тому +2

      Hello! Thank you! First create a regular arrow, then select it, then on the right panel there are two drop downs which control the start and end of the line. The end should by default be an arrowhead. Click the start one and select an arrow head for the start as well :)

    • @Esem854
      @Esem854 4 роки тому +2

      @@Abdullah-mg5zl You are awesome, you just solved a problem in seconds i have spent hours trying to figure out. Thank you so much Abdullah, it really worked.

    • @Abdullah-mg5zl
      @Abdullah-mg5zl  4 роки тому +1

      @@Esem854 You are very welcome! Thanks so much for the kind words, I appreciate it! I hope you have a fantastic week!

  • @geangelai8052
    @geangelai8052 3 роки тому

    I Hope this can be link also in Google sheet

  • @atuljain9887
    @atuljain9887 2 роки тому

    very clear description

  • @aletheagallacher4265
    @aletheagallacher4265 4 роки тому +1

    Very helpful indeed! Thanks.

  • @blushandrush9584
    @blushandrush9584 2 роки тому

    thanks a lot for this great intro to draw io. It helps a lot :)

  • @daniahmohammad6101
    @daniahmohammad6101 3 роки тому

    Man, you are just amazing

  • @LearningToCodeAndDesign
    @LearningToCodeAndDesign 2 роки тому

    This was very helpful. Thank you so much!

    • @Abdullah-mg5zl
      @Abdullah-mg5zl  2 роки тому

      You're very welcome! Super glad it helped ya

  • @shinsuo9943
    @shinsuo9943 3 роки тому +1

    Well explained my friend

  • @hymapolimera1622
    @hymapolimera1622 4 роки тому +2

    very useful video. Thanks a lot

    • @Abdullah-mg5zl
      @Abdullah-mg5zl  4 роки тому

      Not a problem! Thanks for watching and have a great weekend!

  • @Julian-tf8nj
    @Julian-tf8nj 4 роки тому +1

    Super helpful - thanks!!

  • @SohangLal
    @SohangLal 4 роки тому +2

    Excellent Intro

  • @vamicagarg7118
    @vamicagarg7118 4 роки тому +2

    amazing video,was really helpful

    • @Abdullah-mg5zl
      @Abdullah-mg5zl  4 роки тому

      Thank you! I'm glad you found it helpful! Have a great weekend!

  • @zincfive
    @zincfive 2 роки тому

    Nice video, very helpful, thanks!

  • @UniqueAB247
    @UniqueAB247 6 місяців тому

    Cool. Nice tutorial.

  • @amumpairejane4436
    @amumpairejane4436 Рік тому

    Very useful video thanks❤

  • @jackli9837
    @jackli9837 3 роки тому +1

    谢谢你的视频,帮助很大

  • @sonunitjsr223
    @sonunitjsr223 4 роки тому +2

    This is helpful. Thank you for the video

  • @cliffmathew
    @cliffmathew Рік тому

    Thank you. Very useful

  • @dlsgl407
    @dlsgl407 3 роки тому

    Thank you this was very helpful.

  • @danieluwira4990
    @danieluwira4990 3 роки тому

    Great tutorial. Thank you!

  • @sardorabdirayimov
    @sardorabdirayimov 2 роки тому

    Great tutorial. Subscribed

  • @required.
    @required. Рік тому

    thank for the awesome video

  • @mnchester
    @mnchester 3 роки тому

    great video!

  • @aykutyldz1538
    @aykutyldz1538 4 роки тому +2

    thank you very much it was so useful

  • @원형석-k3f
    @원형석-k3f 4 роки тому +2

    Thanks a lot!

  • @nehamarothiya4073
    @nehamarothiya4073 4 роки тому +1

    Thank you so much ✌🏻

  • @kevinjoshi96
    @kevinjoshi96 2 роки тому

    nice ....very helpful

  • @explain_in_urdu
    @explain_in_urdu 3 роки тому

    show loading

  • @AhmedEzzat-si5ri
    @AhmedEzzat-si5ri 3 роки тому +1

    Thank a million :)

  • @whynotorwhy
    @whynotorwhy 3 роки тому +1

    Thank You

  • @ravingagunawardana178
    @ravingagunawardana178 3 роки тому +1

    Thanks!

  • @Malpekar-mo4wb
    @Malpekar-mo4wb 8 місяців тому

    Nice one

  • @ameerm7894
    @ameerm7894 2 роки тому

    Superb

  • @mohammedessam581
    @mohammedessam581 12 днів тому

    awesome

  • @imnot4chriss
    @imnot4chriss 4 роки тому +1

    ITS CALLED DRAW.IO NOT SHAPE.IO IM HERE TO "DRAWWWW"

  • @mikeswinxx
    @mikeswinxx Рік тому +1

    Play around with it a few minutes and theres no need to watch a 20min tut...

  • @Christobanistan
    @Christobanistan 3 роки тому

    Buy a mic

  • @andl645
    @andl645 2 роки тому

    Thanks a lot!