diff --git a/web-interface/static/css/main.css b/web-interface/static/css/main.css
index e3e2e55..56f7983 100755
--- a/web-interface/static/css/main.css
+++ b/web-interface/static/css/main.css
@@ -1,5 +1,5 @@
 body{
-	background-color: #a6e89d;
+	background-color: #dcb0de;
 	margin: 1vh 5vw 2vh 5vw;
 	z-index: 1;
 }
@@ -13,17 +13,21 @@ div#nav{
 	z-index: 999;
 }
 	div#nav a#home,
-	div#nav span#loading,
-	div#nav a#update{
+	div#nav a#notes{
 		float: left;
-		padding-right: 0.25em;
+		padding: 0.25em 0.125em;
 	}
-	div#nav span#loading{
+	div#nav div#loading{
 		display: none;
-		margin: 0.35em 0.25em;
-		color: fuchsia;
-    	opacity: 0;
-    	animation: fade 2s linear;
+		margin: 0.35em 0;
+		color: black;
+		clear: both;
+		float: right;
+		background-color: white;
+		padding: 0.5em 1em;
+		border-radius: 5px;
+    		opacity: 0;
+    		animation: fade 2s infinite linear;
 	}
 	@keyframes fade {
 		0%,100% { opacity: 0 }
@@ -32,13 +36,21 @@ div#nav{
 iframe{
 	width: 90vw;
 	height: 88vh;
+	margin-top: 4em;
 }
 input{
 	min-width: 300px;
 }
+div#index{
+	line-height: 2;
+}
+div#index img{
+	max-width: 100%;
+	margin: 1em 0;
+}
 div#index ul{
 	padding: 0;
-	margin: 0 0 0 5em;
+	margin: 0 0 0 2.5em;
 	width: 750px;
 }
 	div#index ul li{
@@ -46,7 +58,7 @@ div#index ul{
 		list-style: none;
 	}
 	div#index ul li::before{
-		content:  "▁ ▂ ▃ ▄ ▅ ▆ ▇ █";
+		content:  "-----";
 		float: left;
-		margin-left:  -9.5em;
-	}
\ No newline at end of file
+		margin-left:  -2.5em;
+	}
diff --git a/web-interface/templates/flask/base.html b/web-interface/templates/flask/base.html
index 5e702a6..456b8f2 100644
--- a/web-interface/templates/flask/base.html
+++ b/web-interface/templates/flask/base.html
@@ -21,12 +21,12 @@ window.addEventListener('load', function () {
 	// Insert the nav buttons, after the page is loaded
 	const nav = document.createElement('div');
 	nav.id = 'nav';
-	nav.innerHTML = '<a id="home" href="/"><button>/</button></a> <a id="update" href="/update/" onclick="load()"><button>update</button></a><span id="loading">loading</span><a id="pdf" href="/pagedjs/"><button>pdf</button></a> <a id="inspect" href="/inspect/"><button>inspect</button></a> <a id="stylesheet" href="/stylesheet/"><button>stylesheet</button></a>: <input type="text" name="pad" value="https://pad.vvvvvvaria.org/volumetric-regimes.css">';
+	nav.innerHTML = '<a id="home" href="/"><button>/</button></a> <a id="notes" href="/notes/"><button>notes</button></a> <a id="pdf" href="/pagedjs/"><button>pdf</button></a> <a id="inspect" href="/inspect/"><button>inspect</button></a> <a id="stylesheet" href="/stylesheet/"><button>stylesheet</button></a>: <input type="text" name="pad" value="https://pad.vvvvvvaria.org/volumetric-regimes.css"> <a id="update" href="/update/" onclick="loading()"><button>update</button></a><div id="loading">loading</div>';
 	document.body.insertBefore(nav, document.body.firstChild)
 })
