Sims Triva Quiz

Development, Branding
Year:2019
Technology:HTML/CSS, JavaScript, jQuery, Bootstrap
Categories:Development, Branding

Description

Welcome to my project, "The Sims Quiz," where I combine my love for video games and web development. In this project, I wanted to create an interactive and enjoyable quiz experience centered around one of my all-time favorite video game series, The Sims. To bring this quiz to life, I utilized a range of technologies. The frontend of the project is built using HTML, CSS, and JavaScript. These foundational web technologies provide the structure, styling, and interactivity needed to engage users. Additionally, I leveraged jQuery, a popular JavaScript library, to enhance the quiz's functionality. jQuery was particularly useful in handling click events and manipulating HTML elements seamlessly.

Originally, the quiz was designed as a form within the HTML document. The JavaScript code primarily consisted of a countdown timer and a function to tally the correct answers, which were stored in an array. However, I decided to take a simpler stylistic approach. I transformed the form-based quiz into a more visually appealing format by displaying one question at a time within a designated div element. This allowed for a more elegant design and enabled me to incorporate a timer specific to each question, adding an element of urgency and excitement.

Conclusion

The development process involved several essential steps. Firstly, I carefully selected The Sims as the theme for the quiz, ensuring it resonated with both my interests and the target audience. Next, I crafted a set of intriguing questions and curated captivating trivia related to The Sims universe. To organize and manage the quiz data effectively, I created objects to store the questions, answers, and correct responses. Additionally, I implemented an object dedicated to managing the entire trivia game flow. Throughout the code, various method functions were utilized, including countdown timers, loading questions, advancing to the next question within the game object, and resetting the game when needed.

Overall, "The Sims Quiz" showcases my ability to create an engaging and interactive web project using a combination of HTML, CSS, JavaScript, and jQuery. It highlights my attention to detail in designing a visually appealing user interface and my proficiency in utilizing various technologies to enhance user experience. Feel free to explore the project repository on GitHub for a closer look at the code and the thought process behind it.