diff --git a/e2e_tests/integration/play-command.spec.ts b/e2e_tests/integration/play-command.spec.ts
index c8d193ad9f7..064621acb0b 100644
--- a/e2e_tests/integration/play-command.spec.ts
+++ b/e2e_tests/integration/play-command.spec.ts
@@ -61,7 +61,9 @@ describe('Play command', () => {
     // Go to next again
     cy.getNextInFrameStackBtn().click()
 
-    // Click forward 7 times (to last slide)
+    // Click forward to the last slide
+    nextSlideBtn().click()
+    nextSlideBtn().click()
     nextSlideBtn().click()
     nextSlideBtn().click()
     nextSlideBtn().click()
@@ -70,7 +72,7 @@ describe('Play command', () => {
 
     frame = cy.getFrames()
 
-    frame.should('have.length', 1).should('contain', 'Keep getting started')
+    frame.should('have.length', 1).should('contain', 'Next steps')
 
     // Click new guide
     frame.contains('Play Cypher').click()
@@ -86,9 +88,11 @@ describe('Play command', () => {
     nextSlideBtn().click()
     nextSlideBtn().click()
     nextSlideBtn().click()
+    nextSlideBtn().click()
+    nextSlideBtn().click()
 
     frame = cy.getFrames()
-    frame.should('have.length', 1).should('contain', 'Keep getting started')
+    frame.should('have.length', 1).should('contain', 'Next steps')
 
     // Click next in stack
     cy.getNextInFrameStackBtn().click()
diff --git a/src/browser/documentation/guides/intro.tsx b/src/browser/documentation/guides/intro.tsx
index 1c42215ea09..b758f62ff8f 100644
--- a/src/browser/documentation/guides/intro.tsx
+++ b/src/browser/documentation/guides/intro.tsx
@@ -21,13 +21,19 @@
 import React from 'react'
 import Carousel from '../../modules/Carousel/Carousel'
 import Slide from '../../modules/Carousel/Slide'
+import {
+  FULLSCREEN_SHORTCUT,
+  FOCUS_SHORTCUT,
+  printShortcut,
+  isMac
+} from 'browser/modules/App/keyboardShortcuts'
 
 const title = 'Intro'
 const slides = [
   <Slide key="s1">
     <div className="col-sm-3">
       <h3>Introduction</h3>
-      <p className="lead">Getting started with Neo4j Browser</p>
+      <p className="lead">Neo4j Browser User Interface </p>
     </div>
     <div className="col-sm-6">
       <p>
@@ -55,26 +61,53 @@ const slides = [
     </div>
     <div className="col-sm-5">
       <p>
-        The editor is the primary interface for entering and running commands.
-        Enter Cypher queries to work with graph data. Use client-side commands
-        like
-        <code>:help</code> for other operations.
+        Editor pane is used to edit and run for Cypher statements and Browser
+        commands. Browser commands begin with <code>:</code>, for example{' '}
+        <code>:help</code>
+      </p>
+      <table>
+        <tbody>
+          <tr>
+            <td>Execute current command</td>
+            <td className="padding5">
+              <div className="key code">
+                {isMac ? '<Cmd-Return>' : '<Ctrl-Return>'}
+              </div>
+            </td>
+          </tr>
+          <tr>
+            <td>Previous command in history</td>
+            <td className="padding5">
+              <div className="key code">
+                {isMac ? '<Cmd-Up-Arrow>' : '<Ctrl-Up-Arrow>'}
+              </div>
+            </td>
+          </tr>
+          <tr>
+            <td>Next command in history</td>
+            <td className="padding5">
+              <div className="key code">
+                {isMac ? '<Cmd-Down-Arrow>' : '<Ctrl-Down-Arrow>'}
+              </div>
+            </td>
+          </tr>
+        </tbody>
+      </table>
+      <p></p>
+      <p>
+        You can view the list of keybinding anytime by running{' '}
+        <code>:help keys</code> or by pressing <b>F1 </b>in the editor to see
+        all editor-specific keybindings.
       </p>
-      <ul>
-        <li>Single line editing for brief queries or commands</li>
-        <li>Switch to multi-line editing with {'<shift-enter>'}</li>
-        <li>Run a query with {'<ctrl-enter>'}</li>
-        <li>History is kept for easily retrieving previous commands</li>
-      </ul>
     </div>
     <div className="col-sm-4">
-      <img src="./assets/images/screen_editor.png" className="img-responsive" />
+      <img src="./assets/images/Keystrokes2.gif" className="img-responsive" />
     </div>
   </Slide>,
   <Slide key="s3">
     <div className="col-sm-3">
-      <h3>Stream</h3>
-      <p className="lead">Scrolling series of result frames</p>
+      <h3>Result frame</h3>
+      <p className="lead">Most recently executed command or Cypher query.</p>
     </div>
     <div className="col-sm-5">
       <p>
@@ -83,76 +116,110 @@ const slides = [
         order.
       </p>
       <ul>
-        <li>Special frames like data visualization</li>
-        <li>Expand a frame to full screen</li>
-        <li>Remove a specific frame from the stream</li>
+        <li>If a frame is pinned it will always stay in the same position. </li>
+        <li>
+          You can clear the stream of result frames running <code>:clear</code>{' '}
+          command.
+        </li>
+        <li>
+          There are maximum 30 result frames displayed in the stream. You can
+          change this number in the Settings sidebar.{' '}
+        </li>
         <li>
-          Clear the stream with the <code>:clear</code> command
+          You can bring up the history of the executed commands and queries by
+          running <code className="nobreak">:history</code> command.
         </li>
       </ul>
     </div>
     <div className="col-sm-4">
-      <img src="./assets/images/screen_stream.png" className="img-responsive" />
+      <img src="./assets/images/Stream.png" className="img-responsive" />
     </div>
   </Slide>,
   <Slide key="s4">
     <div className="col-sm-3">
-      <h3>Frame code view</h3>
-      <p className="lead">Viewing requests and responses</p>
+      <h3>Reusable frame</h3>
+      <p className="lead">Instead of the stream</p>
     </div>
     <div className="col-sm-5">
       <p>
-        The code tab displays everything sent to and received from the Neo4j
-        server, including:
+        You can also iterate in the same frame instead of generating a
+        scrollable stream of frames.
       </p>
-      <ul>
-        <li>Request URI, HTTP method and headers</li>
-        <li>Response HTTP response code and headers</li>
-        <li>Raw request and response content in JSON format</li>
-      </ul>
+      <p>Adjust your preferences in the Settings sidebar tab.</p>
     </div>
     <div className="col-sm-4">
       <img
-        src="./assets/images/screen_code_frame.png"
+        src="./assets/images/ReusableFrame2.gif"
         className="img-responsive"
       />
     </div>
   </Slide>,
   <Slide key="s5">
     <div className="col-sm-3">
-      <h3>Sidebar</h3>
-      <p className="lead">Convenient clickable access</p>
+      <h3>Sidebar: Database information</h3>
+      <p className="lead">Database metadata</p>
     </div>
     <div className="col-sm-5">
-      <p>
-        The sidebar expands to reveal different functional panels for common
-        queries and information.
-      </p>
-      <ul>
-        <li>Database metadata and basic information</li>
-        <li>Saved scripts organized into folders</li>
-        <li>Information links for docs and reference</li>
-        <li>Credits and licensing information</li>
-      </ul>
+      When Neo4j is installed, it is initiated with two databases - a{' '}
+      <code>system</code> database and a default <code>neo4j</code> database.
+      Launching Neo4j Browser will automatically point us to the{' '}
+      <code className="nobreak">neo4j default</code> database, shown by the
+      neo4j$ prompt in the editor.
     </div>
     <div className="col-sm-4">
       <img
-        src="./assets/images/screen_sidebar.png"
+        src="./assets/images/SidebarDB_Iinfo.png"
         className="img-responsive"
       />
     </div>
   </Slide>,
+
   <Slide key="s6">
-    <div className="col-sm-4">
-      <h3>Next steps</h3>
-      <p className="lead">
-        Neo4j is like a mashup of a REPL + lightweight IDE + graph
-        visualization.
+    <div className="col-sm-3">
+      <h3>Sidebar: Favorites</h3>
+      <p className="lead">Quick way to save your queries</p>
+    </div>
+    <div className="col-sm-5">
+      <p>
+        Favorite queries or commands can be saved in the local storage and
+        displayed in the sidebar.{' '}
+      </p>
+      <p>
+        Favorites are global and independent of project or database which means
+        that you can access your Favorites from Neo4j Browser with different
+        databases, hosting platforms, and data sets.
       </p>
-      <a play-topic="start">Play start</a> - Back to getting started
     </div>
     <div className="col-sm-4">
-      <h3>Keep getting started</h3>
+      <img src="./assets/images/Favorites2.gif" className="img-responsive" />
+    </div>
+  </Slide>,
+
+  <Slide key="s7">
+    <div className="col-sm-3">
+      <h3>Sidebar: Project files</h3>
+      <p className="lead">Save cypher files to share with your colleagues</p>
+    </div>
+    <div className="col-sm-5">
+      Queries and commands can also be saved as <b>Project files</b>. Project
+      folder can be reached through Neo4j Desktop and your hard disk.
+    </div>
+    <div className="col-sm-4">
+      <img src="./assets/images/ProjectFiles2.gif" className="img-responsive" />
+    </div>
+  </Slide>,
+
+  <Slide key="s8">
+    <div className="col-sm-4">
+      <div>
+        {' '}
+        &#127968;
+        <a play-topic="start">Play start</a> - Back to getting started
+      </div>
+    </div>
+
+    <div className="col-sm-4">
+      <h3>Next steps</h3>
       <ul className="undecorated">
         <li>
           <a help-topic="commands">Help commands</a> - Useful Neo4j Browser
diff --git a/src/browser/documentation/help/keys.tsx b/src/browser/documentation/help/keys.tsx
index f905d844c90..04a48710164 100644
--- a/src/browser/documentation/help/keys.tsx
+++ b/src/browser/documentation/help/keys.tsx
@@ -31,80 +31,197 @@ const category = 'browserUiCommands'
 const content = (
   <>
     <table className="table-condensed table-help table-help--keys">
-      <thead>
+      <tbody>
         <tr>
-          <th>Editor action</th>
-          <th>Any mode</th>
-          <th>Single-line mode</th>
+          <th>Global actions</th>
+          <th />
+          <th />
         </tr>
-      </thead>
-      <tbody>
         <tr>
-          <td>Execute current command</td>
+          <td>Change focus to editor</td>
           <td>
-            <div className="key code">
-              {isMac ? '<Cmd-Return>' : '<Ctrl-Return>'}
-            </div>
+            <div className="key code">{printShortcut(FOCUS_SHORTCUT)}</div>
           </td>
+        </tr>
+        <tr>
+          <td>Toggle fullscreen editor</td>
           <td>
-            <div className="key code">{'<Return>'}</div>
+            <div className="key code">{printShortcut(FULLSCREEN_SHORTCUT)}</div>
           </td>
         </tr>
+        <tr>
+          <td />
+        </tr>
+      </tbody>
+    </table>
+
+    <p className="padding30">
+      You can access the list of all available editor keybindings by pressing{' '}
+      <b>F1 </b>in the editor.
+    </p>
+    <p> Some of them are listed here:</p>
+
+    <table className="table-condensed table-help table-help--keys">
+      <thead>
+        <tr>
+          <th title="Field #1" className="padding30">
+            Editor action
+          </th>
+          <th title="Field #2" className="padding30">
+            Windows / Linux
+          </th>
+          <th title="Field #3" className="padding30">
+            Mac
+          </th>
+        </tr>
+      </thead>
+      <tbody>
+        <tr>
+          <td>Execute current command</td>
+          <td>Ctrl + Enter</td>
+          <td>Cmd + Return</td>
+        </tr>
+
         <tr>
           <td>Previous command in history</td>
-          <td>
-            <div className="key code">
-              {isMac ? '<Cmd-Up-Arrow>' : '<Ctrl-Up-Arrow>'}
-            </div>
-          </td>
-          <td>
-            <div className="key code">{'<Up-Arrow>'}</div>
-          </td>
+          <td>Ctrl + Up Arrow</td>
+          <td>Cmd + Up Arrow</td>
         </tr>
+
         <tr>
           <td>Next command in history</td>
-          <td>
-            <div className="key code">
-              {isMac ? '<Cmd-Down-Arrow>' : '<Ctrl-Down-Arrow>'}
-            </div>
-          </td>
-          <td>
-            <div className="key code">{'<Down-Arrow>'}</div>
-          </td>
+          <td>Ctrl + Up Down</td>
+          <td>Cmd + Up Down</td>
         </tr>
+
         <tr>
-          <td>Switch to multi-line editing</td>
-          <td />
-          <td>
-            <div className="key code">{'<Shift-Return>'}</div>
-          </td>
+          <td>Search</td>
+          <td>Ctrl + F</td>
+          <td>Command + F</td>
         </tr>
         <tr>
-          <td />
+          <td>Increase Indent</td>
+          <td>Tab</td>
+          <td>Tab</td>
         </tr>
         <tr>
-          <th>Global actions</th>
-          <th />
-          <th />
+          <td>Decrease Indent</td>
+          <td>Shift + Tab</td>
+          <td>Shift + Tab</td>
         </tr>
         <tr>
-          <td>Change focus to editor</td>
-          <td>
-            <div className="key code">{printShortcut(FOCUS_SHORTCUT)}</div>
-          </td>
+          <td>Comment Out</td>
+          <td>Ctrl + /</td>
+          <td>Command + /</td>
         </tr>
         <tr>
-          <td>Toggle fullscreen editor</td>
-          <td>
-            <div className="key code">{printShortcut(FULLSCREEN_SHORTCUT)}</div>
-          </td>
+          <td>Comment In</td>
+          <td>Ctrl + /</td>
+          <td>Command + /</td>
         </tr>
         <tr>
-          <td />
+          <td>Undo</td>
+          <td>Ctrl + Z</td>
+          <td>Command + Z</td>
+        </tr>
+        <tr>
+          <td>Redo</td>
+          <td>Ctrl + Y</td>
+          <td>Shift + Command + Z or Command + Y</td>
+        </tr>
+        <tr>
+          <td>Decrease Indent</td>
+          <td>Ctrl + [</td>
+          <td>Command + [</td>
+        </tr>
+        <tr>
+          <td>Increase Indent</td>
+          <td>Ctrl + ]</td>
+          <td>Command + ]</td>
+        </tr>
+        <tr>
+          <td>Move the line down</td>
+          <td>Alt + Down</td>
+          <td>Option + Down</td>
+        </tr>
+        <tr>
+          <td>Move the line up</td>
+          <td>Alt + Up</td>
+          <td>Option + Up</td>
+        </tr>
+        <tr>
+          <td>Replace</td>
+          <td>Ctrl + F</td>
+          <td>Command + Alt + F</td>
+        </tr>
+        <tr>
+          <td>Select all</td>
+          <td>Ctrl + A</td>
+          <td>Command + A</td>
+        </tr>
+        <tr>
+          <td>Select downward</td>
+          <td>Shift + Down</td>
+          <td>Shift + Down</td>
+        </tr>
+        <tr>
+          <td>Select right</td>
+          <td>Shift + Right</td>
+          <td>Shift + Right</td>
+        </tr>
+        <tr>
+          <td>Select left</td>
+          <td>Shift + Left</td>
+          <td>Shift + Left</td>
+        </tr>
+        <tr>
+          <td>Select upward</td>
+          <td>Shift + Up</td>
+          <td>Shift + Up</td>
+        </tr>
+        <tr>
+          <td>Select to the end</td>
+          <td>Alt + Shift + Right</td>
+          <td>Command + Shift + Right</td>
+        </tr>
+        <tr>
+          <td>Select to the start</td>
+          <td>Alt + Shift + Left</td>
+          <td>Command + Shift + Left</td>
+        </tr>
+        <tr>
+          <td>Align text right</td>
+          <td>Ctrl + Shift + Right</td>
+          <td>Option + Right</td>
+        </tr>
+        <tr>
+          <td>Align text left</td>
+          <td>Ctrl + Shift + Left</td>
+          <td>Option + Left</td>
+        </tr>
+        <tr>
+          <td>Add multi-cursor above</td>
+          <td>Ctrl + Alt + Up</td>
+          <td>Command + Alt + Up</td>
+        </tr>
+        <tr>
+          <td>Add multi-cursor below</td>
+          <td>Ctrl + Alt + Down</td>
+          <td>Command + Alt + Down</td>
+        </tr>
+        <tr>
+          <td>Add multi-cursor above</td>
+          <td>Ctrl + Alt + Shift + Up</td>
+          <td>Command + Alt + Shift + Up</td>
+        </tr>
+        <tr>
+          <td>Move multi-cursor from current line to the line below</td>
+          <td>Ctrl + Alt + Shift + Down</td>
+          <td>Command + Alt + Shift + Down</td>
         </tr>
       </tbody>
     </table>
-    <div>
+    <div className="padding30">
       <h3>Next steps </h3>
       <ul>
         <li>
diff --git a/src/browser/images/Favorites2.gif b/src/browser/images/Favorites2.gif
new file mode 100644
index 00000000000..f2514b03422
Binary files /dev/null and b/src/browser/images/Favorites2.gif differ
diff --git a/src/browser/images/Keystrokes2.gif b/src/browser/images/Keystrokes2.gif
new file mode 100644
index 00000000000..726b44e9fa0
Binary files /dev/null and b/src/browser/images/Keystrokes2.gif differ
diff --git a/src/browser/images/ProjectFiles2.gif b/src/browser/images/ProjectFiles2.gif
new file mode 100644
index 00000000000..4849db7d278
Binary files /dev/null and b/src/browser/images/ProjectFiles2.gif differ
diff --git a/src/browser/images/ReusableFrame2.gif b/src/browser/images/ReusableFrame2.gif
new file mode 100644
index 00000000000..b54cc5cbe9a
Binary files /dev/null and b/src/browser/images/ReusableFrame2.gif differ
diff --git a/src/browser/images/SidebarDB_Iinfo.png b/src/browser/images/SidebarDB_Iinfo.png
new file mode 100644
index 00000000000..58c11d57d93
Binary files /dev/null and b/src/browser/images/SidebarDB_Iinfo.png differ
diff --git a/src/browser/images/Stream.png b/src/browser/images/Stream.png
new file mode 100644
index 00000000000..cd883575077
Binary files /dev/null and b/src/browser/images/Stream.png differ
diff --git a/src/browser/modules/Carousel/style.less b/src/browser/modules/Carousel/style.less
index e8a161ee363..c6e992d9f29 100644
--- a/src/browser/modules/Carousel/style.less
+++ b/src/browser/modules/Carousel/style.less
@@ -423,5 +423,9 @@
       margin: 6px 0 20px 0;
       overflow: hidden;
     }
+   
   }
+  .padding5 {padding: 5px;}
+  .padding30  {padding-top: 30px;} 
+  .table-padding {padding-top: 10px;}
 }