Android Phone Prototype
Material 3 design system · 390 × 844 px · Complete 11-screen verified workflow
✓ VERIFIED PROTOTYPE
Presented & Verified by ABIN S CHANDRAN
Reviewer Demo Instructions
1
Launch & Complete Onboarding:
Review the Hero screen with the "5-day free trial" badge, proceed through the Google Play VPN Data-Use disclosure, simulate email registration, and verify the 5-day confirmation screen.
Review the Hero screen with the "5-day free trial" badge, proceed through the Google Play VPN Data-Use disclosure, simulate email registration, and verify the 5-day confirmation screen.
2
Test Connection State Machine:
Tap the large 120px circular connect button. Observe the 1.4-second connecting pulse transition into the green "Protected & Secured" state with live duration timer.
Tap the large 120px circular connect button. Observe the 1.4-second connecting pulse transition into the green "Protected & Secured" state with live duration timer.
3
Server Selection & Mode Switching:
Toggle between Smart Routing and Global Mode. Tap the server card to browse locations by latency; tapping a server updates Home immediately.
Toggle between Smart Routing and Global Mode. Tap the server card to browse locations by latency; tapping a server updates Home immediately.
4
Security Hub & Account Settings:
Navigate to Security to test the Kill Switch, Split Tunneling app selector bottom sheet, and Identity Breach checker. Test the 5 VPN protocols in Account.
Navigate to Security to test the Kill Switch, Split Tunneling app selector bottom sheet, and Identity Breach checker. Test the 5 VPN protocols in Account.
5
Inspect Paywall & Pricing:
Tap any locked Premium feature or the trial chip to open the Paywall. Toggle between "Yearly plans" and "Monthly plans" to inspect 2-Year, 1-Year, 6-Month, and $0.00 trial pricing.
Tap any locked Premium feature or the trial chip to open the Paywall. Toggle between "Yearly plans" and "Monthly plans" to inspect 2-Year, 1-Year, 6-Month, and $0.00 trial pricing.
Known Simulation Scope:
This is a browser-based high-fidelity design prototype. VPN tunnel sockets and Google Play in-app billing APIs are simulated client-side. No installable APK is distributed in this repository.
Prototype Validation Checklist
- Passed Screen 1: Hero onboarding with 5-day trial badge
- Passed Screen 2: Google Play VPN data-use disclosure & consent
- Passed Screen 3: Email sign-up form with password reveal
- Passed Screen 4: Trial activation confirmation screen
- Passed Screen 5–7: Home connection 3-state cycle (Unprotected → Connecting → Protected)
- Passed Screen 8: Locations tabs (Recommended, All, Favourites, Loyalty) & server ping badges
- Passed Screen 9: Security hub, split tunnel app sheet, breach checker
- Passed Screen 10: Account, 10-device quota, protocol selector bottom sheet
- Passed Screen 11: Paywall yearly/monthly toggle & Free vs Premium matrix
- Passed Responsive Auto-Fit Zoom engine preventing laptop clipping
- Passed Fixed bottom navigation bar pinned permanently at base
- Simulated Network socket tunneling & Google Play billing APIs
File:
Open Raw Prototype ↗
android-phone.html (148 KB)