Background
Project Pulse was originally designed and developed for wide desktop browsers. This works well for instructors, who typically access the system on a PC or MacBook.
However, students have repeatedly requested the ability to complete their weekly workflows on mobile devices (phones and tablets), especially:
- Weekly Activity Reports (WARs)
- Peer Evaluations
Additionally, some instructors may prefer to review activities and evaluations on mobile devices rather than a desktop browser.
At this moment, many pages rely on hard-coded pixel values, which causes layout issues, clutter, and poor usability on smaller screens.
Summary
Make Project Pulse fully mobile-friendly (responsive) for both student weekly workflows and instructor portal pages, without introducing new features or redesigning the system.
The goal is to ensure all core workflows are usable, readable, and functional on phones and tablets.
Target devices include modern smartphones and tablets in both portrait and landscape orientations.
Student Pages (Weekly Use)
The following student-facing pages should work well on mobile devices:
- Login page
- Home page
- User Profile page
- My Weekly Activities page
- Pick a week
- Enter, edit, and delete weekly activity content
- Team's Activities page
- Pick a week
- Review teammates' activities
- Submit Evaluations page
- Evaluate teammates for a selected week
- My Evaluations page
- View peer evaluation scores and feedback for a selected week
Instructor Portal Pages
The instructor portal should also be mobile-friendly:
- Login page
- Home page
- Courses page
- Sections page
- Teams page
- Students page
- Section's Activities page
- Section's Evaluations page
- Rubrics page
- Criteria page
Current Behavior
- UI is optimized for wide desktop screens only.
- Many layouts use hard-coded pixel widths/heights, causing:
- Horizontal scrolling
- Cramped forms
- Tables overflowing the viewport
- Modals exceeding screen height on mobile
- Several student weekly workflows are difficult or impossible to complete on a phone.
Proposed Improvement
Refactor existing layouts to be responsive and mobile-friendly.
UI / Layout
- Replace hard-coded pixel values with responsive units and layouts:
- Flexbox / Grid
%, rem, em, vh/vwmax-width / min-width instead of fixed widths
- Ensure forms, tables, and modals adapt to smaller screens:
- Inputs stack vertically on mobile
- Buttons remain accessible and tappable
- Modals fit within viewport and scroll internally if needed
- Navigation should remain usable on mobile (drawer or collapse patterns acceptable).
Scope Control
- Reuse and fix shared components (tables, page containers, forms) first so improvements propagate across pages.
- No feature changes — responsiveness only.
Non-Goals
- No new features
- No visual redesign beyond layout responsiveness
- No native mobile app or PWA work
Acceptance Criteria
Risks / Notes
- Some data-heavy tables may require horizontal scrolling or alternative mobile layouts.
- Changes to shared layout components may affect multiple pages and require broader regression testing.
Rationale
Students interact with Project Pulse weekly, often outside traditional desktop settings. Supporting mobile devices improves accessibility, compliance, and student satisfaction.
For instructors, mobile access enables quick review of activities and evaluations without requiring a desktop browser.
Addressing responsiveness now will reduce UI technical debt and improve long-term maintainability.
Tags
feature, enhancement, ui, responsive-design
Background
Project Pulse was originally designed and developed for wide desktop browsers. This works well for instructors, who typically access the system on a PC or MacBook.
However, students have repeatedly requested the ability to complete their weekly workflows on mobile devices (phones and tablets), especially:
Additionally, some instructors may prefer to review activities and evaluations on mobile devices rather than a desktop browser.
At this moment, many pages rely on hard-coded pixel values, which causes layout issues, clutter, and poor usability on smaller screens.
Summary
Make Project Pulse fully mobile-friendly (responsive) for both student weekly workflows and instructor portal pages, without introducing new features or redesigning the system.
The goal is to ensure all core workflows are usable, readable, and functional on phones and tablets.
Target devices include modern smartphones and tablets in both portrait and landscape orientations.
Student Pages (Weekly Use)
The following student-facing pages should work well on mobile devices:
Instructor Portal Pages
The instructor portal should also be mobile-friendly:
Current Behavior
Proposed Improvement
Refactor existing layouts to be responsive and mobile-friendly.
UI / Layout
%,rem,em,vh/vwmax-width/min-widthinstead of fixed widthsScope Control
Non-Goals
Acceptance Criteria
Risks / Notes
Rationale
Students interact with Project Pulse weekly, often outside traditional desktop settings. Supporting mobile devices improves accessibility, compliance, and student satisfaction.
For instructors, mobile access enables quick review of activities and evaluations without requiring a desktop browser.
Addressing responsiveness now will reduce UI technical debt and improve long-term maintainability.
Tags
feature,enhancement,ui,responsive-design