Assignment 2
1701ICT— Creative Coding
School of ICT Griffith University Trimester 2, 2023
Milestone 1 (30%) is due at the end of Week 9 with demonstrations to be held in your week 10 workshop. (11:59pm Sunday 24th September)
Milestone 2 (30%) is due at the end of Week 11 with demonstrations to be held in your week 12 workshop. (11:59pm Sunday 8th October)
Instructions
● Due: Milestone 1, 11:59pm Sunday 24th September. Milestone 2 11:59pm Sunday 8th October)
● Marks: 60% of your overall grade (30% each milestone)
● Late Submissions: Late submission is allowed but a penalty applies. The penalty is defined as the reduction of the mark allocated to the assessment item by 5% of the total weighted mark for the assessment item, for each day that the item is late. Assessment items submitted more than five days after the due date will be awarded zero marks.
● Extensions: You can request for an extension of time on one of two grounds; ○ medical
○ other (e.g., family or personal circumstances, employment-related circumstances, unavoidable commitments).
All requests must be made through the myGriffith portal.
● Individual Work: You must complete this assignment individually.
● Presentation: You must present/demonstrate your work in your week 10 workshop (milestone 1) and week 12 workshop (milestone 2) to a teaching team member. Your
work will not be marked if you do not present it.
● Other: This assignment is a mandatory pass component. You must attain 40% (24/60)
to be eligible to pass the course.
The purpose of this assignment is to assess your ability to implement complex interactions between separate modules using JavaScript, p5.js and p5play.
Each Question should be submitted on Canvas in a separate .js file (titled q1.js, q2.js etc.), but you DO ONT need to submit html and css files. Please also submit any additional image/sound/video file you are using.
Some of the questions will require you to investigate some concepts outside of the lecture notes. Please make sure that all code that you submit is your own and is not taken/copied from anywhere else.
Important! When using p5.play, you should only use version 3, code that includes p5.play
v2 won’t be accepted.
Milestone 1 (due end of Week 9, 11:59pm Sunday 24th September) Question 1 (12 marks) – Super Speed Sprint Racer
In p5.play, sprites provide some additional functionality over normal images. Using p5.play, create a simple top-down racing game similar to Super Sprint (https://en.wikipedia.org/wiki/Super_Sprint) but simpler, with the following specifications:
• The program should read a track in from a file called ‘track.txt’. 0 should indicate grass, 1 should indicate track and 2 should indicate start/finish line. You should find/draw appropriate images to use as tiles to represent these components. Draw the track according to the input file. For example, if the input file is 10×10 numbers, you should draw this many tiles. The track is static, so this could be drawn in the setup phase, but you will need access to this data for detecting the car leaving the track (2 marks)
Hint: you can use p5play Tiles to draw the track –
https://p5play.org/learn/tiles.html?page=0
• The program should draw two cars as sprites one next to each other on the start/ finish line, facing one of the adjacent road tiles. You could find a suitable images to use. Use cars in different colour and/or shape. The car size should be smaller than the tile size so it can easily drive on the track. (2 marks)
• The program should allow for 4 inputs per car – up/down and left/right on the keyboard. You may use the arrow keys for one car and some other keys (e.g. WASD) for the second car so two players can play the game together.
• Up and down should modify the velocity of the car (you should impose limits so it cannot go too fast or backwards). Left and right should rotate the angle it is facing and moving. This should be done in a smooth way so the car cannot execute instant 90 degree turns. (3 marks)
Collision detection:
• If a car leaves the track and hits the grass, the car should lose its speed and come to stop. However, it should still be possible to adjust the car’s angle and increase its velocity, with a limit of 0.1, so the car can slowly return to the track. Once back on the track, it can accelerate again. (3 marks)
• If a car collides with the other car, they should both bounce away from each other (keep it a small bounce only) and lose some of their velocity (proportionally to their current velocity). (2 marks)
For this question, we are not assessing your ability to write a full game (Milestone 2 covers this), but are more interested in demonstrating your ability to use p5.play and other features.
Question 2 (18 marks) – Rush Hour Game Visualiser
In this question you are going to visualise a solution to the puzzle game ‘Rush Hour’. Note
that you DO NOT need to implement the game or solve it, just visualise a provided solution. You can find the game description here, instruction on how to play here, and you can also
play it online here. The game:
1. The game consists of a 6×6 grid (the board) and a set of cars and tracks positioned on the grid. Cars are of size 1×2, and trucks are 1×3.
2. Cars are marked with the letters A, B, C, D, E, F, G, H, I, J, K, and X.
3. Tracks are marked with the letters O, P, Q, and R.
4. In each challenge, a varying number of cars and tracks are placed on the board in a
specific arrangement.
5. The goal of the game is to clear a path for the red car (marked with X) out of the board
to the right by moving the other vehicles.
6. The player can move the cars and trucks up and down or left and right, according to
their initial orientation as long as there is no other vehicle blocking them.
This question has 4 parts:
a) loadProblems(filename) (2 marks). Write this function that will read the set of problems from the text file rh.txt. The file includes 40 different challenges (cards) in an increasing difficulty level. Each line represents a different challenge. Each challenge is given as a 36-character string represents the 6×6 grid, where letter represents a car/truck occupies a square, and period (‘.’) represents an empty square.
For example, the string “AA…OP..Q.OPXXQ.OP..Q..B…CCB.RRR.” represents the following challenge/card:
Your function should read the 40 problems and solutions from the file and store them in an array.
Programming Help, Add QQ: 749389476
b) loadSolutions(filename) (4 marks). Write this function that will read the set of solutions from the text file rh_sol.txt. The file includes 40 solutions for the 40 challenges from rh.txt. Each solution is a string that consists of three-character substrings separated by spaces, with a period at the end. For example:
“CL3 OD3 AR1 PU1 BU1 RL2 QD2 XR5 .”
Each three-character substring represents a single move: the first character is the vehicle label, the second is the moving direction (L=left, R=right, U=up, D=down) and the third is number of squares to move. For example, the above string means: move car C three squares to the left, then move track O three squares down, etc.
Your function should read the 40 solutions from the file and store them in an array.
Hint: Reading the rh.txt and rh_sol.txt files can be a little daunting. Have a look at these files and see you understand them before writing the functions. It should make the problem seem a lot easier.
c) showProblem(problem_num) (4 marks). Write this function that will take a problem number (a number between 1 and 40), and will visualise that problem/challenge. You may choose what shapes/colours/images to use to visualise the board and vehicles. You should make sure you display the problem/challenge number somewhere on the canvas.
d) showSolution(problem_num) (8 marks). Write this function that will visualise a solution to a problem. You will need to use the solution from the file and animate the movement of the vehicles in the correct order.
Extra / Bonus: (No marks, just kudos). Try and implement a game where a player can move the vehicles using the mouse and/or keyboard. As this is not part of the assignment, do this AFTER finishing everything else.
Code Help, Add WeChat: cstutorcs
Milestone 2 (due end of Week 11, 11:59pm Sunday 8th October) Game (30 marks)
You will be creating your own version of the game ‘Scorched Earth’. This is provided as inspiration, but the possibilities are vast (you can look here for some inspiration)
The players should be controlled by keyboard (i.e. changing power, angle and shooting), and at a minimum you should draw a terrain (randomly generated) and two players, and have them shooting at each other according to the selected speed and angle. But there are plenty more things you may add, such as: wind, different weapons, store, etc.
You can find more information about the game in this video – https://youtu.be/L5MfFU14jhM, and can try and play the original game here.
Requirements
1. MultipleScenes
The game must involve at least 4 scenes, there must be a:
• Loading / splash scene
• Main menu scene
• Main game scene
• Leaderboard scene
You should be able to navigate between the scenes
Note: each scene needs to only be navigable by at least one other scene (with the exception of the loading scene, it can be a time-oriented screen)
The game must use at least 3 loops which are fundamental to the operation of the program.
The game must incorporate at least 2 arrays.
4. Interactivity
There must exist player interaction using a keyboard. The game needs to handle at least 3 keyboard keys. Using mouse input is optional.
There must be at least 1 image present in the final product (separate to sprites) that is drawn at an appropriate size.
Note: it is up to you which scene you incorporate the image in.
6. Sprites
The p5.play v3 library must be incorporated with a minimum of 3 sprites used. The sprites must have collision detection (between sprites) and must move independently. Sprites must be animated (i.e. a moving object, changing size or colour)
7. Video&Sound
The game should use at least 3 sounds and 1 video. Hint: you can use sounds for shooting and video to introduce the game in the main screen.
8. GUIInput
At least one type of GUI input is required (e.g. text input, slider, button). The input should affect what is drawn. (Hint: Text input could be useful for high score entry)
The program needs to read in data from a JSON or a Text file. This data must be presented in one of the scenes.
Hint: if your themes / ideas of the main game scene conflict/don’t work well with using external data, use the data in the leaderboard scene!
10. Stability
The game must feel stable to play. Your game should not feel ‘buggy’.
Programming Help
11. Creativity
You must produce creative work that adds complexity to your game. Examples of creative work that add complexity to your game include:
o Having a scene with a day/night cycle, or clouds/stars (sprites or images) may
a dynamic background
traverse the screen, being generated at random rates & positions from the sides of the screen.
multiple weapon types / modes of fire
o Yourplayermaybuydifferenttypeofweaponfromastore,orjustpickfroma
range of weapon types.
o You could add super weapons, or other beneficial additions to the defenders
(shields, Power-ups, etc.)
o Wind can be randomly set and affect the movement of the missile.
• Creative terrain
o You could use an image for the randomly generated terrain.
o Youcouldusedifferentaffectswhenamissilehitstheterrain,creatingcraters,
changing the surface, etc.
• UI & Fonts
o You may download and use custom fonts that better fit your theme.
• Score & Sound Effects
o Play a special sound for hit/ near miss, apply bonus score for hitting the opponent on the first try.
• Multiple players/computer player
o Allow adding more players.
o Allow choosing between a human player or the computer.
You are encouraged to create your own assets (i.e. opponents or laser fire) on top of using public assets from the internet.
Note: the ability to creatively expand your game is highly dependent on having basic functionality, such as interactivity.
You must produce clean, well-written code. This encompasses indentation, meaningful naming of functions & variables, use & overuse of absolute values.