diff --git a/ng2-components/ng2-activiti-processlist/demo/src/main.ts b/ng2-components/ng2-activiti-processlist/demo/src/main.ts
index ac708f15b6..fb4fb9d666 100644
--- a/ng2-components/ng2-activiti-processlist/demo/src/main.ts
+++ b/ng2-components/ng2-activiti-processlist/demo/src/main.ts
@@ -24,6 +24,8 @@ import { ActivitiProcessListModule } from 'ng2-activiti-processlist';
 import { AlfrescoAuthenticationService, AlfrescoSettingsService, StorageService } from 'ng2-alfresco-core';
 import { ObjectDataTableAdapter } from 'ng2-alfresco-datatable';
 
+const currentProcessIdNew = '__NEW__';
+
 @Component({
     selector: 'alfresco-app-demo',
     template: `
@@ -66,7 +68,8 @@ import { ObjectDataTableAdapter } from 'ng2-alfresco-datatable';
                     <div class="mdl-grid">
                         <div class="mdl-cell mdl-cell--2-col task-column">
                             <span>Process Filters</span>
-                            <activiti-start-process-instance [appId]="appId"></activiti-start-process-instance>
+                            <button type="button" (click)="navigateStartProcess()"
+                                    class="mdl-button" data-automation-id="btn-start-process">Start Process</button>
                             <activiti-process-instance-filters
                                         [appId]="appId"
                                         (filterClick)="onProcessFilterClick($event)"
@@ -85,7 +88,7 @@ import { ObjectDataTableAdapter } from 'ng2-alfresco-datatable';
                                         (onSuccess)="onSuccessProcessList($event)"
                                         #activitiprocesslist></activiti-process-instance-list>
                         </div>
-                        <div class="mdl-cell mdl-cell--7-col task-column">
+                        <div class="mdl-cell mdl-cell--7-col task-column" *ngIf="!isStartProcessMode()">
                             <span>Process Details</span>
                             <activiti-process-instance-details
                                         [processInstanceId]="currentProcessInstanceId"
@@ -93,6 +96,10 @@ import { ObjectDataTableAdapter } from 'ng2-alfresco-datatable';
                                         (processCancelled)="processCancelled()"
                                         #activitiprocessdetails></activiti-process-instance-details>
                         </div>
+                        <div class="mdl-cell mdl-cell--7-col task-column" *ngIf="isStartProcessMode()">
+                            <span>Start Process</span>
+                            <activiti-start-process [appId]="appId" (start)="onStartProcessInstance($event)"></activiti-start-process>
+                        </div>
                     </div>
                 </div>
             </section>
@@ -124,6 +131,9 @@ class MyDemoApp implements OnInit {
     @ViewChild('activitiprocessdetails')
     activitiprocessdetails: any;
 
+    @ViewChild(ActivitiStartProcessInstance)
+    activitiStartProcess: ActivitiStartProcessInstance;
+
     @Input()
     appId: number;
 
@@ -189,6 +199,19 @@ class MyDemoApp implements OnInit {
         this.changeTab('apps', 'processes');
     }
 
+    navigateStartProcess() {
+        this.currentProcessInstanceId = currentProcessIdNew;
+    }
+
+    onStartProcessInstance(instance: ProcessInstance) {
+        this.currentProcessInstanceId = instance.id;
+        this.activitiStartProcess.reset();
+    }
+
+    isStartProcessMode() {
+        return this.currentProcessInstanceId === currentProcessIdNew;
+    }
+
     onProcessFilterClick(event: any) {
         this.processFilter = event;
     }