Final UI UX Code References

User Interface / User Experience

This section provides links to the implemented web and Android user interface code, and lists the new or significantly modified screens that should be shown with screenshots for the final milestone.

What This Section Covers

The final milestone asks for:

1. Links to the code in the project repository for each user interface design.
2. Screenshots of only the new or significantly modified web and mobile interfaces developed in this milestone.

The UX design of NEPH focuses on emergency preparedness, help requests, volunteer coordination, safety awareness, privacy, and admin monitoring. Since users may interact with the system under stress, the interface prioritizes speed, clarity, trust, and privacy.

UX Design Focus

Domain Need	UX Response
Request help quickly	Structured emergency help request forms with clear required fields
Coordinate volunteers	Availability toggle, assigned request detail, resolve/cancel actions
Support emergency awareness	Safety status, safety circles, nearby visible users, notifications
Find trusted resources	Emergency information, news, gathering areas, crisis map
Protect sensitive data	Privacy settings for profile, health, location, and visibility
Support admins	Dashboard views for users, help requests, announcements, and emergency monitoring
Maintain consistency	Shared red-white visual language across web and Android

Web UI Code Links

Interface Area	Code Links
Web app layout and navigation	Root layout, App shell, Top navbar
Authentication screens	Welcome, Login, Signup, Verify email, Complete profile
Home page	Home page
Profile and privacy	Profile page, Profile view, Privacy security page, Privacy security view
Gathering areas and crisis map	Gathering areas page, Gathering areas map, Crisis map page, Crisis map component
News and announcements	News list, News detail
Notifications	Notifications page
Admin dashboard	Admin page, Dashboard switcher, Users view, Announcements view, Emergency overview, Emergency history, Emergency insights, Deployment monitoring
Shared UI components	Buttons, Inputs, Display components, Selection components

Android UI Code Links

Interface Area	Code Links
App entry and navigation	MainActivity, AppNavGraph
Authentication screens	Welcome, Login, Signup, Verify email, Complete profile
Home and emergency actions	Home screen, Available to help card
Request help flow	Request help screen, My help requests, Help request map
Volunteer assignment	Assigned request screen
Safety status and circles	Safety circles screen, Circle status card, Nearby visible users
Profile and privacy	Profile screen, Edit profile screen, Privacy security screen, Settings screen
Emergency information and maps	Emergency info, Gathering areas, Map integration
News and notifications	News screen, Announcement detail, Notifications screen
Shared UI components	Layout components, Buttons, Inputs, Display components, Selection components

Screenshots

Screenshots of the new or significantly modified interfaces are provided directly in the main Final Deliverables wiki page. This linked page focuses on repository code references for the implemented UI designs.

Summary

The final UI/UX work expands the MVP experience from basic authentication, profile, help request, and availability flows into a broader emergency coordination product. The final release adds or significantly improves admin emergency monitoring, announcements, notifications, safety circles, safety status, nearby users, gathering areas, and privacy controls while keeping the emergency-focused UX principles of speed, clarity, and trust.