Small Diagrams + Text

[colah]

One nice trick that might be helpful in this article -- especially in the "Preamble" section, due to its two dimensional nature -- is combining some of the text with small diagrams.

Below, I've included a few examples I threw together really quickly. Please don't take them too seriously. They're just there to stimulate discussion. You could do the illustrations in lots of different ways! And you should probably sharpen the text a bit if you want to do this -- this kind of illustration works best if you can use sharp concise prose to accompany the diagrams.

Example: Effect of angle on adversarial examples

The effect of angle on adversarial examples (in a few different styles):

Example: Construction of adversarial examples

Not sure that this is really necessary as a standalone diagram but it gives an idea:

Benefits

• The integrated diagrams can make a point easier to understand.

• It can make the reader more comfortable pausing to think. Mathematical texts often require you to pause and think about an equation. Many readers -- especially those who haven't studied advanced math/CS/etc -- aren't comfortable with this and will just keep going. A diagram gives them "permission" to think.

• It can emphasize points, making them stick in peoples heads.

[thomas-tanay]

I like this idea and will try to add more diagrams (I like the "construction of adversarial examples" one for instance). Do you recommend a specific tool for the creation of these diagrams? (I've been using d3 so far but wasn't very efficient at it)

[colah]

I usually use Adobe Illustrator or Inkscape (free) for static diagrams, but any vector graphics tool would work. (Figma looks cool and I've been meaning to try it.) These tools have a steep learning curve, but really powerful once you're used to them. :)

One challenge is that you'll want to have consistent style between your interactive diagrams and your static diagrams. It will just look weird if they're different. For that, it might be best to wait until we've really pinned down one diagram, then grab the SVG produced by D3 and import it into the tool your using for static diagrams... Or just carefully mimic its style.

[colah]

There's some lovely examples of this in Gabriel's momentum article. For example:

Some related techniques are integrating text into diagrams (example) and integrating text into equations (example).

(Again, these are all just tools for you to use if you feel like it. Please don't feel like you have to!)