Monday, 14 September 2015

Actionscript code for Prototype 1

There are one stage of the prototype and three accompanied classes constructed through Actionscript. 

Stage - Mashup.fla
Main class - main.as
Player's class - player.as
player's moving number class - tile.as


The stage would contain the pre-drawn text fields for the game instruction to be presented for players. Also, 10 small text boxes would be used as the letter box for players to guess the words. The 'player' and 'tile' in the Library has their own class files and will be presented on the stage when the stage is played.




Player's class
 
This class determines the initial and moved position of the players.


Tile class





















This class determines the start off point of the tile inside the grid. Also, a mouse click event is added, which allowed developer (user) to see the number of the tile.




Main class

imported class and package
 import flash.display.MovieClip;  
 import flash.events.*;  
 import flash.text.TextField;  


Variables were set to all the elements included in the stage
 public var player1;  
 public var player1CurrentTile:int = 0;  
 public var tileArray:Array = new Array();  
 public var wordArray:Array = new Array();  
 public var words:Array =   
      [  
           "tiger",  
           "lion",  
           "deer",  
           "bear",  
           "horse",  
           "eagle"  
      ];       
 public var chosenWord:int;  
 public var letter1:TextField = new TextField();  
 public var letter2:TextField = new TextField();  
 public var letter3:TextField = new TextField();  
 public var letter4:TextField = new TextField();  
 public var letter5:TextField = new TextField();  
 public var letter6:TextField = new TextField();  
 public var wordLettersDisplay:Array = new Array();  
 public var guess1:TextField = new TextField();  
 public var guess2:TextField = new TextField();  
 public var guess3:TextField = new TextField();  
 public var guess4:TextField = new TextField();  
 public var guess5:TextField = new TextField();  
 public var guess6:TextField = new TextField();  
 public var guess:Array = new Array();  
 public var guessDisplay:Array = new Array();  
 public var guessCorrectCounter:int = 0;  
* As there a 5 spots for user's to guess the words, the words chosen for the array contained no more than five letters.

Run functions
 public function main() {  
      // constructor code  
      createGameBoard();  
      setUpLettersDisplay();  
      setUpWordArray();  
      player1 = new player(40, 490);  
      stage.addChild(this.player1);  
      startGame();  
           }  

Break down each function below:

start game function:
 public function startGame()  
 {  
      chooseWord();  
      trace(wordArray[chosenWord]);  
      setUpInstructions();  
      getGuess();  
 }  
Run the other game function to ensure the order of the game process.


 public function setUpLettersDisplay()  
 {  
      wordLettersDisplay.push(letter1);  
      wordLettersDisplay.push(letter2);  
      wordLettersDisplay.push(letter3);  
      wordLettersDisplay.push(letter4);  
      wordLettersDisplay.push(letter5);  
      wordLettersDisplay.push(letter6);  
      guessDisplay.push(guess1);  
      guessDisplay.push(guess2);  
      guessDisplay.push(guess3);  
      guessDisplay.push(guess4);  
      guessDisplay.push(guess5);  
      guessDisplay.push(guess6);  
 }  
This function would 'push' the input to another text box so the letter of the guessed would be presented separated in each box.

the function that create the game board (developed from Blackboard ac3 grid creation tutorial)
 public function createGameBoard()   
 {  
      var gameBoardStartX: uint = 80;  
      var gameBoardStartY: uint = 50;  
      var gameBoardTilesWide = 8;  
      var gameBoardTilesHigh = 6;  
      var tileWidth = 80;  
      var tileNumber:int = gameBoardTilesWide*gameBoardTilesHigh;  
      var tileNumberChange:int = -1;  
      for (var i = 0; i < gameBoardTilesHigh; i++) {  
           var yPos = gameBoardStartY + tileWidth / 2 + (i * tileWidth);  
           if (i > 0 && (i % 2) != 0)  
           {  
                tileNumber -= (gameBoardTilesWide-1);  
                tileNumberChange *= -1;  
           }  
           if (i>1 && (i % 2) ==0)  
           {  
                tileNumber -= (gameBoardTilesWide+1);  
                tileNumberChange *= -1;  
           }  
           for (var j = 0; j < gameBoardTilesWide; j++) {  
                var xPos = gameBoardStartX + tileWidth / 2 + (j * tileWidth);  
                var aTile: tile = new tile(xPos, yPos, tileNumber);  
                stage.addChild(aTile);  
                tileNumber += tileNumberChange;  
           }  
      }  
 }  

word pool function
 public function setUpWordArray()  
 {  
      for(var k:int = 0; k < words.length; k++)  
      {  
           var thisWord = words[k];  
           var thisWordArray:Array = new Array();  
           for(var l:int = 0; l < thisWord.length; l++)  
           {  
                thisWordArray.push(thisWord.charAt(l));  
           }  
           wordArray.push(thisWordArray);  
      }  
      trace(wordArray.length);  
 }  
This function set up the word array, which creates a list of words for players to guess.


 public function chooseWord()       
 {  
      chosenWord = Math.ceil(Math.random()*(wordArray.length-1));  
      trace("chosenWord = ", chosenWord);  
 }  
Randomly choose a word for player to guess.


 public function setUpInstructions()  
 {  
      trace("in setUpInstructions");  
      instructions.text = "Your word has " + wordArray[chosenWord].length + " letters. Type in your guess";  
 }  
This function would present a text instruction to show the total number of letters that a player is about to guess.


 public function getGuess()  
 {  
      stage.addEventListener(KeyboardEvent.KEY_DOWN, getLetters);  
 }  
