diff --git a/lib/classification/CustomSearchDelegate.dart b/lib/classification/CustomSearchDelegate.dart
index 8fdb5bf7b91cd4bb51380ab8ee3f3f8281544ace..5a1ab2549cc4658cf4e5b0d86717edc93d552578 100644
--- a/lib/classification/CustomSearchDelegate.dart
+++ b/lib/classification/CustomSearchDelegate.dart
@@ -2,6 +2,8 @@ import 'package:flutter/material.dart';
 
 import '../firebase.dart';
 
+//Suchleiste mit den Vorschlägen aller Genres aus Spotify
+
 class CustomSearchDelegate extends SearchDelegate<String>{
   String colorText;
   CustomSearchDelegate(this.colorText);
diff --git a/lib/classification/classification.dart b/lib/classification/classification.dart
index 0483f2533556ac02890b4f2e07f1582a75de3dd5..d99b6af8a29fbb0edecc7b17126e2c4182870407 100644
--- a/lib/classification/classification.dart
+++ b/lib/classification/classification.dart
@@ -3,27 +3,28 @@ import 'package:cloud_firestore/cloud_firestore.dart';
 import 'package:firebase_auth/firebase_auth.dart';
 import 'package:firebase_core/firebase_core.dart';
 import 'package:flutter/material.dart';
-import 'package:flutter_custom_clippers/flutter_custom_clippers.dart';
-import '../main.dart';
 import 'CustomSearchDelegate.dart';
 import '../homepage.dart';
+import 'package:google_fonts/google_fonts.dart';
+
+/*
+Klasse & Screen zur Klassifizierung der Farben zu den Genres.
+Es gibt eine graue Default Seite wenn keine Farbe ausgewählt ist.
+Wenn eine Farbe ausgewählt wird, kann man das Genre dazu auswählen.
+Die Klassifizierung wird dann in der Datenbank aktualisiert
+ */
 
 class ClassificationPage extends StatefulWidget {
   const ClassificationPage({Key? key}) : super(key: key);
 
   @override
   State<StatefulWidget> createState() => _ClassificationPageState();
-
       }
 
 class _ClassificationPageState extends State<ClassificationPage> {
 
   final String id = (FirebaseAuth.instance.currentUser?.uid.toString())!+'_genres';
-
-
   Color _ambientBackgroundColor = Colors.grey.withOpacity(0.5);
-  Color _ambientHeader = Colors.white;
-
   String genreValue = '';
 
   bool _redSelected = false;
@@ -47,35 +48,55 @@ class _ClassificationPageState extends State<ClassificationPage> {
     return Scaffold(
         resizeToAvoidBottomInset: false,
         body: Container(
+          color: _ambientBackgroundColor,
             child: Column(
                 children: [
-                  ClipPath(
-                    clipper: WaveClipperTwo(flip: true),
-                    child: Container(
-                      height: 140,
-                      color: _ambientBackgroundColor,
-                      child: Center(
-                        child: Text(
-                          'Ambient!',
-                          style: TextStyle(
-                              fontSize: 40.0, color: _ambientHeader),
-                        ),
-                      ),),),
-                  Expanded(
-                    child: ListView(
+                  const SizedBox(height: 40,),
+                  SizedBox( height: 50, width: 300,
+                   child: Text('Ambient!',
+                     style:
+                     GoogleFonts.cabin(
+                         fontSize: 40.0, color: Colors.white.withOpacity(0.85)),),),
+                  const SizedBox(height: 20,),
+                  SizedBox(
+                    height: 80,
+                      width: 300,
+                      child : Text('Select the genre that fits to the emotion of each color',
+                    style:
+                    GoogleFonts.cabin(
+                        fontSize: 20.0, color: Colors.white.withOpacity(0.85),),),),
+
+
+                   Expanded(
+                     child:  Container(
+                         height: 50,
+                         decoration: BoxDecoration(
+                           color: Color(0xffffffff),
+                           borderRadius: BorderRadius.only(topLeft: Radius.circular(50),topRight: Radius.circular(50)),
+                           boxShadow: [
+                             BoxShadow(
+                               color: Colors.grey.withOpacity(0.5),
+                               spreadRadius: 5,
+                               blurRadius: 7,
+                               offset: Offset(0, 3),
+                             ),
+                           ],),
+                      child: ListView(
                         children: <Widget>[
-                          const SizedBox(height: 20,),
                           GestureDetector(
-                            onTap: (){
+                            onTap: () async {
+                              String genre = await changeFirebase().getGenreByHex('FF0000');
+                              print('Get genre by hex ' + genre);
+
                               if(!_redSelected){closeAll(); setState(() => _redSelected = true); }
                               else{closeAll();}
                               _ambientBackgroundColor = Colors.red;
                               if (!_redSelected){_ambientBackgroundColor = Colors.grey.withOpacity(0.5);}},
                             child: Container(
                                 child: _redSelected ?
-                                selectedColor("Red", Colors.red, Colors.white.withOpacity(0.7),
+                                selectedColor("Red", Colors.red, Colors.white.withOpacity(0.9),
                                     "rock","latin", "blues",
-                                    'Starke Emotionen, Liebe, Energie') : noSelection("Red")
+                                    'Strong emotions, love, energie') : noSelection("Red")
                             )
                             ,),
                           const SizedBox(height: 20,),
@@ -87,8 +108,8 @@ class _ClassificationPageState extends State<ClassificationPage> {
                               if (!_orangeSelected){_ambientBackgroundColor = Colors.grey.withOpacity(0.5);}},
                             child: Container(
                                 child: _orangeSelected ?
-                                selectedColor("Orange", Colors.orange, Colors.white.withOpacity(0.7),
-                                    "soul", "jazz", "Orange 3", 'Wärme, Energie, Herbst') : noSelection("Orange")
+                                selectedColor("Orange", Colors.orange, Colors.white.withOpacity(0.9),
+                                    "soul", "jazz", "indie-pop", 'warmth, energie, fall') : noSelection("Orange")
                             )
                             ,),
                           const SizedBox(height: 20,),
@@ -101,7 +122,7 @@ class _ClassificationPageState extends State<ClassificationPage> {
                             child: Container(
                                 child: _yellowSelected ?
                                 selectedColor("Yellow", Colors.yellow, Colors.white,
-                                    "pop", "funk", "country", 'Freude, Optimismus, Wärme') : noSelection("Yellow")
+                                    "pop", "funk", "country", 'happiness, optimism, warmth') : noSelection("Yellow")
                             )
                             ,),
                           const SizedBox(height: 20,),
@@ -113,8 +134,8 @@ class _ClassificationPageState extends State<ClassificationPage> {
                               if (!_greenSelected){_ambientBackgroundColor = Colors.grey.withOpacity(0.5);}},
                             child: Container(
                                 child: _greenSelected ?
-                                selectedColor("Green", Colors.green, Colors.white.withOpacity(0.7),
-                                    "ambient", "classical", "new-age", 'Ruhe, Wachstum, Natur') : noSelection("Green")
+                                selectedColor("Green", Colors.green, Colors.white.withOpacity(0.9),
+                                    "ambient", "classical", "new-age", 'calmness, growth, nature') : noSelection("Green")
                             )
                             ,),
                           const SizedBox(height: 20,),
@@ -122,12 +143,12 @@ class _ClassificationPageState extends State<ClassificationPage> {
                             onTap: (){
                               if(!_whiteSelected){closeAll(); setState(() => _whiteSelected = true); }
                               else{closeAll();}
-                              _ambientBackgroundColor = Colors.white60;
+                              _ambientBackgroundColor = Colors.grey.withOpacity(0.5);
                               if (!_whiteSelected){_ambientBackgroundColor = Colors.grey.withOpacity(0.5);}},
                             child: Container(
                                 child: _whiteSelected ?
-                                selectedColor("White", Colors.white60, Colors.grey,
-                                    "classical", "ambient", "piano", 'Reinheit, Frieden, Gelassenheit') : noSelection("White")
+                                selectedColor("White", Colors.white, Colors.grey.withOpacity(0.7),
+                                    "classical", "ambient", "piano", 'calmness, peace, serenity') : noSelection("White")
                             )
                             ,),
                           const SizedBox(height: 20,),
@@ -139,8 +160,8 @@ class _ClassificationPageState extends State<ClassificationPage> {
                               if (!_blueSelected){_ambientBackgroundColor = Colors.grey.withOpacity(0.5);}},
                             child: Container(
                                 child: _blueSelected ?
-                                selectedColor( "Blue", Colors.blue, Colors.white.withOpacity(0.7),
-                                    "blues", "rainy-day", "indie-pop", 'Ruhe, Gelassenheit, Traurigkeit') : noSelection("Blue")
+                                selectedColor( "Blue", Colors.blue, Colors.white.withOpacity(0.9),
+                                    "blues", "rainy-day", "indie-pop", 'calm, Gelassenheit, sadness') : noSelection("Blue")
                             )
                             ,),
                           const SizedBox(height: 20,),
@@ -153,8 +174,8 @@ class _ClassificationPageState extends State<ClassificationPage> {
                             child: Container(
                                 child: _pinkSelected ?
                                 selectedColor(
-                                    "Pink", Colors.pink, Colors.white.withOpacity(0.7),
-                                    "pop", "k-pop", "r-n-b", 'Romantik, Anmut, Nostalgie') : noSelection("Pink")
+                                    "Pink", Colors.pink, Colors.white.withOpacity(0.9),
+                                    "pop", "k-pop", "r-n-b", 'romance, charm, nostalgia') : noSelection("Pink")
                             )
                             ,),
                           const SizedBox(height: 20,),
@@ -166,8 +187,8 @@ class _ClassificationPageState extends State<ClassificationPage> {
                               if (!_purpleSelected){_ambientBackgroundColor = Colors.grey.withOpacity(0.5);}},
                             child: Container(
                                 child: _purpleSelected ?
-                                selectedColor("Purple", Colors.purple, Colors.white.withOpacity(0.7),
-                                    "rock", "classical", "hip-hop", 'Luxus, Spiritualität, Ambition') : noSelection("Purple")
+                                selectedColor("Purple", Colors.purple, Colors.white.withOpacity(0.9),
+                                    "rock", "classical", "hip-hop", 'luxury, spirituality, ambition') : noSelection("Purple")
                             )
                             ,),
                           const SizedBox(height: 20,),
@@ -179,8 +200,8 @@ class _ClassificationPageState extends State<ClassificationPage> {
                               if (!_brownSelected){_ambientBackgroundColor = Colors.grey.withOpacity(0.5);}},
                             child: Container(
                                 child: _brownSelected ?
-                                selectedColor("Brown", Colors.brown, Colors.white.withOpacity(0.7),
-                                    "country", "Brown2", "Brown3", 'info') : noSelection("Brown")
+                                selectedColor("Brown", Colors.brown, Colors.white.withOpacity(0.9),
+                                    "country", "folk", "reggae", 'warmth, security, nostalgia, calm') : noSelection("Brown")
                             )
                             ,),
                           const SizedBox(height: 20,),
@@ -188,29 +209,33 @@ class _ClassificationPageState extends State<ClassificationPage> {
                             onTap: () {
                               if(!_blackSelected){closeAll(); setState(() => _blackSelected = true); }
                               else{closeAll();}
-                              _ambientBackgroundColor = Colors.black54;
+                              _ambientBackgroundColor = Colors.black87;
                               if (!_blackSelected){_ambientBackgroundColor = Colors.grey.withOpacity(0.5);}},
                             child: Container(
                                 child: _blackSelected ?
-                                selectedColor("Black", Colors.black54, Colors.white.withOpacity(0.7), "Black1", "Black2", "Black3", 'info') : noSelection("Black")
+                                selectedColor("Black", Colors.black87, Colors.white.withOpacity(0.7),
+                                    "metal", "classical", "rock", 'melancholy, power, noble') : noSelection("Black")
                             )
                             ,),
                           const SizedBox(height: 20,),
-                      SizedBox(
-                        width: 100,
+                        Align(
+                          alignment: Alignment.center,
+                        child: Container(
+                          width: 200, height: 40,
                             child : StreamBuilder(
+                                //Es wird in der Datenbank geprüft, ob zu allen Farben ein Genre ausgewählt wurde
                                 stream: FirebaseFirestore.instance.collection('classification').doc(id).snapshots(),
                                 builder: (BuildContext context,
                                     AsyncSnapshot snapshot) {
                                       return ElevatedButton(
-                                      style:ButtonStyle(backgroundColor: MaterialStatePropertyAll<Color>(Colors.white.withOpacity(0.9))),
+                                      style:ButtonStyle(
+                                          backgroundColor: MaterialStatePropertyAll<Color>(Colors.white.withOpacity(0.9))),
                                       child: const Text(
-                                        "Save",
-                                        style: TextStyle(color: Colors.indigo, fontWeight: FontWeight.bold),),
+                                        "Save", style: TextStyle(color: Colors.indigo, fontWeight: FontWeight.bold),),
                                       onPressed: () {
                                         print(changeFirebase().checkIfEverythingSelected(snapshot).toString());
                                         if (changeFirebase().checkIfEverythingSelected(snapshot)) {
-                                        Navigator.push(context, MaterialPageRoute(builder: (context) => HUD()));
+                                        Navigator.push(context, MaterialPageRoute(builder: (context) => HomePage()));
                                         }
                                         else{
                                           setState(() {
@@ -218,7 +243,7 @@ class _ClassificationPageState extends State<ClassificationPage> {
                                           });
                                         }
                                 });
-                          })),
+                          }))),
                         Container(
                             child: _errorText ?
                             const Text('Not everything is selected!',
@@ -226,10 +251,8 @@ class _ClassificationPageState extends State<ClassificationPage> {
                               style: TextStyle( fontSize: 20, color: Colors.red),)
                                 : null
                         ),
-                          SizedBox(height: 40,)
-                        ]),
-                  ),
-                ]
+                          const SizedBox(height: 40,)
+                        ]),),)]
             )
         ));
   }
