diff --git a/call/static/call/guestbook.css b/call/static/call/guestbook.css
index cac43f6..2b1e6c1 100644
--- a/call/static/call/guestbook.css
+++ b/call/static/call/guestbook.css
@@ -27,7 +27,7 @@ div.caption {
     position: absolute;
     left: -120px;
     width: 240px;
-  }
+}
 div.caption .corner {
     width: 11px;
     height: 11px;
@@ -39,6 +39,7 @@ div.caption .corner {
 div.caption div.captiontext {
     /* height: 4em; */
     width: 100%;
+    background: white;
     border: 1px solid black;
     /* top | right | bottom | left */
     padding: 0 0.3em 0.3em 0.3em;
diff --git a/call/static/call/index.css b/call/static/call/index.css
index 96df9de..c12628a 100644
--- a/call/static/call/index.css
+++ b/call/static/call/index.css
@@ -16,6 +16,9 @@ h1 {
   margin: 0 0 10px 0;
   padding: 0; 
 }
+h2 {
+  font-size: 28px;
+}
 #root {
   max-width: 512px;
   /* white-space: nowrap; */
diff --git a/call/templates/call/creature_detail.html b/call/templates/call/creature_detail.html
index fda1389..bb77633 100644
--- a/call/templates/call/creature_detail.html
+++ b/call/templates/call/creature_detail.html
@@ -1,7 +1,48 @@
 {% extends "call/base.html" %}
+{% load static %}
+{% block extrahead %}
+<link rel="stylesheet" href="{% static 'call/guestbook.css'%}">
+<style>
+    body { 
+        background:  hsl({{bg_hue|default:"0"}}deg {{bg_sat|default:"0"}}% {{bg_lightness|default:"66"}}%);
+        margin: 0;
+    }
+    @page {
+        /* size: 2160px 3840px; */
+        size: 432px 768px;
+        margin: 0;
+    }
+    .flex-container {
+        height: 100%;
+        padding: 0;
+        margin: 0;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+    }
+    #page {
+        position: absolute;
+        left: 0; right: 0;
+        top: 0; bottom: 0;
+    }
+    div.caption div.captiontext {
+        font-size: 24px;
+    }
+    div.caption {
+        /* border: 1px solid black; */
+        position: absolute;
+        /* left: -480px;
+        width: 960px; */
+        left: -120px;
+        width: 240px;
+    }
 
+</style>
+{% endblock %}
 {% block content %}
-<img src="{{object.image.url}}">
-<img src="{% url 'creature_frame' object.id %}">
-<p>{{object.caption}}</p>
+<div id="page">
+    <div class="flex-container">
+        <div class="creature"><img src="{% url 'creature_frame' creature.id %}?cell={{cell}}"><div class="centerbottom"><div class="caption"><div class="corner"></div><div class="captiontext">{{creature.caption}}</div></div></div></div>
+    </div>
+</div>
 {% endblock %}
\ No newline at end of file
diff --git a/call/templates/call/index.html b/call/templates/call/index.html
index d4cee8d..af42a3c 100644
--- a/call/templates/call/index.html
+++ b/call/templates/call/index.html
@@ -6,9 +6,37 @@
 
 {% block content %}
 
-<h1>XPUB Community Builder...</h1>
+<h1>Study @ XPUB!</h1>
 <span id=loading>loading...</span>
 <div id=root class=rootloading>
+
+  <div id="info" style="font-family: serif !important">
+    <p>
+      The <a href="https://xpub.nl/" target="extern">Master Experimental Publishing (XPUB)</a> at the <a href="https://pzwart.nl/" target="extern">Piet Zwart Institute</a> in Rotterdam (NL) is a two-year master focused on the acts of making things public and creating publics in the age of post-digital networks. 
+    </p>
+    <p>XPUB is looking for new students! Come & join us!<p>
+    <p>Use the <em>XPUB Community Builder</em> below to put yourself on our digital guestbook, join an upcoming open day either online or in-person, and APPLY!</p>
+    <p><a href="https://www.pzwart.nl/application/deadlines/" target="extern">Application deadlines</a>:</p>
+    <p>
+      <ul>
+        <li>March 4, 2024 (non-EU final + EU priority deadline)</li>
+        <li>May 8, 2024 (final EU deadline)</li>
+      </ul>
+    </p>
+    <p><a href="https://www.pzwart.nl/blog/open-day/" target="extern">Open days</a>:</p>
+    <p>
+      <ul>
+        <li>ONLINE: <a href="mailto:pzi.coordinators@hr.nl?subject=XPUB Open Day (online)&amp;body=Hello, I will join the online open day on the February 11th on 10:00 CET or 16:00 CET" target="_blank">February 11, 2024, 10:00 + 16:00 CEST</a></li>
+        <li>IN PERSON:<a href="https://www.pzwart.nl/blog/open-day/" target="extern">February 15, 2025</a></li>
+      </ul>
+    </p>
+    <p>
+      <button style="background: yellow" id="apply" onclick="window.open('https://www.pzwart.nl/experimental-publishing/apply/', 'extern')">Apply</button>
+    </p>
+  </div>
+
+  <h2>XPUB Community Builder</h2>
+
   <canvas id=c width=16 height=16></canvas>
   <!-- <div id=caption>HERE CAPTION</div> -->
   <div class="caption"><div class="corner"></div><textarea placeholder="Your messsage" autofocus id="caption"></textarea></div>
@@ -75,32 +103,10 @@
     </p>
   </div>
 
-  <div id="info" style="font-family: serif !important">
-    <p>
-      The <a href="https://xpub.nl/" target="extern">Master Experimental Publishing (XPUB)</a> at the <a href="https://pzwart.nl/" target="extern">Piet Zwart Institute</a> in Rotterdam (NL) is a two-year master focused on the acts of making things public and creating publics in the age of post-digital networks. 
-    </p>
-    <p><a href="https://www.pzwart.nl/application/deadlines/" target="extern">Application deadlines</a>:</p>
-    <p>
-      <ul>
-        <li>March 4, 2024 (non-EU final + EU priority deadline)</li>
-        <li>May 8, 2024 (final EU deadline)</li>
-      </ul>
-    </p>
-    <p><a href="https://www.pzwart.nl/blog/open-day/" target="extern">Open days</a>:</p>
-    <p>
-      <ul>
-        <li>ONLINE: <a href="mailto:pzi.coordinators@hr.nl?subject=XPUB Open Day (online)&amp;body=Hello, I will join the online open day on the February 11th on 10:00 CET or 16:00 CET" target="_blank">February 11, 2024, 10:00 + 16:00 CEST</a></li>
-        <li>IN PERSON:<a href="https://www.pzwart.nl/blog/open-day/" target="extern">February 15, 2025</a></li>
-      </ul>
-    </p>
-    <p>
-      <button style="background: yellow" id="apply" onclick="window.open('https://www.pzwart.nl/experimental-publishing/apply/', 'extern')">Apply</button>
-    </p>
-  </div>
-  
-    <div style="display: none"><a href="{% static 'call/terms.json'%}" id="terms-data-source"></a></div>
     
-</div>
+    <div style="display: none"><a href="{% static 'call/terms.json'%}" id="terms-data-source"></a></div>
+      
+  </div>
 
 <div style="display: none">
     <form enctype="multipart/form-data" method="post" action="">
diff --git a/call/urls.py b/call/urls.py
index 2476cac..03194f2 100644
--- a/call/urls.py
+++ b/call/urls.py
@@ -17,14 +17,14 @@ Including another URLconf
 from django.contrib import admin
 from django.urls import path, include
 from call import views
-from .views import Guestbook, CreatureList, CreatureDetail, creature_frame
+from .views import Guestbook, CreatureList, creature_detail, creature_frame
 
 urlpatterns = [
     path("guestbook/", Guestbook.as_view(), name="guestbook"),
     # path("creatures/<int:pk>/s/", Statement.as_view(), name="statement"),
     # path("creatures/<int:pk>/w/", Walk.as_view(), name="walk"),
     path("creatures/", CreatureList.as_view(), name="creature_list"),
-    path("creatures/<int:pk>/", CreatureDetail.as_view(), name="creature_detail"),
+    path("creatures/<int:creature_id>/", creature_detail, name="creature_detail"),
     path("creatures/<int:creature_id>/frame/", creature_frame, name="creature_frame"),
     path('', views.index)
 ]
diff --git a/call/views.py b/call/views.py
index 621330f..2f8f821 100644
--- a/call/views.py
+++ b/call/views.py
@@ -5,6 +5,7 @@ from .models import Creature
 from django.urls import reverse
 # from io import StringIO
 from PIL import Image
+from random import randint, seed
 
 
 def index(request):
@@ -40,15 +41,29 @@ class CreatureList(generic.ListView):
     template_name = "call/creature_list.html"
     queryset = Creature.objects.filter(published=True)
 
-class CreatureDetail(generic.DetailView):
+def creature_detail(request, creature_id):
     """ Generates Pixelated PNG of creature """ 
-    model = Creature
-    template_name = "call/creature_detail.html"
+    context = {}
+    context['creature'] = get_object_or_404(Creature, pk=creature_id)
+    context['cell'] = int(request.GET.get("cell", "0"))
+    seed(creature_id)
+    context['bg_hue'] = randint(0, 360)
+    context['bg_sat'] = 100
+    context['bg_lightness'] = randint(50, 100)
+    return render(request, "call/creature_detail.html", context)
 
 def creature_frame (request, creature_id):
     """ Generates Pixelated PNG of creature """ 
+    cell = int(request.GET.get("cell", "0"))
     creature = get_object_or_404(Creature, pk=creature_id)
     im = Image.open(creature.image.path)
     response = HttpResponse(content_type="image/png")
+    scale = 6 # 24
+    im = im.crop((16*cell, 0, (16*cell)+16, 16))
+    w, h = im.size
+    im = im.resize((w*scale,h*scale), resample=Image.NEAREST)
     im.save(response, "PNG")
+    #im_with_background = Image.new("RGBA", (w*scale, h*scale), (128,0,0))
+    #im_with_background.paste(im, mask=im)
+    #im_with_background.save(response, "PNG")
     return response