diff --git a/audino/frontend/src/app.js b/audino/frontend/src/app.js
index 23e184a9..5cbd0921 100644
--- a/audino/frontend/src/app.js
+++ b/audino/frontend/src/app.js
@@ -15,7 +15,8 @@ import {
   Labels,
   LabelValues,
   Data,
-  CreateUser
+  CreateUser,
+  LoginPage
 } from './pages';
 import NavBar from './containers/navbar';
 
@@ -142,11 +143,12 @@ class App extends React.Component {
                       // window.location.href.includes("/newUser")
                       return <Redirect {...props} to="/newUser" />;
                     }
-                    return <Home {...props} />;
+                    return <Home {...props} history={history}/>;
                   }
                   return <Redirect {...props} to="/dashboard" />;
                 }}
               />
+              <PublicRoute exact path="/login" component={LoginPage} history={history} />
               <PublicRoute exact path="/newUser" component={CreateUser} />
               <Route path="/empty" component={null} key="empty" />
               <PrivateRoute exact path="/admin" component={Admin} />
diff --git a/audino/frontend/src/containers/navbar.js b/audino/frontend/src/containers/navbar.js
index 314488cb..42a667d0 100644
--- a/audino/frontend/src/containers/navbar.js
+++ b/audino/frontend/src/containers/navbar.js
@@ -35,8 +35,8 @@ class NavBar extends React.Component {
     const isAdmin = store.get('isAdmin');
 
     return (
-      <nav className="navbar navbar-expand-md bg-dark navbar-dark">
-        <Link to="/" className="navbar-brand">
+      <nav className="navbar navbar-expand-md bg-dark navbar-dark" >
+        <Link to="/" className="navbar-brand" style={{marginRight: 0}}>
           Pyrenote
         </Link>
 
@@ -45,12 +45,21 @@ class NavBar extends React.Component {
           type="button"
           data-toggle="collapse"
           data-target="#collapsibleNavbar"
+          style={{marginLeft: 0}}
         >
           <span className="navbar-toggler-icon" />
         </button>
 
+
+        <div className="collapse navbar-collapse" id="collapsibleNavbar"
+          style={{
+            marginLeft: 0,
+            justifyContent: "right"
+          
+          }}
+        >
         {isUserLoggedIn && (
-          <div className="collapse navbar-collapse" id="collapsibleNavbar">
+         
             <ul className="navbar-nav">
               <li className="nav-item">
                 <Link className="nav-link" to="/dashboard">
@@ -74,8 +83,26 @@ class NavBar extends React.Component {
                 </button>
               </li>
             </ul>
-          </div>
         )}
+        
+        {!isUserLoggedIn && window.location.href.includes('/login') && (
+            <ul className="navbar-nav">
+              <li className="nav-item">
+                <Link className="nav-link" to="/">
+                  Head back to landing page!
+                </Link>
+              </li>
+            </ul>
+        ) || (
+          <ul className="navbar-nav">
+            <li className="nav-item">
+              <Link className="nav-link" to="/login">
+                login
+              </Link>
+            </li>
+          </ul>
+        )}
+        </div>
       </nav>
     );
   }
diff --git a/audino/frontend/src/images/Engineers4Exploration.PNG b/audino/frontend/src/images/Engineers4Exploration.PNG
new file mode 100644
index 00000000..b0f29cfb
Binary files /dev/null and b/audino/frontend/src/images/Engineers4Exploration.PNG differ
diff --git a/audino/frontend/src/images/Landing Page Links.docx b/audino/frontend/src/images/Landing Page Links.docx
new file mode 100644
index 00000000..cf6c4ce7
Binary files /dev/null and b/audino/frontend/src/images/Landing Page Links.docx differ
diff --git a/audino/frontend/src/images/Lyrebird.jpg b/audino/frontend/src/images/Lyrebird.jpg
new file mode 100644
index 00000000..ebd5eb64
Binary files /dev/null and b/audino/frontend/src/images/Lyrebird.jpg differ
diff --git a/audino/frontend/src/images/PyrenoteLabelExample.png b/audino/frontend/src/images/PyrenoteLabelExample.png
new file mode 100644
index 00000000..10c206f0
Binary files /dev/null and b/audino/frontend/src/images/PyrenoteLabelExample.png differ
diff --git a/audino/frontend/src/images/Sdzwa-green.svg b/audino/frontend/src/images/Sdzwa-green.svg
new file mode 100644
index 00000000..65d8521a
--- /dev/null
+++ b/audino/frontend/src/images/Sdzwa-green.svg
@@ -0,0 +1,40 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="354.136" height="115" viewBox="0 0 354.136 115">
+  <g id="Group_82" data-name="Group 82" transform="translate(-73.379 -338.59)">
+    <circle id="Ellipse_10" data-name="Ellipse 10" cx="57.5" cy="57.5" r="57.5" transform="translate(73.379 338.59)" fill="#fff"/>
+    <g id="Group_79" data-name="Group 79" transform="translate(85.733 354.314)">
+      <path id="Path_1360" data-name="Path 1360" d="M498.57,449.111v-6.064a11.182,11.182,0,0,0,7.829,3.4c1.476,0,2.246-.578,2.246-1.6,0-.77-.417-1.187-1.541-1.6l-4.076-1.572a6.315,6.315,0,0,1-4.365-6.1c0-4.235,3.657-7.124,8.6-7.124A11.246,11.246,0,0,1,514,430.472v5.968a10.632,10.632,0,0,0-6.481-2.631c-1.156,0-1.892.513-1.892,1.283,0,.705.416,1.122,1.379,1.476l3.784,1.507a6.246,6.246,0,0,1,4.268,6.223c0,4.716-3.529,7.571-9.047,7.571A10.583,10.583,0,0,1,498.57,449.111Z" transform="translate(-398.856 -411.391)" fill="#215732"/>
+      <path id="Path_1361" data-name="Path 1361" d="M589.182,466.9c0,3.5-1.637,5.2-4.2,5.2a3.756,3.756,0,0,1-3.4-1.6,6.047,6.047,0,0,1-4.62,1.6c-3.079,0-5.487-1.926-5.487-4.685s2.054-4.685,5.9-5.359l3.4-.609c-.224-.994-1.348-1.7-3.113-1.7a7.328,7.328,0,0,0-5.744,2.47c0-4.974,3.113-7.124,7.316-7.124,4.813,0,7.316,2.6,7.316,7.027V465.9c0,.835.385,1.476,1.348,1.476A1.819,1.819,0,0,0,589.182,466.9Zm-8.373-.031V464.91l-1.83.417c-1.026.224-1.476.674-1.476,1.348a1.155,1.155,0,0,0,1.314,1.122A2.3,2.3,0,0,0,580.808,466.867Z" transform="translate(-454.205 -431.617)" fill="#215732"/>
+      <path id="Path_1362" data-name="Path 1362" d="M665.953,461.258v10.364h-5.742V462.7a2.042,2.042,0,0,0-2.054-2.181,2.715,2.715,0,0,0-2.566,1.83v9.274H649.85V455.581h5.742v1.83a5.509,5.509,0,0,1,4.589-2.311C664.061,455.1,665.953,457.633,665.953,461.258Z" transform="translate(-513.716 -431.625)" fill="#215732"/>
+      <path id="Path_1363" data-name="Path 1363" d="M774.545,441.668c0,7.251-5.359,11.231-11.9,11.231H753.53V430.44h9.112C769.186,430.44,774.545,434.419,774.545,441.668Zm-6.288,0c0-4.138-2.728-6.127-6.192-6.127h-2.535V447.8h3.113C765.529,447.8,768.256,445.775,768.256,441.668Z" transform="translate(-592.435 -412.902)" fill="#215732"/>
+      <path id="Path_1364" data-name="Path 1364" d="M847.89,427.129a3.163,3.163,0,1,1,3.144,3.017A3.006,3.006,0,0,1,847.89,427.129Zm.255,4.875h5.744v16.043h-5.744Z" transform="translate(-664.078 -408.05)" fill="#215732"/>
+      <path id="Path_1365" data-name="Path 1365" d="M891.412,467.075a7.953,7.953,0,0,0,4.878-1.283c0,3.883-2.5,6.322-7.283,6.322-5.518,0-8.727-3.368-8.727-8.342,0-5.166,3.175-8.662,8.311-8.662,4.878,0,7.925,3.305,7.925,9.208H886.344C886.6,466.24,888.973,467.075,891.412,467.075Zm-5.1-6.033h4.365a1.993,1.993,0,0,0-2.119-2.246A2.138,2.138,0,0,0,886.311,461.042Z" transform="translate(-688.671 -431.633)" fill="#215732"/>
+      <path id="Path_1366" data-name="Path 1366" d="M1021.14,463.569c0-5.487,4.2-8.469,8.92-8.469,4.747,0,8.92,2.983,8.92,8.469,0,5.518-4.17,8.534-8.92,8.534C1025.344,472.1,1021.14,469.087,1021.14,463.569Zm11.84,0c0-1.926-1.122-3.209-2.92-3.209-1.765,0-2.887,1.283-2.887,3.209s1.122,3.272,2.887,3.272C1031.856,466.841,1032.98,465.5,1032.98,463.569Z" transform="translate(-795.619 -431.625)" fill="#215732"/>
+      <path id="Path_1367" data-name="Path 1367" d="M1134.378,447.509v5.39H1114.42l10.33-17.1h-9.432V430.44h19.057L1124.2,447.509h10.174Z" transform="translate(-866.443 -412.902)" fill="#215732"/>
+      <path id="Path_1368" data-name="Path 1368" d="M1199.32,463.569c0-5.487,4.2-8.469,8.92-8.469,4.748,0,8.92,2.983,8.92,8.469,0,5.518-4.172,8.534-8.92,8.534C1203.523,472.1,1199.32,469.087,1199.32,463.569Zm11.84,0c0-1.926-1.122-3.209-2.92-3.209-1.765,0-2.886,1.283-2.886,3.209s1.122,3.272,2.886,3.272C1210.036,466.841,1211.16,465.5,1211.16,463.569Z" transform="translate(-930.903 -431.625)" fill="#215732"/>
+      <path id="Path_1369" data-name="Path 1369" d="M1277.04,463.569c0-5.487,4.2-8.469,8.92-8.469,4.747,0,8.92,2.983,8.92,8.469,0,5.518-4.172,8.534-8.92,8.534C1281.243,472.1,1277.04,469.087,1277.04,463.569Zm11.717,0c0-1.926-1.122-3.209-2.92-3.209-1.765,0-2.887,1.283-2.887,3.209s1.122,3.272,2.887,3.272C1287.635,466.841,1288.757,465.5,1288.757,463.569Z" transform="translate(-989.913 -431.625)" fill="#215732"/>
+      <path id="Path_1370" data-name="Path 1370" d="M528,556.08l-6.416,22.459h-5.968l-4.555-13.8-4.524,13.8h-5.971L494.15,556.08H500.5l3.464,14.245,4.365-14.245h5.486l4.362,14.245,3.464-14.245Z" transform="translate(-395.5 -508.294)" fill="#215732"/>
+      <path id="Path_1371" data-name="Path 1371" d="M640.58,552.769a3.163,3.163,0,1,1,3.144,3.017A3,3,0,0,1,640.58,552.769Zm.255,4.875h5.744v16.043h-5.744Z" transform="translate(-506.677 -503.443)" fill="#215732"/>
+      <path id="Path_1372" data-name="Path 1372" d="M678.29,552.08h5.744V575.5H678.29Z" transform="translate(-535.309 -505.258)" fill="#215732"/>
+      <path id="Path_1373" data-name="Path 1373" d="M728.069,552.08V575.5h-5.711v-1.411a5.066,5.066,0,0,1-4.235,1.892c-4.076,0-7.444-3.079-7.444-8.534s3.368-8.469,7.444-8.469a4.98,4.98,0,0,1,4.235,1.892V552.08Zm-5.711,16.363v-1.957a2.883,2.883,0,0,0-5.677.963,2.945,2.945,0,0,0,2.886,3.272A2.9,2.9,0,0,0,722.359,568.443Z" transform="translate(-559.901 -505.257)" fill="#215732"/>
+      <path id="Path_1374" data-name="Path 1374" d="M796.37,552.08h5.744V575.5H796.37Z" transform="translate(-624.962 -505.258)" fill="#215732"/>
+      <path id="Path_1375" data-name="Path 1375" d="M831.96,552.769a3.163,3.163,0,1,1,3.144,3.017A3,3,0,0,1,831.96,552.769Zm.255,4.875h5.744v16.043h-5.744Z" transform="translate(-651.984 -503.443)" fill="#215732"/>
+      <path id="Path_1376" data-name="Path 1376" d="M872.223,557.7v.737h4.2V563h-4.2v11.486h-5.711V563H863.4v-4.555h3.113v-.674c0-4.62,2.535-7.027,7.09-7.027a9.613,9.613,0,0,1,2.92.45v4.685a6.634,6.634,0,0,0-1.733-.258C872.96,555.62,872.223,556.487,872.223,557.7Z" transform="translate(-675.855 -504.24)" fill="#215732"/>
+      <path id="Path_1377" data-name="Path 1377" d="M929.582,592.715a7.952,7.952,0,0,0,4.877-1.283c0,3.883-2.5,6.322-7.283,6.322-5.518,0-8.727-3.368-8.727-8.342,0-5.166,3.175-8.662,8.311-8.662,4.877,0,7.925,3.305,7.925,9.208H924.514C924.767,591.88,927.143,592.715,929.582,592.715Zm-5.1-6.033h4.365a1.993,1.993,0,0,0-2.119-2.246A2.141,2.141,0,0,0,924.478,586.682Z" transform="translate(-717.652 -527.025)" fill="#215732"/>
+      <path id="Path_1378" data-name="Path 1378" d="M1026.879,573.951h-7.925l-1.572,4.589h-6.322l8.662-22.459h6.319l8.7,22.459h-6.288Zm-1.637-4.812-2.342-6.866-2.342,6.866Z" transform="translate(-787.966 -508.294)" fill="#215732"/>
+      <path id="Path_1379" data-name="Path 1379" d="M1114.89,552.08h5.744V575.5h-5.744Z" transform="translate(-866.8 -505.258)" fill="#215732"/>
+      <path id="Path_1380" data-name="Path 1380" d="M1152.07,552.08h5.744V575.5h-5.744Z" transform="translate(-895.029 -505.258)" fill="#215732"/>
+      <path id="Path_1381" data-name="Path 1381" d="M1187.65,552.769a3.163,3.163,0,1,1,3.144,3.017A3.006,3.006,0,0,1,1187.65,552.769Zm.258,4.875h5.744v16.043h-5.744Z" transform="translate(-922.043 -503.443)" fill="#215732"/>
+      <path id="Path_1382" data-name="Path 1382" d="M1239.082,592.539c0,3.5-1.637,5.2-4.2,5.2a3.756,3.756,0,0,1-3.4-1.6,6.047,6.047,0,0,1-4.62,1.6c-3.079,0-5.487-1.926-5.487-4.685s2.054-4.685,5.9-5.359l3.4-.609c-.224-.994-1.348-1.7-3.113-1.7a7.327,7.327,0,0,0-5.744,2.47c0-4.974,3.113-7.124,7.316-7.124,4.813,0,7.316,2.6,7.316,7.027v3.785c0,.835.385,1.476,1.348,1.476A1.826,1.826,0,0,0,1239.082,592.539Zm-8.375-.031V590.55l-1.83.417c-1.026.224-1.476.674-1.476,1.348a1.155,1.155,0,0,0,1.314,1.122A2.3,2.3,0,0,0,1230.706,592.507Z" transform="translate(-947.645 -527.01)" fill="#215732"/>
+      <path id="Path_1383" data-name="Path 1383" d="M1315.854,586.9v10.364h-5.742v-8.92a2.042,2.042,0,0,0-2.054-2.181,2.715,2.715,0,0,0-2.566,1.83v9.274h-5.742V581.221h5.742v1.83a5.51,5.51,0,0,1,4.589-2.311C1313.961,580.74,1315.854,583.273,1315.854,586.9Z" transform="translate(-1007.155 -527.018)" fill="#215732"/>
+      <path id="Path_1384" data-name="Path 1384" d="M1373.3,589.4c0-5.07,3.594-8.662,8.792-8.662a8.348,8.348,0,0,1,5.325,1.507v5.359a5.453,5.453,0,0,0-4.2-1.7c-2.374,0-3.946,1.122-3.946,3.144,0,1.957,1.507,3.337,4.172,3.337a6.546,6.546,0,0,0,4.3-1.314c0,4.685-2.374,6.673-6.257,6.673C1376.671,597.744,1373.3,594.535,1373.3,589.4Z" transform="translate(-1062.999 -527.018)" fill="#215732"/>
+      <path id="Path_1385" data-name="Path 1385" d="M1447.752,592.715a7.952,7.952,0,0,0,4.877-1.283c0,3.883-2.5,6.322-7.282,6.322-5.518,0-8.727-3.368-8.727-8.342,0-5.166,3.175-8.662,8.311-8.662,4.877,0,7.925,3.305,7.925,9.208h-10.172C1442.937,591.88,1445.313,592.715,1447.752,592.715Zm-5.1-6.033h4.362a1.993,1.993,0,0,0-2.119-2.246A2.137,2.137,0,0,0,1442.651,586.682Z" transform="translate(-1111.075 -527.025)" fill="#215732"/>
+      <path id="Path_1386" data-name="Path 1386" d="M962.072,465.68H957c-.578,0-1.38-.1-1.38-.77a.9.9,0,0,1,.193-.578,10.3,10.3,0,0,0,2.277.224c4.4,0,7.155-2.15,7.155-5.614a3.669,3.669,0,0,0-.022-.436c1.63-1.392,2.273-2.624,1.625-5.7a3.527,3.527,0,0,1-2.239,1.4,6.293,6.293,0,0,1-3.248-.371,10.2,10.2,0,0,0-3.272-.481c-4.427,0-7.124,2.15-7.124,5.583a5.133,5.133,0,0,0,1.861,4.076,3.509,3.509,0,0,0-.578,5.937,3.549,3.549,0,0,0-2.022,3.079c0,2.855,2.886,4.107,8.149,4.107,5.9,0,8.92-2.277,8.92-5.937C967.3,467.414,965.313,465.68,962.072,465.68Zm-3.98-8.566a1.853,1.853,0,1,1,0,3.691,1.853,1.853,0,1,1,0-3.691Zm.385,15.112c-2.6,0-3.175-.513-3.175-1.348a1.214,1.214,0,0,1,.224-.674,9.268,9.268,0,0,0,.929.065h4.62c.64,0,.994.258.994.739C962.072,471.745,961.4,472.226,958.478,472.226Z" transform="translate(-741.781 -429.886)" fill="#215732"/>
+      <path id="Path_1387" data-name="Path 1387" d="M665.953,461.258v10.364h-5.742V462.7a2.042,2.042,0,0,0-2.054-2.181,2.715,2.715,0,0,0-2.566,1.83v9.274H649.85V455.581h5.742v1.83a5.509,5.509,0,0,1,4.589-2.311C664.061,455.1,665.953,457.633,665.953,461.258Z" transform="translate(-513.716 -431.625)" fill="#215732"/>
+      <path id="Path_1388" data-name="Path 1388" d="M498.57,449.111v-6.064a11.182,11.182,0,0,0,7.829,3.4c1.476,0,2.246-.578,2.246-1.6,0-.77-.417-1.187-1.541-1.6l-4.076-1.572a6.315,6.315,0,0,1-4.365-6.1c0-4.235,3.657-7.124,8.6-7.124A11.246,11.246,0,0,1,514,430.472v5.968a10.632,10.632,0,0,0-6.481-2.631c-1.156,0-1.892.513-1.892,1.283,0,.705.416,1.122,1.379,1.476l3.784,1.507a6.246,6.246,0,0,1,4.268,6.223c0,4.716-3.529,7.571-9.047,7.571A10.583,10.583,0,0,1,498.57,449.111Z" transform="translate(-398.856 -411.391)" fill="#215732"/>
+      <g id="Group_78" data-name="Group 78" transform="translate(0 0)">
+        <path id="Path_1389" data-name="Path 1389" d="M308.341,471.1a3.62,3.62,0,0,0-3.621,3.621h7.242A3.623,3.623,0,0,0,308.341,471.1Z" transform="translate(-251.674 -443.773)" fill="#215732"/>
+        <path id="Path_1390" data-name="Path 1390" d="M128.317,357.59c-24.265,0-43.633,19.671-43.936,43.936-.27,21.513,19.652,43.746,43.936,43.936a43.936,43.936,0,1,0,0-87.872Zm36.552,39.061c0,3.789-4.841,6.069-4.841,6.069-6.351,3.476-14.035,3.395-14.035,3.395,4.964,1.784,12.439,1.81,17.3.436,1.382,8.563-3.561,17.837-3.561,17.837-12.723-3.4-19.031-11.527-19.031-11.527s3.659,10.164,15.605,16.587a47.039,47.039,0,0,1-10.316,7.456c-8.041-5.407-13.891-17.338-13.891-17.338.982,8.566,5.135,15.848,7.675,19.8a36.14,36.14,0,0,1-11.707,1.652,32.98,32.98,0,0,1-6.011-14.878c-1.416,6.647-1.076,9.883.026,14.409a38.482,38.482,0,0,1-11.12-3.527c-3.118-7.658.84-15.557.84-15.557a25.566,25.566,0,0,0,21.149-19.041,10.341,10.341,0,0,0-5.992-4.143s-1.336-9.293-9.2-12.117c1.057,2.764,2.843,8.573-.7,11.5a7.6,7.6,0,0,0-3.922-4.309,6.822,6.822,0,0,1-.383,5.836c-4.67.161-9.3-2.407-9.871-3.267a6.678,6.678,0,0,0-3.7-7.234s-3.857,4.839.219,7.985a29.937,29.937,0,0,0-10.412,8.354,38.238,38.238,0,0,1,.713-11.837c7.073-12.771,22.531-11.382,22.531-11.382a29.507,29.507,0,0,0-18.261.234,48.176,48.176,0,0,1,2.752-4.2c7.863-10.164,20.466-5.629,20.466-5.629a23.953,23.953,0,0,0-9.083-4.634,37.323,37.323,0,0,1,19.3-5.549,39.751,39.751,0,0,1,17.054,3.4c-10.711.311-12.471,9.635-12.471,9.635a8.263,8.263,0,0,0-8.159,6.3c1.187-.3,2.4-.566,4.006-.838,15.957-2.694,30.82,4.271,38.4,12.622a5.56,5.56,0,0,1-.621,1c-1.955-.339-3.659-.756-5.617-1.059C159.99,393.088,162.063,394.778,164.87,396.651Zm-55.386,8.166a2.622,2.622,0,0,1,5.243-.019Zm31.891-31.875h-4.6a2.3,2.3,0,0,1,4.6,0Z" transform="translate(-84.379 -357.59)" fill="#215732"/>
+      </g>
+    </g>
+  </g>
+</svg>
diff --git a/audino/frontend/src/images/UCSanDiegoLogo-BlueGold.png b/audino/frontend/src/images/UCSanDiegoLogo-BlueGold.png
new file mode 100644
index 00000000..bd02a614
Binary files /dev/null and b/audino/frontend/src/images/UCSanDiegoLogo-BlueGold.png differ
diff --git a/audino/frontend/src/pages/LoginPage.js b/audino/frontend/src/pages/LoginPage.js
new file mode 100644
index 00000000..86087be4
--- /dev/null
+++ b/audino/frontend/src/pages/LoginPage.js
@@ -0,0 +1,23 @@
+import React from 'react';
+import LoginForm from '../containers/forms/loginForm';
+import { Button } from '../components/button';
+
+const LoginPage = () => {
+  return (
+    <div className="container h-75 text-center">
+      <div className="row h-100 justify-content-center align-items-center">
+        <LoginForm />
+        <Button
+          size="lg"
+          type="primary"
+          onClick={() => {
+            window.location.href = `/newUser`;
+          }}
+          text="No Account? Sign up here!"
+        />
+      </div>
+    </div>
+  );
+};
+
+export default LoginPage;
diff --git a/audino/frontend/src/pages/home.js b/audino/frontend/src/pages/home.js
index 17be36e3..4d3b2abf 100644
--- a/audino/frontend/src/pages/home.js
+++ b/audino/frontend/src/pages/home.js
@@ -1,21 +1,157 @@
 import React from 'react';
-import LoginForm from '../containers/forms/loginForm';
 import { Button } from '../components/button';
+import spectrogramImage from '../images/PyrenoteLabelExample.png'
+import Lyrebird from '../images/Lyrebird.jpg'
+import { Link } from 'react-router-dom';
+import { faWindowRestore } from '@fortawesome/free-solid-svg-icons';
 
-const Home = () => {
-  return (
+const Home = (props) => {
+    return (
     <div className="container h-75 text-center">
-      <div className="row h-100 justify-content-center align-items-center">
-        <LoginForm />
-        <Button
-          size="lg"
-          type="primary"
-          onClick={() => {
-            window.location.href = `/newUser`;
-          }}
-          text="No Account? Sign up here!"
-        />
-      </div>
+        THIS IS THE HOME PAGE
+        <div className="row h-100 justify-content-center align-items-center" style={{display:"flex"}}>
+            <div style={{float: "left", width: "50%"}}>
+                <div style={{
+                    fontFamily: 'Montserrat',
+                    fontStyle: 'normal',
+                    fontWeight: 600,
+                    fontSize: '48px',
+                    lineHeight: '59px', 
+                    position:"relative",
+                    width: "100%"
+                }}>
+                    <text>Pyrenote: A web-based,
+                    manual annotation tool.</text>
+                </div>
+                <div style={{float: "left", position:"relative", display:"flex", width:"100%"}}>
+                    <Button
+                        type="primary"
+                        text="Join The Labeling Now!"
+                        onClick={() => {
+                            props.history.push('/login');
+                        }}
+                    />
+                    <Link 
+                        style={{float: "right", position:"relative", right:"0%"}} 
+                        to={{ pathname: "https://github.com/UCSD-E4E/Pyrenote" }} 
+                        target="_blank" >
+                    Get started on GitHub
+                    </Link>
+                </div>
+            </div>
+            <div style={{float: "left", display:"flex",  width: "50%"}}>
+                <img 
+                    src={spectrogramImage} 
+                    alt="Spectrogram Image" 
+                    style={{width: "100%"}}
+                />
+            </div>
+        </div>
+        <div className="row h-100 justify-content-center align-items-center" style={{display:"flex", backgroundColor: "#EFEFEF"}}>
+            <div className="justify-content-center align-items-center" style={{float: "left", width: "50%"}}>
+                <div style={{
+                    fontFamily: 'Montserrat',
+                    fontStyle: 'normal',
+                    fontWeight: 600,
+                    fontSize: '40px',
+                    lineHeight: '59px', 
+                    position:"relative",
+                    width: "100%",
+
+                }}>
+                    <text>What is Pyrenote?</text>
+                </div>
+                <div style={{
+                    fontFamily: 'Montserrat',
+                    fontStyle: 'normal',
+                    fontWeight: 400,
+                    fontSize: '24px',
+                    lineHeight: '29px', 
+                    position:"relative",
+                    width: "100%"
+                }}>
+                    <p>
+                        Pyrenote creates moment to moment, or “strong” labels, for audio data.
+                        Based on <a href="https://github.com/midas-research/audino">Audino</a>, Pyrenote displays a spectrogram for audio annotation, stores labels in a database, 
+                        and optimizes the labeling process through simplifying the user interface to produce high-quality 
+                        annotations in a short time frame.
+                    </p>
+                        
+                    <p>
+                        Pyrenote’s name is a combination of Python, Lyrebird, and note (such as making a note on a label)
+                    </p>
+                </div>
+                <Button
+                    type="primary"
+                    text="Check out the paper!"
+                    style={{width:"80%"}}
+                    onClick={() => {
+                        window.location = "https://ieeexplore.ieee.org/document/9637784";
+                    }}
+                />
+            </div>
+            <div style={{float: "left", display:"flex",  width: "50%"}}>
+                <img 
+                    src={Lyrebird} 
+                    alt="Spectrogram Image" 
+                    style={{width: "100%"}}
+                />
+                <div style={{
+                    fontFamily: 'Montserrat',
+                    fontStyle: 'normal',
+                    fontWeight: 400,
+                    fontSize: '24px',
+                    lineHeight: '29px', 
+                    position:"relative",
+                    width: "100%"
+                }}>
+                <Link 
+                    style={{float: "right", position:"relative", right:"0%"}} 
+                    to={{ pathname: "https://www.facebook.com/donwilsonphotography" }} 
+                    target="_blank" >
+                    Superb lyrebird (© Donovan Wilson).
+                </Link>
+                </div>
+            </div>
+        </div>
+        <div className="row h-100 justify-content-center align-items-center" style={{display:"flex"}}>
+            <div className="justify-content-center align-items-center" style={{float: "left", width: "50%"}}>
+            <div style={{
+                    fontFamily: 'Montserrat',
+                    fontStyle: 'normal',
+                    fontWeight: 600,
+                    fontSize: '40px',
+                    lineHeight: '59px', 
+                    position:"relative",
+                    width: "100%",
+
+                }}>
+                    <text>About</text>
+                </div>
+                <div style={{
+                    fontFamily: 'Montserrat',
+                    fontStyle: 'normal',
+                    fontWeight: 400,
+                    fontSize: '24px',
+                    lineHeight: '29px', 
+                    position:"relative",
+                    width: "100%"
+                }}>
+                    <p>
+                        Pyrenote is part of a larger effort to monitor ecosystems using passive acoustic monitoring. 
+                        Annotations created in Pyrenote will be used to train machine learning models to identify bird vocalizations in field data,
+                        which can then be used to calculate biodiversity metrics. 
+                    </p>
+                    <p>
+                        
+                        The <a href="https://e4e.ucsd.edu/acoustic-species-identification">Acoustic Species Identification</a> project is a collaboration between 
+                        <a href="https://e4e.ucsd.edu/">Engineers for Exploration</a> and the Population Sustainability group from the
+                        <a href="https://science.sandiegozoo.org/population-sustainability">San Diego Zoo Institute for Conservation Research</a>.
+
+                    </p>
+                </div>
+            </div>
+        </div>
     </div>
   );
 };
diff --git a/audino/frontend/src/pages/index.js b/audino/frontend/src/pages/index.js
index 78fc7a18..80eed740 100644
--- a/audino/frontend/src/pages/index.js
+++ b/audino/frontend/src/pages/index.js
@@ -7,5 +7,6 @@ import Home from './home';
 import Labels from './labels';
 import LabelValues from './labelValues';
 import CreateUser from './createUser';
+import LoginPage from './LoginPage';
 
-export { Admin, Dashboard, Error, Home, Labels, LabelValues, Data, Annotate, CreateUser };
+export { Admin, Dashboard, Error, Home, Labels, LabelValues, Data, Annotate, CreateUser, LoginPage };