Ask HN: A modern-looking UML diagram tool? | Hacker News Reader

Ask HN: A modern-looking UML diagram tool?

223 pointsfaizshah89 comments

Hi HN,

I've been going back to UML to try to tame some of my design/notes for my projects. Is there something that generates some more modern looking UML diagrams out there?

View on HN

I use PlantUML[1] for my UML diagrams.

  - It uses a human readable text-based file format renderable via the PlantUML jar. Friendly to CLI and git.
  - The diagrams are stylable, should you wish to style them. 
  - There's a PlantUML Integration IntelliJ plugin that's easy to use for preview/rendering[2]
  - Overall simple to use, but I imagine it can as robust as you want it to be. For example, the IntelliJ plugin Sketch.it automatically generates PlantUML diagrams from Java source code[3], and the source code for how it works is available on BitBucket if you want to know how it works[4]

I've seen other people suggest Mermaid.JS[5] before, but I haven't used it so I can't say how it is.

  [1]: http://plantuml.com
  [2]: https://plugins.jetbrains.com/plugin/7017-plantuml-integration/
  [3]: https://plugins.jetbrains.com/plugin/10387-sketch-it-
  [4]: https://bitbucket.org/pmesmeur/sketch.it/src/develop/
  [5]: https://mermaidjs.github.io

If you're going to monospace lists (why?) please format them to remove the horizontal scroll bar.

Edited to remove example that still produces scroll bar on non-maximized windows (and mobile).

Haha I'm on mobile, so you'd need to do 4 words per line

The PlantUML Website used to look like you were about to download a whole bunch of malware into your computer, but the software is really great. Diagrams are simple text files that are then rendered by the tool. This frees you from having to drag and drop circles and arrows into an editor, and allows you to easily version-control your diagrams.

> There's a PlantUML Integration IntelliJ plugin that's easy to use for preview/rendering

The VSCode one[0] is good too

0 - https://marketplace.visualstudio.com/items?itemName=jebbs.pl...

Second PlantUML and Mermaid. Both work great in boostnote, which I also recommend.

plantuml is nice one. Works smoothly with VSCode extension. And wow, mermaid has gantt chart !

I also use Draw.io and recommend it highly. It's web-based, so it's also cross platform.

However, Lucidcharts has a better UI in that I can build diagrams after in LC than Draw.io. https://www.lucidchart.com/pages/

LC is paid if you need more than 1 chart (who doesn't?). But Draw.io is free. LC is also web-based and is cross-platform.

I've heard OmniGraffle is also excellent (never used it myself) but it only works on OSX/iOS: https://www.omnigroup.com/omnigraffle/

Can confirm that OmniGraffle is excellent. Downside is that after my departure from MacOSX towards Linux my diagrams are lost in the silo I created them in.

Since then using draw.io, yed and Inkscape.

My vote for Lucid, got my company to switch from Draw.io. Nearly everything works how I expect it to which is just not true when it comes to the other online diagram tools

+1 for lucid charts. I used the free trial a few years ago for a senior design class and was incredibly happy with it, which is saying a lot as I was consistently sleep deprived and irritated by most things at the time.

OmniGraffle is freaking amazing. If you're on a mac then RUN (don't walk) to grab a copy and try it out.

it's also SO much more than just UML. I have found SO many uses for it.

> OmniGraffle is freaking amazing.

On the whole I like OmniGraffle, but I _hate_ the curves that it draws. If I use it to make a diagram, I have to spend so much time making the curved lines between shapes not look like shit.

I enjoy using Mermaid: https://mermaidjs.github.io

It does not support all the diagrams yet, but it's completely themable and you can code away your diagrams like you would with dot/graphviz.

It integrates well into any Markdown tool, Gitlab integrated it about a year ago so it's natively available in Gitlab flavored Markdow.

Any comparisons of Mermaid vs other tools? Why do you like Mermaid?

I use Plantuml myself and I find that I regularly have to fight with the layout engine to get diagrams to looks the way I want them too.

Mermaid is a bit nicer than PlantUML in that it isn't a Java blob that spits out PNGs. Easier to integrate into web things. Also the default style is much nicer.

But I think PlantUML is more capable.

I've been using mermaid for almost 2 years now, great software and still improving. It's nice too that I can keep the code in a note and change in in meetings.

Honestly just change the default styling in PlantUML[1]. The default styling turns a lot of people off, which is a shame because it's a fantastic tool. Even the monochromatic skin is much easier on the eye. The real benefit to PlantUML is the ability to commit the source code for your diagrams alongside your actual source code.

[1]: http://plantuml.com/skinparam

