diff --git a/knockoutwhistweb/app/controllers/HomeController.scala b/knockoutwhistweb/app/controllers/HomeController.scala
index 4489cd5..ff8281f 100644
--- a/knockoutwhistweb/app/controllers/HomeController.scala
+++ b/knockoutwhistweb/app/controllers/HomeController.scala
@@ -7,6 +7,7 @@ import de.knockoutwhist.components.Configuration
 import di.KnockOutWebConfigurationModule
 import play.api.*
 import play.api.mvc.*
+import play.twirl.api.Html
 
 import java.util.UUID
 import javax.inject.*
@@ -35,13 +36,13 @@ class HomeController @Inject()(val controllerComponents: ControllerComponents) e
       KnockOutWhist.entry(injector.getInstance(classOf[Configuration]))
     }
     Action { implicit request =>
-      Ok(views.html.index.apply())
+      Redirect("/sessions")
     }
   }
 
   def sessions(): Action[AnyContent] = {
     Action { implicit request =>
-      Ok(views.html.tui.apply(PodGameManager.listSessions().map(f => f.toString + "\n").mkString("")))
+      Ok(views.html.sessions.apply(PodGameManager.listSessions().map(f => f.toString)))
     }
   }
 
@@ -49,7 +50,7 @@ class HomeController @Inject()(val controllerComponents: ControllerComponents) e
     val uuid: UUID = UUID.fromString(id)
     if (PodGameManager.identify(uuid).isEmpty) {
       Action { implicit request =>
-        NotFound(views.html.tui.apply("Player not found"))
+        NotFound(views.html.tui.apply(List(Html(s"<p>Session with id $id not found!</p>"))))
       }
     } else {
       val session = PodGameManager.identify(uuid).get
diff --git a/knockoutwhistweb/app/controllers/WebUI.scala b/knockoutwhistweb/app/controllers/WebUI.scala
index 06eac00..0e826fe 100644
--- a/knockoutwhistweb/app/controllers/WebUI.scala
+++ b/knockoutwhistweb/app/controllers/WebUI.scala
@@ -39,7 +39,7 @@ object WebUI extends CustomThread with EventListener with UI {
           if (event.status == TECHNICAL_MATCH_STARTED) {
             val matchImpl = event.objects.head.asInstanceOf[Match]
             for (player <- matchImpl.totalplayers) {
-              PodGameManager.addSession(SimpleSession(player.id, ""))
+              PodGameManager.addSession(SimpleSession(player.id, List()))
             }
           } else {
             PodGameManager.transmitAll(event)
diff --git a/knockoutwhistweb/app/controllers/sessions/SimpleSession.scala b/knockoutwhistweb/app/controllers/sessions/SimpleSession.scala
index 3b62d76..738ce6b 100644
--- a/knockoutwhistweb/app/controllers/sessions/SimpleSession.scala
+++ b/knockoutwhistweb/app/controllers/sessions/SimpleSession.scala
@@ -10,13 +10,14 @@ import de.knockoutwhist.events.cards.{RenderHandEvent, ShowTieCardsEvent}
 import de.knockoutwhist.events.round.ShowCurrentTrickEvent
 import de.knockoutwhist.player.AbstractPlayer
 import de.knockoutwhist.utils.events.SimpleEvent
+import play.twirl.api.Html
 import scalafx.scene.image.Image
 import util.WebUIUtils
 
 import java.util.UUID
 
-case class SimpleSession(id: UUID, private var output: String) extends PlayerSession {
-  def get(): String = {
+case class SimpleSession(id: UUID, private var output: List[Html]) extends PlayerSession {
+  def get(): List[Html] = {
     output
   }
 
@@ -40,28 +41,23 @@ case class SimpleSession(id: UUID, private var output: String) extends PlayerSes
   }
 
   private def clear(): Unit = {
-    output = ""
+    output = List()
   }
 
   private def renderHand(event: RenderHandEvent): Unit = {
-    output += WebUICards.renderHandEvent(event.hand, event.showNumbers).map(_.toString).mkString
+    output = output :++ WebUICards.renderHandEvent(event.hand)
+    output = output :+ Html("<br>")
   }
 
   private def showtiecardseventmethod(event: ShowTieCardsEvent): Option[Boolean] = {
-    val a: Array[String] = Array("", "", "", "", "", "", "", "")
+    var l = List[Html]()
     for ((player, card) <- event.card) {
-      val playerNameLength = player.name.length
-      a(0) += " " + player.name + ":" + (" " * (playerNameLength - 1))
-      val rendered = WebUIUtils.cardtoImage(card)
-      //a(1) += " " + rendered(0)
-      //a(2) += " " + rendered(1)
-      //a(3) += " " + rendered(2)
-      //a(4) += " " + rendered(3)
-      //a(5) += " " + rendered(4)
-      //a(6) += " " + rendered(5)
-      //a(7) += " " + rendered(6)
+      l = l :+ Html(s"<p>${player.name}:</p>")
+      l = l :+ WebUIUtils.cardtoImage(card)
+      l = l :+ Html("<br>")
     }
-    a.foreach(addToOutput)
+    output = output :++ l
+    output = output :+ Html("<br>")
     Some(true)
   }
 
@@ -83,7 +79,7 @@ case class SimpleSession(id: UUID, private var output: String) extends PlayerSes
       case SHOW_START_MATCH =>
         clear()
         println("Starting a new match...")
-        output += "\n\n"
+        output = output :+ Html("<br><br>")
         Some(true)
       case SHOW_TYPE_PLAYERS =>
         println("Please enter the names of the players, separated by a comma.")
@@ -139,7 +135,7 @@ case class SimpleSession(id: UUID, private var output: String) extends PlayerSes
         Some(true)
       case SHOW_WON_PLAYER_TRICK =>
         println(s"${event.player.name} won the trick.")
-        output = "\n\n"
+        output = output :+ Html("<br><br>")
         Some(true)
     }
   }
@@ -156,7 +152,7 @@ case class SimpleSession(id: UUID, private var output: String) extends PlayerSes
       case SHOW_START_ROUND =>
         clear()
         println(s"Starting a new round. The trump suit is ${event.currentRound.trumpSuit}.")
-        output = "\n\n"
+        output = output :+ Html("<br><br>")
         Some(true)
       case WON_ROUND =>
         if (event.objects.length != 1 || !event.objects.head.isInstanceOf[AbstractPlayer]) {
@@ -219,16 +215,17 @@ case class SimpleSession(id: UUID, private var output: String) extends PlayerSes
     Some(true)
   }
 
-  private def addToOutput(str: String): Unit = {
-    output += str + "\n"
-  }
-
   private def println(s: String): Unit = {
-    output += s + "\n"
+    var html = List[Html]()
+    for (line <- s.split("\n")) {
+      html = html :+ Html(line)
+      html = html :+ Html("<br>")
+    }
+    output = output :++ html
   }
 
   private def println(): Unit = {
-    output += "\n"
+    output = output :+ Html("<br>")
   }
 
   object WebUICards {
@@ -256,16 +253,8 @@ case class SimpleSession(id: UUID, private var output: String) extends PlayerSes
       )
     }
 
-    def renderHandEvent(hand: Hand, showNumbers: Boolean): List[Image] = {
+    def renderHandEvent(hand: Hand): List[Html] = {
       hand.cards.map(WebUIUtils.cardtoImage)
-      //var zipped = cardStrings.transpose
-      //if (showNumbers) zipped = {
-      // List.tabulate(hand.cards.length) { i =>
-      //    s"     ${i + 1}     "
-      //  }
-      // } :: zipped
-      // zipped.map(_.mkString(" ")).toVector
-      // }
     }
   }
 }
\ No newline at end of file
diff --git a/knockoutwhistweb/app/util/WebUIUtils.scala b/knockoutwhistweb/app/util/WebUIUtils.scala
index a89cc82..63428f3 100644
--- a/knockoutwhistweb/app/util/WebUIUtils.scala
+++ b/knockoutwhistweb/app/util/WebUIUtils.scala
@@ -3,10 +3,11 @@ package util
 import de.knockoutwhist.cards.Card
 import de.knockoutwhist.cards.CardValue.{Ace, Eight, Five, Four, Jack, King, Nine, Queen, Seven, Six, Ten, Three, Two}
 import de.knockoutwhist.cards.Suit.{Clubs, Diamonds, Hearts, Spades}
+import play.twirl.api.Html
 import scalafx.scene.image.Image
 
 object WebUIUtils {
-  def cardtoImage(card: Card): Image = {
+  def cardtoImage(card: Card): Html = {
     val s = card.suit match {
       case Spades => "S"
       case Hearts => "H"
@@ -28,6 +29,6 @@ object WebUIUtils {
       case Three => "3"
       case Two => "2"
     }
-    new Image(f"public/images/cards/$cv$s.png")
+    views.html.output.card.apply(f"images/cards/$cv$s.png")(card.toString)
   }
 }
diff --git a/knockoutwhistweb/app/views/output/card.scala.html b/knockoutwhistweb/app/views/output/card.scala.html
new file mode 100644
index 0000000..788be74
--- /dev/null
+++ b/knockoutwhistweb/app/views/output/card.scala.html
@@ -0,0 +1,2 @@
+@(src: String)(alt: String)
+<img src="@routes.Assets.versioned(src)" alt="@alt"/>
\ No newline at end of file
diff --git a/knockoutwhistweb/app/views/output/text.scala.html b/knockoutwhistweb/app/views/output/text.scala.html
new file mode 100644
index 0000000..8f0538f
--- /dev/null
+++ b/knockoutwhistweb/app/views/output/text.scala.html
@@ -0,0 +1,3 @@
+@(text: String)
+<p>@text</p>
+
diff --git a/knockoutwhistweb/app/views/sessions.scala.html b/knockoutwhistweb/app/views/sessions.scala.html
new file mode 100644
index 0000000..e458c99
--- /dev/null
+++ b/knockoutwhistweb/app/views/sessions.scala.html
@@ -0,0 +1,10 @@
+@(toRender: List[String])
+
+@main("Sessions") {
+    <div id="sessions">
+        @for(line <- toRender) {
+            <a href="@routes.HomeController.ingame(line)">@line</a><br>
+        }
+    </div>
+}
+
diff --git a/knockoutwhistweb/app/views/tui.scala.html b/knockoutwhistweb/app/views/tui.scala.html
index f6ae5be..8d8cc04 100644
--- a/knockoutwhistweb/app/views/tui.scala.html
+++ b/knockoutwhistweb/app/views/tui.scala.html
@@ -1,9 +1,9 @@
-@(toRender: String)
+@(toRender: List[Html])
 
 @main("Tui") {
     <div id="tui">
-        @for(line <- toRender.split('\n')) {
-            <a href="@routes.Relative.ingame(line)">@line</a>
+        @for(line <- toRender) {
+            @line
         }
     </div>
 }