Text adventure

So I found this really amazing tool - textäventyr - but we have pros and cons at this moment. On the plus side it's really really easy to learn and use, on the minus side the interface is in Swedish. However, what you find in Swedish is really simple. Text adventure online tool, here.

"Skapa nytt" - CREATE NEW! (simple, right?)

Here you have the basics when you first land on the toolbench

Click on a node to get the settings on that node, or click on an arrow to get its settings.

And last skill to learn is this

 And now you're ready to start!

Let's try to create a game!
Either and most likely, you're students will dig right in. However, if you'd like to implant code thinking you can start to introduce pseudocode and later also, if you'd like, flowcharts (graphic version of your pseudo text code). 

Pseudocode above and flowchart below.

With this masterplan we open up Textäventyr.se and after START we should have three (3) options. You already have two that you need to edit (höger - right and vänster - left). After done that you need to click on the mother node (Start / math game) and add a new node.

If you had a plausible answer, you will now get a new try to get back on track. Therefore we need to add a new question after 40, "what is 55+56?". Click on the 40-bubble, press "skapa ny nod" to create a new node "Step 2"

If you click on a bubble (node) and hold down the left mouse button, you can also move the node. The step 2 answer "100" is wrong and is about to be linked to start, I want to have that button moved to the left.

And if you click on the arrow between "100" and "math game" you can also see the arrow's settings.

If you remember the flowchart, we use that to build up our game

Now it's time to test run our game! Press PLAY (green button "spela upp") 

Looking good, right?

When we answered correctly (38) we see you can turn back. If you make progress in game it's no need to turn back, we need to change that arrow from a double - to a single arrow. Press EDIT (the green button "redigera")

Then search the right arrow and press it!

And now change the arrow from "double direction" ("dubbelriktad") to "one way" ("enkel").

Then, press PLAY ("spela upp") once more and continue to "debug" your code. When you're ready you can SHARE your work with your students. Press SHARE ("dela")

You now get a few options. Orange square and text is YOUR link to save so you can edit the game in the future. The blue square and text is the one you share with your players! And you can also have players to join with a QR code.

And if you, who have read this, want to test the game I made for this tutorial, you can press here!

Pseduokod med Textäventyr

Det oavsiktliga (?) lärandet

Jag insåg ganska snabbt att det oavsiktliga lärandet med Textäventyr.se var grunderna i programmering. Att man behöver inte göra introduktionen till kod krångligare än så här. För att du skall lyckas med ditt Textäventyr behöver ha ett flöde i ditt spel.

Pseudokod kallas ett sånt flöde. Man skriver vad som skall hända, när, vilka valmöjligheter osv, Det här kan man göra antingen i textform eller i ett flödesschema.

Datorer har fördelar och nackdelar. En fördel är att de kan räkna oerhört snabbt. En nackdel är att du måste säga åt datorn vad han skall räkna.

Pseudokod, förklaring i Wikipedia

"Pseudokod är i datorprogrammering ett för ett icke-programspråk specifikt sätt att beskriva algoritmer. Det finns ingen standard för pseudokod. Pseudokod används dels i äkta datorprogram, instoppade i kodkommentarer, för att ge en skiss till kod som ännu inte skrivits, dels används det i publicerade program enbart avsedda att läsas, då en äkta programimplementation bedöms vara mer svårläst. Pseudokod kan även vara ett verktyg för att beskriva en algoritm utan att behöva ta hänsyn till olika programspråks variation av implementeringen.

Ofta består pseudokod av en blandning av ett "riktigt" programspråk och ett mänskligt språk som svenska eller engelska. Det är också vanligt att matematiska symboler ingår."

Exempel.

I min förra bloggpost visade jag hur man kan skapa ett textspel om finsk litteraturhistoria. Pseudokoden till spelet skulle kunna se ut så här:

Flödesschema

Nästa steg blir att skissa upp processen i ett flödesschema. Vi använder igen Wikipedia som källa:

"Ett flödesschema är en grafisk beskrivning av en algoritm eller en process. Dess grafiska struktur kan bestå av ovaler, rektanglar och romber som binds samman av pilar för att visa ordningen i flödesschemat. Innehållet i de grafiska figurerna består av korta beskrivningar, som till exempel instruktioner och villkor. Flödesscheman används till att analysera, designa, dokumentera eller hantera en process eller ett program inom olika områden."

Flödesschemat för mitt spel ser ut så här:

Min "kod" i Textäventyr.se

Min "kod" i textäventyr.se ser nästan likadan ut som i mitt flödesschema. Fördelen med ett verktyg som Textäventyr (eller FazGame) är att du kan testköra din "kod" direkt för att se hur den ser ut, vad som fungerar och vad som inte fungerar. Måste du ändra nåt?

Textäventyr.se