@@ -240,89 +263,76 @@ class _ClassificationPageState extends State<ClassificationPage> {
       style: TextStyle(fontSize: 20, color: Colors.red)
     );
   }
+
   //wenn die Farbe nicht ausgewählt ist, wird kein Genre-Auswahl dargestellt und die Farben sind grau
-  Column noSelection(String colorText) {
-    return Column(
-        children: [
-          Row(
+  Align noSelection(String colorText) {
+      return Align(
+        alignment: Alignment.center,
+        child:Container(
+          width: 320,
+            decoration: BoxDecoration(
+              color: Colors.transparent,
+              border: Border.all(
+                  color: Colors.grey.shade300, width: 1),
+              borderRadius: BorderRadius.circular(10),),
+          child: Column(
+            children: [
+              SizedBox(height: 50,),
+            Row(
               children: [
-                const SizedBox(width: 30, height: 50),
+               const SizedBox(width: 25),
                 Text(colorText,
-                    style: const TextStyle(fontSize: 30, color: Colors.grey)),
-              ]
-          ),
-           Align(
-                alignment: Alignment.center,
-                child: Row(
-                    children: [
-                      const SizedBox(width: 30),
-                      Container(
-                          width: 340,
-                          decoration: BoxDecoration(
-                            color: Colors.transparent,
-                            border: Border.all(
-                                color: Colors.grey,
-                                width: 1),
-                            borderRadius: BorderRadius.circular(10),
-                          ),
-                         child: StreamBuilder(
+                  style: GoogleFonts.cabin(fontSize: 20.0, color: Colors.grey.shade400,)),]),
+             Row(
+                 children: [
+                   const SizedBox(width: 25),
+                   StreamBuilder(
                            stream: FirebaseFirestore.instance.collection('classification').doc(id).snapshots(),
                            builder: (BuildContext context, AsyncSnapshot snapshot){
                              if (snapshot.connectionState == ConnectionState.waiting) {
                                return const Center(
-                                 child: CircularProgressIndicator(),
-                               );
-                             }
-                             return
-                               Text(changeFirebase().checkForNull(snapshot.data.data()[colorText]), textAlign: TextAlign.center,
-                                 style: const TextStyle(fontSize: 20, color: Colors.grey),);
-                           }
-                         )
-                      )
-                    ]
-          )
-    )
-  ]);
-}
+                                 child: CircularProgressIndicator(),);}
+                             return Text(changeFirebase().checkForNull(snapshot.data.data()[colorText]), textAlign: TextAlign.center,
+                               style: GoogleFonts.cabin(fontSize: 40.0, color: Colors.grey.shade400,),);
+                           }),]),
+                        SizedBox(height: 5,)])));}
 
