Final Project - Real or Fake
Directions
Press space to start the game. You have 30 seconds to examine the image and determine whether you think it's real or fake! Once you think you know the answer, just click on the button and say either "Real" or "Fake" into your mic to answer the question. But make sure to act quick, because the AI may try and answer before you. The player with the most correct answers at the end of the game wins!
Microphone is required to play this game
Link to Project Code
Description
The final project for this course was an open brief, in which we could expand on anything we had learned throughout the course. For this brief, I really wanted to continue working with the Teachable Machine from the last project. I also wanted to explore something I hadn't tried yet in this course - making a game. Lastly, I've always been really interested in "deep fakes", and how computers are getting so good at creating fake things that at first glance, look very very real.
My final project is a game-show-style game called Real or Fake. In this game, you compete against a Teachable Machine to determine if an image is of a real person, or one procedurally generated by ThisPersonDoesNotExist. You have 30 seconds to click the button, and say either "real" or "fake" for each question. However, you must say your answer before the machine, which might buzz in ahead of you. If either player answers correctly, they will gain one point. If they answer incorrectly, the game will just move on to the next question. Get the most points in 5 rounds to win the game!
This game ended up being way more difficult to create than I anticipated, and there were some things I had to leave out or cut down on (i.e. graphic design, intro scene, etc). Regardless, I'm proud of the core functionality of this game, and I'm just happy it works!
Design Process
Sketches
Credits
Code Examples
- Martin, Etienne. “Wait 5 Seconds before Executing next Line.” Stack Overflow, 24 Nov. 2017, stackoverflow.com/questions/14226803/wait-5-seconds-before-executing-next-line.
- Tikhon Jelvis. “SetTimeout() inside JavaScript Class Using ‘This.’” Stack Overflow, 6 May 2011, stackoverflow.com/questions/5911211/settimeout-inside-javascript-class-using-this.
- denaplesk2. “Game Timer.” p5.Js Web Editor, 26 Nov. 2017, editor.p5js.org/denaplesk2/sketches/ryIBFP_lG.
- “Reference | TextBounds().” Reference | p5.Js, p5js.org/reference/#/p5.Font/textBounds.
Resources/Assets
- Background Image: DreamwallStyle. “Rock 'n' Roll Your Walls.” 'Dreamwall Style Blog', 31 Jan. 2011, dreamwall1.wordpress.com/2011/01/31/going-rock-n-roll-retro-on-your-walls-1950s-style/.
- Real People Images: NVlabs. “NVlabs/Ffhq-Dataset.” GitHub, 16 Dec. 2019, github.com/NVlabs/ffhq-dataset.
- Fake People Images: This Person Does Not Exist, Dec. 2019, thispersondoesnotexist.com/.
- Button Sprite Image: Gafosasaj1. “Red Button Cliparts.” FavPNG, 12 July 2017, favpng.com/png_view/red-button-cliparts-push-button-clip-art-png/FujkH4Zy#.
- Background Music: Smith, Patrick. “Pearly Whites”, Electronic Philharmonic. Storyblocks, storyblocks.com/audio/stock/pearly-whites-sl0qtl02ivbk0wy3kma.html.
- Sound Effects: “Free Sound Effects & Royalty Free Music.” ZapSplat, 26 Apr. 2021, www.zapsplat.com/.
- Sound Effects: “PASSWORD 1962-09-30 Polly Bergen & Raymond Burr.” YouTube, YouTube, 3 Sept. 2016, www.youtube.com/watch?v=SkyP_P0kfD8.
Inspiration/References
- Molleindustria. “Molleindustria.” Molleindustria Games, www.molleindustria.org/.
- Dewey-Hagborg, Heather. “How Do You See Me?” Heather Dewey-Hagborg, 2019, deweyhagborg.com/projects/how-do-you-see-me.
- Bergstrom, Carl T, and Jevin West. “Calling Bullshit: Data Reasoning in a Digital World.” .Calling Bullshit, 2019, www.callingbullshit.org/index.html.
- Solenthaler, Bart. “The McGuire Sisters – By Request … Album Art.” Fonts In Use, Fonts In Use, 9 Nov. 2019, fontsinuse.com/uses/29285/the-mcguire-sisters-by-request-album-art.