This project was created as part of my coursework at Birkbeck to develop a fully realised web project, connecting visual design with coding practice using JavaScript, HTML, and CSS, and applying concepts learned in the Visual Design and Web Project module.
(Featured in the Birkbeck Digital Showcase 2025)
- Description
- Technologies Used
- Getting Started
- Installation
- Project Improvements
- Contributors
- Acknowledgments
- Contact
- License
This project was created as the final submission for my coursework in the Visual Design and Web Project module at Birkbeck, University of London.
CodeGotchi is a browser-based pixel art Tamagotchi-style game where users interact with a virtual developer character, helping them level up by managing stats such as Energy, Knowledge, Motivation, and Stress.
Built with JavaScript, HTML, and CSS, the project demonstrates the use of variables, functions, arrays, conditional logic, and DOM manipulation.
The game features interactive user inputs, dynamic stat updates, and persistent data storage using localStorage, creating a playful and responsive user experience.
- Character Customisation: Allow users to create or select a developer avatar using the DiceBear API.
- Centralised Audio Management: Improve sound handling by managing audio centrally across components.
- Dark/Light Mode: Fully implement a dark and light mode toggle for better user experience.
- Random Events: Add randomised gameplay events to make the experience more dynamic and unpredictable.
##❗GETTING STARTED
-
Clone the repo
git clone https://github.com/your_username_/Project-Name.git
-
Navigate to the project directory: cd repository name
-
Open the
index.htmlfile in your web browser to view the project.
No installation is required. Simply clone the repository, navigate to the project directory, and open the index.html file in your web browser to start using the project.
This project was built using the following technologies and tools:
- HTML: Semantic HTML5 was used to structure the website and to ensure accessibility.
- CSS: External stylesheets were written to style the website, using Grid, Flexbox and Media Queries for responsive design.
- JavaScript: Used to build interactive functionality, manage the game state, and handle user interactions dynamically.
- NES.css: A lightweight CSS framework inspired by retro 8-bit games, used for selected UI elements while maintaining a consistent pixel art aesthetic.
- FontAwesome: For adding icons to enhance the design and usability of the site.
- Visual Studio Code (VS Code): The primary code editor used for development.
- Git & GitHub: Version control and repository hosting to manage and share the project.
Other Tools and Libraries:
I would like to thank the following for their contributions and support in creating this project:
- Birkbeck University: For providing guidance and resources through the Web Development and User Experience module.
- Professors and Instructors: For their valuable feedback and teaching.
- Validation Tools: WAVE, Lighthouse, and HTML validation tools for ensuring accessibility and responsiveness.
- GitHub: For hosting this project and enabling version control.
- Classmates and Friends: For their encouragement, feedback, user testing and helpful suggestions.
For more information or inquiries about the project, feel free to contact me:
GitHub: marshjaja
Linkedin
Copyright © 2025 Marcia Mijnhijmer (@marshjaja)