Course Reflection

 I really enjoyed DECO 2300. This course taught me knowledge and gave me experience of making prototype, which was a very unique and fun experience to learn about prototype.

I am proud of myself that I actually made a game by myself. At first, i feel impossible and frustrated to code the game. Because the samples we did in prac was so different to my game. I had no idea where to start. Luckily, i got some help from tutor and i also searched some similar game on internet. Once to figured out the logic, I could implement the game step by step. Moreover, I really liked the testing session because it gave us opportunity to let people test our prototype and also provided feedback, which is very useful for the next project. However, the participation of that session was getting less and less, that means the change of getting feedback has decreased.

Overall, i really liked this course, i got to know new people while testing others. The knowledge that i learnt form this course will definitely become useful in the future.

Week 13 Prac B testing session

Today's prac is a testing session, in the first half session, I've got an opportunity to test other people's work. Just like everyone did, at first people started to explain how the prototype works and the instruction of the game. After that, we start to play the game.

For the next half of the session, we swapped over. I was acting like one of the player. At first I explained how the prototype works and the instructions of the game. Then I asked a person near me to place the gold, at the meantime, me and the other player / tester were not allow to look at it. After that, I was player one. By doing that I can show how to use the prototype by action. After the game finished, I asked them to fill in the survey.

• How would you rate the game? (1 lowest - 5 highest)
  71.4% said it's fun but need some improvement (4) and 28.6% said the game is fun. (5)
• How would you rate the physical of the prototype? (1 lowest - 5 highest)
  71.4% gave 5 and 28.6% of them gave 4
• How did you find using the physical prototype?
  All of them said it is really easy and straight forward to use, interesting. But one of them mentioned about the small bug that needed to fix.
• What features can be added to improve for the game and also physical prototype? How?
  Some of them said it is so good, nothing to add. Some of them suggested the gold can be generated randomly. I think this idea is really nice.

Week 13 Prac A

At this stage, i feel like my prototype is too similar to my last prototype. Here are elements i want to add to my prototype to make it more interesting.

This is what i tried:

As you can see at the below image, there is a extra foil on the third row fourth column.

That is the gold, I wrapped play-doh with foil. At first, a person has to hold the wire that is connect to earth and hold the gold (play-doh) and place on one of the square on grid. 

Then i cut out holes on the lid. To cover the top.

That way, players will not know the position of the gold. After that, i made a stick so players can use that stick to go in the hole and touch the foil. If player successfully find the gold, they can actually feel it.

The shape of bottom of the stick is square and flat. That way, It is able to touch two foil at the same time.

However, for some reasons, it does not work well when it connects to the game. It works fine when placing the gold. After that when clicking on a square, it happens to click other random squares at the same time. Therefore, i had to abandon this idea.

Week 12

In this week, Im starting to refine the prototype. My goal is to let user pressing on the prototype instead of using the stick to touch two separate wire at once. Here is what i found on the internet.

In this video, she uses copper tape and foil for the columns and rows. Then use clear tape to cover the columns that will cross the rows. That way, the clear tape make that area non-conductive. Because every cross are now non-conductive. For example, the image below shows how to press G & W at the same time.

This is the plan i am going to follow when actually implementing it.

Materials:

1. copper tape
2. foil
3. tape
4. box
5. MakeyMakey

First, i used two shoeboxes and cut out one side and combine them together to make the box bigger.

Then, i place and fix those copper tape and foil in the position i wanted them to be. As you can see i used paper instead of clear tape to separate. However, i didn't have to do the same thing for the copper tape because it is a tape the bottom part have glue on it, which make it non conductive.

After that, i cut out some more foil. 

By doing that, user can touch both of the foil inside the square. Just like user is actually press on the grid.

Week 12 C12

For this week lecture, we were asked to revisit the definition of prototype that we did in week1.

In week1, i defined prototype as:
- a draft
- putting idea into something physical
- few steps to the final product
- a way to present your product

