diff --git a/app/components/api/header-blockchain.js b/app/components/api/header-blockchain.js
index 301b016..34a9a85 100644
--- a/app/components/api/header-blockchain.js
+++ b/app/components/api/header-blockchain.js
@@ -1,15 +1,18 @@
 "use strict";
 
+
+
+//  P A C K A G E
+
 import html from "choo/html";
 
-export default () => {
-  return html`
-    <div class="api__header page__markup">
-      <h1>lbrycrd APIs</h1>
-      <p>
-        Methods and signatures provided by the <a href="/glossary#lbrycrd">lbrycrd</a> blockchain daemon are documented below. 
-        To build, download, or run lbrycrd, see the project <a href="https://github.com/lbryio/lbrycrd/blob/master/README.md">README</a>.
-        </p>
-    </div>
-  `;
-};
+
+
+//  E X P O R T
+
+export default () => html`
+  <div class="api__header page__markup">
+    <h1>lbrycrd APIs</h1>
+    <p>Methods and signatures provided by the <a href="/glossary#lbrycrd">lbrycrd</a> blockchain daemon are documented below. To build, download, or run lbrycrd, see the project <a href="https://github.com/lbryio/lbrycrd/blob/master/README.md">README</a>.</p>
+  </div>
+`;
diff --git a/app/components/api/header-sdk.js b/app/components/api/header-sdk.js
index 694a66e..4ac685c 100644
--- a/app/components/api/header-sdk.js
+++ b/app/components/api/header-sdk.js
@@ -1,15 +1,18 @@
 "use strict";
 
+
+
+//  P A C K A G E
+
 import html from "choo/html";
 
-export default () => {
-  return html`
-    <div class="api__header page__markup">
-      <h1>lbry-sdk APIs</h1>
-      <p>
-        Methods and signatures provided by the <a href="/glossary#lbry-sdk">lbry-sdk</a> daemon are documented below. 
-        To build, download, or run the daemon, see the project <a href="https://github.com/lbryio/lbry/blob/master/README.md">README</a>.
-        </p>
-    </div>
-  `;
-};
+
+
+//  E X P O R T
+
+export default () => html`
+  <div class="api__header page__markup">
+    <h1>lbry-sdk APIs</h1>
+    <p>Methods and signatures provided by the <a href="/glossary#lbry-sdk">lbry-sdk</a> daemon are documented below. To build, download, or run the daemon, see the project <a href="https://github.com/lbryio/lbry/blob/master/README.md">README</a>.</p>
+  </div>
+`;
diff --git a/app/components/client/tour-scripts.js b/app/components/client/playground-scripts.js
similarity index 68%
rename from app/components/client/tour-scripts.js
rename to app/components/client/playground-scripts.js
index fcea1e3..c5ffa9b 100644
--- a/app/components/client/tour-scripts.js
+++ b/app/components/client/playground-scripts.js
@@ -2,7 +2,7 @@
 
 
 
-initializeTour();
+initializePlayground();
 
 
 
