Add Jordan's Spago flowchart for visual overview of workflow

CHANGELOG.md

@@ -9,6 +9,9 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 Bugfixes:
 - Report all missing packages together (#223)
 
+Other Improvements:
+- Added visual overview of what Spago does "under the hood" in typical project workflow (#211)
+
 ## [0.8.4] - 2019-06-11
 
 New features:

CONTRIBUTING.md

@@ -54,6 +54,18 @@ If you edit any title in the readme, run `doctoc` to update the Table of Content
 doctoc --notitle README.md
 ```
 
+If you want to contribute new or edit existing flowcharts, download [yEd](https://www.yworks.com/products/yed), use that program to edit the `.graphml` files, and then export them as an SVG or PNG file via the <kbd>CTRL+E</kbd> shortcut. When a dialog box appears, just press 'ok' and use the default export settings.
+
+The following are recommendations to make using `yEd` easier/faster:
+- In the 'Preferences' dialog
+    - Under the 'General' tab, change the "Mouse Wheel Behavior" to "[Wheel] Up/Down, [Shift+Wheel] Left/Right, [Ctrl+Wheel] In/Out"
+    - Under the 'Editor' tab, check the "Create Node on background click" box
+    - Under the 'Editor' tab, check the "Edit Label on Create Node" box
+    - Under the 'Editor' tab, check the "Dynamically Adjust Node Size to Label Size" box
+- Click on an edge between two nodes...
+    - ... and press <kbd>F2</kbd> to add text to that edge
+    - ... and press <kbd>F6</kbd> to edit its properties. Under the 'Label' tab, change the "Placement"'s "Model" dropdown to "Free" to get full control over where the edge's text can appear.
+
 ## Running tests
 
 The CI runs the tests on new pull requests, so it's not possible to merge a change without them passing.

README.md

@@ -49,6 +49,7 @@ PureScript package manager and build tool powered by [Dhall][dhall] and
   - [Know what `purs` commands are run under the hood](#know-what-purs-commands-are-run-under-the-hood)
   - [Ignore or update the global cache](#ignore-or-update-the-global-cache)
 - [Explanations](#explanations)
+  - [Visual Overview: What happens when you do 'spago build'?](#visual-overview-what-happens-when-you-do-spago-build)
   - [Configuration file format](#configuration-file-format)
   - [Why can't `spago` also install my npm dependencies?](#why-cant-spago-also-install-my-npm-dependencies)
   - [Why we don't resolve JS dependencies when bundling, and how to do it](#why-we-dont-resolve-js-dependencies-when-bundling-and-how-to-do-it)
@@ -780,6 +781,10 @@ that is accepted by many commands. You can either:
 
 ## Explanations
 
+### Visual Overview: What happens when you do 'spago build'?
+
+![spago-flowchart.svg](./diagrams/spago-flowchart.svg)
+
 ### Configuration file format
 
 It's indeed useful to know what's the format (or more precisely, the [Dhall][dhall]