-function load(){
+function loading(){
 	const loading = document.getElementById("loading");
-	loading.style.display = 'inline-block';
+	loading.style.display = 'block';
 }
 </script>
 {% block footer %}
diff --git a/web-interface/templates/flask/index.html b/web-interface/templates/flask/index.html
index 6a79d28..97e634a 100644
--- a/web-interface/templates/flask/index.html
+++ b/web-interface/templates/flask/index.html
@@ -4,16 +4,60 @@
 <div id="index">
 	<br>
 	<br>
-	<h1>Volumetric Regimes</h1>
-	<h1>Shared Book/PDF rendering environment</h1>
-	<br>
-	<br>
+	<h1>
+		Volumetric Regimes
+		<br>Shared Book/PDF rendering environment
+	</h1>
+	<ul>
+		<li>
+			<strong>pdf</strong>: Preview the Book/PDF file, which is rendered in the browser with Paged.js
+			<br>----- using <a href="https://git.vvvvvvaria.org/mb/volumetric-regimes-book/src/branch/master/web-interface/templates/flask/pagedjs.html">this pagedjs.html template</a>
+		</li>
+		<li>
+			<strong>inspect</strong>: Dive into the <a href="{{ url_for('static', filename='Unfolded.html')}}">Unfolded.html</a> webpage that renders the Book/PDF
+			<br>----- using <a href="https://git.vvvvvvaria.org/mb/volumetric-regimes-book/src/branch/master/web-interface/templates/flask/inspect.html">this inspect.html template</a>
+		</li>
+		<li>
+			<strong>stylesheet</strong>: Change the layout of the Book/PDF
+			<br>----- saved to file as <a href="{{ url_for('static', filename='css/volumetric-regimes.css')}}">volumetric-regimes.css</a>
+			<br>----- using <a href="https://git.vvvvvvaria.org/varia/etherpump">Etherpump</a> in <a href="https://git.vvvvvvaria.org/mb/volumetric-regimes-book/src/branch/master/web-interface/web-interface.py">web-interface.py</a>: the main script of this Flask web-application
+		</li>
+		<li>
+                        <strong>update</strong>: Update the materials from the <a href="https://possiblebodies.constantvzw.org/book/index.php?title=Unfolded" target="new">Unfolded wiki page</a>
+                        <br>----- saved to file as <a href="{{ url_for('static', filename='Unfolded.html')}}">Unfolded.html</a>
+                        <br>----- saved to file as <a href="{{ url_for('static', filename='Unfolded.json')}}">Unfolded.json</a> (to inspect the MediaWiki API call)
+                        <br>----- using <a href="https://git.vvvvvvaria.org/mb/volumetric-regimes-book/src/branch/master/web-interface/update.py">update.py</a>
+                </li>
+
+	</ul>
+
+	<div>
+	<h2>Meanwhile ...</h2>
 	<ul>
-		<li><strong>update</strong>: Update the materials from the <a href="https://possiblebodies.constantvzw.org/book/index.php?title=Unfolded" target="new">Unfolded wiki page</a> (saved as <a href="{{ url_for('static', filename='Unfolded.html')}}">Unfolded.html</a>)</li>
-		<li><strong>pdf</strong>: Preview the Book/PDF file, which is displayed in the browser using Paged.js</li>
-		<li><strong>inspect</strong>: Dive into the <a href="{{ url_for('static', filename='Unfolded.html')}}">Unfolded.html</a> webpage that renders the Book/PDF</li>
-		<li><strong>stylesheet</strong>: Change the layout of the Book/PDF (saved as <a href="{{ url_for('static', filename='css/volumetric-regimes.css')}}">volumetric-regimes.css</a>)</li>
+		<li>
+			This web-interface is based on other interfaces-in-process, using <a href="https://git.vvvvvvaria.org/mb/pad2pdf">Flask to make collaborative workflows</a>
+		</li>
+		<li>
+			<a href="https://constantvzw.org/wefts/webpublications.en.html">https://constantvzw.org/wefts/webpublications.en.html</a>
+		</li>
+		<li>
+			<strong>notes</strong> was added, to include the organisational dynamics into the Book/PDF making
+		</li>
+		<li>
+			A shared environment that can be operated as a local <a href="https://git.vvvvvvaria.org/mb/volumetric-regimes-book/src/branch/master/command-line">command line tool</a> and <a href="https://git.vvvvvvaria.org/mb/volumetric-regimes-book/src/branch/master/web-interface">web-interface</a>, to allow for bridging different situations of viability (related to a shared server, personal hardware, ...). 
+		</li>
+		<li>
+			Collaborative editorial space for Book/PDF making using Etherpads (<a href="http://osp.kitchen/tools/ethertoff/">Ethertoff</a> <> <a href="https://networksofonesown.constantvzw.org">Etherbox</a> <> <a href="https://git.xpub.nl/XPUB/jupyterpi">JupyterPi</a>)
+		</li>
+		<li>
+			The capacity of the shared server has been monitored, this is the impact of a hard-refresh of the <strong>pdf</strong> view:
+			<br>
+			<img src="https://git.vvvvvvaria.org/mb/volumetric-regimes-book/raw/branch/master/snapshots/capacity-monitor-varia-server.png">
+		</li>
 	</ul>
+	<br>
+	<br>
+	</div>
 </div>
 {% endblock %}
 
diff --git a/web-interface/templates/flask/notes.html b/web-interface/templates/flask/notes.html
new file mode 100644
index 0000000..88abedb
--- /dev/null
+++ b/web-interface/templates/flask/notes.html
@@ -0,0 +1,6 @@
+{% extends "flask/base.html" %} 
+
+{% block content %}
+<iframe src="https://pad.vvvvvvaria.org/volumetric-regimes-in-process"></iframe>
+{% endblock %}
+
diff --git a/web-interface/update.py b/web-interface/update.py
index 7e6fb73..7614394 100644
--- a/web-interface/update.py
+++ b/web-interface/update.py
@@ -32,7 +32,7 @@ def API_request(url, pagename):
 
 	return data
 
-def download_media(html, images):
+def download_media(html, images, wiki):
 	"""
 		html = string (HTML)
 		images = list of filenames (str)
@@ -98,7 +98,7 @@ def parse_page(pagename, wiki):
 	if 'parse' in data:
 		html = data['parse']['text']['*']
 		images = data['parse']['images']
-		html = download_media(html, images)
+		html = download_media(html, images, wiki)
 		html = clean_up(html)
 	else: 
 		html = None
diff --git a/web-interface/web-interface.py b/web-interface/web-interface.py
index 0452cb4..b9807f4 100755
--- a/web-interface/web-interface.py
+++ b/web-interface/web-interface.py
@@ -3,6 +3,9 @@ import urllib, json
 import os
 from update import *
 
+# To add: server feedback (logging + capacity) using socket io in Flask
+# https://towardsdatascience.com/how-to-add-on-screen-logging-to-your-flask-application-and-deploy-it-on-aws-elastic-beanstalk-aa55907730f
+
 # Create the application.
 APP = flask.Flask(__name__)
 
@@ -34,6 +37,10 @@ def pad():
 
 	return flask.render_template('flask/index.html', title=PROJECT_NAME)
 
+@APP.route('/notes/', methods=['GET'])
+def notes():
+        return flask.render_template('flask/notes.html')
+
 @APP.route('/update/', methods=['GET', 'POST'])
 def update():
 	publication_unfolded = update_material_now(PAGENAME, WIKI) # download the latest version of the page