Adaptive Web App UIs for Older Users

ISEF Category: Systems Software

Subcategory: Human/Machine Interface  ·  Difficulty: Advanced  ·  Setup: University Lab  ·  Time: Full Year

The Hook

A web app can feel easy for one person and painful for another. For older users, tiny things like font size, contrast, and animation can change whether a task feels smooth or impossible. You can build a system that learns from real interaction data and restyles the interface for the user. That turns a normal app into a personal one.

What Is It?

This project studies adaptive user interfaces. That means a web app changes how it looks or behaves based on how you use it. If someone keeps missing buttons, the app might increase button size. If someone scrolls slowly and pauses a lot, the app might reduce visual clutter or animation.

Think of it like a smart pair of glasses for a website. The page does not just stay the same for every person. It watches simple signals, like dwell time, mis-taps, and scroll-jitter, then picks a better layout. Dwell time means how long you hover or linger before acting. Mis-taps are clicks on the wrong thing. Scroll-jitter means shaky, stop-and-go scrolling that can signal trouble.

Your job is to test whether that adaptation helps older adults complete tasks more easily. You can compare a fixed interface with an adaptive one, then measure speed, accuracy, and user comfort. The machine learning part can stay small. Even a simple rule system plus a tiny reinforcement learning policy can count if you explain it clearly and test it well.

Why This Is a Good Topic

This is a strong science fair topic because you can measure real behavior instead of guessing. You can test whether interface changes actually improve task completion, error rate, and satisfaction. It connects to a real problem, since many older adults struggle with websites that were not built for them. You can also learn useful skills in UX design, data logging, experimentation, and basic machine learning.

Research Questions

• How does adaptive font sizing affect task completion time for older users?
• What is the effect of increased contrast on mis-tap rate during web navigation?
• Does reducing animation improve scroll stability for users with slower interaction patterns?
• To what extent do dwell time and scroll-jitter predict when a user needs interface changes?
• Which adaptation rule, font size, contrast, or spacing, produces the largest drop in navigation errors?
• How does a rule-based adapter compare with a tiny reinforcement learning policy in usability outcomes?

Basic Materials

• Laptop or desktop computer with a browser
• Screen recording software with cursor capture
• Web analytics logger for clicks, scrolls, and dwell time
• Simple web app prototype or editable demo site
• Consent form and participant instruction sheet
• Spreadsheet software for data coding
• Video call platform for remote user testing
• External mouse with adjustable pointer speed.

Advanced Materials

• Web app testbed with editable front end code
• JavaScript event logging framework
• Database or local log storage for interaction telemetry
• Framework for adaptive styling changes
• Small reinforcement learning library in Python
• Statistical analysis software
• Screen capture and remote usability testing setup
• Optional eye-tracking or webcam-based gaze proxy tool.

Software & Tools

• JavaScript: Captures clicks, scrolls, and dwell time directly in the browser.
• Python: Cleans log data, computes metrics, and runs comparisons between groups.
• R: Runs statistical tests and creates plots for usability outcomes.
• ImageJ: Not used here, so skip it if you do not need image-based analysis.
• Google Sheets: Organizes participant logs and basic summaries for early analysis.

Experiment Steps

1. Define the user task you want to improve, then pick one outcome metric that matters most.
2. Choose the interaction signals your system will watch, and decide how each signal will trigger a style change.
3. Build two versions of the interface, one fixed and one adaptive, so you can compare them fairly.
4. Plan a logging scheme that records user actions in a consistent way across sessions.
5. Design controls that separate true usability gains from practice effects, device differences, or user familiarity.
6. Set up an analysis plan that compares speed, error rate, and user satisfaction across conditions.

Common Pitfalls

• Changing too many UI features at once, which makes it impossible to know whether font, contrast, or spacing caused the improvement.
• Logging only total clicks, which misses the dwell, mis-tap, and scroll-jitter signals that drive the adaptation.
• Testing on a single device type, which hides how touchpads, mice, and tablets change user behavior.
• Letting the adaptive system change during the task without a fixed rule, which makes results hard to compare across participants.
• Using young testers instead of older adults, which can produce a design that looks good but does not solve the real problem.

What Makes This Competitive

A stronger project will not just say that adaptive UI helps. It will measure which signals matter, which style changes help most, and whether a simple rule system beats a learned policy. You can raise the level by using careful controls, preregistered metrics, and real statistical tests instead of only average scores. A strong writeup will also explain when adaptation helps, when it hurts, and why.

Project Variations

• Test whether adaptive spacing helps older users more than adaptive font size on mobile versus desktop screens.
• Compare a rule-based interface tuner with a tiny machine learning model that chooses one UI change at a time.
• Study whether the same adaptive system works better for people with low vision, shaky mouse control, or limited web experience.

Learn More

• Nielsen Norman Group: Search their articles on accessibility, aging users, and adaptive interfaces for practical UX background.
• W3C Web Accessibility Initiative: Read the accessibility guidelines and techniques on the W3C website.
• MIT OpenCourseWare: Search for human-computer interaction and user interface design courses for free lecture notes.
• PubMed: Search review articles on older adults, usability, and digital interface accessibility.
• ACM Digital Library: Search for peer-reviewed papers on adaptive interfaces, though some full texts may require institutional access.
• NIH National Institute on Aging: Look for resources on aging, vision, dexterity, and technology use.