From what i did so far, the definition of prototype has not changed but i want to add few more things. Prototype is putting idea into anything to present and the prototype should be tested by user. Testing and ask for feedback are vital. They are very useful, feedbacks allowed me to understand their point of view (the things that i missed, and couldn't think of) then improve and modify the prototype based on the sugguestions.

Week 11

This week prac, i started to think about what should i do for the next project. I would like to refine my last prototype. In order to improve, i am going to refine it according to the feedback i got in the last testing session.

Suggestions from players:
- fix the problems i had last time (multiple rounds)
- let user to actually press the grid
- having two sticks that connect to earth so player don't have to pass it around

To fix multiple rounds problem, i have to remove the certain event listener after player selected a box.

To let user press the grid, i have to modify the prototype.

For the last suggestion, it is quite easy to fix.

Week 11 C11

Exercise:
Generate concepts for consistently reproducing & representing 3D movement in space that allows a musical composition to be accurately played on a Theremin. Pugh Matrix to compare concepts.What criteria important to measure against?

1. laser
2. screen
3. haptic device

	Weighting	Laser	Screen	Haptic device
Cost	1	1	1	2
Feasibility	2	1	2	1
Accuracy	2	2	1	2
Weight Score		7	7	8

Week 10 Prac B testing session

Today's prac is a testing session, in the first half session, I've got an opportunity to test other people's work. Just like everyone did, at first people started to explain how the prototype works and the instruction of the game. After that, we start to play the game.

For the next half of the session, we swapped over. I was acting like one of the player. At first I explained how the prototype works and the instructions of the game. Then I asked a person near me to place the gold, at the meantime, me and the other player / tester were not allow to look at it. After that, I was player one. By doing that I can show how to use the prototype by action. After the game finished, I asked them to fill in the survey.

Here are the feedback i got from users earlier. Only 1 of them thinks the game is absolutely fun. Other 3 of think the game is fun but perfect. Most of them like the physical prototype the feedback were fun to use, interesting, cool idea, easy to use but the only thing was sometime when touching those wires it does not give any responses.

For improving the game and prototype, i have been advised that i should have one more gold so players can play the game longer. Also, in terms of the physical part of the prototype, i should have two sticks connect to the earth so player don't have to pass it around. I think I'm going to have 2 two sticks for the next prototype 3. And i will also consider having 1 more gold as well.

 I recorded some videos of how people actually used my prototype:

Week 10 Prac A

In todays prac, i just continue to modify the code. Because the game is turn based, i need to somehow let players know the selected square is clicked by which player. I decided to use different colour to represent. So the orange colour boxes are selected by player 1 and the green colour boxes are selected by player 2.

First, i created 2 classes one for each player. These two classes will be similar, the only difference would be adding different child. Because player 1 should add child with orange square and player 2 should add green square. Then, I also add all the event listeners in the main. And i also created a function for tracking which players turn.

Week 10 C10

There wasn't any contact this week, it was a public holiday.

Processing...

This prototype is in both physical and digital from. In terms of physical form, at the very beginning, I was worried because I have a 5 x 5 grid and the best way to have 25 different buttons or an object to click on and each buttons or object represents each square on the grid. However, Makey Makey doesn’t have 25 inputs so I decided to make a grid system, which will only need 10 inputs in the Makey Makey. I was planning to have key W, A, S, D, F, G and arrow UP, DOWN, RIGHT and LEFT these 10 keys. For example, when W and UP presses together it presses the first square. By doing that way, there will be 25 different combinations.

For the prototype, I cut out two lids of shoeboxes and stick them together so it more like a square and bigger. For the wire, I cut them into the right length and cut the plastic on the outside so that the electricity can transfer and I needed 10 of them. After that I poked 20 holes on the side of the lid. Position of 10 of them is lower or upper then is other 10 because I wanted them to be separate.

                                 

I had 5 wires connected to W, A, S, D, F on the left side of the box and other 5 wires connected to UP, DOWN, RIGHT, LEFT, D on the top side of the box.

In order to touch both of the wire at the same time, I wrapped one chopstick with foil and connected to earth.

Mid sem break (Processing)

Ive been working on the code. I couldn't add mountains around the gold before. But now i know. Here is the logic, at first I created a grid and push every single square into a array list. Then i add event listeners for those squares which will trigger place gold function. In the place gold function, I check for if currently there isn't any gold on the grid then I add child on the specific square. Then I call the add mountains function after that. In the function, I tracks position of the selected square (the position of array list). The position number is like that, it starts from 0 from the top left hand corner and count it down vertically to the bottom right 24.  For example, if i want to place a gold in position 12. I will need to place mountains on position (12-6, 12-5, 12-4, 12-1, 12+1, 12+4. 12+5, 12+6).

Due to the limited duration and coding ability, I also decided not to have two grids. That way, i am able to lessen my workload and the game can still be competitive. The process of the game would now be: first, a person has to place a gold (players are not allow to look at it at that time). After that, the game may begin. Each player has to takes turn and click on the square and  to guess where is the gold.

Week 9 Prac B

In today' s Prac, Ive been advised that i can make a grid system and i will only need 10 keys to do that. And i decided to use W, A, S, D, F, G (on the left) and UP, DOWN, RIGHT, LEFT (on the right)

grid system looks like

Here is my plan:

However, i will need a lot of things to change in my code. For my last prototype, i used mouse to move and point to the targeted square and click on it. But this time, i have to use keyboard keys to press on the targeted square. So i have to change basically more than half of my code.

Week 9 Prac A

During week 9, Makey Makey has been introduce to us. In today's class, we start using makey makey which is quite easy to understand and use. Makey Makey is just like a keyboard. We need to connect to something that are able to transmit electricity. In todays prac, we played mario cat using foil to tab each key.

After that i started thinking about my prototype. Because my game has a 5 x5 grid which i needed 25 keys to press on. However, the makey makey only has 22 input. So I'm thinking of having a smaller grid like 4 x 4.

Week9 C09

Restaurant Dining Experience

• What is the existing experience? From different stakeholder P.O.V.? 
• What external/internal factors impact on the experience?
  - the food
  - waiter's attitude
  - condition of restaurant facilities
  - duration of waiting for the order
  -hygienic condition of the restaurant
  - service

• What aspects of the existing experience could be enhanced/augmented/supported with technology?
  - duration of waiting for the order
  -hygienic condition of the restaurant
• How would introducing technology in to this context change the experience?
  - Introducing technology in to both fine and casual dining will add its value. But it depends on the kind of technology. For example, if losing human service in fine dinning will also lose its value.
• What experience scenarios might you test with the technology?
  - having a device for ordering
  - use machine to clean tableware

Week8 Prac A

In today's prac, we got an opportunity to show what we've done to our peers. In this section, I basically told them to place a gold by clicking on the grid and the other player is not allowed to look at it. After that, they looked at the instruction then start the game. Once, one of the player found the gold, the game ends.

Here are the feedback that i got from my peers:

Most of the responses 60% says that think the game is fun but 33% and 16% of the rate the game as satisfactory. I think it's because now the game is abit too basic. I should add more elements like what i was planning to have. I will add mountains so players know when they are getting closer to the gold.(also bomb)

100% of the responses says they fully understand how the game works. I think it is because i added a instruction page so the players know what to do without my explanation.

5 out of 6 responses show that they like the design of the game but 1 of them didn't like it that much, i think it is because the when player hover on the grid the, the object on the grid will blink which influence the overall look of the game and I will fix that. 

In order to improve the game, i will be adding more features like bomb (make player lose), mountains (clues for the player when they are getting closer to the gold). Also i have to fix the gold hiding problem because sometimes the gold wont hide so that the other player is able to see the gold which influence the objective of the game. I also need to fix the blink section.

Week 7 continue implementing

In these 3 - 4 day, i've been following the plan.

My working plan:
0. front page
1. grid for player 2 
2. place only one gold on each grid
3. show instruction, game start
4. click on box and check if gold is here or not
5. player1/2 wins

Ive made a front page which consists the title of the game "The Thief" and a play button. I converted the title in symbol(movie clip) and add it on stage at the position that i want. I also converted the play button into button so when hover on it, the mouse will change to pointer. 

Next, i added event listener to the button. By doing that,  users click the play button, they will be directed to the setting page and title and button will be removed from the stage. Where players have to place one gold on their grid, one by one. Gold will hide after 3 second, it gives time for users to memories and confirm where did they place the gold. 

I also added another grid for player 2. Even i'm using the same grid symbol. I duplicated that symbol and named it a different name. By doing that, i was able to create new child class. For that class, i added event listeners to handle hover out and over and click as well. 

After both of the players placed gold, instruction will pop up.

This instruction is actually a button, so players can press anywhere to start the game.

As the instruction mentioned, player 1 starts first. In each round, each player has to click on one square. In order to let players know which square they are pointing to, i add a hover effect. However, both of the grid already have event listeners for placing the gold so i had to remove those listeners. This time i decided to have a slight darker square for hover effect. After i remove listeners, I add new listeners. If the gold wasn't place on that grid, the selected square will change to a darker colour and it cannot be selected again. Finally, the gold will appear if one of the player found the gold and the message box will shown.

Due to the limited time, ability and skills, i had to simplify it and show the very base of the game to peers.

Week7 C07

In today's lecture, Greg talked about how to design questions for testing prototypes.
Questions should be clear and specific, they should also give clear instructions on how to answer. Ordering of the questions are also important.

Two types of response:
Qualitative

• Deals with descriptions - can be observed but not measured. 
• Understand underlying reasons. 
• Unstructured or semi-structured techniques. 

Quantitative

• Deals with numbers - measure incidence. 
• Structured techniques.

We were ask to revisit user testing questions from the video prototype and distinguish which are qualitative  and quantitative.

• Can you understand the concept? quantitative
• How would you rate the concept? quantitative
• How would you rate the video? quantitative
• Would you play this game? qualitative
• Can you suggest a better name for this game? qualitative
• What features can be improved for the concept and how? qualitative

Week 7 Start implementing

The grid that i implemented last week wasn't useful for my idea, and i found a tutorial webpage of how to build a minesweeper game in Flash CC. That tutorial helped me to get started.

http://code.tutsplus.com/tutorials/build-a-minesweeper-game-within-200-lines-of-code--active-8578

I created a new file to start over. At first, I used the small part of the code that draws grid, and hover effect on the grid.

Here is the code for the grid:

Then, i created another child class for grid and in that class. In that class, its basically tell how the grid should behave in the game. So i add EventListener for when hover over the grid the gold then the gold appears, when hover out the grid (square) it disappear and when click on the box it place the gold.

 After that, i can successfully hover over and out on each box and also place gold on it. Then, i was planning to add mountains surrounded square, however, i was having so much trouble when implementing it. Due to the short limit of duration, i changed my plan.
First, i have to make another grid for player 2 -> place only one gold on each grid -> game start -> click on box and check if gold is here or not -> player1/2 wins

I'm hoping i can get these tasks done by Monday.

Week 6 Prac A & B

During today's prac, I start thinking of how to implement my idea. At first, i had not idea how to start. Because the tutorial "pong" that we did from last week 5 is totally different game with my idea. Therefore, i think of the most important element in "The Thief" which is the grid, so i decided the first thing to get start with is to make a 5x5 grid. I was looking for tutorial in google, then i found this: 

this tutorial helped me to get started and i made a grid successfully. But then, i had no idea how to make it when hover over the square gold will appear, when move out of the box gold will disappear and when click the gold will stay. I will need to keep trying for the up coming assessment.

Week 6 plan for the game

Classes that i need

• elements (gold, mountains/bomb, trees)
• players
• main

Main

• var player1; var player2; var theGold; var mountain; var bomb; var tree;
• addEventListener (MouseEvent.CLICK, clickTargetSquare)
• add players (grids) to stage
• setupElements() add each element on the stage

Elements Class

• hide() hide elements
• show(targetSquare) show chosen elements
• win()
• lose()

Player Class

• drawGrid()
• getTargetSquare() -> return targetSquare