diff --git a/website/app/components/demo-upload.hbs b/website/app/components/demo-upload.hbs
index 9fd8596d..4fe5e647 100644
--- a/website/app/components/demo-upload.hbs
+++ b/website/app/components/demo-upload.hbs
@@ -1,22 +1,63 @@
-{{#let (file-queue name='demo' onFileAdded=this.addToQueue) as |queue|}}
+<form aria-label="Simulate upload speed">
+  <label>
+    Simulate upload speed:
+    <select name="uploadRate" {{on "change" this.setUploadRate}}>
+      {{#each-in this.UPLOAD_RATES as |name rate|}}
+        <option value={{rate}} selected={{this.eq this.uploadRate rate}}>
+          {{name}}
+        </option>
+      {{/each-in}}
+    </select>
+  </label>
+</form>
+
+{{#let (file-queue name="demo" onFileAdded=this.addToQueue) as |queue|}}
   <FileDropzone @queue={{queue}} class="demo-upload__dropzone" as |dropzone|>
-    <form>
-    <label>
-      <input type='file' {{queue.selectFile}} />
-    </label>
-  </form>
+    <form aria-label="File upload">
+      <label>
+        <input type="file" {{queue.selectFile}} />
+      </label>
+    </form>
     {{#if dropzone.active}}
       Drop to upload
     {{else if queue.files.length}}
-      Uploading {{queue.files.length}} files. ({{queue.progress}}%)
+      Uploading
+      {{queue.files.length}}
+      files. ({{queue.progress}}%)
     {{else if dropzone.supported}}
       Or drag and drop files here to upload them
     {{/if}}
   </FileDropzone>
+
+  <div>
+    <h3>Queue</h3>
+    <table>
+      <thead>
+        <tr>
+          <th width="33%">
+            Loaded
+          </th>
+          <th width="33%">
+            Size
+          </th>
+          <th width="33%">
+            Progress
+          </th>
+        </tr>
+      </thead>
+      <tbody>
+        <tr>
+          <td>{{this.localeNumber queue.loaded}} bytes</td>
+          <td>{{this.localeNumber queue.size}} bytes</td>
+          <td>{{queue.progress}}%</td>
+        </tr>
+      </tbody>
+    </table>
+  </div>
 {{/let}}
 
 <div>
-  <h3>Uploaded Files</h3>
+  <h3>Files</h3>
   <table>
     <thead>
       <tr>
@@ -41,14 +82,14 @@
       </tr>
     </thead>
     <tbody>
-      {{#each this.uploadedFiles as |file|}}
+      {{#each this.files as |file|}}
         <tr>
           <td>{{file.name}}</td>
           <td>{{file.type}}</td>
-          <td>{{file.size}}</td>
+          <td>{{this.localeNumber file.size}} bytes</td>
           <td>{{file.source}}</td>
           <td>{{file.state}}</td>
-          <td>{{file.progress}}</td>
+          <td>{{this.round file.progress}}</td>
         </tr>
       {{/each}}
     </tbody>
diff --git a/website/app/components/demo-upload.js b/website/app/components/demo-upload.js
index 517332b1..8443e353 100644
--- a/website/app/components/demo-upload.js
+++ b/website/app/components/demo-upload.js
@@ -4,27 +4,59 @@ import { action } from '@ember/object';
 import { tracked } from '@glimmer/tracking';
 import { task, timeout } from 'ember-concurrency';
 import { FileState } from 'ember-file-upload';
+import { onloadstart, onprogress, onloadend } from 'ember-file-upload/internal';
 
-const uploadDuration = 1_500;
-const steps = 15;
-const stepProgress = 100 / steps;
-const stepInterval = uploadDuration / steps;
+// Values in kilobits per second (kbps)
+const UPLOAD_RATES = {
+  'Disconnected - 0 Mbps': 0,
+  'Very slow - 0.1 Mbps': 100,
+  'Slow 3G - 0.4 Mbps': 400,
+  'Fast 3G - 0.675 Mbps': 675,
+  'ADSL - 1.5 Mbps': 1_500,
+  '4G/LTE - 50 Mbps': 50_000,
+  'Fast Fibre - 100 Mbps': 100_000,
+};
 
-const round = (number) => Math.round(number * 100) / 100;
+const STEP_INTERVAL = 100; // Progress events every 100ms
+const STEPS_PER_SECOND = 1_000 / STEP_INTERVAL;
+const BYTES_PER_KILOBYTE = 1_024;
+const BITS_PER_BYTE = 8;
 
 export default class DemoUploadComponent extends Component {
   @service fileQueue;
-  @tracked uploadedFiles = [];
+
+  @tracked files = [];
+  @tracked uploadRate = UPLOAD_RATES['Fast 3G - 0.675 Mbps'];
+
+  UPLOAD_RATES = UPLOAD_RATES;
 
   get queue() {
     return this.fileQueue.find('demo');
   }
 
+  get bytesPerStep() {
+    const kilobytesPerSecond =
+      // Convert to kilobytes
+      (this.uploadRate / BITS_PER_BYTE) *
+      // and then to bytes
+      BYTES_PER_KILOBYTE;
+    return kilobytesPerSecond / STEPS_PER_SECOND;
+  }
+
+  round = (number) => Math.round(number);
+  localeNumber = (number) => number.toLocaleString('en-GB');
+  eq = (a, b) => a === b;
+
+  @action
+  setUploadRate(event) {
+    this.uploadRate = parseInt(event.target.value, 10);
+  }
+
   @action
   addToQueue(file) {
     file.queue = this.queue;
     file.state = FileState.Queued;
-    this.uploadedFiles = [file, ...this.uploadedFiles];
+    this.files = [file, ...this.files];
 
     this.simulateUpload.perform(file);
   }
@@ -33,14 +65,37 @@ export default class DemoUploadComponent extends Component {
   *simulateUpload(file) {
     file.state = FileState.Uploading;
 
-    const stepLoaded = file.size / steps;
+    onloadstart(
+      file,
+      new ProgressEvent('loadstart', {
+        lengthComputable: true,
+        loaded: 0,
+        total: 0,
+      }),
+    );
 
     while (file.progress < 100) {
-      yield timeout(stepInterval);
-      file.loaded = file.loaded += stepLoaded;
-      file.progress = round(Math.min(file.progress + stepProgress, 100));
+      yield timeout(STEP_INTERVAL);
+
+      onprogress(
+        file,
+        new ProgressEvent('progress', {
+          lengthComputable: true,
+          loaded: file.loaded + this.bytesPerStep,
+          total: file.size,
+        }),
+      );
     }
 
+    onloadend(
+      file,
+      new ProgressEvent('loadend', {
+        lengthComputable: true,
+        loaded: file.size,
+        total: file.size,
+      }),
+    );
+
     file.state = FileState.Uploaded;
     file.queue.flush();
   }
diff --git a/website/app/templates/demo.hbs b/website/app/templates/demo.hbs
index 11b5a93d..482aa484 100644
--- a/website/app/templates/demo.hbs
+++ b/website/app/templates/demo.hbs
@@ -1,5 +1,7 @@
+{{page-title "Demo"}}
+
 <header>
-  <div class='container'>
+  <div class="container">
     <h1>Demo</h1>
 
     <DemoUpload />