MEMORY MIX GAME

A MINI PROJCT REPORT

Submitted by

DHINAHARI R - 810020104023
DHIVYA A S- 810020104024
MADHUMITHA A- 810020104308

DEPARTMENT OF COMPUTER SCIENCE AND ENGINEERING

UNIVERSITY COLLEGE OF ENGINEERING (BIT CAMPUS)

ANNA UNIVERSITY, TIRUCHIRAPPALLI – 620024

MAY 2023

i
 DEPARTMENT OF COMPUTER SCIENCE AND ENGINEERING

UNIVERSITY COLLEGE OF ENGINEERING (BIT CAMPUS)

ANNA UNIVERSITY, TIRUCHIRAPPALLI – 620024

BONAFIDE CERTIFICATE

This is to certify that this Mini Project report (CS8611) titled ‘Memory Mix Game” is
the bonafide work of “Dhinahari R (810020104023), Dhivya A S (81020104024),
Madhumitha A (810020104308)” Third Year, Sixth Semester, B.E COMPUTER SCIENCE
AND ENGINEERING during the year February 2023 to May 2023

Guide Faculty In Charge Head of the Department

Submitted for the university practical Examination held on …………………

Internal Examiner External Examiner

ii
ABSTRACT:

A memory game in which many of the parents will allow their children
for playing ecofriendly. The graphics of the gameplay system is good and
smooth for improving children’s attraction. Memory Mix Game (MMG) - game
for children to gain their knowledge and memory power. This single player
mode game in java script is an easy game for all. In this project, a webpage
consists of five different Memory development games. The games are Letter
Puzzle (LP)-guessing the right letter within the word. Match Match (MM)-to
find the corresponding match. Number Guessing (NG)-to guess a number in a
given range. Zeros and Crosses-row (XOX), column and diagonal are
completely filled by mark `X’ or `O’. Ching Chong Cha (CCC) - fun game for
entertainment purpose. Now a day most of the children’s are addicted for video
games, online games and cash reward games.

In this project, an Extra feature-the player should answer a quiz to enter

any of the games which is useful for gaining extra knowledge. So it can reduce
the addiction of children’s who playing games.

KEYWORDS:

MMG, LP, MM, NG, XOX, CCC.

iii
 TABLE OF CONTENTS

CHAPTER TITLE PAGE.NO

ABSTRACT iii

LIST OF FIGURES vii