&&&
 public function getLetters(e:KeyboardEvent)  
 {  
      trace(String.fromCharCode(e.charCode));  
      guess.push(String.fromCharCode(e.charCode));  
      var currentGuess = guess.length - 1;  
      trace(guess);  
      guessDisplay[currentGuess].text = guess[currentGuess];  
      if (guess.length == wordArray[chosenWord].length)  
      {  
           stage.removeEventListener(KeyboardEvent.KEY_DOWN, getLetters);  
           checkGuess();  
      }  
 }  
get the letters guessed from player by keyboard events.


 public function checkGuess()  
 {  
      for (var m:int = 0; m < wordArray[chosenWord].length; m++)  
      {  
           if(wordArray[chosenWord][m] == guess[m])  
           {  
                wordLettersDisplay[m].text = guess[m];  
                guessCorrectCounter ++;  
           }  
      }  
      if (guessCorrectCounter > 0)  
      {  
           results.text = "You got "+guessCorrectCounter+" letters correct!";  
           movePlayerTo();  
      }  
      else  
      {  
           results.text = "You didn't get any letters correct :-( ";  
           nextGuess();  
      }  
 }  
To check if the guessed word matches up with the actual word letter by letter.


 public function movePlayerTo()  
 {  
      trace("in movePlayerTo");  
      var moveToTile = player1CurrentTile + guessCorrectCounter - 1;  
      trace(moveToTile);  
      for (player1CurrentTile; player1CurrentTile <= moveToTile; player1CurrentTile++)  
      {  
           var nextTile = stage.getChildByName(String(player1CurrentTile+1));  
           trace(nextTile);  
           player1.movePlayer(nextTile.x, nextTile.y);  
      }  
      nextGuess();  
 }  
To transfer the number of correct guessed letterso the steps to take by the player.


 public function nextGuess()  
 {  
      instructions.text = "press any key to play again";  
      stage.addEventListener(KeyboardEvent.KEY_DOWN, resetGame);  
 }  
&&&
 public function resetGame(e:KeyboardEvent)  
 {  
      stage.removeEventListener(KeyboardEvent.KEY_DOWN, resetGame);  
      guessCorrectCounter = 0;  
      guess=[];  
      for (var p:int = 0; p < wordLettersDisplay.length; p++)  
      {  
           wordLettersDisplay[p].text = "";  
           guessDisplay[p].text = "";  
      }  
      results.text ="";  
      instructions.text = "";  
      startGame();  
 }  
Allow players press a random to start the next round of word guessing.


Tuesday, 8 September 2015

Week 7 Course Exercise: Feedback of the "feedback"

3 main type of study
- comparison
survey, focus group, A/B testing
- Attitude
desirability study, participatory design, context mapping, conjoint analysis, interview/focus group
- behaviour measuring
field study/site visit, prototype study, heuristic evaluation/ cognitive walkthrough, eye tracking, data mining/analytics

pick one that is most appropriate for the user test

Research and Answer statement
(covers in statement of delivery)

Exercise
Revisit your use-testing questions from the video prototype. or consider the ones for your next testing round.
- which are quantitative & which are qualitative
- do you fall into any of the traps outlined previously? how could you rephrase the questions?


My own users test is mainly using the qualitative research that most of my results came from the open questions to the users. E.g.
1. Do you understand the concept delivered in the video?
2. Is there any obvious errors within the game you just watched?
3. Do you find the gameplay interesting, if not, what’s the main reason that bores you?
4. Do you have any questions for the gameplay process?

These were some of the key questions asked to users after the user testing. One of the main problems of these questions is that this questions could be too wide for the users, so the result is that the answers from the users varies to different focus towards the game. This makes the summarisation of the answers quite difficult, because the user’s focus are very different. The suggestion is that some framing and leading questions should be given within the question.
Also, the lack of quantitative questions indeed make the loss of overall ideas or insight towards the concept. The next user testing should be involving the combination of qualitative and quantitative question of reaching more specific answers as well as a clear frame to the overall ideas.

Tuesday, 1 September 2015

Developed idea for prototyping

Because of the complexity of the original video prototype, the prototype idea need to be developed and partially simplified for its feasibility in the future implementation.

The developed idea removed the elements of Pacman. Based on the feedback from the video prototype, the mini game would make the game more complicated, and many testers pointed out that the button smashed style game play would get bored of pretty soon. Therefore, the game would no longer contain the part that an additional screen popped up with a smash-button mini game or any relation to the Pacman. Instead, the game would be a mash-up of Snake and Ladder and Hangman.

Game Mechanism
The game is a mash-up of Snake and Ladder and Hangman. The player would be firstly play the word guessing game. Based on the letters that player get correct, the number of correct letters would be the number of player's move. The guessing game would follow the rules of Hangman, when one player guessed too many wrong letters (for instance, 5 chances), the game would be ended and the correct number of letters would be transferred to the steps that players take. For example, if the word is "tiger" and the player guessed 'timer', the letter "t" , "i" and "r" are correct. So the player could take 3 steps to move.The game board is similar with the Snake and Ladder's game board, which would contain ladders for player jumping to higher tile and snakes (or something else) to fall down to the lower tiles.

What to be presented and tested in prototype
As the initial version of prototype, the game would be included every elements of the game play. There are two part to be mainly made for the prototype.
1. The player's movement. The player should be moved along a certain path inside the grid. Shown below:

2. The guessing game counting system. Unlike the original Hangman game, the mash-up game would add another features to the word guessing game that the game would be able to count the number of correct words players guessing. In this case, the prototype would contain a counter which tells the player their correct words and then, if feasible, would transfer to the movement of the player in the grid.