A great example (and sort of a framework) of taking that way beyond is https://github.com/RicardoNiepel/C4-PlantUML

See also that repo with a skinparam for a "not ugly" plantuml style: https://github.com/matthewjosephtaylor/plantuml-style

For all sorts of diagrams, this software is awesome: yEd

https://www.yworks.com/products/yed

Favorite feature: automatically reorganize the chart according to your preferences/constraints (e.g. fewer line intersections, hub-spoke, hierarchical, etc)

Would like to second yed. I've been told that it feels a bit non-native outside Windows, but it's so fast to make diagrams with it, it's nuts.

It has some weird defaults though, eg the "create node on click" is weird. Turn that off :-)

It has lovely alignment features, making it super easy to make clear diagrams. It doesn't align things to a grid, but to surrounding nodes/edges in a really nice way. Try putting two nodes besides one another, and then a third one next to it. It'll auto-align the spacing so the three boxes are evenly spaced.

(yWorks employee and developer (though not on yEd) here.)

Thanks for the kind words. One note: yEd does have grid snapping (look for the grid-like icon in the toolbar or View > Grid). Personally, though, I rarely need the grid, as the normal snapping features work rather well for quickly making things line up or the same size. Also, automatic layout takes care of many alignment needs :-)

There's also Tools > Snap to Grid for a one-time grid snapping operation of everything (or a selection). Didn't even know that one existed until now.

Well aware, but like you said,you don't need the grid because the gridless snapping generally works even better.

Compliment the team for a great app! Inventing great UX isn't trivial and you guys aced it.

yEd isn't exactly modern-looking though. I've recently used it on Ubuntu 16.04 but my colleague on Ubuntu 18.04 couldn't because the menu or window handles were cut off. As IntelliJ shows, using Java/Swing is no excuse for an app to look like a Windows 3.1 app migrated over to Windows95. But then UML is from a time and mindset when win32-like and Java-like OOP and Hungary notation were sold to people and I guess a certain amount of retro design must feel authentic to UML.

(Disclaimer: yWorks employee and developer here)

We do have a more modern web-based graph editor: https://www.yworks.com/yed-live/ It may lack features you need, as the idea was a less cluttered and more modern UI, not to bring over everything and the kitchen sink.

As far as yEd Desktop goes, Java becomes an increasingly unattractive platform for desktop development, with Swing showing varying degrees of brokenness on different platforms and Java releases. The new hotness right now seems to be to either get working printing or working High-DPI support, but not both in the same Java release.

It's due for a minor UI overhaul, though, and this may come in the future. We probably cannot and won't completely restructure yEd's UI (such things also serve well to piss off long-time users).