`I INTRODUCTION 1-3

1.1 Objective 1

1.2 Motivation 1

1.3 Overview 2

II LITERATURE SURVEY 4-5

2.1 Min max algorithm 4

2.2 Genetic Algorithm 4

2.3 Number Guessing 4

2.4 Reinforcement Learning 4

2.5 Algorithm of finding missing letters 5

2.6 Limitations 5

III SYSTEM ARCHITECTURE 6-13

3.1 Data Flow Diagram 6

3.1.1 Data flow diagram level 0 6

3.1.2 Data flow diagram level 1 6

iv
 3.1.3 Data flow diagram level 2 7

3.1.4 System Architecture 8

3.2 System Requirement Specification 9

3.2.1 Hardware Requirements 9

3.2.2 Software Requirements 9

3.2.3 Input Requirements 10

3.2.4 Pre-processing Requirements 10

3.2.5 Model architecture Requirements 11

3.2.6 Output Requirements 11

3.2.7 Performance Requirements 11

3.2.8 Security Requirements 11

3.2.9 User Interface Requirements 11

3.2.10 Java Script 12

3.3 Contribution of Individuals 12

IV IMPLEMENTATION 14-24

4.1 Artificial Intelligence 14

4.2 Enhanced System Architecture 17

4.3 Implementation 18

4.4 Performance Measures 22

v
V CONCLUSION AND FUTURE WORKS 25-26

5.1 Conclusion 25

5.2 Future Works 25

APPENDICES 27-46

REFERENCES 47-51

vi
 LIST OF FIGURES

FIGURE FIGURE NAME PAGENO

NO
1.1 Overview 3

3.1 Data Flow Diagram (Level 0) 6

3.2 Data Flow Diagram (Level 1) 7

3.3 Data Flow Diagram(Level 2) 7

3.4 System Architecture 8

4.1 Min Max Algorithm 15

4.2 Divide and Conquer 16

Algorithm

4.3 Enhanced System Model 18

4.4 Website Design 19

4.5 Game Design 1 19

4.6 Game Design 2 20

4.7 Game Play 1 20

4.8 Game play 2 21

4.9 Game play 3 21

4.10 Quiz Creation 22

4.11 Performance measures 23

4.12 Memory Performance 24

vii

vii
 CHAPTER I

INTRODUCTION

1.1 OBJECTIVE

The objective of a memory game using web development is to

provide an engaging and interactive experience for the players while
testing their memory skills. The game challenges players to remember the
location of different pairs of cards with the same image, and to match
them within a limited amount of time. The primary objective of the game
is to improve the player's memory skills by exercising their short-term
memory and concentration abilities. As the game progresses and becomes
more challenging, the player must use their visual memory to remember
the location of the cards they have previously seen.
In addition to improving memory skills, the game also aims to
provide a fun and entertaining experience for the players. The game can
be designed with different themes, graphics, and sound effects to create
an immersive experience that engages the player. Another objective of
the memory game is to increase engagement and player retention. The
game can be designed with multiple levels, rewards, and achievements to
motivate players to continue playing and improve their skills. The game
can also be integrated with social media platforms, allowing players to
compete with their friends and share their scores.

1.2 MOTIVATION OF THIS PROJECT

Entertainment: Memory games are fun and engaging, and people of all
ages enjoy playing them. Developing a memory game using web
development can provide a fun and entertaining experience for users.
Memory games are known to improve cognitive abilities such as
memory, attention, and concentration. Developing a memory game using

1
web development can provide a platform for users to exercise their brain
while having fun.
Education: Memory games can be used as an educational tool to teach
different concepts such as language, mathematics, or history. Developing
a memory game using web development can provide an interactive and
engaging way to learn.
Memory games can be used as a marketing tool to promote a brand or
product. Developing a memory game using web development can provide
an engaging way to increase brand awareness and customer engagement.

1.3 OVERVIEW

A memory game using web development is a digital version of the

classic game that challenges players to match pairs of cards with the same
image while testing their memory skills.
The game is designed using web development tools such as
HTML, CSS, and JavaScript, and can be played on different devices.
The objective of the game is to exercise the player's memory and
concentration abilities by challenging them to remember the location of
different pairs of cards with the same image, and to match them within a
limited amount of time.
The game can be designed with different themes, graphics, and
sound effects to create an immersive experience that engages the player.
The game can also be integrated with social media platforms, allowing
players to compete with their friends and share their scores.The game can
be designed with multiple levels, rewards, and achievements to motivate
players to continue playing and improve their skills. It can also be
integrated with social media platforms, allowing players to compete with
their friends and share their scores.

2
Figure 1.1 Overview

3
 CHAPTER II

LITERATURE SURVEY

2.1 MINIMAX ALGORITHM

"Building a Tic Tac Toe AI with Minimax Algorithm" by Ehsan Elahi

(2020)

This article provides an overview of the minimax algorithm and

demonstrates how it can be used to build an AI player for tic tac toe.

2.2 GENETIC ALGORITHM

"Using Genetic Algorithms to Develop a Winning Strategy for Rock-

Paper-Scissors" by Toshiyuki Nakagaki et al. (2000)

This paper explores the use of genetic algorithms to develop a winning

strategy for rock paper scissors.

2.3 NUMBER GUESSING

"A Simple Method for Solving the Number Guessing Game" by Tom
Ziemke and David O'Connell (2007)

This paper presents a simple algorithm for playing the number guessing
game based on the binary search method.

2.4 REINFORCEMENT LEARNING

"Learning Memory Match Game with Deep Reinforcement Learning" by

Pei-Hung Chung et al. (2018)

This paper applies deep reinforcement learning to the memory match

game and demonstrates that the algorithm is able to learn to play the
game effectively.

4
2.5 ALGORITHM OF FINDING MISSING LETTERS

"A Study on Generating Missing Letter Games" by Yi-Hsuan Yang et al.

(2019)

This paper describes the development of an algorithm for generating

missing letter games, and evaluates the quality of the generated games
using human subjects.

2.6 LIMITATIONS OF EXISTING SYSTEM

 Game mechanics: Many existing memory games for the web use the
same basic game mechanics, such as flipping over cards to match
pairs. While this can be engaging initially, players may quickly
become bored with repetitive gameplay.
 Limited customization: Many existing memory games for the web
offer limited options for customization, such as the ability to change
the theme or difficulty level. This can make the game feel generic and
less engaging.
 Limited social features: Many existing memory games for the web do
not include social features, such as the ability to compete with friends
or share scores on social media. This can limit the game's appeal and
reduce its potential for viral growth.
 Memory capacity: The existing system may have limited memory
capacity, which can affect the number of game elements or levels that
can be stored and displayed.
 User interface limitations: The existing system may have constraints
on the user interface, such as screen size, input methods, or available
interaction options. These limitations can affect the design and
presentation of the memory game.

5
 CHAPTER III

SYSTEM ARCHITECTURE

3.1 DATA FLOW DIAGRAM

A Data Flow Diagram (DFD) is a graphical representation of the

flow of data through a system. Here is a possible DFD for a memory mix
gaming website.

3.1.1 DATA FLOW DIAGRAM LEVEL 0

The Figure 3.1 Data Flow Diagram Level 0 below shows a context
Data Flow Diagram or Level 0 Data Flow Diagram drawn for the system.
It is an overview of the whole system.

Figure 3.1 Data Flow Diagram Level 0

In Level 0 DFD, the game and gamers relationship is shown, and the
gamer interacts with application using gamer inputs.

3.1.2 DATA FLOW DIAGRAM LEVEL 1

The Level 1 Data Flow Diagram is the decomposition of

the context Data Flow Diagram. It involves the breakdown of the main
process into sub processes. In Level 1 DFD, the operation of the game is
explained. The gamer interacts with the game using game controllers.

6
 Figure 3.2 Data Flow Diagram Level 1

3.1.3 DATA FLOW DIAGRAM LEVEL 2

The Level 2 Data Flow Diagram explains the working of the quiz.
It explains the process of generation of the questions and the options,
saving the option selected by the user, checking the users answer with the
correct answer and giving feedback to the user about that particular
question

Figure 3.3 Data Flow Diagram Level 2

7
3.1.4 SYSTEM ARCHITECTURE

Model: This component represents the data and business logic of the
memory game. It includes classes and functions that interact with the
database and process the game's rules and logic.

View: This component is responsible for the user interface. It includes

HTML, CSS, and JavaScript code that renders the game's graphics,
buttons, and other elements.

Controller: This component handles the user's input and manages the
communication between the model and view components. It includes
server-side code written in a programming language like PHP, Python, or
Node.js.

Figure 3.4 System Architecture for MMG

8
In addition to the MVC architecture, you may need to consider other
components for a memory game website, such as:

Database: You'll need a database to store the game's data, such as player
information, game progress, and scores.

Server: You'll need a server to host your website, manage user sessions,
and handle requests and responses.

APIs: You may want to integrate your website with third-party APIs,
such as social media or payment gateways, to enhance the user
experience.

3.2 SYSTEM REQUIREMENT SPECIFICATION

3.2.1 HARDWARE REQUIREMENTS

• CPU:A dual-core CPU or higher is recommended

• RAM: At least 2GB of RAM is recommended

• Storage: 10GB of storage

3.2.2 SOFTWARE REQUIREMENTS

Frontend:

• HTML

• CSS

• JavaScript

Backend:

• MySQL

• PHP

• XAMPP

9
3.2.3 INPUT REQUIREMENTS

Game Content: You will need to decide on the type of memory games
that you want to offer on your website. This can include games that test
short-term memory, working memory, visual memory, auditory memory,
and more.

User Registration: To track user progress and scores, you will need to
have a user registration system where users can create accounts and log in
to play games.

Game Levels: You should offer different levels of difficulty for each
game to cater to different skill levels of users.

3.2.4 PREPROCESSING REQUIREMENTS

Data Cleaning: The game content and any user-generated content on

your website should be checked for errors and inconsistencies, and
cleaned if necessary.

Data Validation: User input should be validated to ensure that it is

correct and safe. For example, you should check that user names and
passwords meet certain complexity requirements to prevent security
breaches.

Data Encryption: Sensitive user information such as passwords and

payment details should be encrypted to prevent unauthorized access.

Data Compression: Images and other large files should be compressed to

reduce loading times and improve website performance.

Data Contenting: The game content and any user-generated content on

your website should be checked for errors and inconsistencies, and
cleaned if necessary.

10
3.2.5 MODEL ARCHITECTURE REQUIREMENTS

Front-End Development: You will need to create an interactive and

user-friendly front-end interface for your website, including the game
visuals, game controls, and overall user experience.

Back-End Development: You will need to develop the back-end

infrastructure for your website, including the game logic, user data
storage, and other server-side functionality.

3.2.6 OUTPUT REQUIREMENTS

Game Scores: The website should output game scores for each user for
the games they play on the website.

3.2.7 PERFORMANCE REQUIREMENTS

Fast Loading Speeds: Your website should load quickly, with minimal
delays and waiting times.

3.2.8 SECURITY REQUIREMENTS

Protection of user data, privacy and payment details should be encrypted

to prevent unauthorized access.

3.2.9 USER INTERFACE REQUIREMENTS

Simple and intuitive user interface for ease of use.

Visibility of system status. Users should always be informed of system

operations with easy to understand and highly visible status displayed on
the screen within a reasonable amount of time.

Error prevention. Whenever possible, design systems so that potential

errors are kept to a minimum. Users do not like being called upon to
detect and remedy problems, which may on occasion be beyond their

11
level of expertise. Eliminating or flagging actions that may result in errors
are two possible means of achieving error prevention.

Match between system and the real world. Designers should endeavor to
mirror the language and concepts users would find in the real world based
on who their target users are.

3.2.10 WHY WE ARE USING JAVASCRIPT LANGUAGE FOR

OUR MINI PROJECT?

JavaScript is a popular programming language for developing interactive

and dynamic web pages. There are several reasons why JavaScript is a
good choice for a memory gaming website:

Interactivity: JavaScript allows for interactivity on the website, such as

animating game elements, responding to user input, and updating the
website without reloading the page.

Cross-Platform Compatibility: JavaScript is supported by all major web

browsers, making it a good choice for a website that needs to work across
different platforms.

Client-Side Validation: JavaScript allows for client-side form validation,

which can reduce the workload on the server and improve website
performance.

Frameworks and Libraries: There are many frameworks and libraries

available for JavaScript, such as React and jQuery, that can simplify the
development process and improve website functionality.

3.3 CONTRIBUTION OF INDIVIDUAL PROJECT

PARTICIPANTS

This project is done by a team of two members. Each of the member’s

contributions are described briefly as follows:

12
TEAM MEMBER 1

NAME: DHINAHARI R

REG NO: 810020104023

CONTRIBUTION:

• Algorithm

• Backend Development

• Testing

TEAM MEMBER 2

NAME: DHIVYA A S

REG NO: 810020104024

CONTRIBUTION:

• Front-end Development

• Documentation

• Web designing

TEAM MEMBER 3

NAME: MADHUMITHA A

REG NO: 810020104308

CONTRIBUTION:

• Database

• PowerPoint Presentation

• Project maintenance

13
 CHAPTER IV

IMPLEMENTATION

4.1 ARTIFICIAL INTELLEGENCE

Gaming is one of the most popular and exciting applications of

artificial intelligence (AI). Here are some ways in which AI is used in
gaming:

Game design: AI can be used to create game content such as levels,

enemies, puzzles, and quests. AI algorithms can generate game content
based on player behaviour, preferences, and feedback.
Game testing: AI can be used to test games and identify bugs and other
issues that might be missed by human testers. AI algorithms can play
through the game and report any problems they encounter.
Non-player characters (NPCs): AI can be used to create intelligent
NPCs that can interact with players and respond to their actions. NPCs
can be programmed to have their own goals, behaviours, and
personalities.
Procedural generation: AI can be used to generate game content
procedurally, meaning that it is created on the fly rather than being pre-
designed. This can lead to more varied and dynamic gameplay
experiences.
Game optimization: AI can be used to optimize game performance by
adjusting graphics, physics, and other settings based on the player's
hardware and preferences.
Player analysis: AI can be used to analyse player behaviour and
preferences, and use this information to personalize the game experience.
This can include recommending games, customizing difficulty, and
creating personalized challenges.

14
MINIMAX ALGORITHM

The Minimax algorithm is a decision-making algorithm used in

game theory, artificial intelligence, and decision theory. It is commonly
used in two-player games such as chess, tic-tac-toe, and checkers, where
each player tries to maximize their chances of winning while minimizing
the opponent's chances.
The Minimax algorithm works by recursively analysing all
possible moves and their outcomes. It assumes that the opponent will
make the best move possible, and thus, it seeks to minimize the maximum
possible loss.
To implement the Minimax-algorithm, we start by constructing a
game tree that represents all possible moves and outcomes of the game.
Then, we evaluate the terminal nodes of the tree (i.e., the nodes that
represent the end of the game) using a heuristic function that estimates
the utility of the final outcome for the algorithm.

Fig: 4.1: MINIMAX Algorithm

15
DIVIDE AND CONQUER ALGORITHM

The Divide and Conquer algorithm is a problem-solving approach

used in artificial intelligence and other fields of computer science. The
algorithm works by breaking down a complex problem into smaller sub-
problems that are easier to solve, then combining the solutions to the sub-
problems to obtain the solution to the original problem.

The basic steps of the Divide and Conquer algorithm are as follows:

1. Divide the problem into smaller sub-problems that are similar in

structure to the original problem.

2. Solve each sub-problem recursively, either by applying the same

Divide and Conquer algorithm to each sub-problem or by using a
different algorithm appropriate to that sub-problem.
3. Combine the solutions to the sub-problems to obtain the solution to the
original problem.

Fig: 4.2: DIVIDE AND CONQUER Algorithm

16
4.2 ENHANCED SYSTEM ARCHITECTURE

User interface: The user interface (UI) is a critical component of

any game, and memory games are no exception. Your system should
have a UI that is intuitive and easy to use, with clear instructions on how
to play the game. It's important to design the UI with the user in mind,
ensuring that it is visually appealing, responsive, and easy to navigate.
Memory storage: Memory games require storing a lot of data, such
as the game board layout, player scores, and game settings. Your system
should have an efficient memory storage mechanism that allows for fast
retrieval and updating of data. You can use a database, such as MySQL or
PostgreSQL, to store the game data.
Randomization: Memory games rely heavily on randomization to
ensure that each game is unique and challenging. Your system should
have a robust randomization algorithm that ensures that the game board
layout is unpredictable and varied. You can use a pseudo-random number
generator or a true random number generator to achieve this.
Game logic: The game logic is the backbone of the game,
determining how the game progresses and how the player interacts with
the game. Your system should have a well-designed game logic that is
flexible and scalable, allowing for easy updates and modifications as the
game evolves.
Multiplayer support: Memory games can be even more fun when
played with friends or other players online. Your system should support
multiplayer functionality, allowing players to compete against each other
in real-time. You can use Web Socket or similar technology to enable
real-time communication between players.
Performance optimization: Memory games can be resource-
intensive, especially when dealing with large game boards and complex

17
game logic. Your system should be optimized for performance, ensuring
that it runs smoothly on a variety of devices and platforms.
Overall, an enhanced system architecture for a memory game
should prioritize user experience, game logic, and performance
optimization, while also providing support for features like randomization
and multiplayer functionality.

Fig: 4.3: Enhanced System Model Diagram

4.3 IMPLEMENTATION

The following steps were involved in implementing this whole project

Step 1: Website Design

The game is implemented using JavaScript, HTML, and CSS. The

game board is created dynamically using JavaScript DOM manipulation.

The cards are represented using HTML div elements with

background images set using CSS. The game logic is implemented using
JavaScript functions that handle card flipping, matching, and scoring. The
game timer is also implemented using JavaScript's se interval() function.

18
 Figure 4.4 Website Design diagram

Step 2: Game Design

The game is designed with a simple user interface and consists of a

game board with a grid of cards, each containing a unique image.

Figure 4.5 Game design 1

19
 The objective of the game is to match pairs of cards with the same
image by flipping them over one by one until all pairs are found.

Figure 4.6 Game design 2

Step 3: Gameplay

The user starts the game by clicking the "Start Game" button. The
game board is generated with a random layout of cards, with each card
containing a unique image.

Figure 4.7 Gameplay 1

20
 Figure 4.8 Gameplay 2

The single level memory game implemented using JavaScript

provides a fun and challenging way for users to improve their cognitive
abilities and memory retention.
The game's simple user interface, dynamic game board generation,
and scoring system make it a great addition to any website. Future
enhancements could include multiple difficulty levels, additional game
modes, and social sharing features.

Figure 4.9 Gameplay 3

21
Step 4: Creating Quiz

The quiz consists of multiple-choice questions with four options

each. The user must select one option as their answer for each question.
The quiz has a total of 5 questions and the user's score is calculated based
on the number of correct answers .The quiz is designed with a simple user
interface and consists of a main quiz container that contains the question,
options, and submit button for each question. The user interface is
designed using HTML and CSS to provide an intuitive and easy-to-use
interface for the user.

Figure 4.10 Quiz Creation

4.4 PERFORMANCE MEASURES

The performance measure for a kids game website can depend on the
specific goals and objectives of the website.
User engagement: This can be measured through metrics such as time
spent on the site, number of page views, and number of return visits.
Conversion rate: If the website has a specific goal, such as getting users
to sign up for a newsletter or purchase a product, the conversion rate can
be a key performance indicator.

22
 Figure 4.11 Performance measures

Responsiveness: A kids game website should load quickly and be

responsive to user actions. Performance metrics such as page load speed
and server response time can be tracked.
User feedback: Gathering feedback from users can provide valuable
insights into how well the website is performing. This can be done
through surveys, user testing, or analyzing comments and reviews.
Safety and security: It is important to ensure that the website is safe and
secure for young users. Performance measures such as uptime, downtime,
and security breaches should be tracked and addressed promptly.
Completion rate: This metric measures the percentage of users who
successfully complete a game. It can indicate how challenging the game
is and how engaged users are with it.

23
 Figure 4.13 Memory Performance over time

Average time to complete a game: This metric can provide insight into
how long it takes for users to complete a game. It can help identify if the
game is too easy or too difficult, and whether users are engaged enough
to complete it.
Error rate: This metric measures the number of errors or mistakes made
by users during the game. It can provide insight into the level of difficulty
of the game and how well users are able to remember and match patterns.
User engagement: Metrics such as time spent on the site, number of
page views, and return visits can indicate how engaged users are with the
game.

24
 CHAPTER V

CONCLUSION AND FUTURE WORK

5.1 CONCLUSION

A memory gaming website can be a great way to improve cognitive

function and memory skills while providing a fun and engaging experience for
users. Through the use of various memory games and exercises, users can
challenge themselves and track their progress over time. Additionally,
incorporating elements of gamification, such as rewards and leaderboards, can
help to increase motivation and engagement. Overall, a memory gaming website
has the potential to be a valuable tool for individuals looking to improve their
memory skills and cognitive function.

A quiz related gaming website can be an excellent way to provide

entertainment and education to users. Through the use of quizzes, users can test
their knowledge on various topics and compete with others in a fun and
engaging way. Additionally, incorporating elements of gamification, such as
rewards and badges, can help to increase motivation and engagement. A quiz
gaming website can be an effective tool for individuals looking to learn new
information and expand their knowledge. It can also be a useful tool for
educators to create engaging learning experiences for their students. Overall, a
quiz related gaming website has the potential to be a valuable resource for
individuals of all ages and backgrounds

5.2 FUTURE WORKS

There are several future work needs for memory gaming websites.
Memory gaming websites can benefit from incorporating new technologies,
such as virtual reality or augmented reality, to enhance the user experience and
provide a more immersive and interactive environment. There is a need to

25
conduct further research to determine the effectiveness of memory gaming
websites in improving cognitive function and memory skills in different
populations, such as older adults or individuals with cognitive impairments.
Memory gaming websites can benefit from integrating social networking
features to enable users to compete and collaborate with friends and family,
share their progress, and receive feedback and support.

Augmented Reality (AR) Enhancements: AR can overlay virtual elements onto

the real world, allowing memory games to be played in a more interactive and
dynamic manner. Players could explore their surroundings, discover hidden
clues, and engage with virtual characters or objects.

Advanced AI and Adaptive Difficulty: Memory games can employ artificial

intelligence algorithms to adapt to each player's skill level. The game can
dynamically adjust the difficulty, pacing, and complexity based on the player's
performance, providing personalized and challenging experiences.

Multiplayer and Social Features: Adding multiplayer functionality to memory

games would enable players to compete or collaborate with friends, family, or
online communities. Leaderboards, achievements, and social sharing options
could enhance engagement and create a sense of community.

Virtual Reality (VR) Integration: Memory games could leverage VR technology

to provide immersive experiences. Players could interact with virtual
environments, manipulate objects, and engage their senses to enhance memory
recall.

Virtual Reality (VR) Integration: Memory games could leverage VR technology

to provide immersive experiences. Players could interact with virtual
environments, manipulate objects, and engage their senses to enhance memory
recall.

26
 APPENDICES

ZEROS AND CROSSES

let btnRef = document.querySelectorAll(".button-option");

let popupRef = document.querySelector(".popup");

let newgameBtn = document.getElementById("new-game");

let restartBtn = document.getElementById("restart");

let msgRef = document.getElementById("message");

let winningPattern = [

[0, 1, 2],

[0, 3, 6],

[2, 5, 8],

[6, 7, 8],

[3, 4, 5],

[1, 4, 7],

[0, 4, 8],

[2, 4, 6],

];

let xTurn = true;

let count = 0;

const disableButtons = () => {

btnRef.forEach((element) => (element.disabled = true));

27
 //enable popup

popupRef.classList.remove("hide");

};

const enableButtons = () => {

btnRef.forEach((element) => {

element.innerText = "";

element.disabled = false;

});

popupRef.classList.add("hide");

};

const winFunction = (letter) => {

disableButtons();

if (letter == "X") {

msgRef.innerHTML = "&#x1F389; <br> 'X' Wins";

} else {

msgRef.innerHTML = "&#x1F389; <br> 'O' Wins";

};

const drawFunction = () => {

disableButtons();

msgRef.innerHTML = "&#x1F60E; <br> It's a Draw";

newgameBtn.addEventListener("click", () => {

28
 count = 0;

enableButtons();

});

restartBtn.addEventListener("click", () => {

count = 0;

enableButtons();

});

const winChecker = () => {

for (let i of winningPattern) {

let [element1, element2, element3] = [

btnRef[i[0]].innerText,

btnRef[i[1]].innerText,

btnRef[i[2]].innerText

];

if (element1 != "" && (element2 != "") & (element3 != "")) {

if (element1 == element2 && element2 == element3) {

winFunction(element1);

};

btnRef.forEach((element) => {

29
 element.addEventListener("click", () => {

if (xTurn) {

xTurn = false;

//Display X

element.innerText = "X";

element.disabled = true;

} else {

xTurn = true;

//Display Y

element.innerText = "O";

element.disabled = true;

count += 1;

if (count == 9) {

drawFunction();

winChecker();

});

});

window.onload = enableButtons;

WORD PUZZLE

const options = {
30
 aroma: "Pleasing smell",

pepper: "Salt's partner",

halt: "put a stop to",

jump: "Rise suddenly ",

shuffle: "Mix cards up ",

combine: "Add; Mix",

chaos: "Total disorder",

labyrinth: "Maze",

disturb: "Interrupt; upset ",

shift: "Move; Period of word",

machine: "Device or appliance",

};

const message = document.getElementById("message");

const hintRef = document.querySelector(".hint-ref");

const controls = document.querySelector(".controls-container");

const startBtn = document.getElementById("start");

const letterContainer = document.getElementById("letter-container");

const userInpSection = document.getElementById("user-input-section");

const resultText = document.getElementById("result");

const word = document.getElementById("word");

const words = Object.keys(options);

let randomWord = "",

31
 randomHint = "";

let winCount = 0,

lossCount = 0;

const generateRandomValue = (array) => Math.floor(Math.random() *

array.length);

const blocker = () => {

let lettersButtons = document.querySelectorAll(".letters");

stopGame();

};

startBtn.addEventListener("click", () => {

controls.classList.add("hide");

init();

});

const stopGame = () => {

controls.classList.remove("hide");

};

const generateWord = () => {

letterContainer.classList.remove("hide");

userInpSection.innerText = "";

randomWord = words[generateRandomValue(words)];

randomHint = options[randomWord];

32
 hintRef.innerHTML = `<div id="wordHint">