Nu har jag ramlat på ett helt fantastiskt verktyg med superlåg inlärningströskel. Den pedagogiska tanken är att ha fokus (och uppmuntra) skrivandet men också läsandet. Sen finns det naturligtvis ett oavsiktligt lärande som är nog så viktigt: pseudokod, manus, flödesschema osv.

Textäventyr lanserades för ca 2 veckor sedan, det är helt nytt och ännu i alfa.version. Det är Göteborgsregionens kommunalförbund som utvecklat det webbaserade verktyget "för att på ett enkelt och uppmuntrande sätt arbeta med text i olika former, motivera elever att arbeta med läs- och skrivkunnighet samt skapa med digitala verktyg."

Om du som pedagog är nyfiken hur man förankrar spelet i (den svenska) läroplanen, kan du läsa här.

Mitt första textäventyr

Vi återkommer till hur man gör, men jag upptäckte själv att kreativiteten började flöda och att jag ville skapa mer och mer. Jag föreställde mig att vi står utanför vår skola Prakticum, med ryggen mot Arcada och bredvid lejonen. Till höger har jag ingången till vår skola och till vänster, i byggnaden bredvid, fordonsmekanikernas verkstad och Fixus butiken.

Bilmekanikernas drama, klicka här

Textäventyr.se

That's it. Länkadress (orange fyrkant) som är bra om du kopierar och sparar någonstans och sen två knappar i verktygsmenyn (gul fyrkant).

Navigera
När du trycker på "Skapa nytt" så landar du här. Den svarta rutan "inställningar" markerar att du nu är i skapar miljön. Gröna knappen "Spela upp" trycker du för att spela spelet och "Dela"-knappen (gula knappen) är hur du delar din skapelse med andra.

Igen skulle jag vilja rekommendera att du kopierar länken för framtida bruk (oranga rutan)

Cirklarna i bilden kallas för "Nod", klicka på en cirkel för att redigera den. Bollarna eller cirklarna är ditt flödesschema (eller om vi pratar programmering, din pseudokod)

Nodens namn, den syns dels i ditt flödesschema men också som knappnamn i ditt spel.

Pilarna anger möjligheterna inne i spelet. I mitt första spel om bilmekanikerna kunde man precis i början välja att gå till höger, men då gick vi in i en återvändsgränd och behövde gå tillbaka. I flödesschemat är den pilen dubbelriktad. Senare i spelet skickas eleven till rektorn, dessa pilar går bara framåt eftersom eleven måste prata med rektorn.

Skapa steg för steg

Nu kör vi! Start kan behållas eftersom spelet startas där, och vi börjar med en fråga. Det här är ett praktiskt exempel, det är en - eller var - en del av min kollega JP:s kursinnehåll i modersmål och Fänrik Ståhls sägner. Så, frågan vi ställer oss: Vem var Sven Duva?

Vi bestämmer oss för att ha två val, två finska stora författare: Topelius och Runeberg. Topelius blir det felaktiga svaret medan Runeberg är det rätta.

Vi testkör för att se hur spelet ser ut. Och om vi trycker på Topelius så får vi meddelande att det är fel och att vi måste svara på nytt (dubbelriktad pil).

För att komma tillbaka till verktygsbordet trycker man nu på den gröna knappen "redigera".

Nu fortsätter vi med spelet och lägger till det rätta svaret (Runeberg). Den som skapar spelet kan nu uppmuntra spelarna att lära sig mer om Sven Duva, vare sig det är läraren eller en elev som vill redovisa att han läst eposet. I "Brödtexten" ställer vi en ny fråga "vad minns du om Sven?"

Rätt svar var ju Runeberg, och nu går spelet vidare. Vi måste föra handlingen vidare i spelet och för att göra detta måste vi skapa en ny cirkel/boll - nod - tryck på knappen "skapa ny nod".

Den nya nod:en får ett nummer (i flödesschemats ordningsföljd) och du måste nu döpa om nodens namn och vad som händer just här.

"Hen var enda barnet" - fel svar. Passligt nog har Topelis skrivit Adalminas pärla, och Adalmina var enda barnet. Om man väljer "enda barnet" vill vi att spelaren skickas tillbaka till Topelius och därmed starta på nytt.

Det här svarsalternativet behöver länkas till, i det här fallet, Topelius bollen.

Nu lägger vi till ett rätt svar, klicka på "Runebergs cirkeln" igen. Tryck "skapa ny nod"

"Hen var yngst" (av nio syskon) - rätt svar - och som belöning kopierar vi in första versen om Sven Duva.

Vårt exempelspel är nu klart och vi vill dela detta, med klasskamrater, elever eller kanske läraren. Då trycker vi på "Dela" knappen och där får vi tre alternativ

• Redigeringslänken
• Spellänken
• QR kod till spelet

Och om du, som orkat läsa så här långt, vill testa spelet så trycker du här!

An intro to FazGame

With the TeacherGaming desk there comes a great bundle of games, and as I took the big package I have a lot of games to explore. During work hours = me like! One of the more interesting ones is the sandbox FazGame, where you create your own game. 

