The Vowel Quiz Application is a web-based tool designed to help users practice and learn the International Phonetic Alphabet (IPA) vowel sounds. Through an interactive quiz format, users can listen to vowel sounds and match them to the correct IPA symbols.
- Interactive Quiz: A series of 10 questions where users listen to a vowel sound and choose the corresponding IPA symbol.
- Multiple Choice Answers: Each question provides four possible answers, randomly shuffled to encourage careful listening.
- Real-time Scoring: The user's score is updated after each question and displayed throughout the quiz.
- Adaptive Learning: If a mistake is made, the quiz remembers and revisits similar questions, helping users to reinforce their learning.
- Audio Playback: An embedded audio player lets users replay the vowel sound as needed.
- Time Warning: A modal popup notifies users when only one minute remains in the quiz, enhancing time management.
- HTML: To structure the application and present the quiz interface.
- CSS: For styling and responsive design.
- JavaScript: Provides the logic for quiz functionality, including handling user input, scoring, dynamic content generation, and managing mistakes.
- Font Awesome: Used for icons, specifically the volume control.
- Audio Files: Vowel sounds are provided as
.mp3
files, dynamically loaded into the audio player.
index.html
: The main HTML file containing the structure and logic for the quiz.style.css
: Stylesheet responsible for the layout, design, and responsive elements.vowels/
: Directory containing.mp3
files for each vowel sound.README.md
: Project description and instructions (this file).
- Download the project files or clone the repository.
- Open
index.html
in any modern web browser. - The quiz will start once you press the "Play" button.
- Listen to the vowel sound by clicking the volume icon or using the audio player.
- Select the correct IPA symbol from the provided multiple-choice answers.
- After selecting an answer, click "Next Question" to proceed.
- Your score is updated after each question, and the quiz will adapt if you make any mistakes.
- After answering all 10 questions, your final score is displayed.
- Add New Vowel Sounds: Expand the quiz by adding more vowel sounds. To do this, include new
.mp3
audio files in thevowels/
folder and update the vowel data array in JavaScript with corresponding IPA symbols. - Increase/Decrease Number of Questions: Modify the
questionsCount
variable in the JavaScript to adjust the total number of questions in the quiz. - Customize Styling: Tweak the
style.css
file to change colors, layout, fonts, or button styles. - Additional Quiz Features: You can implement new features such as a timer-based scoring system or track user progress across multiple quiz sessions.
- Font Awesome: For the volume icon.
- HTML5 Audio Element: The quiz relies on modern browsers that support the
<audio>
element to play.mp3
files.
This project is licensed under the MIT License, allowing for open use, modification, and distribution.
This project was developed as an engaging way to help learners practice IPA vowel sounds through interactive quizzes.