diff --git a/src/main/webapp/preview/index.html b/src/main/webapp/preview/index.html
index 1bb7406..1095225 100644
--- a/src/main/webapp/preview/index.html
+++ b/src/main/webapp/preview/index.html
@@ -1,6 +1,7 @@
 ﻿<!DOCTYPE html>
 <html>
     <head>
+        <title>BauDas</title>
         <!--Import Google Icon Font-->
         <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
         <!--Import materialize.css-->
@@ -28,11 +29,11 @@
                 <div class="nav-wrapper col 2 right">
                     <ul class="right hide-on-med-and-down">
                         <li><a data-target="slide-out" class="sidenav-trigger show-on-large"><i class="material-icons left">menu</i>Menü</a></li><!--Sidenav-->
-                        <li><a><i class="material-icons left">person_outline</i>Logout</a></li><!--Logout-->
+                        <li><a href="login.html"><i class="material-icons left">person_outline</i>Logout</a></li><!--Logout-->
                     </ul>
                     <ul class="right">
                         <li><a href="#" data-target="slide-out" class="sidenav-trigger"><i class="material-icons">menu</i></a></li><!--Sidenav-->
-                        <li><a href="#" class="sidenav-trigger"><i class="material-icons">person_outline</i></a></li><!--Logout-->
+                        <li><a href="login.html" class="sidenav-trigger"><i class="material-icons">person_outline</i></a></li><!--Logout-->
                     </ul>
                 </div>
             </nav>
@@ -72,6 +73,22 @@
                 </select>
                 <br>
             </div></li>
+            <li><div class="divider"></div></li>
+            <li><form action="upload">
+                <br>
+                <div class="file-field input-field container">
+                    <div class="btn blue-grey lighten-2">
+                        <span>File</span>
+                        <input type="file">
+                    </div>
+                    <div class="file-path-wrapper">
+                        <input class="file-path validate" type="text" placeholder="Datei hochladen">
+                    </div>
+                </div>
+            </form></li>
+            <li><div class="container">
+                <a class="waves-effect waves-light btn blue-grey lighten-2 right"><i class="material-icons left">file_upload</i>Hochladen</a>
+            </div></li>
         </ul>
 
         <!--Cards-->
@@ -164,7 +181,6 @@
                     </div>
                 </div>
             </div>
-
             <!--Flop Artikel-->
             <div class="col s12 m6">
                 <div id="flop_articles" class="card white">
diff --git a/src/main/webapp/preview/js/materialize_components.js b/src/main/webapp/preview/js/materialize_components.js
index f438abd..c788aff 100644
--- a/src/main/webapp/preview/js/materialize_components.js
+++ b/src/main/webapp/preview/js/materialize_components.js
@@ -1,11 +1,14 @@
 $(".dropdown-trigger").dropdown();
+$('.tabs').tabs();
 $(document).ready(function(){
     $('.sidenav').sidenav();
 });
-$('.tabs').tabs();
 $(document).ready(function(){
     $('select').formSelect();
 });
 $(document).ready(function(){
     $('.collapsible').collapsible();
+});
+$(document).ready(function() {
+    M.updateTextFields();
 });
\ No newline at end of file
diff --git a/src/main/webapp/preview/login.html b/src/main/webapp/preview/login.html
new file mode 100644
index 0000000..67dd914
--- /dev/null
+++ b/src/main/webapp/preview/login.html
@@ -0,0 +1,44 @@
+﻿<!DOCTYPE html>
+<html>
+    <head>
+        <meta charset="UTF-8">
+        <title>Login</title>
+        <!--Import Google Icon Font-->
+        <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
+        <!--Import materialize.css-->
+        <link type="text/css" rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0/css/materialize.min.css" media="screen,projection" />
+        <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.8.0/Chart.min.css" integrity="sha256-aa0xaJgmK/X74WM224KMQeNQC2xYKwlAt08oZqjeF0E=" crossorigin="anonymous" />
+        <!--Let browser know website is optimized for mobile-->
+        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    </head>
+    <body class="blue-grey lighten-5">
+        <div class="container row">
+            <!--Login-->
+            <div class="center">
+                <div class="card white col s6 push-s3">
+                    <div class="card-content">
+                        <div class="center">
+                            <img style="width: 50%" src="logoOrginal.gif">
+                        </div>
+                        <div class="divider"></div>
+                        <div class="row">
+                            <div class="col s8 push-s2">
+                                <input id="password" type="password" class="validate" placeholder="Passwort">
+                                <a class="waves-effect waves-light btn blue-grey lighten-2"><i class="material-icons left">lock_open</i>Login</a>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+
+        <!--Anfang Skriptbereich-->
+
+        <!--Script für Materlialize-->
+        <script type="text/javascript" src="https://code.jquery.com/jquery-2.1.1.min.js"></script>
+        <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0/js/materialize.min.js"></script>
+        <script type="text/javascript" src="js/materialize_components.js"></script>
+
+        <!--Ende Skriptbereich-->
+    </body>
+</html>
\ No newline at end of file
diff --git a/src/main/webapp/preview/registration.html b/src/main/webapp/preview/registration.html
new file mode 100644
index 0000000..0dbe2f8
--- /dev/null
+++ b/src/main/webapp/preview/registration.html
@@ -0,0 +1,55 @@
+<!DOCTYPE html>
+<html>
+    <head>
+        <meta charset="UTF-8">
+        <title>Registrierung</title>
+        <!--Import Google Icon Font-->
+        <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
+        <!--Import materialize.css-->
+        <link type="text/css" rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0/css/materialize.min.css" media="screen,projection" />
+        <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.8.0/Chart.min.css" integrity="sha256-aa0xaJgmK/X74WM224KMQeNQC2xYKwlAt08oZqjeF0E=" crossorigin="anonymous" />
+        <!--Let browser know website is optimized for mobile-->
+        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    </head>
+    <body class="blue-grey lighten-5">
+    <div class="container">
+        <!--Login-->
+        <div class="center">
+            <div class="card white">
+                <div class="center">
+                    <span class="card-title center">Regstrierung</span>
+                </div>
+                <div class="card-content">
+                    <div>
+                        <img style="width: 100%" src="logoOrginal.gif">
+                    </div>
+                    <div class="divider"></div>
+                    <div class="row">
+                        <div class="col s12">
+                            <input id="login" type="text">
+                            <label for="login">Login-Name</label>
+                        </div>
+                        <div class="col s12">
+                            <input id="password" type="text">
+                            <label for="password">Passwort</label>
+                        </div>
+                    </div>
+                </div>
+                <div class="card-action right">
+                    <a href="#">Bestätigen</a>
+                    <a href="login.html">Zurück</a>
+                </div>
+            </div>
+        </div>
+    </div>
+
+    <!--Anfang Skriptbereich-->
+
+    <!--Script für Materlialize-->
+    <script type="text/javascript" src="https://code.jquery.com/jquery-2.1.1.min.js"></script>
+    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0/js/materialize.min.js"></script>
+    <script type="text/javascript" src="js/materialize_components.js"></script>
+
+    <!--Ende Skriptbereich-->
+    </body>
+</html>
\ No newline at end of file