<span>Hint: </span>${randomHint}</div>`;

let displayItem = "";

randomWord.split("").forEach((value) => {

displayItem += '<span class="inputSpace">_ </span>';

});

userInpSection.innerHTML = displayItem;

userInpSection.innerHTML += `<div id='chanceCount'>Chances Left:

${lossCount}</div>`;

};

const init = () => {

winCount = 0;

lossCount = 5;

randomWord = "";

word.innerText = "";

randomHint = "";

message.innerText = "";

userInpSection.innerHTML = "";

letterContainer.classList.add("hide");

letterContainer.innerHTML = "";

generateWord();

for (let i = 65; i < 91; i++) {

33
let button = document.createElement("button");

button.classList.add("letters");

button.innerText = String.fromCharCode(i);

button.addEventListener("click", () => {

message.innerText = `Correct Letter`;

message.style.color = "#008000";

let charArray = randomWord.toUpperCase().split("");

let inputSpace = document.getElementsByClassName("inputSpace");

if (charArray.includes(button.innerText)) {

charArray.forEach((char, index) => {

if (char === button.innerText) {

button.classList.add("correct");

inputSpace[index].innerText = char;

winCount += 1

if (winCount == charArray.length) {

resultText.innerHTML = "You Won";

startBtn.innerText = "Restart";

blocker();

});

} else {

34
 button.classList.add("incorrect");

lossCount -= 1;

document.getElementById(

"chanceCount"

).innerText = `Chances Left: ${lossCount}`;

message.innerText = `Incorrect Letter`;

message.style.color = "#ff0000";

if (lossCount == 0) {

word.innerHTML = `The word was:

<span>${randomWord}</span>`;

resultText.innerHTML = "Game Over";

blocker();

button.disabled = true;

});

letterContainer.appendChild(button);

};

window.onload = () => {

init();

};

35
NUMBER GUESSING

var msg1 = document.getElementById("message1");

var msg2 = document.getElementById("message2");

var msg3 = document.getElementById("message3");

var answer = Math.floor(Math.random()*100) + 1;

var no_of_guesses = 0;

var guessed_nums = [];

function play(){

var user_guess = document.getElementById("guess").value;

if(user_guess < 1 || user_guess > 100){

alert("Please enter a number between 1 and 100.");

else{

guessed_nums.push(user_guess);

no_of_guesses+= 1;

if(user_guess < answer){

msg1.textContent = "Your guess is too low.";

msg2.textContent = "No. of guesses: " + no_of_guesses;

msg3.textContent = "Guessed numbers are: " +

guessed_nums;

36
 else if(user_guess > answer){

msg1.textContent = "Your guess is too high.";

msg2.textContent = "No. of guesses: " + no_of_guesses;

msg3.textContent = "Guessed numbers are: " +

guessed_nums;

else if(user_guess == answer){

msg1.textContent = "Yippie You Win!!";

msg2.textContent = "The number was: " + answer;

msg3.textContent = "You guessed it in "+ no_of_guesses + "

guesses";

document.getElementById("my_btn").disabled = true;

MATCH MATCH

const moves = document.getElementById("moves-count");

const timeValue = document.getElementById("time");

const startButton = document.getElementById("start");

const stopButton = document.getElementById("stop");

const gameContainer = document.querySelector(".game-container");

const result = document.getElementById("result");

37
const controls = document.querySelector(".controls-container");

let cards;

let interval;

let firstCard = false;

let secondCard = false;

Const items = [

{ name: "bee", image: "bee.png" },

{ name: "crocodile", image: "crocodile.png" },

{ name: "macaw", image: "macaw.png" },

{ name: "gorilla", image: "gorilla.png" },

{ name: "tiger", image: "tiger.png" },

{ name: "monkey", image: "monkey.png" },

{ name: "chameleon", image: "chameleon.png" },

{ name: "piranha", image: "piranha.png" },

{ name: "anaconda", image: "anaconda.png" },

{ name: "sloth", image: "sloth.png" },

{ name: "cockatoo", image: "cockatoo.png" },

{ name: "toucan", image: "toucan.png" },

];

let seconds = 0,

minutes = 0;

38
 let movesCount = 0,

winCount = 0;

const timeGenerator = () => {

seconds += 1;

if (seconds >= 60) {

minutes += 1;

seconds = 0;

let secondsValue = seconds < 10 ? `0${seconds}` : seconds;

let minutesValue = minutes < 10 ? `0${minutes}` : minutes;

timeValue.innerHTML =
`<span>Time:</span>${minutesValue}:${secondsValue}`;

};

const movesCounter = () => {

movesCount += 1;

moves.innerHTML = `<span>Moves:</span>${movesCount}`;

};

Const generateRandom = (size = 4) => {

let tempArray = [...items];

let cardValues = [];

size = (size * size) / 2;

for (let i = 0; i < size; i++) {

39
 const randomIndex = Math.floor(Math.random() * tempArray.length);

cardValues.push(tempArray[randomIndex]);

tempArray.splice(randomIndex, 1);

return cardValues;

};

const matrixGenerator = (cardValues, size = 4) => {

gameContainer.innerHTML = "";

cardValues = [...cardValues, ...cardValues];

cardValues.sort(() => Math.random() - 0.5);

for (let i = 0; i < size * size; i++) {

/*

Create Cards

before => front side (contains question mark)

after => back side (contains actual image);

data-card-values is a custom attribute which stores the names of the

cards to match later

*/

gameContainer.innerHTML += `