-  Column selectedColor(String colorText, Color color, Color textColor, String rec1, String rec2, String rec3, String infoText) {
-    return Column(
-        children: [
-          Row(
-              children: [
-                const SizedBox(width: 30, height: 50),
-                Text(colorText, style: TextStyle(fontSize: 30, color: color)),
-                      IconButton(onPressed:(){
-                        _showMyDialog(colorText, infoText);
-                      },
-                        alignment: Alignment.centerRight,
-                        icon: Icon( Icons.info_outline, color: color),
-                      ),
-                ],),
-          selectedGenre(colorText, color, textColor, rec1, rec2, rec3),
-    ]);
-  }
 
-  Align selectedGenre(String colorText, Color color, Color textColor, String rec1, String rec2,
-      String rec3) {
+  //Wenn eine Farbe ausgewählt wird, werden die Farben entsprechend angepasst
+  //Und man kann ein Genre zu dieser Farbe auswählen
+  Align selectedColor(String colorText, Color color, Color textColor, String rec1, String rec2, String rec3, String infoText) {
     return Align(
-        alignment: Alignment.center,
-        child: Column(
-            children: [
-              Row(
-                  children: [
-                    const SizedBox(width: 30),
-                    Container(
-                        width: 340,
-                        decoration: BoxDecoration(
-                          color: Colors.transparent,
-                          border: Border.all(
-                              color: color,
-                              width: 1),
-                          borderRadius: BorderRadius.circular(10),
-                        ),
-                        child:
-                        StreamBuilder(
+      alignment: Alignment.center,
+        child:Container(
+         width: 320,
+            decoration: BoxDecoration(
+            color: color,
+            borderRadius: BorderRadius.circular(10),
+                boxShadow: [
+                  BoxShadow(
+                      color: Colors.grey.withOpacity(0.4),
+                      blurRadius: 10.0,
+                      spreadRadius: 2.0,
+                      offset: const Offset(0.0, 0.0),)]),
+            child: Column(
+                children: [
+                  Align(
+                    alignment: Alignment.topRight,
+                    child : IconButton(onPressed:(){
+                      _showMyDialog(colorText, infoText);},
+                      alignment: Alignment.centerRight,
+                      icon: Icon( Icons.info_outline, color: textColor.withOpacity(0.7), size: 35,),),
+                  ),
+                SizedBox(height: 0,),
+                Row(
+                    children: [
+                        const SizedBox(width: 25),
+                        Text(colorText,
+                        style: GoogleFonts.cabin(fontSize: 20.0, color: textColor,)),]),
+                        Row(
+                        children: [
+                            const SizedBox(width: 25),
+                            StreamBuilder(
                             stream: FirebaseFirestore.instance.collection('classification').doc(id).snapshots(),
                             builder: (BuildContext context, AsyncSnapshot snapshot) {
                               if (snapshot.connectionState == ConnectionState.waiting) {
@@ -332,29 +342,10 @@ class _ClassificationPageState extends State<ClassificationPage> {
                               }
                               return
                                 Text(changeFirebase().checkForNull(snapshot.data.data()[colorText]), textAlign: TextAlign.center,
-                                  style: TextStyle(color: color, fontSize: 20),);
+                                  style:  GoogleFonts.cabin(fontSize: 40.0, color: textColor),);
                             }
-                            ),
-                    ) ]
-              ),
-              const SizedBox(height: 30),
-              Container(
-              width: 340,
-              //   alignment: Alignment.center,
-              decoration: BoxDecoration(
-                color: color,
-                borderRadius: BorderRadius.circular(10),
-                boxShadow: [
-                  BoxShadow(
-                    color: Colors.grey.withOpacity(0.5),
-                    blurRadius: 10.0,
-                    spreadRadius: 2.0,
-                    offset: const Offset(0.0, 0.0),
-                  )
-                ],
-                        ),
-                  child: Column(
-                      children: [
+                            ),]),
+
                         const SizedBox(height: 20,),
                         Container(
                           width: 290,
@@ -402,17 +393,14 @@ class _ClassificationPageState extends State<ClassificationPage> {
                             ),
                             const SizedBox(height: 50,)
                           ]
-                      )
-                    ]
-        )
-
-    )
-    ]));
-  }
+                      )])));
+   }
 
   GestureDetector recommendationLabel(String colorText, String rec, Color textColor) {
     return GestureDetector(
-      onTap: () => changeFirebase().updateColorGenre(colorText, rec),
+      onTap: () {
+        changeFirebase().updateColorGenre(colorText, rec);
+        closeAll();},
       child:Container(
         child: Row(
             children: [
@@ -430,12 +418,11 @@ class _ClassificationPageState extends State<ClassificationPage> {
                       style: TextStyle(fontSize: 20, color: textColor)
                 ),
               )
-              )]
-        )
-    ),
+              )])),
     );
   }
 
