Om Kvandring

”Kvandring” är en hopskrivning av Kulturvandring.

Kvandring.se är en applikationsplattform som utvecklas och drivs av Mikael Grön, Grön IT AB i Skara. Applikationernas individuella utvecklare och skapare ses i listan nedan.

Just nu finns dessa applikationer:

  • Fornbyäventyret, fornbyn.kvandring.se (upplevs bäst via mobiltelefon på plats i Fornbyn!)
    Utvecklades under början och mitten av 2021 och lanseras 2021-06-12. Detta projekt är ett samarbete mellan Västergötlands Museum och Högskolan i Skövde. Det administreras, drivs och underhålls av Brita Planck och Niclas Loodus-Dristig på Västergötlands Museum.
    • Projektkonsult: Lars Vipsjö
    • Manus och regi: Niclas Loodus-Dristig
    • Forskning: Axel Kallberg
    • Illustration och animation: Christina Jonsson
    • Programmering: Mikael Grön
    • Röster: [lista kommer snart]

Plattformen

I grunden är det en WordPress multisite, där flera subdomäner kan köra samma applikation parallellt med olika grafik, textinnehåll och spel-logik.

I wordpress finns ett plugin som håller koll på hur användaren tagit sig runt i ”vandringen”. Det håller koll på vilka sidor som besökts och tillhandahåller funktioner en rutt-funktion där t.ex. en QR-kod kan leda till vilken sida som helst och där urvalet baseras på vilka sidor besökaren sett och inte sett.

Komponenter i systemet

Rutter

En rutt låter administratören specificera ett logiskt flöde där en mål-sida väljs. Det går att ha obegränsat antal steg i det urvalet, och för varje steg (utom det sista) kan en en lista med regler anges. Det finns två listor: sidor användaren behöver ha sett, och sidor användaren inte får ha sett.

Det första steget i ordning där alla regler stämmer kommer väljas och användaren skickas till den sida som valts i steget.

I slutet finns ett steg som inte har några regler, och där anger administratören den sida som ska användas som standard.

I exemplet Fornbyäventyret ska man t.ex. scanna en QR-kod vid smedjan. När koden scannas kollar Rutt-systemet om besökaren varit och öppnat Jordkällaren ännu, och har den inte det visas en sida som visar att smedjan är tom. Om besökaren sedan går till Jordkällaren och släpper ut smeden så noteras det att den sidan besökts, och nästa gång QR-koden vid smedjan scannas så visas istället en annan sida som visar smeden i smedjan.

Karaktärer

En karaktär har flera attribut:

  • Namn
    En textruta som visas på de ställen karaktären visas.
  • Bild
    Används på Kartan och i knappraden på de sidor som kopplat karaktären.
  • En lista med sidor där karaktären är kopplad
    På dessa sidor visas karaktären i knappraden i botten. När besökaren trycker på karaktären skickas den till den sida som är kopplad som ”om karaktären”
  • En sida som är kopplad som ”om karaktären”
    Alltså den sida man ska skickas till när man trycker på karaktären. Detta kan komma att ändras till att istället vara själva karaktärsobjektet i en framtida version.
  • Kartposition
    Den plats på kartan, angiven i procent av kartans totala bredd respektive höjd, där karaktären ska visas. Läs mer här.
    Om dessa fält är tomma visas inte karaktären på kartan.

Sidor

Detta är huvudpunkterna i systemet. Det är här bild och text leder besökaren genom vandringsupplevelsen.

När besökaren når en sida registreras det av WordPress-pluginet och den informationen kan sedan användas av rutt-systemet för att i ett senare skede skicka besökaren till olika sidor baserat på vilka sidor som redan besökts och inte.

Det finns en rad attribut som adminstratören kan använda:

  • Titel
    Denna visas inte för besökaren men visas i administrationen så det är lätt att hitta rätt sida. Den används också som underlag för sidans unika webbadress, men webbadressen kan redigeras i efterhand.
  • Utvald bild
    Detta är ett en standardfunktion i WordPress men i det här fallet används den som bakgrundsbild på sidan. Den täcker hela vyn och är centrerad i höjd- och breddled.
  • Kopplade saker
    När besökaren når sidan registreras alla kopplade saker som ”mottagna” och visas från den stunden i ”Ryggsäcken”.
  • Karaktärsknappar
    Detta är kopplingen mellan sidor och karaktärer. Den kopplingen är två-vägs och sidor som är kopplade till en viss karaktär visas även i redigeringsvyn för själva karaktären.
  • Karaktärer som leder till sidan
    När tryck på en karaktär ska leda till den nuvarande sidan så visas de karaktärerna i denna lista.
  • Animationer och ljud
    Grafiken på sidan görs i lager. I den här rutan kan administratören lägga lager på lager av transparenta png och apng-filer, alltså både stilla och animerade bilder. Dessa är alla låsta i vänster, botten och höger. På så sätt kan en animatör/illustratör optimera hur mycket data besökaren behöver ladda ner, genom att t.ex. sätta en persons kropp i ett stilla lager och göra en separat animation med ansiktsrörelser som då blir mycket mindre.
    Här sätts även ett ljudspår i mp3-format. På grund av restriktioner i moderna webbläsare behöver besökaren interagera med sidan innan ett ljudspår kan startas, så därför laddas bilder och ljud i bakgrunden så de kan startas samtidigt när besökaren trycker på ”Starta berättelse”-knappen.

Saker

En sak är ett ganska enkelt objekt. Besökaren får saker när den besöker sidor där det finns kopplade saker, och sakerna visas sedan i Ryggsäcken.

Knappraden

I botten av alla sidor visas en knapprad med dessa knappar:

  • Kopplade karaktärer
    Varje knapp leder då till den sida som från karaktären är kopplad som ”Sida att öppna vid klick”.
  • Kartan (se nedan)
  • Ryggsäcken (se nedan)

Kartan

Kartan är i första versionen hårdkodad i temat. Därför behöver ett nytt tema konstrueras per vandring. Det kan dock lika gärna bli så att temat byggs om vid första behovet, då det är något som kan göras dynamiskt.

På kartan visas alla karaktärer som har en kartposition. Deras bild centreras på den punkten och deras namn visas under bilden. De karaktärer som är kopplade till sidor besökaren har sett blir semitransparenta för att markera detta för besökaren.

Kartpositioner

Karaktärernas position på kartan är angiven i procent av kartans höjd och bredd. Detta för att systemet inte ska bli för fastlåst i en viss bild eller en viss skärmstorlek. För att räkna ut rätt kartposition rekommenderas därför att kartan om formas till en kvadrat i ett bildredigeringsprogram och att den önskade positionen mäts från vänster och från toppen i pixlar som sedan delas med kartans totalhöjd och multipliceras med 100. Ett exempel som jag använde under utvecklingen av Fornbyäventyret är att i Photoshop skala kartan till 1000×1000 pixlar och med markeringsverktyget dra från övre vänstra hörnet ned till en viss plats på kartan och släppa. I Photoshop kan man då se hur stor den markerade ytan är i pixlar. Om måtten då var till exempel 552 och 328 så delade jag dem med 10 och fick ut kartpositionen 55,2 och 32,8 procent.

Ryggsäcken

Detta är en ruta som visar alla saker man samlat på sig under vandringen. Dessa har ingen vidare logik kopplad till sig, men det går att bygga något sådant i framtiden, att t.ex. rutter kan ha med saker i stegens logik.