<div class="card-container" data-card-

value="${cardValues[i].name}">

<div class="card-before">?</div>

40
 <div class="card-after">

<img src="${cardValues[i].image}" class="image"/></div>

</div>

`;

gameContainer.style.gridTemplateColumns = `repeat(${size},auto)`;

cards = document.querySelectorAll(".card-container");

cards.forEach((card) => {

card.addEventListener("click", () => {

if (!card.classList.contains("matched")) {

card.classList.add("flipped");

if (!firstCard) {

firstCard = card;

firstCardValue = card.getAttribute("data-card-value");

} else {

movesCounter();

secondCard = card;

let secondCardValue = card.getAttribute("data-card-value");

if (firstCardValue == secondCardValue) {

firstCard.classList.add("matched");

secondCard.classList.add("matched");

firstCard = false;

41
 winCount += 1;

if (winCount == Math.floor(cardValues.length / 2)) {

result.innerHTML = `<h2>You Won</h2>

<h4>Moves: ${movesCount}</h4>`;

stopGame();

} else {

let [tempFirst, tempSecond] = [firstCard, secondCard];

firstCard = false;

secondCard = false;

let delay = setTimeout(() => {

tempFirst.classList.remove("flipped");

tempSecond.classList.remove("flipped");

}, 900);

});

});

};

startButton.addEventListener("click", () => {

movesCount = 0;

42
 seconds = 0;

minutes = 0;

controls.classList.add("hide");

stopButton.classList.remove("hide");

startButton.classList.add("hide");

interval = setInterval(timeGenerator, 1000);

moves.innerHTML = `<span>Moves:</span> ${movesCount}`;

initializer();

});

StopButton.addEventListener(

"click",

(stopGame = () => {

controls.classList.remove("hide");

stopButton.classList.add("hide");

startButton.classList.remove("hide");

clearInterval(interval);

})

);

const initializer = () => {

result.innerText = "";

winCount = 0;

let cardValues = generateRandom();

43
 console.log(cardValues);

matrixGenerator(cardValues);

};

CHING CHANG CHOE

let [computer_score,user_score]=[0,0];

let result_ref = document.getElementById("result");

let choices_object = {

'rock' : {

'rock' : 'draw',

'scissor' : 'win',

'paper' : 'lose'

},

'scissor' : {

'rock' : 'lose',

'scissor' : 'draw',

'paper' : 'win'

},

'paper' : {

'rock' : 'win',

'scissor' : 'lose',

'paper' : 'draw'

}
44
}

function checker(input){

var choices = ["rock", "paper", "scissor"];

var num = Math.floor(Math.random()*3);

document.getElementById("comp_choice").innerHTML =

` Computer choose <span> ${choices[num].toUpperCase()} </span>`;

document.getElementById("user_choice").innerHTML =

` You choose <span> ${input.toUpperCase()} </span>`;

let computer_choice = choices[num];

switch(choices_object[input][computer_choice]){

case 'win':

result_ref.style.cssText = "background-color: #cefdce; color:

#689f38";

result_ref.innerHTML = "YOU WIN";

user_score++;

break;

case 'lose':

result_ref.style.cssText = "background-color: #ffdde0; color:

#d32f2f";

result_ref.innerHTML = "YOU LOSE";

computer_score++;

45
 break;

default:

result_ref.style.cssText = "background-color: #e5e5e5; color:

#808080";

result_ref.innerHTML = "DRAW";

break;

document.getElementById("computer_score").innerHTML =
computer_score;

document.getElementById("user_score").innerHTML = user_score;

46
 REFERENCES

1. Rojas-Ruiz, J. A., Manrique-Huerta, L., Sanchez-Torres, J. A., &

Ramirez, V. (2020). Memory games: A cognitive training proposal
for elderly adults. Journal of Medical Systems, 44(1), 1-9.

2. Nouchi, R., Taki, Y., Takeuchi, H., Sekiguchi, A., Hashizume, H.,
Nozawa, T., & Kawashima, R. (2013). Brain training game
improves executive functions and processing speed in the elderly:
A randomized controlled trial. PLoS ONE, 8(3), e59276.

3. De Frias, C. M., Dixon, R. A., & Strauss, E. (2006). Structure of

four executive functioning tests in healthy older adults.
Neuropsychology, Development, and Cognition. Section B, Aging,
Neuropsychology and Cognition, 13(4), 575-589.

4. Belleville, S., Gilbert, B., Fontaine, F., Gagnon, L., Ménard, É., &
Gauthier, S. (2006). Improvement of episodic memory in persons
with mild cognitive impairment and healthy older adults: Evidence
from a cognitive intervention program. Dementia and Geriatric
Cognitive Disorders, 22(5-6), 486-499.

5. Basak, C., Boot, W. R., Voss, M. W., & Kramer, A. F. (2008). Can
training in a real-time strategy video game attenuate cognitive
decline in older adults? Psychology and Aging, 23(4), 765-777.

6. Heinzel, S., Schulte, S., Onken, J., Duong, Q. L., Riemer, T. G.,
Heinz, A., ... & Kathmann, N. (2018). Working memory training
improvements and gains in non-trained cognitive tasks in young

47
 and older adults. Aging, Neuropsychology, and Cognition, 25(6),
816-849.

7. Lee, J. H., Han, K. S., Park, Y. H., & Hong, J. W. (2020). Effect of
virtual reality-based cognitive training on balance, cognition, and
brain activity in older adults with mild cognitive impairment: A
randomized controlled trial. International Journal of Environmental
Research and Public Health, 17(9), 3240.

8. Brehmer, Y., Westerberg, H., & Bäckman, L. (2012). Working-

memory training in younger and older adults: Training gains,
transfer, and maintenance. Frontiers in Human Neuroscience, 6, 63.

9. Stern, Y. (2012). Cognitive reserve in ageing and Alzheimer's

disease. The Lancet Neurology, 11(11), 1006-1012.

10.Kueider, A. M., Parisi, J. M., Gross, A. L., & Rebok, G. W. (2012).

Computerized cognitive training with older adults: A systematic
review. PLoS ONE, 7(7), e40588.

11.Schwaighofer, M., Fischer, F., & Bühner, M. (2015). Does

working memory training transfer? A meta-analysis including
training conditions as moderators. Educational Psychologist, 50(2),
138-166.

12.Shipstead, Z., Redick, T. S., & Engle, R. W. (2012). Is working

memory training effective? Psychological Bulletin, 138(4), 628-
654.

48
13.Klingberg, T., Fernell, E., Olesen, P. J., Johnson, M., Gustafsson,
P., Dahlström, K., Gillberg, C. G., Forssberg, H., & Westerberg, H.
(2005). Computerized training of working memory in children with
ADHD—A randomized, controlled trial. Journal of the American
Academy of Child & Adolescent Psychiatry, 44(2), 177-186.

14.Jaeggi, S. M., Buschkuehl, M., Jonides, J., & Perrig, W. J. (2008).

Improving fluid intelligence with training on working memory.
Proceedings of the National Academy of Sciences, 105(19), 6829-
6833.

15.Soveri, A., Antfolk, J., Karlsson, L., Salo, B., & Laine, M. (2017).
Working memory training revisited: A multi-level meta-analysis of
n-back training studies. Psychonomic Bulletin & Review, 24(4),
1077-1096.

16.Alloway, T. P., & Alloway, R. G. (2010). Investigating the

predictive roles of working memory and IQ in academic
attainment. Journal of Experimental Child Psychology, 106(1), 20-
29.

17.Holmes, J., Gathercole, S. E., & Dunning, D. L. (2009). Adaptive

training leads to sustained enhancement of poor working memory
in children. Developmental Science, 12(4), F9-F15.

18.Karbach, J., & Verhaeghen, P. (2014). Making working memory

work: A meta-analysis of executive control and working memory
training in older adults. Psychological Science, 25(11), 2027-2037.

49
19.Richmond, L. L., Morrison, A. B., Chein, J. M., & Olson, I. R.
(2011). Working memory training and transfer in older adults.
Psychology and Aging, 26(4), 813-822.

20.Melby-Lervåg, M., & Hulme, C. (2013). Is working memory

training effective? A meta-analytic review. Developmental
Psychology, 49(2), 270-291.

21.Green, C. S., & Bavelier, D. (2008). Exercising your brain: A

review of human brain plasticity and training-induced learning.
Psychology and Aging, 23(4), 692-701.

22.Dunning, D. L., Holmes, J., & Gathercole, S. E. (2013). Does

working memory training lead to generalized improvements in
children with low working memory? A randomized controlled trial.
Developmental Science, 16(6), 915-925.

23.Bergman Nutley, S., Söderqvist, S., & Klingberg, T. (2015).

Increased training intensity improves working memory in
adolescents with ADHD: A randomized controlled trial. Child
Neuropsychology, 21(6), 747-765.

24.Diamond, A., Barnett, W. S., Thomas, J., & Munro, S. (2007).

Preschool program improves cognitive control. Science,
318(5855), 1387-1388.

25.Morrison, A. B., & Chein, J. M. (2011). Does working memory

training work? The promise and challenges of enhancing cognition

50
 by training working memory. Psychonomic Bulletin & Review,
18(1), 46-60.

26.Holmes, J., Gathercole, S. E., Place, M., Dunning, D. L., Hilton, K.

A., & Elliott, J. G. (2010). Working memory deficits can be
overcome: Impacts of training and medication on working memory
in children with ADHD. Applied Cognitive Psychology, 24(6),
827-836.

27.Thorell, L. B., Lindqvist, S., Nutley, S. B., Bohlin, G., &

Klingberg, T. (2009). Training and transfer effects of executive
functions in preschool children. Developmental Science, 12(1),
106-113.

28.Karbach, J., & Kray, J. (2009). How useful is executive control

training? Age differences in near and far transfer of task-switching
training. Developmental Science, 12(6), 978-990.

29.Au, J., Sheehan, E., Tsai, N., Duncan, G. J., Buschkuehl, M., &
Jaeggi, S. M. (2015). Improving fluid intelligence with training on
a working memory task. Proceedings of the National Academy of
Sciences, 112(19), 14888-14893.

30.Li, S. C., Schmiedek, F., Huxhold, O., Röcke, C., Smith, J., &
Lindenberger, U. (2008). Working memory plasticity in old age:
Practice gain, transfer, and maintenance. Psychology and Aging,
23(4), 731-742.

51