+  //Info Dialog zur Erklärung der Farben-Emotionen
   Future<void> _showMyDialog(String colorText, String infoText) {
     return showDialog<void>(
       context: context,
@@ -447,8 +434,7 @@ class _ClassificationPageState extends State<ClassificationPage> {
             child: ListBody(
               children: <Widget>[
                 Text(infoText),
-              ],
-            ),
+              ],),
           ),
           actions: <Widget>[
             TextButton(
@@ -475,4 +461,5 @@ class _ClassificationPageState extends State<ClassificationPage> {
       });
       _ambientBackgroundColor = Colors.grey.withOpacity(0.5);
     }
+
 }
diff --git a/lib/classification/color_widgets.dart b/lib/classification/color_widgets.dart
deleted file mode 100644
index e69de29bb2d1d6434b8b29ae775ad8c2e48c5391..0000000000000000000000000000000000000000
diff --git a/lib/firebase.dart b/lib/firebase.dart
index 88fe12c0851b94e62c4d3db9594a722fe9ddf505..68cabf5593204abf42fbdacdf51dd3a9f63f121b 100644
--- a/lib/firebase.dart
+++ b/lib/firebase.dart
@@ -36,40 +36,40 @@ class changeFirebase{
     return true;
   }
 
-  String getGenreByHex(String code){
+  Future<String> getGenreByHex(String code) async {
     switch (code){
       case 'FF0000':
-       return getGenreByColor('Red');
-      case 'FF8800':
-        return getGenreByColor('Orange');
+       return await getGenreByColor('Red');
+      case 'FFA500':
+        return await getGenreByColor('Orange');
       case 'FFFF00':
         return getGenreByColor('Yellow');
-      case 'FF8800':
+      case '00FF00':
         return getGenreByColor('Green');
       case 'FFFFFF':
         return getGenreByColor('White');
       case '0000FF':
         return getGenreByColor('Blue');
-      case 'FFC0CB':
+      case 'FF46FD':
         return getGenreByColor('Pink');
-      case 'A020F0':
+      case '7F45D8':
         return getGenreByColor('Purple');
-      case '964B00':
+      case '67402D':
         return getGenreByColor('Brown');
       case '000000':
         return getGenreByColor('Black');
     }
-    return '';
+    return 'nothing';
   }
 
-  String getGenreByColor(String color){
+
+  Future<String> getGenreByColor(String color) async {
     String genre = '';
-     FutureBuilder<DocumentSnapshot>(
-      future: FirebaseFirestore.instance.collection('classification').doc(id).get(),
-      builder: (BuildContext context, AsyncSnapshot<DocumentSnapshot> snapshot){
-        genre = snapshot.data![color];
-        return const SizedBox();
-      });
-     return genre;
+    await FirebaseFirestore.instance.collection('classification').doc(id).get().then((snapshot) async {
+      genre = await snapshot.data()![color];
+      return genre;
+    });
+    return genre;
   }
+
 }
\ No newline at end of file
diff --git a/lib/loginRegister/login.dart b/lib/loginRegister/login.dart
index 11f3f81aca9cca631b5294e4bc6589a8c1684495..0180d302699a1605a281142b61ca45138052e5fb 100644
--- a/lib/loginRegister/login.dart
+++ b/lib/loginRegister/login.dart
@@ -5,10 +5,15 @@ import 'package:firebase_auth/firebase_auth.dart';
 import 'package:firebase_core/firebase_core.dart';
 import 'package:flutter/material.dart';
 import 'package:page_transition/page_transition.dart';
+import 'package:google_fonts/google_fonts.dart';
 
 import '../homepage.dart';
-import '../main.dart';
 
+/*
+Klasse zum Einloggen
+Die Daten werden aus der Datenbank geholt
+Entsprechende Fehlermeldungen werden abgefangen
+ */
 
 class LoginPage extends StatefulWidget {
   const LoginPage({Key? key}) : super(key: key);
@@ -29,7 +34,7 @@ class _LoginPageState extends State<LoginPage> {
     return Stack(
 
       children: <Widget>[
-        Image.asset("assets/ambientL.jpeg",
+        Image.asset("ambientL.jpeg",
             alignment: Alignment.centerLeft,
             height: MediaQuery.of(context).size.height,
              width: MediaQuery.of(context).size.width,),
@@ -47,10 +52,11 @@ class _LoginPageState extends State<LoginPage> {
         child : Column(
         children:[
           SizedBox(height: 80,),
-          const Expanded(
+           Expanded(
             child: Text(
               'Ambient!',
-              style: TextStyle(fontSize: 50.0, color: Colors.white),
+                style: GoogleFonts.cabin(
+                  fontSize: 50.0, color: Colors.white,),
             ),),
           Expanded(
           child: Column(
@@ -62,9 +68,9 @@ class _LoginPageState extends State<LoginPage> {
                   keyboardType: TextInputType.name,
                   decoration: const InputDecoration(
                     prefixIcon: Icon(Icons.person, color: Colors.white),
-                    hintText: 'Username',
+                    hintText: 'E-Mail',
                     hintStyle: TextStyle(color: Colors.white),
-                    labelText: 'Username',
+                    labelText: 'E-Mail',
                     labelStyle: TextStyle(color: Colors.white),
                   ),
                 ),),
@@ -92,7 +98,7 @@ class _LoginPageState extends State<LoginPage> {
             FirebaseAuth.instance.signInWithEmailAndPassword(
                 email: _emailTextController.text,
                 password: _passwordTextController.text).then((value) {
-              Navigator.push(context, MaterialPageRoute(builder: (context)=>const HUD()));
+              Navigator.push(context, MaterialPageRoute(builder: (context)=>const ClassificationPage()));
             }).onError((error, stackTrace){
               setState(() {
                 _wrongInput = true;
diff --git a/lib/loginRegister/registration.dart b/lib/loginRegister/registration.dart
index 9820b239fd0371a35ea386eb22ab034dac437542..71175fe9b6949a86e86fe0d5ce554bb63943ba37 100644
--- a/lib/loginRegister/registration.dart
+++ b/lib/loginRegister/registration.dart
@@ -4,10 +4,15 @@ import 'package:firebase_auth/firebase_auth.dart';
 import 'package:firebase_core/firebase_core.dart';
 import 'package:flutter/material.dart';
 import '../classification/classification.dart';
-
 import 'package:ambient/loginRegister/login.dart';
 import 'package:page_transition/page_transition.dart';
+import 'package:google_fonts/google_fonts.dart';
 
+/*
+Klasse zum Registrieren
+Die User Daten werden in die Firebase Datenbank gespeichert
+Fehlermeldungen beim Registrieren werden abgefangen
+ */
 
 class RegistrationPage extends StatefulWidget {
   const RegistrationPage({Key? key}) : super(key: key);
@@ -41,19 +46,19 @@ class _RegistrationPage extends State<RegistrationPage> {
 
       Scaffold(
           backgroundColor: Colors.transparent,
-
           body: Center(
               child :Container(
-                  decoration:  const BoxDecoration(
+                  decoration: BoxDecoration(
                   ),
                   child: SizedBox(width: 250, height: 600,
                       child : Column(
                           children:[
                             SizedBox(height: 40,),
-                            const Expanded(
+                             Expanded(
                               child: Text(
                                 'Ambient!',
-                                style: TextStyle(fontSize: 60.0, color: Colors.white),
+                                style: GoogleFonts.cabin(
+                                  fontSize: 50.0, color: Colors.white,)
                               ),),
 
                           Expanded(
@@ -111,25 +116,27 @@ class _RegistrationPage extends State<RegistrationPage> {
                         ),
 
                         loginRegisterButton(context, false, () {
-                          try{
                           FirebaseAuth.instance.createUserWithEmailAndPassword(
                               email: _emailTextController.text,
                               password: _passwordTextController.text).then((value){
                                 createSetUp();
                                 print ("Created new account");
                                 Navigator.push(context, MaterialPageRoute(builder: (context)=>ClassificationPage()));
-                          });}
-                         on FirebaseAuthException catch(e){
-                              if(e.code == 'ERROR_EMAIL_ALREADY_IN_USE'){
+                          }).onError((error, stackTrace){
+                              String e = error.toString();
+                              print('Error 1 ' + error.toString());
+
+                              if(error.toString().contains('email-already-in-use')){
+                                print("Email already in use");
                                 setState(() {
                                   _infoText = 'Email already in use';
                                 });
                               }
-                              if(e.code == 'weak-password'){
+                              else if(error.toString().contains('weak-password')){
                                 setState(() {
                                   _infoText = 'weak Password';
                                 });}
-                              if(e.code == 'invalid-email'){
+                              else if(error.toString().contains('invalid-email')){
                                 setState(() {
                                   _infoText = 'invalid email';
                                 });}
@@ -139,7 +146,7 @@ class _RegistrationPage extends State<RegistrationPage> {
                                 });
                               }
 
-                          };
+                          });
                         }),
                         SizedBox(height: 20),
                         loginPage(),
@@ -177,13 +184,10 @@ class _RegistrationPage extends State<RegistrationPage> {
     );
   }
 
-  Future addDisplayName() async{
-    FirebaseAuth.instance.currentUser?.updateDisplayName(_usernameTextController.text);
-  }
-
+  //Beim Anlegen eines Accounts werden auch die Farben angelegt,
+  //damit der User später die Genres zuordnen kann
   Future createSetUp() async{
 
-    //final String id = '${FirebaseAuth.instance.currentUser?.uid.toString()}_genres';
     final String id = (FirebaseAuth.instance.currentUser?.uid.toString())!+'_genres';
     final user = FirebaseFirestore.instance.collection('classification').doc(id);
 
@@ -200,6 +204,7 @@ class _RegistrationPage extends State<RegistrationPage> {
           'Brown' : null,
           'Black' : null,
         };
+        print('set up');
         await user.set(json);
   }
 }
\ No newline at end of file
diff --git a/lib/loginRegister/widgets.dart b/lib/loginRegister/widgets.dart
index c7e00475e5f9d17cb1ee4d8a5be85ac2d7c4a5a4..64e4db31380ca0bbb906bc24e73bf1225f400743 100644
--- a/lib/loginRegister/widgets.dart
+++ b/lib/loginRegister/widgets.dart
@@ -3,6 +3,8 @@ import 'package:flutter/material.dart';
 
 import 'login.dart';
 
+//Widgets für den Login/Registrations Screen
+
 Container loginRegisterButton(
 BuildContext context, bool isLogin, Function onTap) {
   return Container(
@@ -71,7 +73,6 @@ Container signOutButton(
       //textWidth
       height: 10,
       child: Text(
-
         text,
         style: const TextStyle(
             color: Colors.red),
diff --git a/macos/Flutter/GeneratedPluginRegistrant.swift b/macos/Flutter/GeneratedPluginRegistrant.swift
index 6683932708b343a842114a6330c73c7f44e49c1a..ab540b9945bec56adb13154c9a92a792a0a762ae 100644
--- a/macos/Flutter/GeneratedPluginRegistrant.swift
+++ b/macos/Flutter/GeneratedPluginRegistrant.swift
@@ -9,6 +9,7 @@ import audio_session
 import cloud_firestore
 import firebase_auth
 import firebase_core
+import path_provider_foundation
 import just_audio
 import path_provider_macos
 
@@ -19,4 +20,5 @@ func RegisterGeneratedPlugins(registry: FlutterPluginRegistry) {
   FLTFirebaseCorePlugin.register(with: registry.registrar(forPlugin: "FLTFirebaseCorePlugin"))
   JustAudioPlugin.register(with: registry.registrar(forPlugin: "JustAudioPlugin"))
   PathProviderPlugin.register(with: registry.registrar(forPlugin: "PathProviderPlugin"))
+  PathProviderPlugin.register(with: registry.registrar(forPlugin: "PathProviderPlugin"))
 }
diff --git a/pubspec.lock b/pubspec.lock
index 97bb2f5237bd081a2f782e7f6484b9179bc7a90b..425083e469b60c8d6d6e8b210f35b6a24d9608f9 100644
--- a/pubspec.lock
+++ b/pubspec.lock
@@ -15,13 +15,6 @@ packages:
       url: "https://pub.dartlang.org"
     source: hosted
     version: "2.9.0"
-  audio_session:
-    dependency: transitive
-    description:
-      name: audio_session
-      url: "https://pub.dartlang.org"
-    source: hosted
-    version: "0.1.13"
   boolean_selector:
     dependency: transitive
     description:
@@ -49,7 +42,7 @@ packages:
       name: cloud_firestore
       url: "https://pub.dartlang.org"
     source: hosted
-    version: "4.3.1"
+    version: "4.3.0"
   cloud_firestore_platform_interface:
     dependency: transitive
     description:
@@ -63,7 +56,7 @@ packages:
       name: cloud_firestore_web
       url: "https://pub.dartlang.org"
     source: hosted
-    version: "3.2.1"
+    version: "3.2.0"
   collection:
     dependency: transitive
     description:
@@ -71,20 +64,6 @@ packages:
       url: "https://pub.dartlang.org"
     source: hosted
     version: "1.16.0"
-  color_models:
-    dependency: transitive
-    description:
-      name: color_models
-      url: "https://pub.dartlang.org"
-    source: hosted
-    version: "1.3.3"
-  cross_file:
-    dependency: transitive
-    description:
-      name: cross_file
-      url: "https://pub.dartlang.org"
-    source: hosted
-    version: "0.3.3+2"
   crypto:
     dependency: transitive
     description:
@@ -99,20 +78,6 @@ packages:
       url: "https://pub.dartlang.org"
     source: hosted
     version: "1.0.5"
-  dio:
-    dependency: transitive
-    description:
-      name: dio
-      url: "https://pub.dartlang.org"
-    source: hosted
-    version: "4.0.6"
-  drop_shadow_image:
-    dependency: "direct main"
-    description:
-      name: drop_shadow_image
-      url: "https://pub.dartlang.org"
-    source: hosted
-    version: "0.9.1"
   fake_async:
     dependency: transitive
     description:
@@ -134,34 +99,27 @@ packages:
       url: "https://pub.dartlang.org"
     source: hosted
     version: "6.1.4"
-  file_picker:
-    dependency: "direct main"
-    description:
-      name: file_picker
-      url: "https://pub.dartlang.org"
-    source: hosted
-    version: "5.2.4"
   firebase_auth:
     dependency: "direct main"
     description:
       name: firebase_auth
       url: "https://pub.dartlang.org"
     source: hosted
-    version: "4.2.4"
+    version: "4.2.3"
   firebase_auth_platform_interface:
     dependency: transitive
     description:
       name: firebase_auth_platform_interface
       url: "https://pub.dartlang.org"
     source: hosted
-    version: "6.11.7"
+    version: "6.11.6"
   firebase_auth_web:
     dependency: transitive
     description:
       name: firebase_auth_web
       url: "https://pub.dartlang.org"
     source: hosted
-    version: "5.2.4"
+    version: "5.2.3"
   firebase_core:
     dependency: "direct main"
     description:
@@ -188,13 +146,6 @@ packages:
     description: flutter
     source: sdk
     version: "0.0.0"
-  flutter_color_models:
-    dependency: "direct main"
-    description:
-      name: flutter_color_models
-      url: "https://pub.dartlang.org"
-    source: hosted
-    version: "1.3.3+2"
   flutter_custom_clippers:
     dependency: "direct main"
     description:
@@ -202,13 +153,6 @@ packages:
       url: "https://pub.dartlang.org"
     source: hosted
     version: "2.1.0"
-  flutter_dotenv:
-    dependency: "direct main"
-    description:
-      name: flutter_dotenv
-      url: "https://pub.dartlang.org"
-    source: hosted
-    version: "5.0.2"
   flutter_lints:
     dependency: "direct dev"
     description:
@@ -216,13 +160,6 @@ packages:
       url: "https://pub.dartlang.org"
     source: hosted
     version: "2.0.1"
-  flutter_plugin_android_lifecycle:
-    dependency: transitive
-    description:
-      name: flutter_plugin_android_lifecycle
-      url: "https://pub.dartlang.org"
-    source: hosted
-    version: "2.0.7"
   flutter_test:
     dependency: "direct dev"
     description: flutter
@@ -233,6 +170,13 @@ packages:
     description: flutter
     source: sdk
     version: "0.0.0"
+  google_fonts:
+    dependency: "direct main"
+    description:
+      name: google_fonts
+      url: "https://pub.dartlang.org"
+    source: hosted
+    version: "2.3.3"
   google_nav_bar:
     dependency: "direct main"
     description:
@@ -241,7 +185,7 @@ packages:
     source: hosted
     version: "5.0.6"
   http:
-    dependency: "direct main"
+    dependency: transitive
     description:
       name: http
       url: "https://pub.dartlang.org"
@@ -254,41 +198,6 @@ packages:
       url: "https://pub.dartlang.org"
     source: hosted
     version: "4.0.2"
-  image_picker:
-    dependency: "direct main"
-    description:
-      name: image_picker
-      url: "https://pub.dartlang.org"
-    source: hosted
-    version: "0.8.6"
-  image_picker_android:
-    dependency: transitive
-    description:
-      name: image_picker_android
-      url: "https://pub.dartlang.org"
-    source: hosted
-    version: "0.8.5+4"
-  image_picker_for_web:
-    dependency: transitive
-    description:
-      name: image_picker_for_web
-      url: "https://pub.dartlang.org"
-    source: hosted
-    version: "2.1.10"
-  image_picker_ios:
-    dependency: transitive
-    description:
-      name: image_picker_ios
-      url: "https://pub.dartlang.org"
-    source: hosted
-    version: "0.8.6+4"
-  image_picker_platform_interface:
-    dependency: transitive
-    description:
-      name: image_picker_platform_interface
-      url: "https://pub.dartlang.org"
-    source: hosted
-    version: "2.6.2"
   intl:
     dependency: transitive
     description:
@@ -303,34 +212,6 @@ packages:
       url: "https://pub.dartlang.org"
     source: hosted
     version: "0.6.4"
-  json_annotation:
-    dependency: transitive
-    description:
-      name: json_annotation
-      url: "https://pub.dartlang.org"
-    source: hosted
-    version: "4.7.0"
-  just_audio:
-    dependency: "direct main"
-    description:
-      name: just_audio
-      url: "https://pub.dartlang.org"
-    source: hosted
-    version: "0.9.31"
-  just_audio_platform_interface:
-    dependency: transitive
-    description:
-      name: just_audio_platform_interface
-      url: "https://pub.dartlang.org"
-    source: hosted
-    version: "4.2.0"
-  just_audio_web:
-    dependency: transitive
-    description:
-      name: just_audio_web
-      url: "https://pub.dartlang.org"
-    source: hosted
-    version: "0.4.7"
   lints:
     dependency: transitive
     description:
@@ -338,13 +219,6 @@ packages:
       url: "https://pub.dartlang.org"
     source: hosted
     version: "2.0.1"
-  logger:
-    dependency: transitive
-    description:
-      name: logger
-      url: "https://pub.dartlang.org"
-    source: hosted
-    version: "1.1.0"
   matcher:
     dependency: transitive
     description:
@@ -366,13 +240,6 @@ packages:
       url: "https://pub.dartlang.org"
     source: hosted
     version: "1.8.0"
-  num_utilities:
-    dependency: transitive
-    description:
-      name: num_utilities
-      url: "https://pub.dartlang.org"
-    source: hosted
-    version: "1.0.5"
   page_transition:
     dependency: "direct main"
     description:
@@ -380,13 +247,6 @@ packages:
       url: "https://pub.dartlang.org"
     source: hosted
     version: "2.0.9"
-  palette_generator:
-    dependency: "direct main"
-    description:
-      name: palette_generator
-      url: "https://pub.dartlang.org"
-    source: hosted
-    version: "0.3.3+2"
   path:
     dependency: transitive
     description:
@@ -400,7 +260,7 @@ packages:
       name: path_provider
       url: "https://pub.dartlang.org"
     source: hosted
-    version: "2.0.11"
+    version: "2.0.12"
   path_provider_android:
     dependency: transitive
     description:
@@ -408,13 +268,13 @@ packages:
       url: "https://pub.dartlang.org"
     source: hosted
     version: "2.0.22"
-  path_provider_ios:
+  path_provider_foundation:
     dependency: transitive
     description:
-      name: path_provider_ios
+      name: path_provider_foundation
       url: "https://pub.dartlang.org"
     source: hosted
-    version: "2.0.11"
+    version: "2.1.1"
   path_provider_linux:
     dependency: transitive
     description:
@@ -422,13 +282,6 @@ packages:
       url: "https://pub.dartlang.org"
     source: hosted
     version: "2.1.7"
-  path_provider_macos:
-    dependency: transitive
-    description:
-      name: path_provider_macos
-      url: "https://pub.dartlang.org"
-    source: hosted
-    version: "2.0.6"
   path_provider_platform_interface:
     dependency: transitive
     description:
@@ -457,13 +310,6 @@ packages:
       url: "https://pub.dartlang.org"
     source: hosted
     version: "2.1.3"
-  powers:
-    dependency: transitive
-    description:
-      name: powers
-      url: "https://pub.dartlang.org"
-    source: hosted
-    version: "1.0.0+2"
   process:
     dependency: transitive
     description:
@@ -471,13 +317,6 @@ packages:
       url: "https://pub.dartlang.org"
     source: hosted
     version: "4.2.4"
-  rxdart:
-    dependency: transitive
-    description:
-      name: rxdart
-      url: "https://pub.dartlang.org"
-    source: hosted
-    version: "0.27.7"
   sky_engine:
     dependency: transitive
     description: flutter
@@ -490,13 +329,6 @@ packages:
       url: "https://pub.dartlang.org"
     source: hosted
     version: "1.9.0"
-  spotify_sdk:
-    dependency: "direct main"
-    description:
-      name: spotify_sdk
-      url: "https://pub.dartlang.org"
-    source: hosted
-    version: "2.3.0"
   stack_trace:
     dependency: transitive
     description:
@@ -518,13 +350,6 @@ packages:
       url: "https://pub.dartlang.org"
     source: hosted
     version: "1.1.1"
-  synchronized:
-    dependency: transitive
-    description:
-      name: synchronized
-      url: "https://pub.dartlang.org"
-    source: hosted
-    version: "3.0.0+3"
   term_glyph:
     dependency: transitive
     description:
@@ -546,13 +371,6 @@ packages:
       url: "https://pub.dartlang.org"
     source: hosted
     version: "1.3.1"
-  uuid:
-    dependency: transitive
-    description:
-      name: uuid
-      url: "https://pub.dartlang.org"
-    source: hosted
-    version: "3.0.7"
   vector_math:
     dependency: transitive
     description:
@@ -573,7 +391,7 @@ packages:
       name: xdg_directories
       url: "https://pub.dartlang.org"
     source: hosted
-    version: "0.2.0+2"
+    version: "0.2.0+3"
 sdks:
   dart: ">=2.18.5 <3.0.0"
   flutter: ">=3.0.0"
diff --git a/pubspec.yaml b/pubspec.yaml
index 37c2862e53014cd8a426a89fba0d207ead48df2c..b0a9915cbeb8bbe299ee0b991e35e2b6a7f3b680 100644
--- a/pubspec.yaml
+++ b/pubspec.yaml
@@ -51,6 +51,7 @@ dependencies:
   flutter_dotenv: ^5.0.2
   drop_shadow_image: ^0.9.1
   flutter_color_models: ^1.3.3+2
+  google_fonts: ^2.1.0
 
 dev_dependencies:
   flutter_test:
@@ -81,6 +82,9 @@ flutter:
     - assets/ambientR.jpeg
   #   - images/a_dot_burr.jpeg
   #   - images/a_dot_ham.jpeg
+  assets:
+    - ambientL.jpeg
+    - ambientR.jpeg
 
   # An image asset can refer to one or more resolution-specific "variants", see
   # https://flutter.dev/assets-and-images/#resolution-aware