However, it demands the teacher to step out of his/her comfort zone and flip the learning. And also flip the mindset how you present the tasks to the students. There is also a lot of unintentionally learning going on - mainly 21st Century themes and math. But that's also skills that you need in the future work life even if you will work in health care. With this said, we're already on cross curriculum so maybe you can involve a colleague?

From the student's view

they login to the TeacherGaming webapp (or directly to FazGame).

This is the dashboard and there is mainly two buttons we're using as newbies. "My creations" and "Create your game!".

Upload own pictures

When pressing "My creations" I can manage my games but also add own images. So let us start there, as the background images in FazGame is a bit boring.

Please note that your image must be exactly 960x600 pixels. If you're a Windows user, you can easily change the resolution of a picture in Paint. Press "Resize", choose "pixels", take away the mark in "Maintain aspect ratio" and write your numbers, Horizontal 960 and Vertical 600.

Find your picture on your computer, write a description and upload the image with the button "Create Asset".

Once it's uploaded you also have to press the button "Create Scenario" in order to access your background in the game editor.

Storyline!

Here is actually where the teacher have to start explain the lesson and task, and it's also this part which is the flipped learning. In order to create a game, you need a game scenario. And if you want your game to be fun to play, you also need a story. What is happening in your game? When you put a question you have to have at least two different options to answer. You maybe need to do research first just to have your game story ready?

Create a game!

 

First you need to set the basic information. Don't worry, you can later change and edit this part.

 

This is a bit illogical, in order to save you have to close the window with the 'x'.

Now, welcome to your dashboard!

If you now want to edit your game information, you can press the gearwheel. For example you can change the opening screen - but note - you don't change the background from this window. You can also change your main character. Just press that little blue button.

To change the actual background you have to do it elsewhere. Press the 'x' in the upper right corner to save and you'll get back to the dashboard. Now instead, press the image button.

Next step is to add another character, a person I call a quest giver. A person your hero will interact with. Therefore we now press the button with a portrait.

When I have inserted another character (or object) I can flip it around when pressing the blue button in the upper right corner. I can also move my characters and object with "drag and drop" - simply hold your mouse over the character, press and hold down left mouse button, and drag it where you want it to be.

 And if I want to add an object I press the button with a box.

Code phase!

This is where you have to start create your "code", bring your game into actions. I call it "code" (or programming) as this phase has similarities to code thinking. This new dashboard is also empty, and if you choose a new scenario, that dashboard will also be empty.

First we have to add the interactions that will happens in the game. You have to start with a message dialog (else the game won't start).

Now you see that you have an icon on your dashboard. If you take your mouse over it, you'll see you light it up and also shows hidden features. 

Now "drag and drop" that message icon till the left side of your dashboard. Your workflow will go from left to right.

Now continue and add a conversation with Dialog message and Dialog question. The message is information about the quest and the question gives you two options (and you can add more if you want).

When you're ready arrange your icons like this

First we take care of the FALSE statement. If the player give a wrong answer, they first get feedback and after that, return to the question once again. So we add a Dialog message.

This new icon have to be connected with the others. simple click on the box with a "1" so you get the green button, drag that line to your new message icon. Take away the blue buckets in the lines (click at them) as this is not the right answer.

And now to the correct answer. A new Dialog message box is needed.

But in this case we keep the blue buck in the connection line.

After the player has given a correct answer we want him to earn an item. (If you want the player have a reward, it's the same thing but instead they got points). Click on "Earn item", choose an item (press on the blue button to change) and press OK.

My code!

And I have now connected all the icons with each other. My code looks like this, I have added descriptions so you can follow the flowchart.

First test + debug!

Now we'll run our game for the first time in order to see it's working as we want. There is to ways to start a game, both has the icon of a PLAY button (even though the names are different).

Quickly I see I have forgotten to change the quest giver's character. As it is now, my hero ask herself the question...

Fix the code!

So I have to change the quest giver to the right one. We stop the game by pressing the STOP button and head into "Actions edition".

Mouse over the first box that needs to be edited, then press the blue button next to the character, then pick another one and finally press OK. Repeat with the other boxes/icons.

New game test!

And now we see the character put the questions is the same as in the game.

To continue...

Well, now when you have ONE scenario ready you might want to continue with your game? From the game dashboard, press the "add scene" button!

And by default you get one of FazGame's own backgrounds and your main character centered in the scenario. If you want to change background you have to press the "Change Scenario" button, and once you change the scene name, you also change it in the bottom icons. Please also note your action dashboard is now empty as it's a new scenario where you still havn't added something to.

And in order to come to this new scenario in the first case, you have to choose the previous one, return to the action editing workplace and press the button "change scene". You have to choose what scene (or room) you're heading to next. 

And you're almost done! Now you have to connect the "reward" with the "change scene" icon.

And here's your final code!