Overview: First draft

styleguide/index.html

@@ -93,8 +93,6 @@
         </ul>
       </nav>
       <main>
-        <h1>Styleguide Easterhegg 2025</h1>
-
         <div class="alert">
           <i data-icon="warning"></i>
           <p>
@@ -104,6 +102,62 @@
             may be missing and things may change without notice.
           </p>
         </div>
+
+        <h1>Styleguide Easterhegg 2025</h1>
+        <p>
+          This page and subpages are meant to guide you through our design.
+          While we do propose some rules, we generally don't want to restrict
+          you to much in creating something. So for most design properties, if
+          one doesn't work for your use-case, then try and adapt that property
+          to make it work for you. This style guide is supposed to help you and
+          not prevent you from being creative.
+        </p>
+
+        <h2>Design Idea</h2>
+        <p>
+          The design aims to imitate the style of 80s' retro and neon signs.
+          During the design process, we interenally used keywords like "Tokyo
+          Nightcity", "Neon", "Glitchy" and "Tron" to describe our ideas, and we
+          hope this carries over.
+        </p>
+        <p>
+          We primarily focused on the dark theme as the primary design
+          characteristics are the neon-glow and neon-sign-font which you can see
+          in the headings, title image and navigation elements. But we did also
+          create a light mode to make content more accesible and available for
+          more people. But because the neon-effect doesn't really work on a
+          bright background out of the box, we tried to instead convey the look
+          of turned off neon signs or neon signs under daylight.
+        </p>
+        <p>
+          We recommend reading through all sections linked to in the site's
+          navigation, but if you just want a quick overview of design elements,
+          you can focus on
+          <a href="demopage/"
+            >the demopage containing a preview of most things</a
+          >. Most pages also include more detailed explanations for our design
+          decisions.
+        </p>
+
+        <h2>Credit and Disclaimer</h2>
+        <p>
+          We (<a href="https://https://kzl.sh/">kritz</a>,
+          <a href="https://lyx.sh/">traumweh</a> &amp;
+          <a href="https://chaos.social/@schrottkatze">Schrottkatze</a>) created
+          this design and guide through many months of hard work. And
+          considering the current hype reguarding "AI" (LLMs & GenAI), we want
+          to make it clear, that we didn't use any such tooling at any point in
+          the design process. All work was done by living beings.
+        </p>
+        <p>
+          This is also why we would kindly ask you to consider not to use LLMs
+          or GenAI yourself when creating something for this event. These tools
+          are built on theft and actively harm all creative industries. Not to
+          mention how devastating they are for our planet. Instead, maybe take
+          this as motivation for you to learn how to achieve the desired thing
+          yourself, or connect with the community. There are many artists who'd
+          be happy to help you create something incredible.
+        </p>
       </main>
       <script src="assets/script/styleguide.js" type="text/javascript"></script>
     </div>