Practice User Interface in CS Thinking
Use these practice problems to test your method after reviewing the concept explanation and worked examples.
Quick Recap
The visual elements and interaction methods through which a user communicates with a computing system — including buttons, menus, text fields, icons, and layout. A well-designed UI follows principles of clarity, consistency, and feedback to make software intuitive and efficient to use.
The UI is everything the user sees and touches. A good UI makes the software feel easy and intuitive; a bad UI makes even simple tasks frustrating.
Showing a random 20 of 50 problems.
Example 1
mediumA long-running task shows no indicator. A user clicks 'Save' three times. What UI principle was missing and what bug results?
Example 2
easyA screen reader reads aloud the labels of buttons. Which UI principle is being supported?
Example 3
mediumA toolbar uses a floppy-disk icon for 'Save' with no label, and new users don't recognize it. Which principle is weak and what is a low-risk fix?
Example 4
mediumA mobile app uses 10px tap targets crammed together, causing mis-taps. Which usability factor is violated and the corrective principle?
Example 5
mediumA delete action shows a confirmation dialog 'Are you sure?'. Which two UI principles does this serve?
Example 6
mediumA login page uses gray text on light gray background, failing contrast. Which UI principle is violated?
Example 7
mediumA form shows an error 'Invalid input' with no detail after submit. How does this fail clarity, and what is the better design?
Example 8
hardA team replaces a familiar 'hamburger menu' icon with a unique custom icon. Engagement drops . Which UI principle did they violate, and what is the safer alternative?
Example 9
easyA screen shows 40 buttons of equal prominence with no grouping. Which UI mistake is this?
Example 10
hardDesign the visible states for a file upload widget so the user always knows what's happening. List them.
Example 11
easyA form clearly labels each field and shows one obvious primary action. Which UI principle is this?
Example 12
easyA button is clicked and a spinner appears while data loads. Which UI principle does the spinner serve?
Example 13
easyCLI stands for what?
Example 14
easyThe interface uses the same icon style throughout. Which principle is this?
Example 15
mediumApp A puts navigation on the left on the home screen but on the bottom on the settings screen, with different icons. Which principle is violated and what is the user impact?
Example 16
mediumAn app uses red for a 'Save' button and green for a 'Delete' button. Why is this a UI problem?
Example 17
mediumA signup form has an inline 'check' next to a valid email field as the user types. Which UI principle does this support?
Example 18
easyA confirmation 'Are you sure you want to delete?' helps prevent ____.
Example 19
hardExplain what usability testing is and design a simple usability test for a school timetable app. Include: tasks for testers, what to measure, and how to use the results.
Example 20
challengeA new feature requires changes to 6 screens. You can either redesign all 6 at once or only 2 of them, leaving 4 in the old style. Which path is better and why?