@@ -16,15 +16,15 @@ if (window.location.href.search && window.location.href.split("?url=")[1]) { //
 document.querySelector("body").addEventListener("click", event => {
   if (event.target.dataset.action) {
     event.preventDefault();
-    document.querySelector(".tour").classList.add("waiting");
+    document.querySelector(".playground").classList.add("waiting");
     handleExamples(event.target);
   }
 
   if (
     event.explicitOriginalTarget.classList &&
-    event.explicitOriginalTarget.classList[0] === "tour__content__meme__canvas__thumbnail"
+    event.explicitOriginalTarget.classList[0] === "playground__content__meme__canvas__thumbnail"
   ) {
-    for (const thumbnail of document.querySelectorAll(".tour__content__meme__canvas__thumbnail"))
+    for (const thumbnail of document.querySelectorAll(".playground__content__meme__canvas__thumbnail"))
       thumbnail.classList.remove("selected");
 
     event.explicitOriginalTarget.classList.add("selected");
@@ -119,18 +119,18 @@ function debounce(func, wait, immediate) {
   };
 }
 
-function initializeTour() {
-  document.querySelector(".tour").classList.add("waiting");
+function initializePlayground() {
+  document.querySelector(".playground").classList.add("waiting");
   document.querySelector("#fetch-claim-uri").value = "";
   document.querySelector("#fetch-claim-uri").focus();
-  document.querySelector(".tour__navigation__example:nth-child(1)").classList.add("active");
+  document.querySelector(".playground__navigation__example:nth-child(1)").classList.add("active");
 
   send(JSON.stringify({
-    "message": "landed on tour"
+    "message": "landed on playground"
   }));
 
   setTimeout(() => {
-    document.querySelector(".tour__navigation__example:nth-child(1)").click();
+    document.querySelector(".playground__navigation__example:nth-child(1)").click();
   }, 300);
 }
 
@@ -150,7 +150,7 @@ function fetchMetadata(exampleNumber, data) {
 
       document.getElementById("fetch-claim-uri").value = data;
 
-      document.getElementById("tour-results").innerHTML = `
+      document.getElementById("playground-results").innerHTML = `
         <pre><code class="language-bash">
 <span class="token comment"># With the LBRY app/daemon running locally, you can use this in your Terminal</span>
 curl --header <span class="token string">"Content-Type: application/json"</span> --data <span class="token string">'{ "method": "resolve", "params": { "uri": "${data}" }}'</span> <span class="token url">http://localhost:5279    </span>
@@ -160,7 +160,7 @@ curl --header <span class="token string">"Content-Type: application/json"</span>
         <div id="example1-result"></div>
       `;
 
-      document.getElementById("tour-loader").style.display = "none";
+      document.getElementById("playground-loader").style.display = "none";
       break;
 
     case 2:
@@ -171,7 +171,7 @@ curl --header <span class="token string">"Content-Type: application/json"</span>
         "example": exampleNumber
       }));
 
-      document.getElementById("tour-results").innerHTML = `
+      document.getElementById("playground-results").innerHTML = `
         <pre><code class="language-bash">
 <span class="token comment"># With the LBRY app/daemon running locally, you can use this in your Terminal</span>
 curl --header <span class="token string">"Content-Type: application/json"</span> --data <span class="token string">'{ "method": "publish", "params": { "name": "TITLE_OF_YOUR_CONTENT", "file_path": "ABSOLUTE_PATH_TO_MEDIA_ON_YOUR_COMPUTER", "bid": "0.001", "metadata": { "description": "DESCRIPTION_OF_YOUR_CONTENT", "title": "TITLE_OF_YOUR_CONTENT", "language": "en", "license": "", "nsfw": false }}}'</span> <span class="token url">http://localhost:5279    </span>
@@ -181,7 +181,7 @@ curl --header <span class="token string">"Content-Type: application/json"</span>
         <div id="example2-result"></div>
       `;
 
-      document.getElementById("tour-loader").style.display = "none";
+      document.getElementById("playground-loader").style.display = "none";
       break;
 
     case 3:
@@ -194,7 +194,7 @@ curl --header <span class="token string">"Content-Type: application/json"</span>
 
       document.getElementById("fetch-claim-uri").value = data;
 
-      document.getElementById("tour-results").innerHTML = `
+      document.getElementById("playground-results").innerHTML = `
         <pre><code class="language-bash">
 <span class="token comment"># With the LBRY app/daemon running locally, you can use this in your Terminal</span>
 curl --header <span class="token string">"Content-Type: application/json"</span> --data <span class="token string">'{ "method": "wallet_send", "params": { "amount": "0.01", "claim_id": "${data}" }}'</span> <span class="token url">http://localhost:5279    </span>
@@ -204,7 +204,7 @@ curl --header <span class="token string">"Content-Type: application/json"</span>
         <div id="example3-result"></div>
       `;
 
-      document.getElementById("tour-loader").style.display = "none";
+      document.getElementById("playground-loader").style.display = "none";
       break;
 
     default:
@@ -228,14 +228,14 @@ const handleExamples = debounce(event => {
   let exampleNumber;
   const data = event.dataset;
 
-  if (!parseInt(document.querySelector(".tour__navigation__example.active").dataset.example)) return;
-  exampleNumber = parseInt(document.querySelector(".tour__navigation__example.active").dataset.example);
+  if (!parseInt(document.querySelector(".playground__navigation__example.active").dataset.example)) return;
+  exampleNumber = parseInt(document.querySelector(".playground__navigation__example.active").dataset.example);
 
   switch(data.action) {
     case "choose claim":
       fetchMetadata(exampleNumber, data.claimId);
 
-      if (document.querySelector(".tour__navigation__example:nth-child(3)").classList.contains("active"))
+      if (document.querySelector(".playground__navigation__example:nth-child(3)").classList.contains("active"))
         document.getElementById("fetch-claim-uri").value = event.alt + "#" + event.dataset.claimId;
 
       break;
@@ -245,28 +245,28 @@ const handleExamples = debounce(event => {
       fetchMetadata(exampleNumber, document.getElementById("fetch-claim-uri").value);
       break;
 
-    case "tour, example 1":
-      if (document.getElementById("tour-loader").classList.contains("tour__content__meme")) {
-        document.getElementById("tour-loader").classList.remove("tour__content__meme");
-        document.getElementById("tour-loader").classList.add("tour__content__trends");
+    case "playground, example 1":
+      if (document.getElementById("playground-loader").classList.contains("playground__content__meme")) {
+        document.getElementById("playground-loader").classList.remove("playground__content__meme");
+        document.getElementById("playground-loader").classList.add("playground__content__trends");
       }
 
       document.getElementById("fetch-claim-uri").value = ""; // reset URL bar
-      document.querySelector("#tour-url button").textContent = "Resolve";
+      document.querySelector("#playground-url button").textContent = "Resolve";
 
-      if (document.getElementById("tour-url").style.display === "none")
-        document.getElementById("tour-url").removeAttribute("style");
+      if (document.getElementById("playground-url").style.display === "none")
+        document.getElementById("playground-url").removeAttribute("style");
 
-      for (const example of document.querySelectorAll(".tour__navigation__example"))
+      for (const example of document.querySelectorAll(".playground__navigation__example"))
         example.classList.remove("active");
 
-      document.querySelector(".tour__navigation__example:nth-child(1)").classList.add("active");
+      document.querySelector(".playground__navigation__example:nth-child(1)").classList.add("active");
 
-      document.getElementById("tour-loader").innerHTML = "";
-      document.getElementById("tour-results").innerHTML = "";
+      document.getElementById("playground-loader").innerHTML = "";
+      document.getElementById("playground-results").innerHTML = "";
 
-      document.getElementById("tour-loader").removeAttribute("style");
-      document.getElementById("tour-results").removeAttribute("style");
+      document.getElementById("playground-loader").removeAttribute("style");
+      document.getElementById("playground-results").removeAttribute("style");
 
       send(JSON.stringify({
         "message": `request for ${data.action}`
@@ -274,25 +274,25 @@ const handleExamples = debounce(event => {
 
       break;
 
-    case "tour, example 2":
-      if (document.getElementById("tour-loader").classList.contains("tour__content__trends")) {
-        document.getElementById("tour-loader").classList.remove("tour__content__trends");
-        document.getElementById("tour-loader").classList.add("tour__content__meme");
+    case "playground, example 2":
+      if (document.getElementById("playground-loader").classList.contains("playground__content__trends")) {
+        document.getElementById("playground-loader").classList.remove("playground__content__trends");
+        document.getElementById("playground-loader").classList.add("playground__content__meme");
       }
 
       document.getElementById("fetch-claim-uri").value = ""; // reset URL bar
-      document.getElementById("tour-url").style.display = "none";
+      document.getElementById("playground-url").style.display = "none";
 
-      for (const example of document.querySelectorAll(".tour__navigation__example"))
+      for (const example of document.querySelectorAll(".playground__navigation__example"))
         example.classList.remove("active");
 
-      document.querySelector(".tour__navigation__example:nth-child(2)").classList.add("active");
+      document.querySelector(".playground__navigation__example:nth-child(2)").classList.add("active");
 
-      document.getElementById("tour-loader").innerHTML = "";
-      document.getElementById("tour-results").innerHTML = "";
+      document.getElementById("playground-loader").innerHTML = "";
+      document.getElementById("playground-results").innerHTML = "";
 
-      document.getElementById("tour-loader").removeAttribute("style");
-      document.getElementById("tour-results").removeAttribute("style");
+      document.getElementById("playground-loader").removeAttribute("style");
+      document.getElementById("playground-results").removeAttribute("style");
 
       send(JSON.stringify({
         "message": `request for ${data.action}`
@@ -300,28 +300,28 @@ const handleExamples = debounce(event => {
 
       break;
 
-    case "tour, example 3":
-      if (document.getElementById("tour-loader").classList.contains("tour__content__meme")) {
-        document.getElementById("tour-loader").classList.remove("tour__content__meme");
-        document.getElementById("tour-loader").classList.add("tour__content__trends");
+    case "playground, example 3":
+      if (document.getElementById("playground-loader").classList.contains("playground__content__meme")) {
+        document.getElementById("playground-loader").classList.remove("playground__content__meme");
+        document.getElementById("playground-loader").classList.add("playground__content__trends");
       }
 
       document.getElementById("fetch-claim-uri").value = ""; // reset URL bar
-      document.querySelector("#tour-url button").textContent = "Tip";
+      document.querySelector("#playground-url button").textContent = "Tip";
 
-      if (document.getElementById("tour-url").style.display === "none")
-        document.getElementById("tour-url").removeAttribute("style");
+      if (document.getElementById("playground-url").style.display === "none")
+        document.getElementById("playground-url").removeAttribute("style");
 
-      for (const example of document.querySelectorAll(".tour__navigation__example"))
+      for (const example of document.querySelectorAll(".playground__navigation__example"))
         example.classList.remove("active");
 
-      document.querySelector(".tour__navigation__example:nth-child(3)").classList.add("active");
+      document.querySelector(".playground__navigation__example:nth-child(3)").classList.add("active");
 
-      document.getElementById("tour-loader").innerHTML = "";
-      document.getElementById("tour-results").innerHTML = "";
+      document.getElementById("playground-loader").innerHTML = "";
+      document.getElementById("playground-results").innerHTML = "";
 
-      document.getElementById("tour-loader").removeAttribute("style");
-      document.getElementById("tour-results").removeAttribute("style");
+      document.getElementById("playground-loader").removeAttribute("style");
+      document.getElementById("playground-results").removeAttribute("style");
 
       send(JSON.stringify({
         "message": `request for ${data.action}`
diff --git a/app/components/ecosystem.js b/app/components/ecosystem.js
index 0bc1399..9adf194 100644
--- a/app/components/ecosystem.js
+++ b/app/components/ecosystem.js
@@ -16,7 +16,7 @@ const WALLET = require("./ecosystem/submodule-wallet");
 
 //  E X P O R T
 
-export default function () {
+export default () => {
   return `
     <section class="ecosystem">
       <aside class="ecosystem__submodules">
@@ -36,4 +36,4 @@ export default function () {
       </aside>
     </section>
   `;
-}
+};
diff --git a/app/components/ecosystem/module-lbrycrd.js b/app/components/ecosystem/module-lbrycrd.js
index 8798179..331cf19 100644
--- a/app/components/ecosystem/module-lbrycrd.js
+++ b/app/components/ecosystem/module-lbrycrd.js
@@ -24,7 +24,7 @@ module.exports = exports = () => `
 
       <p>LBRY uses a public, proof-of-work blockchain that is very similar to Bitcoin. The blockchain is the foundation of the protocol stack.</p>
 
-      <p>The most salient feature of the LBRY blockchain is the association of a string of characters (a "name") with a structured set of metadata. This name can be accessed as a LBRY URL, e.g. <a class="__plain" href="/tour?url=hellolbry"><code>lbry://hellolbry</code></a></p>
+      <p>The most salient feature of the LBRY blockchain is the association of a string of characters (a "name") with a structured set of metadata. This name can be accessed as a LBRY URL, e.g. <a class="__plain" href="/playground?url=hellolbry"><code>lbry://hellolbry</code></a></p>
 
       <p>The LBRY blockchain stores names and metadata in a Merkle tree. This allows LBRY URLs to be trustfully resolved even without a full copy of the blockchain.</p>
 
diff --git a/app/components/edit-link.js b/app/components/edit-link.js
index e594ba3..6b181c4 100644
--- a/app/components/edit-link.js
+++ b/app/components/edit-link.js
@@ -15,7 +15,7 @@ const config = local("/config");
 
 //  E X P O R T
 
-export default function (pagePath) {
+export default pagePath => {
   let githubUrl = `https://github.com/${config.github.repo}/edit/${config.github.branch}`;
 
   switch(pagePath) {
@@ -23,12 +23,16 @@ export default function (pagePath) {
       githubUrl = `${githubUrl}/app/views/home.js`;
       break;
 
-    case "/resources":
-      githubUrl = `${githubUrl}/views/pages/resources.js`;
+    case "/api":
+      githubUrl = `${githubUrl}/app/views/api.js`;
       break;
 
-    case "/tour":
-      githubUrl = `${githubUrl}/app/components/tour.js`;
+    case "/api/blockchain":
+      githubUrl = "https://github.com/lbryio/lbrycrd/blob/add_api_docs_scripts/contrib/devtools/generated/api_v1.json";
+      break;
+
+    case "/api/sdk":
+      githubUrl = "https://github.com/lbryio/lbry/blob/master/docs/api.json";
       break;
 
     default:
@@ -39,9 +43,9 @@ export default function (pagePath) {
   return html`
     <a
       href="${githubUrl}"
-      target="_blank"
       rel="noopener noreferrer"
+      target="_blank"
       title="${config.github.linkText}"
     >${config.github.linkText}</a>
   `;
-}
+};
diff --git a/app/components/email-subscribe.js b/app/components/email-subscribe.js
index 8ea1d22..b205998 100644
--- a/app/components/email-subscribe.js
+++ b/app/components/email-subscribe.js
@@ -10,17 +10,15 @@ import html from "choo/html";
 
 //  E X P O R T
 
-export default function () {
-  return html`
-    <div id="emailSubscribe" class="newsletter-cta">
-      <h3 class="newsletter-cta__title">Don't miss a bit - Subscribe for LBRY technical updates</h3>
+export default () => html`
+  <div id="emailSubscribe" class="newsletter-cta">
+    <h3 class="newsletter-cta__title">Don't miss a bit - Subscribe for LBRY technical updates</h3>
 
-      <div>
-        <input class="newsletter-cta__input" id="emailAddress" placeholder="you@domain.tld" type="text"/>
-        <button class="newsletter-cta__submit" data-action="subscribe to newsletter" title="Subscribe to our technical newsletter" type="button">Subscribe</a>
-      </div>
-
-      <p class="newsletter-cta__message" id="emailMessage"></p>
+    <div>
+      <input class="newsletter-cta__input" id="emailAddress" placeholder="you@domain.tld" type="text"/>
+      <button class="newsletter-cta__submit" data-action="subscribe to newsletter" title="Subscribe to our technical newsletter" type="button">Subscribe</a>
     </div>
-  `;
-}
+
+    <p class="newsletter-cta__message" id="emailMessage"></p>
+  </div>
+`;
diff --git a/app/components/feature-links.js b/app/components/feature-links.js
index 00c193b..4708e54 100644
--- a/app/components/feature-links.js
+++ b/app/components/feature-links.js
@@ -41,7 +41,7 @@ const links = [ // TODO: Update images
 
 //  E X P O R T
 
-export default function () {
+export default () => {
   const renderedLinks = [];
   let imageLink = "";
 
@@ -53,7 +53,7 @@ export default function () {
   return `
     <div class="feature-links">${renderedLinks.join("")}</div>
   `;
-}
+};
 
 
 
diff --git a/app/components/link-grid.js b/app/components/link-grid.js
index e21a861..561672e 100644
--- a/app/components/link-grid.js
+++ b/app/components/link-grid.js
@@ -10,7 +10,7 @@ import html from "choo/html";
 
 //  E X P O R T
 
-export default (links) => {
+export default links => {
   const renderedLinks = links.map((link) =>
     returnLinkTemplate(link.title, link.description, link.destination, link.label));
 
diff --git a/app/components/mission-statement.js b/app/components/mission-statement.js
index e4e9857..b0f2a07 100644
--- a/app/components/mission-statement.js
+++ b/app/components/mission-statement.js
@@ -10,16 +10,14 @@ import html from "choo/html";
 
 //  E X P O R T
 
-export default function () {
-  return html`
-    <div class="component--mission-statement">
-      <strong class="component--mission-statement__title">Mission Statement</strong>
-      To create a market for accessing and publishing information<sup><a class="__plain" href="#footnote-1" title="First footnote of our mission statement">1</a></sup>
-      that is global<sup><a class="__plain" href="#footnote-2" title="Second footnote of our mission statement">2</a></sup>,
-      decentralized<sup><a class="__plain" href="#footnote-3" title="Third footnote of our mission statement">3</a></sup>,
-      robust<sup><a class="__plain" href="#footnote-4" title="Fourth footnote of our mission statement">4</a></sup>,
-      optimal<sup><a class="__plain" href="#footnote-5" title="Fifth footnote of our mission statement">5</a></sup>
-      and complete<sup><a class="__plain" href="#footnote-6" title="Sixth footnote of our mission statement">6</a></sup>.
-    </div>
-  `;
-}
+export default () => html`
+  <div class="component--mission-statement">
+    <strong class="component--mission-statement__title">Mission Statement</strong>
+    To create a market for accessing and publishing information<sup><a class="__plain" href="#footnote-1" title="First footnote of our mission statement">1</a></sup>
+    that is global<sup><a class="__plain" href="#footnote-2" title="Second footnote of our mission statement">2</a></sup>,
+    decentralized<sup><a class="__plain" href="#footnote-3" title="Third footnote of our mission statement">3</a></sup>,
+    robust<sup><a class="__plain" href="#footnote-4" title="Fourth footnote of our mission statement">4</a></sup>,
+    optimal<sup><a class="__plain" href="#footnote-5" title="Fifth footnote of our mission statement">5</a></sup>
+    and complete<sup><a class="__plain" href="#footnote-6" title="Sixth footnote of our mission statement">6</a></sup>.
+  </div>
+`;
diff --git a/app/components/playground.js b/app/components/playground.js
index efd182e..37f6371 100644
--- a/app/components/playground.js
+++ b/app/components/playground.js
@@ -12,17 +12,15 @@ import raw from "choo/html/raw";
 
 //  E X P O R T
 
-export default () => {
-  return dedent`
-    <section class="tour">
-      <ul class="tour__navigation">
-        ${raw(navigation())}
-      </ul>
-      <p class="tour__description" id="tour-example-description"></p>
-      <section class="tour__content">${raw(example1())}</section>
-    </section>
-  `;
-};
+export default () => dedent`
+  <section class="playground">
+    <ul class="playground__navigation">
+      ${raw(navigation())}
+    </ul>
+    <p class="playground__description" id="playground-example-description"></p>
+    <section class="playground__content">${raw(example1())}</section>
+  </section>
+`;
 
 
 
@@ -30,16 +28,16 @@ export default () => {
 
 function example1() {
   return html`
-    <div class="tour__content__urlbar" id="tour-url">
+    <div class="playground__content__urlbar" id="playground-url">
       <span>lbry://</span><input id="fetch-claim-uri" placeholder="&thinsp;Enter a LBRY address or select a video below" type="text"/>
       <button class="button" data-action="execute claim" type="button">Resolve</button>
     </div>
 
-    <div class="tour__content__trends" id="tour-loader"></div>
-    <div id="tour-results"></div>
+    <div class="playground__content__trends" id="playground-loader"></div>
+    <div id="playground-results"></div>
 
     <script>
-      document.getElementById("tour-example-description").textContent = document.querySelector("[data-action='tour, example 1']").dataset.description
+      document.getElementById("playground-example-description").textContent = document.querySelector("[data-action='playground, example 1']").dataset.description
     </script>
   `;
 }
@@ -47,8 +45,8 @@ function example1() {
 function navigation() { // TODO: Save tutorial position to localStorage
   return dedent`
     <li
-      class="tour__navigation__example"
-      data-action="tour, example 1"
+      class="playground__navigation__example"
+      data-action="playground, example 1"
       data-description="In this example, you can see what runs under the hood when selecting content to view in the LBRY app."
       data-example="1"
       data-success="<strong>Success</strong> You resolved a claim, which is a <em>fancy</em> way of saying you searched for a piece of content and got back all the metadata associated with it (if it exists)."
@@ -58,8 +56,8 @@ function navigation() { // TODO: Save tutorial position to localStorage
     </li>
 
     <li
-      class="tour__navigation__example"
-      data-action="tour, example 2"
+      class="playground__navigation__example"
+      data-action="playground, example 2"
       data-description="Sometimes you want to create content, not just consume it. In this example, you can create a meme and upload it to LBRY!"
       data-example="2"
       data-success="<strong>Meme-a-riffic</strong> You've just contributed to the growing expanse that is the meme industry. Where will your meme go next? YOU DECIDE!"
@@ -69,8 +67,8 @@ function navigation() { // TODO: Save tutorial position to localStorage
     </li>
 
     <li
-      class="tour__navigation__example"
-      data-action="tour, example 3"
+      class="playground__navigation__example"
+      data-action="playground, example 3"
       data-description="In the LBRY app, you can financially support your favorite creators by donating LBRY Coin (LBC). In this example, we are donating LBC in your stead."
       data-example="3"
       data-success="<strong>Kudos</strong> You've just supported a creator with LBC (or, LBRY credits) with our own stash of LBC (you'd use your own IRL). You're basically saying, 'thanks for this great content, please continue!' and that's awesome. You're awesome."
diff --git a/app/components/resources-link-grid.js b/app/components/resources-link-grid.js
index 5e01c60..5bc7d33 100644
--- a/app/components/resources-link-grid.js
+++ b/app/components/resources-link-grid.js
@@ -1,27 +1,37 @@
 "use strict";
 
-import linkGrid from "./link-grid";
 
-export default () => {
-  return linkGrid([{
-    title: "Whitepaper",
-    description: "Read the formal specification for LBRY.",
-    destination: "/whitepaper",
-    label: "Study the Paper"
-  }, {
-    title: "Contributor's Guide",
-    description: "Can you code, design, write or test? Join us!",
-    destination: "/contribute",
-    label: "Read the Guide"
-  }, {
-    title: "SDK APIs",
-    description: "Method signatures and examples for lbry-sdk, the most common way to build on LBRY.",
-    destination: "/api/sdk",
-    label: "SDK APIs"
-  }, {
-    title: "Blockchain APIs",
-    description: "Method signatures and examples for lbrycrd, the LBRY blockchain.",
-    destination: "/api/blockchain",
-    label: "Blockchain APIs"
-  }]);
-};
+
+//  P A C K A G E
+
+import { require as local } from "app-root-path";
+
+//  V A R I A B L E
+
+const linkGrid = local("app/components/link-grid").default;
+
+
+
+//  E X P O R T
+
+export default () => linkGrid([{
+  description: "Read the formal specification for LBRY.",
+  destination: "/whitepaper",
+  label: "Study the Paper",
+  title: "Whitepaper"
+}, {
+  description: "Can you code, design, write or test? Join us!",
+  destination: "/contribute",
+  label: "Read the Guide",
+  title: "Contributor's Guide"
+}, {
+  description: "Method signatures and examples for lbry-sdk, the most common way to build on LBRY.",
+  destination: "/api/sdk",
+  label: "SDK APIs",
+  title: "SDK APIs"
+}, {
+  description: "Method signatures and examples for lbrycrd, the LBRY blockchain.",
+  destination: "/api/blockchain",
+  label: "Blockchain APIs",
+  title: "Blockchain APIs"
+}]);
diff --git a/app/dist/scripts/sockets.js b/app/dist/scripts/sockets.js
index 3ba452e..0b46aff 100644
--- a/app/dist/scripts/sockets.js
+++ b/app/dist/scripts/sockets.js
@@ -32,19 +32,19 @@ function initializeWebSocketConnection() {
         document.querySelector(data.selector).innerHTML = data.html;
 
         if (!document.querySelector(`[data-example="${data.example}"`).classList.contains("completed"))
-          document.getElementById("tour-example-description").classList.remove("success");
+          document.getElementById("playground-example-description").classList.remove("success");
 
         document.querySelector(`[data-example="${data.example}"`).classList.add("completed");
-        document.getElementById("tour-example-description").classList.add("success");
+        document.getElementById("playground-example-description").classList.add("success");
 
-        document.getElementById("tour-example-description").innerHTML =
+        document.getElementById("playground-example-description").innerHTML =
           document.querySelector(`[data-example="${data.example}"`).dataset.success;
 
         if (document.getElementById("temp-loader"))
           document.getElementById("temp-loader").style.display = "none";
 
-        if (document.querySelector(".tour"))
-          document.querySelector(".tour").classList.remove("waiting");
+        if (document.querySelector(".playground"))
+          document.querySelector(".playground").classList.remove("waiting");
 
         break;
 
@@ -58,22 +58,22 @@ function initializeWebSocketConnection() {
           initCanvas(); // eslint-disable-line
 
           setTimeout(() => {
-            document.querySelector(".tour__content__meme__canvas__thumbnail").click();
+            document.querySelector(".playground__content__meme__canvas__thumbnail").click();
           }, 500);
         }
 
-        if (document.getElementById("tour-example-description")) {
-          document.getElementById("tour-example-description").classList.remove("success");
+        if (document.getElementById("playground-example-description")) {
+          document.getElementById("playground-example-description").classList.remove("success");
 
-          document.getElementById("tour-example-description").innerHTML =
-            document.querySelector(".tour__navigation__example.active").dataset.description;
+          document.getElementById("playground-example-description").innerHTML =
+            document.querySelector(".playground__navigation__example.active").dataset.description;
         }
 
         if (document.getElementById("temp-loader"))
           document.getElementById("temp-loader").style.display = "none";
 
-        if (document.querySelector(".tour"))
-          document.querySelector(".tour").classList.remove("waiting");
+        if (document.querySelector(".playground"))
+          document.querySelector(".playground").classList.remove("waiting");
 
         break;
 
diff --git a/app/helpers/fetch-metadata.js b/app/helpers/fetch-metadata.js
index df646fb..7324393 100644
--- a/app/helpers/fetch-metadata.js
+++ b/app/helpers/fetch-metadata.js
@@ -103,7 +103,7 @@ module.exports = exports = (data, socket) => {
             logSlackError(
               "\n" +
               "> *DAEMON ERROR:* ```" + JSON.parse(JSON.stringify(publishResponse.error)) + "```" + "\n" +
-              "> _Cause: Someone is going through the Tour after a response has been parsed_\n"
+              "> _Cause: Someone is going through the Playground after a response has been parsed_\n"
             );
           }
 
@@ -122,7 +122,7 @@ module.exports = exports = (data, socket) => {
           publishResponse.result &&
           publishResponse.result.claim_address
         ) explorerNotice = `
-          <p class="tour__description success">To see Proof of Work (lol) that your meme is on the LBRY blockchain, <a href="https://explorer.lbry.io/address/${publishResponse.result.claim_address}" rel="noopener noreferrer" target="_blank" title="Your meme, on our blockchain explorer">check it out</a> on our blockchain explorer! Please note that it may take a couple minutes for the transaction to be confirmed.</p><br/>
+          <p class="playground__description success">To see Proof of Work (lol) that your meme is on the LBRY blockchain, <a href="https://explorer.lbry.io/address/${publishResponse.result.claim_address}" rel="noopener noreferrer" target="_blank" title="Your meme, on our blockchain explorer">check it out</a> on our blockchain explorer! Please note that it may take a couple minutes for the transaction to be confirmed.</p><br/>
         `;
 
         return socket.send(JSON.stringify({
@@ -190,7 +190,7 @@ module.exports = exports = (data, socket) => {
           logSlackError(
             "\n" +
             "> *DAEMON ERROR:* ```" + JSON.parse(JSON.stringify(error)) + "```" + "\n" +
-            "> _Cause: Someone is going through the Tour_\n"
+            "> _Cause: Someone is going through the Playground_\n"
           );
         }
 
@@ -202,7 +202,7 @@ module.exports = exports = (data, socket) => {
           logSlackError(
             "\n" +
             "> *DAEMON ERROR:* ```" + JSON.parse(JSON.stringify(body.error.message)) + "```" + "\n" +
-            "> _Cause: Someone is going through the Tour after a response has been parsed_\n"
+            "> _Cause: Someone is going through the Playground after a response has been parsed_\n"
           );
         }
 
@@ -216,7 +216,7 @@ module.exports = exports = (data, socket) => {
         body.result &&
         body.result.txid
       ) explorerNotice = `
-        <p class="tour__description success">If you want proof of the tip you just gave on behalf of LBRY, <a href="https://explorer.lbry.io/tx/${body.result.txid}" rel="noopener noreferrer" target="_blank" title="Your tip, on our blockchain explorer">check it out</a> on our blockchain explorer! Please note that it may take a couple minutes for the transaction to be confirmed.</p><br/>
+        <p class="playground__description success">If you want proof of the tip you just gave on behalf of LBRY, <a href="https://explorer.lbry.io/tx/${body.result.txid}" rel="noopener noreferrer" target="_blank" title="Your tip, on our blockchain explorer">check it out</a> on our blockchain explorer! Please note that it may take a couple minutes for the transaction to be confirmed.</p><br/>
       `;
 
       if (socket) {
diff --git a/app/sass/bundle.scss b/app/sass/bundle.scss
index 0d14ce4..7af1e54 100755
--- a/app/sass/bundle.scss
+++ b/app/sass/bundle.scss
@@ -30,7 +30,7 @@
   "pages/documentation",
   "pages/home",
   "pages/page",
-  "pages/tour",
+  "pages/playground",
 
   "plugins/prism"
 ;
diff --git a/app/sass/pages/_api.scss b/app/sass/pages/_api.scss
index 93300e2..0089205 100644
--- a/app/sass/pages/_api.scss
+++ b/app/sass/pages/_api.scss
@@ -15,9 +15,18 @@
   }
 }
 
-.api__header
-{
+.api__header {
   padding: 2rem;
+  position: relative;
+
+  &::after {
+    width: 100%; height: 1px;
+    bottom: -1px; left: 0;
+
+    background-color: rgba($gray, 0.3);
+    content: "";
+    position: absolute;
+  }
 }
 
 
diff --git a/app/sass/pages/_tour.scss b/app/sass/pages/_playground.scss
similarity index 87%
rename from app/sass/pages/_tour.scss
rename to app/sass/pages/_playground.scss
index 62e80bc..e6022ff 100644
--- a/app/sass/pages/_tour.scss
+++ b/app/sass/pages/_playground.scss
@@ -1,13 +1,13 @@
 /**
- * Tour | Wrapper
+ * Playground | Wrapper
  *
- * @class     .tour
+ * @class     .playground
  * @selector  {::before}
  * @selector  {::after}
  * @state     {.waiting}
  */
 
-.tour {
+.playground {
   border-top: 1px solid rgba($black, 0.05);
   position: relative;
   top: 1rem;
@@ -31,18 +31,18 @@
 
 
 /**
- * Tour | Navigation
+ * Playground | Navigation
  *
- * @class     .tour__navigation
+ * @class     .playground__navigation
  *
- * @class     .tour__navigation__example
+ * @class     .playground__navigation__example
  * @selector  {::before}
  * @selector  {:last-of-type}
  * @state     {.active}
  * @state     {:hover}
  */
 
-.tour__navigation {
+.playground__navigation {
   width: 100%;
 
   list-style-type: none;
@@ -54,7 +54,7 @@
   }
 }
 
-.tour__navigation__example {
+.playground__navigation__example {
   cursor: pointer;
   float: left;
   position: relative;
@@ -129,30 +129,30 @@
 
 
 /**
- * Tour | Content
+ * Playground | Content
  *
- * @class     .tour__content
+ * @class     .playground__content
  *
- * @class     .tour__content__meme
+ * @class     .playground__content__meme
  * @selector  {::after}
  *
- * @class     .tour__content__meme__canvas
+ * @class     .playground__content__meme__canvas
  *
- * @class     .tour__content__meme__canvas__thumbnail
+ * @class     .playground__content__meme__canvas__thumbnail
  * @selector  {:last-of-type}
  * @state     {.selected}
  *
- * @class     .tour__content__meme__editor
+ * @class     .playground__content__meme__editor
  *
- * @class     .tour__content__trends
+ * @class     .playground__content__trends
  * @selector  {::after}
  * @state     {:empty}
  *
- * @class     .tour__content__trend
- * @class     .tour__content__urlbar
+ * @class     .playground__content__trend
+ * @class     .playground__content__urlbar
  */
 
-.tour__content {
+.playground__content {
   border-top: 1px solid rgba($black, 0.05);
   overflow-y: visible;
   padding-bottom: 1rem;
@@ -176,7 +176,7 @@
   }
 }
 
-.tour__content__meme {
+.playground__content__meme {
   overflow-y: auto;
   position: relative;
 
@@ -185,7 +185,7 @@
   }
 }
 
-.tour__content__meme__canvas {
+.playground__content__meme__canvas {
   float: left;
   margin-right: 2%;
   position: relative;
@@ -199,7 +199,7 @@
   }
 }
 
-.tour__content__meme__canvas__thumbnail {
+.playground__content__meme__canvas__thumbnail {
   width: 5rem; height: 5rem;
 
   border-style: solid;
@@ -222,7 +222,7 @@
   }
 }
 
-.tour__content__meme__editor {
+.playground__content__meme__editor {
   float: right;
   width: 50%;
 
@@ -336,7 +336,7 @@
   }
 }
 
-.tour__content__trends {
+.playground__content__trends {
   min-width: 0; min-height: 0;
 
   display: grid;
@@ -353,7 +353,7 @@
   }
 }
 
-.tour__content__trend {
+.playground__content__trend {
   img {
     width: 100%; height: 213px;
 
@@ -379,7 +379,7 @@
   }
 }
 
-.tour__content__urlbar {
+.playground__content__urlbar {
   border: 1px solid rgba($black, 0.05);
   display: flex;
   margin-bottom: 1rem;
@@ -455,12 +455,12 @@
 
 
 /**
- * Tour | Description
+ * Playground | Description
  *
- * @class .tour__description
+ * @class .playground__description
  */
 
-.tour__description {
+.playground__description {
   cursor: default;
   font-size: 1rem;
   line-height: 1.33;
diff --git a/app/sockets.js b/app/sockets.js
index 60e1ec9..2ba496b 100644
--- a/app/sockets.js
+++ b/app/sockets.js
@@ -36,36 +36,36 @@ module.exports = exports = (socket, action) => {
       });
       break;
 
-    case (action.message === "landed on tour"):
+    case (action.message === "landed on playground"):
       generateContent(1, result => {
         socket.send(JSON.stringify({
           "html": result,
           "message": "updated html",
-          "selector": "#tour-loader"
+          "selector": "#playground-loader"
         }));
       });
       break;
 
-    case (action.message === "request for tour, example 1"):
+    case (action.message === "request for playground, example 1"):
       generateContent(1, result => {
         socket.send(JSON.stringify({
           "html": result,
           "message": "updated html",
-          "selector": "#tour-loader"
+          "selector": "#playground-loader"
         }));
       });
       break;
 
-    case (action.message === "request for tour, example 2"):
+    case (action.message === "request for playground, example 2"):
       generateMemeCreator(socket);
       break;
 
-    case (action.message === "request for tour, example 3"):
+    case (action.message === "request for playground, example 3"):
       generateContent(3, result => {
         socket.send(JSON.stringify({
           "html": result,
           "message": "updated html",
-          "selector": "#tour-loader"
+          "selector": "#playground-loader"
         }));
       });
       break;
@@ -101,7 +101,7 @@ function generateContent(exampleNumber, displayTrendingContent) {
         for (const part of collection) {
           try {
             renderedContentCollection.push(`
-              <figure class="tour__content__trend">
+              <figure class="playground__content__trend">
                 <img alt="${part.name}" data-action="choose claim" data-claim-id="${part.name}" src="${part.value.stream.metadata.thumbnail}"/>
 
                 <figcaption data-action="choose claim" data-claim-id="${part.name}">
@@ -117,7 +117,7 @@ function generateContent(exampleNumber, displayTrendingContent) {
 
         renderedContentCollection.push(`
           <script>
-            document.getElementById("tour-example-description").innerHTML = document.querySelector("[data-action='tour, example 1']").dataset.description
+            document.getElementById("playground-example-description").innerHTML = document.querySelector("[data-action='playground, example 1']").dataset.description
           </script>
         `);
 
@@ -155,7 +155,7 @@ function generateContent(exampleNumber, displayTrendingContent) {
           part.channel_name
         ) {
           renderedContentCollection.push(`
-            <figure class="tour__content__trend">
+            <figure class="playground__content__trend">
               <img alt="${part.name}" data-action="choose claim" data-claim-id="${part.claim_id}" src="${part.value.stream.metadata.thumbnail}"/>
               <figcaption data-action="choose claim" data-claim-id="${part.claim_id}">
                 ${part.value.stream.metadata.title}
@@ -168,7 +168,7 @@ function generateContent(exampleNumber, displayTrendingContent) {
 
       renderedContentCollection.push(`
         <script>
-          document.getElementById("tour-example-description").innerHTML = document.querySelector("[data-action='tour, example 3']").dataset.description
+          document.getElementById("playground-example-description").innerHTML = document.querySelector("[data-action='playground, example 3']").dataset.description
         </script>
       `);
 
@@ -215,17 +215,17 @@ function generateMemeCreator(socket) {
   const renderedImages = [];
 
   for (const image of images)
-    renderedImages.push(`<img alt="${image.alt}" class="tour__content__meme__canvas__thumbnail" src="${image.src}"/>`);
+    renderedImages.push(`<img alt="${image.alt}" class="playground__content__meme__canvas__thumbnail" src="${image.src}"/>`);
 
   const memeCreator = html`
-    <div class="tour__content__meme__canvas">
+    <div class="playground__content__meme__canvas">
       <img alt="Base image for LBRY meme creator" id="base-image" style="height: 0; position: absolute; visibility: hidden;"/>
       <canvas id="meme-canvas" height="600" width="800">Unfortunately, it looks like canvas is <strong>not supported</strong> in your browser</canvas>
 
       ${renderedImages}
     </div>
 
-    <form class="tour__content__meme__editor">
+    <form class="playground__content__meme__editor">
       <h2>Image Text</h2>
 
       <fieldset>
@@ -294,7 +294,7 @@ function generateMemeCreator(socket) {
     "example": 2,
     "html": memeCreator,
     "message": "updated html",
-    "selector": "#tour-loader"
+    "selector": "#playground-loader"
   }));
 }
 
diff --git a/app/views/redirect.js b/app/views/redirect.js
index a8584e3..e694d9b 100644
--- a/app/views/redirect.js
+++ b/app/views/redirect.js
@@ -71,7 +71,7 @@ module.exports = exports = (state, emit) => { // eslint-disable-line
   let pageScript = "";
   if (path === "glossary") pageScript = "<script>" + fs.readFileSync("./app/components/client/glossary-scripts.js", "utf-8") + "</script>";
   if (path === "overview") pageScript = "<script>" + fs.readFileSync("./app/components/client/ecosystem-scripts.js", "utf-8") + "</script>";
-  if (path === "playground") pageScript = "<script>" + fs.readFileSync("./app/components/client/tour-scripts.js", "utf-8") + "</script>";
+  if (path === "playground") pageScript = "<script>" + fs.readFileSync("./app/components/client/playground-scripts.js", "utf-8") + "</script>";
 
   return html`
     <article class="page" itemtype="http://schema.org/BlogPosting">
diff --git a/documents/overview.md b/documents/overview.md
index eb7a8d1..809c1b4 100644
--- a/documents/overview.md
+++ b/documents/overview.md
@@ -32,6 +32,6 @@ Learn more about how LBRY works from this ecosystem overview.
 
 ## Keep Diving
 
-- Explore live metadata and add your own blockchain entry on [the Tour](/tour).
+- Explore live metadata and add your own blockchain entry on [the Playground](/playground).
 - Read the whitepaper, the API specification and other documentation in [Resources](/resources).
 - Learn how to [contribute to LBRY](/contribute) or [build your own application](/build).