App Dev Worksheet: Part 2 Test
Developer's tip (Think like the user): First decide which topic the question is about. Use that lesson’s rule: 48 px buttons, 16 px text, the screen stack, the flow order. For code, count positions from 0.
NameDateTime takenScore ___ / 40
- 1.Which of these helps everyone use the app? (a) fast-flashing lights (b) icons with no labels (c) strong colour contrast (d) tiny tap areas
-
2.🧭 The app has tabs Home, Search, Profile. You start on Home, then:
1. tap the Home tab
2. open “Friend list”
3. tap the Profile tab
How many times must you tap Back to reach the main screen of this tab? -
3.🔘 Our rule: buttons are at least 48 px tall. Which button is too small?
Help button: 40 px tall
Start button: 72 px tall
Back button: 56 px tall (a) Back (b) Help (c) Start - 4.✏️ Is this true of a wireframe or of a final design: shows where things go? (a) a wireframe (b) a final design
- 5.🔘 Is this good or poor button design: space between buttons? (a) good design (b) poor design
-
6.🖼️ In this wireframe (top to bottom), what is right below the tab bar?
[ Save button ]
[ tab bar ]
[ search box ]
[ filter buttons ] (a) search box (b) Save button (c) filter buttons - 7.🔢 In a photo-post flow, which comes first: “write a caption” or “open the camera screen”? (a) write a caption (b) open the camera screen
- 8.♿ Does this help everyone, or make the app harder to use: big touch targets? (a) makes it harder (b) helps everyone
- 9.🔘 Our rule: buttons are at least 48 px tall. The Help button is 28 px tall. How many px taller must it be?
- 10.Which of these is true of a final design? (a) uses plain grey boxes (b) has no real colours (c) shows where things go (d) uses the final pictures
- 11.True or false: strong colour contrast is poor button design. (a) False (b) True
- 12.♿ Does this help everyone, or make the app harder to use: tiny tap areas? (a) helps everyone (b) makes it harder
- 13.💾 Where should the app save a class leaderboard: on the phone or in the cloud? (a) on the phone (b) in the cloud
-
14.💾 pop() takes off the last item. What does this code show?
let songs = ["Kites", "Ocean", "Sunrise", "Rain"];
songs.pop();
show(songs[songs.length - 1]); (a) Kites (b) Ocean (c) Sunrise (d) Rain -
15.🖼️ In this wireframe (top to bottom), which part is at the very bottom?
[ top bar ]
[ search box ]
[ big picture ]
[ list of items ]
[ menu icon ] (a) list of items (b) top bar (c) menu icon (d) search box - 16.♿ Why add captions to videos? (a) to hide the sound (b) so anyone can follow (c) to add colour (d) to slow them down
- 17.♿ A screen has 5 icon buttons. Only 1 of them have a text label for screen readers. How many still need a label?
-
18.💾 pop() takes off the last item. What does this code show?
let songs = ["Sunrise", "Stars", "Ocean"];
songs.pop();
show(songs[songs.length - 1]); (a) Ocean (b) Stars (c) Sunrise -
19.🖼️ In this wireframe (top to bottom), what is right below the top bar?
[ big picture ]
[ top bar ]
[ filter buttons ]
[ search box ] (a) search box (b) filter buttons (c) big picture - 20.Which of these makes the app harder to use? (a) big touch targets (b) text that can grow (c) tiny tap areas (d) labels on every icon
-
21.💾 What number does this code show?
let coins = 4;
coins = coins - 1;
coins = coins + 3;
show(coins); - 22.🔢 In a quiz-app flow, which comes FIRST? (a) see the final score (b) read a question (c) pick an answer (d) tap “Start quiz”
- 23.Which of these makes the app harder to use? (a) colour as the only clue (b) text that can grow (c) big touch targets (d) strong colour contrast
-
24.💾 What does this code show? (Positions start at 0.)
let songs = ["Ocean", "Sunrise", "Rain"];
show(songs[1]); (a) Rain (b) Sunrise (c) Ocean - 25.True or false: a final design uses plain grey boxes. (a) True (b) False
- 26.🧭 About how many tabs suit a tab bar best? (a) 20 (b) 1 (c) 10 to 12 (d) 3 to 5
- 27.🎨 Is this about UI or UX: the icon shapes? (a) UI (b) UX
-
28.💾 What does this code show? (Positions start at 0.)
let songs = ["Kites", "Rain", "Ocean"];
show(songs[0]); (a) Ocean (b) Rain (c) Kites - 29.✏️ Is this true of a wireframe or of a final design: is a quick sketch? (a) a final design (b) a wireframe
-
30.🖼️ In this wireframe (top to bottom), which part is at the very bottom?
[ list of items ]
[ title text ]
[ search box ]
[ Save button ] (a) list of items (b) Save button (c) title text (d) search box - 31.🔘 Our rule: buttons are at least 48 px tall. The Start button is 28 px tall. How many px taller must it be?
- 32.🎨 Is this about UI or UX: the screen layout? (a) UI (b) UX
-
33.🔘 Our rule: buttons are at least 48 px tall. Which button is too small?
Next button: 36 px tall
Cancel button: 60 px tall
Help button: 72 px tall (a) Help (b) Cancel (c) Next - 34.🔍 Which is the odd one out? (a) how many taps it takes (b) how users feel after (c) the icon shapes (d) how fast a task is done
- 35.🔀 In a good flow, each screen should lead to ___. (a) the same screen (b) a random page (c) a dead end (d) a clear next step
- 36.🎨 Is this about UI or UX: the button colours? (a) UI (b) UX
-
37.👆 Two designs for the same task (each arrow is one tap). How many taps does Design A need?
Design A: Home → Menu → Results → Offers → Address → Pens → Size
Design B: Home → Shop → Menu -
38.♿ Our rule: text is at least 16 px. Which text on this screen is too small?
Menu: 9 px
Caption: 17 px
Label: 21 px
Body text: 22 px
Footer: 28 px (a) Label (b) Menu (c) Body text (d) Caption - 39.🔘 Is this good or poor button design: buttons almost touching? (a) good design (b) poor design
- 40.Which colour pair is hard to read? (a) red on green (b) white on dark green (c) black on pale grey (d) dark blue on white
Answer key
- strong colour contrast
- 0
- Help
- a wireframe
- good design
- search box
- open the camera screen
- helps everyone
- 20
- uses the final pictures
- False
- makes it harder
- in the cloud
- Sunrise
- menu icon
- so anyone can follow
- 4
- Stars
- filter buttons
- tiny tap areas
- 6
- tap “Start quiz”
- colour as the only clue
- Sunrise
- False
- 3 to 5
- UI
- Kites
- a wireframe
- Save button
- 20
- UI
- Next
- the icon shapes
- a clear next step
- UI
- 6
- Menu
- poor design
- red on green
Free app development lessons, practice and worksheets at talentjr.in/app-development-for-students