diff --git a/docs/documentation/adding-css-javascript-and-images.md b/docs/documentation/adding-css-javascript-and-images.md
new file mode 100644
index 0000000000..394b40c418
--- /dev/null
+++ b/docs/documentation/adding-css-javascript-and-images.md
@@ -0,0 +1,84 @@
+# Adding CSS, JavaScript and Images
+
+The Prototype Kit comes with standard GOV.UK Frontend styles and components for you to use in your prototypes. However if you need to add your own CSS (Cascading Style Sheets), JavaScript or images, use the `/app/assets` folder.
+
+The Prototype Kit processes all the files in the `/app/assets` folder, and puts the processed files in `/public`.
+
+Do not change files in the `/public` folder because it’s deleted and rebuilt every time you make a change to your prototype.
+
+## CSS
+
+CSS lets you change how web pages look, for example text sizes, colours or spacing.
+
+To add styles use:
+
+```
+/app/assets/sass/application.scss
+```
+
+Do not edit the file `/public/styles/application.css` because it’s deleted and rebuilt every time you make a change to your prototype.
+
+The Prototype Kit uses [Sass](https://sass-lang.com/guide), which adds extra features to CSS.
+
+### Using import
+
+If you have a very long application.scss file, you can split it up into multiple files and import those into `application.scss`. Use an underscore (_) at the start of the import file filenames, for example:
+
+```
+/app/assets/sass/_admin.scss
+```
+
+Import this file into your `application.scss` file without the underscore:
+
+```
+@import "admin";
+```
+
+## JavaScript
+
+You can use JavaScript to make changes to a web page without loading a new one. For example a user could enter some numbers, then JavaScript displays the results of a calculation without loading a new page.
+
+To add JavaScript use:
+
+```
+/app/assets/javascripts/application.js
+```
+
+Do not edit the file `/public/javascript/application.js` because it’s deleted and rebuilt every time you make a change to your prototype.
+
+## Images
+
+If you add images to `/app/assets/images` the Prototype Kit will copy them to `/public`.
+
+For example if you add an image:
+
+```
+/app/assets/images/user.png
+```
+
+Use it in your page like this:
+
+```
+
+```
+
+Use ‘alt’ text to describe the image for screen readers.
+
+Do not put files directly in `/public` because it’s deleted and rebuilt every time you make a change to your prototype.
+
+## Other files
+
+If you need to use other files in your prototype, you can add them to `/app/assets` and the Prototype Kit will copy them to `/public`. You can use sub-folders in the assets folder.
+
+For example if you add a PDF:
+
+```
+/app/assets/downloads/report.pdf
+```
+
+Link to it like this:
+
+```
+Download the report
+```
+Do not put files directly in `/public` because it’s deleted and rebuilt every time you make a change to your prototype.
diff --git a/docs/documentation/writing-css.md b/docs/documentation/writing-css.md
deleted file mode 100644
index e165b22a88..0000000000
--- a/docs/documentation/writing-css.md
+++ /dev/null
@@ -1,25 +0,0 @@
-# Writing CSS
-
-CSS used in the Prototype Kit is written in the SCSS syntax of [Sass](http://sass-lang.com/documentation/file.SASS_REFERENCE.html#syntax).
-
-## Sass
-
-Sass is an extension of CSS that gives a load of extra features useful in producing CSS for the mass of different devices and browsers.
-
-SCSS was chosen because you can paste CSS into it without breaking it which is useful for prototyping. Using SCSS means you can also use the [GOV.UK Frontend](https://github.com/alphagov/govuk-frontend) Sass libraries which include styles for colours, typography, cross-browser fixes and other things which are used across GOV.UK.
-
-## Writing code
-
-You write your Sass in [app/assets/sass](../app/assets/sass) and the Prototype Kit will compile it into the CSS used in your page (found in /public/stylesheets). The app watches your files so this will happen automatically.
-
-There is already a CSS file included to use called [application.scss](../app/assets/sass/application.scss) which compiles into [application.css](../public/stylesheets/application.css). Note that Sass files are identified by the `.scss` extension.
-
-Every time a change happens in [application.scss](../app/assets/sass/application.scss) it will produce a new version of [application.css](../public/stylesheets/application.css). Make sure to write your css in [application.scss](../app/assets/sass/application.scss) as anything you put in [application.css](../public/stylesheets/application.css) will get overridden.
-
-Try starting the app and adding some styles to `application.scss`. If you open `application.css` you should now see the compiled version of those styles.
-
-## Imports
-
-Imports are done from either [GOV.UK Frontend](https://github.com/alphagov/govuk-frontend/tree/master/src/) folder or the [app/assets/sass](../app/assets/sass) folder application.scss sits in. The latter means you can create your own partial files to import.
-
-Note that the convention is to start the name of any partial with an underscore, like those in GOV.UK Frontend.
diff --git a/docs/views/tutorials-and-examples.html b/docs/views/tutorials-and-examples.html
index b42cd759eb..666e5d332e 100644
--- a/docs/views/tutorials-and-examples.html
+++ b/docs/views/tutorials-and-examples.html
@@ -64,7 +64,7 @@