If Java becomes increasingly unattractive, what are you eying as replacement? I won't defend Java/Swing, but at least it does HiDPI (in contrast to eg. JavaFX and RCP last I checked, even though printing is broken w/ HiDPI as you said). There aren't that many alternatives for cross-platform desktop apps (qtk comes to mind, but it's a rather big departure from Java I guess).

For us the most attractive option would probably be to wrap yEd Live in Electron. We're not a large team and rewriting yEd with something else is a major undertaking (especially for a tool given away for free). That makes it hard to justify development costs.

Personally, I'm still hoping for Microsoft to see the need for a good cross-platform managed-code UI toolkit. Perhaps they're open to funding or adopting Avalonia. But perhaps that's just me being open to rewriting an aging Java application in C# ;-)

Interesting. Btw I have an old half-finished Java Swing diagramming (not UML) app lying around waiting to see the light of the day in ... this millenium hopefully ;) Electron is surprisingly good-behaving and I get that it's of course attractive to develop mostly a web app that can also be deployed as desktop app, but isn't entirely without problems (for one, it isn't accepted in the App Store as it is). Things always look brighter on the other side of the fence, but throwing away your whole Java code base is kindof gross. Maybe we Java old schoolers could push JetBrains to open their Swing refactorings (of which I suppose there must be many) or sell their renovated Swing + Addons as a rich desktop appdev product. It's only in their best interest for Swing to have a future. And as IntelliJ shows, Swing isn't half bad a GUI toolkit in the hands of competent developers.

Not only IntelliJ, "Filthy Rich Clients" (http://filthyrichclients.org/) is a must read for anyone that cares about doing proper UIs in Swing.

And being aware of component libraries like JGoodies (http://www.jgoodies.com/).

The automatic rearrangement feature based on predefined layouts is incredibly useful. I strongly encourage people interested in this software to also read their blog. https://www.yworks.com/blog/projects-optical-graph-recogniti...

I also use yEd for UML and other related diagrams. As mentioned the auto-organization is great, and you can also separately re-route signals and labels.

I have used yEd for hardware diagrams as well, although I still haven't found a great way to draw out busses of signals between nodes (to be clear I haven't found anything besides manual drawing which works!)

There's a bus-like edge router under Layout > Edge Routing > Orthogonal / Bus-style. This may require some tweaking of the settings for your particular drawing. https://i.imgur.com/YV3NFAQ.png

Thanks for the tip! That looks good! After playing around I found what I was actually thinking about is called "channels" and it works well!

http://docs.yworks.com/yfiles/doc/developers-guide/figures/c...

For prettiness, Visio or OmniGraffle.

For shareable web editing, LucidChart or Draw.io.

For quick easy text markup, PlantUML or Mermaid.

I have not found any UML tool that's pretty, shareable, round-trippable, and has easy text markup.

Demo of PlantUML: https://github.com/joelparkerhenderson/demo_plantuml.

Can you elaborate "round-trippable"?

Not OP, but I'd say that it is in a text-ish format that can be fed into a generator that can turn the document into code. Some of these UML editors spit out a PNG, which is pretty but useless for code generation or automated use of the information.

You should really ask yourself why you're drawing UML diagrams at all.

You know, there are lots of people selling snake-oil, drawing boxes and arrows that make you feel good, but ultimately have no real meaning. If something is really meaningful you should be able to express it in mathematics. - Leslie Lamport

... via https://github.com/globalcitizen/taoup

If you need to visualize, take more precise states as a basis and take a look at graphviz[0]. If you need to model multi-agent systems, use mscgen[1] to draw Message Sequence Charts.

[0] https://graphviz.org/

[1] http://www.mcternan.me.uk/mscgen/

I'll second graphviz, aside from it's standalone strengths it integrates well with doxygen and the two combined make for some great documentation.

I use it for sequence charts as well by using sublabels (not sure what they're really called), usually I don't care so much about the sequence but where the choke points in this giant pile of steaming enterprise are:

  SomeObject[label="<someMethod1> someMethod1 | <someMethod2> someMethod2"];
  Foo -> SomeObject:someMethod2;

I have used UMLet since 2005. The diagrams won't win a beauty contest, but they are quick to edit and depict the necessary information. https://www.umlet.com/

From the UMLet web page:

> UMLet is a free, open-source UML tool with a simple user interface: draw UML diagrams fast, build sequence and activity diagrams from plain text, export diagrams to eps, pdf, jpg, svg, and clipboard, share diagrams using Eclipse, and create new, custom UML elements. UMLet runs stand-alone or as Eclipse plug-in on Windows, OS X and Linux.

UMLetino runs UMLet in a web browser. Refer to the UMLet FAQ and sample diagrams for help. http://www.umletino.com/umletino.html

I used successfully https://www.draw.io/ for my graduation paper's UML schemes and other additional explanatory graphics. Give it a try.

It's actually a good one, I'd recommend too

Depending on what you be are diagramming you might want to use the C4 Model ( https://c4model.com/) which often results in easier to understand diagrams. There is a PlantUML add on for it too: https://github.com/RicardoNiepel/C4-PlantUML

Also draw.io templates and a set of Visio templates ( https://github.com/pihalve/c4model-visio-stencil ) that can be imported into Lucidcharts as well. There is also some web based tools (see bottom of C4 website).

https://monodraw.helftone.com/ for MacOSX is great

I mostly use it to draw small diagrams for code comments if it makes things clearer but it's one of these small little macOS app gems.

A very small niche and well done as a beautiful native Mac app.

I love monodraw, but i don't know if it counts as "modern looking" Yes, the rendered versions of the output look reasonably good, but there are still some rough edges, like trying to create a "diamond" shape to put text in (typical decision point in flow chart) ends up with a HUGE diamond.

also, i see it as primarily useful for generating ASCII diagrams for inserting into source code or docs. If you don't care about that tools like OmniGraffle do a much better job.

And an absolute steal (for what is it) at the standard sale price.

There's quite a few. Obviously Visio is popular, on Linux I've used a tool called "Dia" (http://dia-installer.de/) there are several others, but these are my 2 go to tools for UML.

You might also like www.breakdown-notes.com. It is not as focused on diagrams as draw.io (and others), but is rather nice if you want to make something inbetween notes and diagrams. (so I say as the owner of breakdown-notes).

http://www.breakdown-notes.com

It would help this discussion if people made a distinction between software that creates diagrams from version-controlled code (e.g. PlantUML, MermaidJS), and software that just creates diagrams.

Have you seen Kumu? https://kumu.io

It doesn't support standard UML diagrams but between sketch mode [1] [2] and icons [3] you may be pleasantly surprised. I personally use it to map out Kumu's own internal application structure and flows.

Full disclosure: I am the lead developer and cofounder of Kumu.

[1]: https://www.youtube.com/watch?v=wX3kbCyOamQ (Gene Bellinger's intro to Kumu's sketch mode)

[2]: https://www.youtube.com/watch?v=AFOz67co0yA (Benjamin Mosior sketching wardley maps in Kumu)

[3]: https://docs.kumu.io/guides/icons.html (Kumu docs on Font Awesome support)

If enough people are interested I'm happy to do a webinar specifically for the HN crowd and do a deep dive on the technicals. Built on top of CouchDB and pretty neat stack overall.

nomnoml: A tool for drawing sassy UML diagrams based on syntax. Provides instant feedback and has a customizable styling.

web: http://www.nomnoml.com/

js: https://github.com/skanaar/nomnoml

r: https://github.com/javierluraschi/nomnoml

Thanks, Visually nomnoml is pretty sweet. That being said, syntax-wise the class diagrams from Mermaid seem way easier to read.

Specifically for sequence diagrams:

https://sequencediagram.org/

Whimsical might be helpful, though you can’t do the special UML arrows on there.

https://whimsical.com/

Here is a link to a few UML diagramming tool, check them out, might find the one you are looking for.

UML Diagramming Software for Windows: https://www.ilovefreesoftware.com/29/featured/free-uml-desig...

Online UML Digaramming Tools: https://www.ilovefreesoftware.com/22/webware/free-websites-t...

Well, http://plantuml.com/en/ is, imo, the most efficient and maintenable way to produce UML diagram

I use lucidchart for most diagramming. There's a free clone, draw.io, which is also pretty good if you need more objects but don't want to pay out for an account on lucidchart.

PowerPoint , I often use animations to explain complex diagrams.

I second this. I have used PowerPoint for some very complex architectural diagrams and transitions over time and it has been a great tool. Definitely not perfect, but is pretty fun to use most of the time.

The best free tool I've used is Draw.io[1], can create diagrams online or offline and has nice integrations with things like OwnCloud.

If you don't mind paying for something and want something that looks great visually, I would recommend Lucid Chart [2]

[1]: https://draw.io

[2]: https://www.lucidchart.com

Check out blockdiag tools, http://blockdiag.com/en/

For windows 10 you have the WhiteStarUML[1], but is not updated since March/2018. You can get and idea of the interface and check if the UML fits your definition of "modern looking".

[1] https://sourceforge.net/projects/whitestaruml/

StarUML is good although its built on Electron

I came across a recent blog post[1], that mentioned some text-to-diagram tools, out of which I liked Gleek.io and nomnoml in particular.

[1] https://avdi.codes/tools-for-turning-descriptions-into-diagr...

You could use GoJS to make one: https://gojs.net/latest/index.html

(I make GoJS, a diagramming library, but it presumes nothing about "looks", which can be modified arbitrarily)

I used visual paradigm few years back. It was really good. https://en.m.wikipedia.org/wiki/Visual_Paradigm

Sometimes PlantUML for rather simple diagrams.

For more advanced diagrams I use Enterprise Architect (https://www.sparxsystems.eu/).

What language do you use?

And what for do you need UML (and what type diagrams)?

For example, IDEA products for Java has some tools for class diagrams

MS visio is nice too as tool for just painting UML

But main problem with UML - synchronization with code base

I really wish to find some tool to replace Enterprise Architect that runs, unfortunately, only in Windows. For me is really important traceability, starting from the requirements.

Monodraw[0] is great for diagrams and general note taking.

[0] https://monodraw.helftone.com/

i just use inkscape

I do too, it’s quite easy to produce diagrams that look better than any modern diagram too. And things look exactly as you want.

Draw.io got completely open sourced a few days back, so now there's no stopping you for adding any features you want either.

http://staruml.io/

hi there,

  draw.io is a free tool both available online at https://www.draw.io/ or you can download a desktop version from https://github.com/jgraph/drawio-desktop/releases. Quite fast and good.

I use https://yuml.me

i've being using https://online.visual-paradigm.com/ for a while now, and am quite happy with it.

Check out Visual Paradigm, they come now with a Web UI too

You can create diagram from plain text https://ivanceras.github.io/svgbob-editor/

I use Google drawings extensively

Software Ideas Modeler works nice

graphviz can be modern looking, you just have to select some styling on your diagram

Figma

yEd with custom palettes, anyone?

Reply on news.ycombinator.com