Post on 01-Oct-2020
Unit 8 – assignment 2
Task 2
Bartosz cichy
ContentsPurpose of the App................................................................................................................................2
Flow Chart.............................................................................................................................................3
Pseudo Code......................................................................................................................................3
GUI design 1..........................................................................................................................................4
GUI design 2..........................................................................................................................................5
Flow diagram.........................................................................................................................................7
Sample code provided that requires adapting.......................................................................................8
Actual GUI design..................................................................................................................................9
Purpose of the App
The purpose of the app is to educate and teach young children aged 3 – 5 years old how to read the alphabet and to help them with the speech. There has to be at least 3 different screens such as: ‘Home’ page with different options, ‘Play’ page with the actual game and ‘Help’ page with all the information for the parent/guardian that explains how to play the game. The game will be written in C# and developed in Visual Studio. It is designed to work on mobile phones with Windows Phone system.
Flow Chart
Pseudo Code
Load the game.
If ‘Help’ clicked
Loads help page.
If clicked ‘Back’
It will load home page.
End if
If ‘Game’ clicked
It will load the game.
End if
If clicked ‘Play’
Random file letter is played.
End if
If wrong letter is clicked
Message will appear,
1 attempt will appear.
End if
If correct letter is clicked
Message will appear,
Your score will go up by 1 point.
End if
GUI design 1
GUI design 2
Help
Play
Ho
Help
Go Back Go Back
A B C D E F
GAME1
2
3
4
5
6
7
Example
8 9
1
2
3
4
5
67
8
9
11
10
No. Font Size Font Colour Font Name Background Colour
1. 20 Black (R:0 G:0 B:0) Buxton Sketch Blue (R:68 G:114 B:196)
2. 16 Black (R:0 G:0 B:0) Buxton Sketch Yellow (R:255 G:192 B:0)
3. 18 Black (R:0 G:0 B:0) Buxton Sketch Orange (R:237 G:125 B:49)
4. 20 Purple (R: 112 G:48 B:160)
Buxton Sketch Yellow (R:255 G:192 B:0)
5. 11 Black (R:0 G:0 B:0) Calibri (Body) Orange (R:237 G:125 B:49)
6. 20 Black (R:0 G:0 B:0) Bradley Hand ITC Blue (R:91 G:155 B:213)
7. 48 Red, yellow, green, blue, brown, pink
Calibri (Body) N/A
8. 9 Black (R:0 G:0 B:0) Calibri (Body) Black (R:0 G:0 B:0)9. 9 Black (R:0 G:0 B:0) Calibri (Body) Black (R:0 G:0 B:0)
No. Font Size Font Colour Font Name Background Colour
1. 20 White (R: 255 G: 255 B: 255)
Calibri (Body) Blue (R: 29 G: 38 B: 123)
2. 18 White (R: 255 G: 255 B: 255)
Calibri (Body) Blue (R: 29 G: 38 B: 123)
3. 18 White (R: 255 G: 255 B: 255)
Calibri (Body) Blue (R: 29 G: 38 B: 123)
4. 20 White (R: 255 G: 255 B: 255)
Calibri (Body) Peach (R: 244 G: 177 B: 131)
5. 11 White (R: 255 G: 255 B: 255)
Calibri (Body) Peach (R: 244 G: 177 B: 131)
6. 12 Red (R: 255 G: 0 B: 0)
Calibri (Body) Peach (R: 244 G: 177 B: 131)
7. 12 Red (R: 255 G: 0 B: 0)
Calibri (Body) Peach (R: 244 G: 177 B: 131)
8. 20 White (R: 255 G: 255 B: 255)
Calibri (Body) Green (R: 123 G: 233 B: 165)
9. 48 Red, yellow, green, blue, brown, pink
Calibri (Body) Green (R: 123 G: 233 B: 165)
10. 11 White (R: 255 G: 255 B: 255)
Calibri (Body) White (R: 255 G: 255 B: 255)
Letter Game
Help
Play
Home Page
Game
Help Page
Example text.
A B C D E F
Letter Game
Play Exit
Text.
Text
11
11. 16 White (R: 255 G: 255 B: 255)
Calibri (Body) Green (R: 123 G: 233 B: 165)
Flow diagram
Sample code provided that requires adapting.private void img4_MouseLeave(object sender, System.Windows.Input.MouseEventArgs e) { if(soundFile == listColoursL1[3]) { txtMessage.Text ="You have selected " + listColoursL1[3]; btnPlay.IsEnabled = true; score = score + 1; } else { txtMessage.Text ="Sorry, You have selected the wrong colour"; txtCheckCount.Text = check.ToString() + " attempt taken."; } }
private void Play_Click(object sender, RoutedEventArgs e) { //call the method to load the colours when the play button is pressed loadImages();
//select a random number between 0 and 4 number = randomIndex.Next(0, 4);
//select a random number between 0 and 4 soundFile = listColoursL1[number]; //set the source code for the sound SoundClip.Source = new Uri("/Assets/" + soundFile + ".mp3", UriKind.Relative); //set to play SoundClip.AutoPlay = true; SoundClip.Play();
}
//method loads list with file names for letter images and sounds
public void loadImagesSounds() { listColoursL1.Add("orange"); listColoursL1.Add("blue"); listColoursL1.Add("red"); listColoursL1.Add("yellow");
}
Actual GUI design
No. Font Size Font Colour Font Name Background Colour
1. 20 White (R: 255 G: 255 B: 255)
Calibri (Body) Blue (R: 29 G: 38 B: 123)
2. 18 White (R: 255 G: 255 B: 255)
Calibri (Body) Blue (R: 29 G: 38 B: 123)
3. 18 White (R: 255 G: 255 B: 255)
Calibri (Body) Blue (R: 29 G: 38 B: 123)
4. 20 White (R: 255 G: 255 B: 255)
Calibri (Body) Purple (R: 112 G: 48 B: 160)
5. 11 White (R: 255 G: 255 B: 255)
Calibri (Body) Purple (R: 112 G: 48 B: 160)
6. 12 Red (R: 255 G: 0 B: 0)
Calibri (Body) Purple (R: 112 G: 48 B: 160)
7. 12 Red (R: 255 G: 0 B: 0)
Calibri (Body) Purple (R: 112 G: 48 B: 160)
Letter Game
Help
Play
Home Page
Game
Help Page
Example text.
A B C D E F
Letter Game
Play Exit
Text.
Text
1
2
3
4
5
67
8
9
11
10
8. 20 White (R: 255 G: 255 B: 255)
Calibri (Body) Peach (R: 248 G: 203 B: 173)
9. 48 Red, yellow, green, blue, brown, pink
Calibri (Body) Peach (R: 248 G: 203 B: 173)
10. 11 White (R: 255 G: 255 B: 255)
Calibri (Body) White (R: 255 G: 255 B: 255)
11. 16 White (R: 255 G: 255 B: 255)
Calibri (Body) Peach (R: 248 G: 203 B: 173)