Physician Portal & Mobile App Screen Requirements
Home / Portals & Mobile Apps / Physician Portal & Mobile App / Screen Requirements

Physician Portal & Mobile App Screen Requirements

Screen Inventory

Screen ID Screen Name Primary Actor(s) Workflow(s) Access Level
SCR-PHYSICIANPORTAL-001 Physician Dashboard / Home Physician, NP/PA, Nurse, CMO/Dept Head WF-PHY-001, WF-PHY-003, WF-PHY-004, WF-PHY-005, WF-PHY-006, WF-PHY-007, WF-PHY-008 Authenticated clinical users with portal account
SCR-PHYSICIANPORTAL-002 Patient Chart (Mobile) Physician, NP/PA, Nurse, Specialist Consultant WF-PHY-001, WF-PHY-002, WF-PHY-003, WF-PHY-006, WF-PHY-007, WF-PHY-008 Clinical users with patient-chart access
SCR-PHYSICIANPORTAL-003 Mobile Order Entry Physician, NP/PA, Specialist Consultant WF-PHY-002 Ordering providers only
SCR-PHYSICIANPORTAL-004 Results Review Physician, NP/PA, Nurse WF-PHY-001, WF-PHY-003, WF-PHY-008 Clinical users with result access
SCR-PHYSICIANPORTAL-005 Unified Inbox Physician, NP/PA, Nurse, CMO/Dept Head WF-PHY-003, WF-PHY-004, WF-PHY-008 Portal users with messaging/alerts permissions
SCR-PHYSICIANPORTAL-006 Schedule & Patient List Physician, NP/PA, CMO/Dept Head WF-PHY-001, WF-PHY-005, WF-PHY-007, WF-PHY-008 Providers with schedule access
SCR-PHYSICIANPORTAL-007 Clinical Handoff Physician WF-PHY-007 Providers with clinical_handoff permission
SCR-PHYSICIANPORTAL-008 Task List Physician, NP/PA, Nurse WF-PHY-008 Users with manage_tasks permission
SCR-PHYSICIANPORTAL-009 Mobile Documentation Physician, NP/PA, Specialist Consultant WF-PHY-006 Users with sign_notes permission
SCR-PHYSICIANPORTAL-010 Telehealth Consultation Physician, Specialist Consultant WF-PHY-001, WF-PHY-002, WF-PHY-006 Providers enabled for telehealth
flowchart LR A["Login / Biometric Unlock"] --> B["SCR-PHYSICIANPORTAL-001<br>Physician Dashboard"] B --> C["SCR-PHYSICIANPORTAL-006<br>Schedule & Patient List"] B --> D["SCR-PHYSICIANPORTAL-005<br>Unified Inbox"] B --> E["SCR-PHYSICIANPORTAL-008<br>Task List"] B --> F["SCR-PHYSICIANPORTAL-007<br>Clinical Handoff"] B --> G["Recent Patients → SCR-PHYSICIANPORTAL-002<br>Patient Chart"] B --> H["Telehealth Sessions → SCR-PHYSICIANPORTAL-010<br>Telehealth Consultation"] C --> G C --> F D --> G D --> E D --> F E --> G G --> I["Orders Tab → SCR-PHYSICIANPORTAL-003<br>Mobile Order Entry"] G --> J["Results Tab → SCR-PHYSICIANPORTAL-004<br>Results Review"] G --> K["Notes Tab → SCR-PHYSICIANPORTAL-009<br>Mobile Documentation"] G --> F I --> G J --> G K --> G H --> G H --> I H --> K subgraph Notifications / Deep Links N1["Push: New Result"] --> J N2["Push: New Message"] --> D N3["Push: Critical Alert"] --> J N4["Push: Task Due"] --> E N5["Push: Telehealth Starting"] --> H end

Screen Specifications

SCR-PHYSICIANPORTAL-001: Physician Dashboard / Home

Purpose

Mobile-optimized landing page summarizing today’s work: patient census, schedule, inbox, tasks, and critical alerts, with one-tap navigation into patient charts and workflows.

Field Specifications

Field Type Required Validation Default Notes
User Greeting (EN/AR) Display text Yes Uses authenticated user’s display name — E.g., “Dr. Ahmed Al-Maktoum” / “د. أحمد المكتوم”
Today’s Date Display text Yes Valid date System date Localized format (DD MMM YYYY)
Patient Census Count Integer display Yes ≥ 0 0 Count of active patients assigned to provider
Today’s Schedule List List of cards No Items must belong to user — From Scheduling; shows time, location, patient
Inbox Summary (by tab) Badge counts Yes ≥ 0 0 Unread patient messages, provider messages, system alerts, results
Pending Tasks Count Integer display Yes ≥ 0 0 From clinical_task_items where status != completed
Critical Alerts Panel List of alerts No Only critical severity — Sorted by urgency; red badge + text
Quick Actions Button group No — Configurable E.g., “Search Patient”, “Start Telehealth”, “Handoff”
Search Patient Input Text (autocomplete) No Min 2 chars to search Empty Search by name, MRN, Emirates ID
Filter: View Mode Segmented control Yes IN (Today, Week, All) Today Affects schedule and tasks
Offline Indicator Icon + text Yes — Hidden when online Shows when offline with last sync time

Validation Messages

Condition Message Severity
Search < 2 chars "Enter at least 2 characters to search patients." Info
No schedule items "No scheduled appointments or on-call duties for the selected period." Info
No assigned patients "No active patients currently assigned to you." Info
Backend error loading dashboard "Unable to load dashboard data. Please pull to refresh or try again later." Error
Offline mode "You are offline. Showing last-synced data only." Warning

Actions / Buttons

Action Description
Tap schedule item Opens Patient Chart (SCR-PHYSICIANPORTAL-002) for that encounter
Tap patient census card Opens filtered patient list in Schedule & Patient List (SCR-PHYSICIANPORTAL-006)
Tap inbox summary Opens Unified Inbox (SCR-PHYSICIANPORTAL-005) with corresponding tab selected
Tap pending tasks Opens Task List (SCR-PHYSICIANPORTAL-008)
Tap critical alert Opens Results Review (SCR-PHYSICIANPORTAL-004) or relevant detail screen
Quick Action: Search Patient Opens Patient Chart search mode (SCR-PHYSICIANPORTAL-002)
Quick Action: Handoff Opens Clinical Handoff (SCR-PHYSICIANPORTAL-007)
Quick Action: Telehealth Opens Telehealth Consultation (SCR-PHYSICIANPORTAL-010) if active session exists
Pull to refresh Reloads dashboard data from server

HTML Wireframe Mockup

Show HTML code
HTML
<div style="font-family: Arial, sans-serif; max-width: 420px; margin: 0 auto; border: 1px solid #ccc; border-radius: 8px; overflow: hidden;">
  <div style="background: #1a73e8; color: white; padding: 12px 16px;">
    <h3 style="margin: 0; font-size: 18px;">Physician Dashboard / Home</h3>
    <div style="font-size: 12px; opacity: 0.9;">Dr. Ahmed Al-Maktoum &nbsp;|&nbsp; 07 Feb 2026</div>
  </div>

  <div style="padding: 12px 16px; border-bottom: 1px solid #eee;">
    <input type="text" placeholder="Search patient by name / MRN / Emirates ID"
           style="width: 100%; padding: 8px; font-size: 13px; border-radius: 4px; border: 1px solid #ccc;" />
  </div>

  <div style="padding: 12px 16px; border-bottom: 1px solid #eee; display: flex; justify-content: space-between; font-size: 12px;">
    <div>
      <div style="font-weight: bold;">Patient Census</div>
      <div style="font-size: 20px; color: #1a73e8;">18</div>
    </div>
    <div>
      <div style="font-weight: bold;">Pending Tasks</div>
      <div style="font-size: 20px; color: #d93025;">7</div>
    </div>
    <div>
      <div style="font-weight: bold;">Critical Alerts</div>
      <div style="font-size: 20px; color: #d93025;">2</div>
    </div>
  </div>

  <div style="padding: 12px 16px; border-bottom: 1px solid #eee;">
    <div style="margin-bottom: 6px; font-weight: bold; font-size: 13px;">Today’s Schedule</div>
    <div style="max-height: 140px; overflow-y: auto;">
      <div style="padding: 8px; border-radius: 4px; border: 1px solid #eee; margin-bottom: 6px; font-size: 12px;">
        <div style="font-weight: bold;">09:00 – Outpatient Clinic</div>
        <div>Fatima Al-Nahyan (MRN 001234)</div>
        <div style="color: #666;">Dubai General Hospital – OPD 3</div>
      </div>
      <div style="padding: 8px; border-radius: 4px; border: 1px solid #eee; margin-bottom: 6px; font-size: 12px;">
        <div style="font-weight: bold;">11:30 – Inpatient Round</div>
        <div>Ward 5B – 6 patients</div>
        <div style="color: #666;">Abu Dhabi Medical Center</div>
      </div>
    </div>
  </div>

  <div style="padding: 12px 16px; border-bottom: 1px solid #eee;">
    <div style="margin-bottom: 6px; font-weight: bold; font-size: 13px;">Inbox</div>
    <div style="display: flex; justify-content: space-between; font-size: 12px;">
      <div>Patient Messages <span style="background:#d93025;color:#fff;border-radius:10px;padding:2px 6px;">4</span></div>
      <div>Provider <span style="background:#1a73e8;color:#fff;border-radius:10px;padding:2px 6px;">3</span></div>
      <div>Results <span style="background:#f9ab00;color:#000;border-radius:10px;padding:2px 6px;">2</span></div>
    </div>
  </div>

  <div style="padding: 12px 16px;">
    <div style="margin-bottom: 6px; font-weight: bold; font-size: 13px;">Quick Actions</div>
    <div style="display: flex; flex-wrap: wrap; gap: 8px;">
      <button style="flex:1; padding: 8px; font-size: 12px; border-radius: 4px; border: 1px solid #1a73e8; background:#1a73e8;color:#fff;">Search Patient</button>
      <button style="flex:1; padding: 8px; font-size: 12px; border-radius: 4px; border: 1px solid #1a73e8; background:#fff;color:#1a73e8;">Handoff</button>
      <button style="flex:1; padding: 8px; font-size: 12px; border-radius: 4px; border: 1px solid #1a73e8; background:#fff;color:#1a73e8;">Telehealth</button>
    </div>
  </div>
</div>

Accessibility (WCAG 2.1 AA)

  • All actionable elements (cards, buttons) are reachable via keyboard (Tab/Shift+Tab) with visible focus.
  • Summary counts include text labels; colour is not the only indicator.
  • Live updates (e.g., new alerts) announced via aria-live="polite" region.
  • Search input has aria-label in both English and Arabic depending on UI language.
  • Touch targets at least 44x44 px on mobile.

Responsive / Mobile

  • Primary design is mobile-first (single-column). On tablets/web, dashboard may show two-column layout (schedule + inbox side-by-side).
  • Cards stack vertically on small screens; scrollable sections for schedule and inbox.
  • Offline indicator pinned to top on mobile when offline.
  • Supports both portrait and landscape; in landscape, more schedule items visible per screen.

SCR-PHYSICIANPORTAL-002: Patient Chart (Mobile)

Purpose

Provide a concise, swipeable view of the patient’s clinical information (demographics, allergies, problems, meds, vitals, results, notes, orders, care team) optimized for mobile and offline access to key data.

Field Specifications

Field Type Required Validation Default Notes
Patient Banner Composite display Yes Patient must be authorized for user — See Patient Banner pattern
Section Tabs Tab bar Yes IN (Summary, Meds, Results, Notes, Orders, Vitals, Care Team) Summary Swipe or tap to change
Allergies List List No — — From patient_allergies
Problems List List No — — From patient_problems (ICD-10-AM/SNOMED)
Medications List List No — — Current meds + last administration
Recent Results List + sparkline No — — Last N lab/imaging results
Vitals Timeline Chart/list No — — Last 24–72 hours
Notes List List No — — Recent clinical notes with type and author
Orders List List No — — Active orders summary
Care Team List No — — Assigned providers and roles
Offline Cache Indicator Icon/text Yes — Hidden when online Shows which sections are cached

Validation Messages

Condition Message Severity
User lacks access to patient "You do not have permission to view this patient’s chart." Error
Patient not found "No patient found with the provided identifier." Error
Section data load failure "Unable to load [section name]. Pull to refresh or try again." Error
Offline and section not cached "This section is not available offline. Connect to the network to view." Warning

Actions / Buttons

Action Description
Tap patient banner Shows full demographics and identifiers
Tap medication Opens detailed medication view (within chart)
Tap result Opens Results Review (SCR-PHYSICIANPORTAL-004) focused on that test
Tap note Opens note detail; if author and unsigned, can edit in Mobile Documentation
Tap order Opens order detail; if provider, can modify via Mobile Order Entry
Floating “+ Order” button Opens Mobile Order Entry (SCR-PHYSICIANPORTAL-003)
Floating “+ Note” button Opens Mobile Documentation (SCR-PHYSICIANPORTAL-009)
Swipe left/right Navigates between sections (Summary → Meds → Results, etc.)

HTML Wireframe Mockup

Show HTML code
HTML
<div style="font-family: Arial, sans-serif; max-width: 420px; margin: 0 auto; border: 1px solid #ccc; border-radius: 8px; overflow: hidden; position: relative;">
  <!-- Patient Banner -->
  <div style="background:#f0f4f8; padding:10px 12px; border-bottom:1px solid #ddd;">
    <div style="font-weight:bold; font-size:14px;">Fatima Al-Nahyan &nbsp;|&nbsp; MRN 000567</div>
    <div style="font-size:12px; color:#555;">DOB 12 Mar 1985 &nbsp;•&nbsp; F &nbsp;•&nbsp; 784-1985-1234567-1</div>
    <div style="font-size:12px; color:#d93025; margin-top:4px;">Allergies: Penicillin</div>
  </div>

  <!-- Section Tabs -->
  <div style="display:flex; overflow-x:auto; border-bottom:1px solid #eee; background:#fff;">
    <button style="flex:1; padding:8px; font-size:12px; border:none; border-bottom:2px solid #1a73e8; background:#fff;">Summary</button>
    <button style="flex:1; padding:8px; font-size:12px; border:none; border-bottom:2px solid transparent; background:#fff;">Meds</button>
    <button style="flex:1; padding:8px; font-size:12px; border:none; border-bottom:2px solid transparent; background:#fff;">Results</button>
    <button style="flex:1; padding:8px; font-size:12px; border:none; border-bottom:2px solid transparent; background:#fff;">Notes</button>
  </div>

  <!-- Summary Section -->
  <div style="padding:10px 12px; max-height: 320px; overflow-y:auto;">
    <div style="margin-bottom:8px;">
      <div style="font-weight:bold; font-size:13px;">Active Problems</div>
      <ul style="margin:4px 0 0 16px; font-size:12px;">
        <li>Type 2 diabetes mellitus (ICD-10-AM E11.9)</li>
        <li>Hypertension (ICD-10-AM I10)</li>
      </ul>
    </div>

    <div style="margin-bottom:8px;">
      <div style="font-weight:bold; font-size:13px;">Current Medications</div>
      <div style="font-size:12px;">
        Metformin 500 mg PO BID<br/>
        Amlodipine 5 mg PO OD
      </div>
    </div>

    <div style="margin-bottom:8px;">
      <div style="font-weight:bold; font-size:13px;">Recent Vitals</div>
      <div style="font-size:12px;">
        BP 130/80 mmHg (08:00)<br/>
        HR 78 bpm (08:00)<br/>
        Temp 36.8 °C (08:00)
      </div>
    </div>

    <div>
      <div style="font-weight:bold; font-size:13px;">Recent Results</div>
      <div style="font-size:12px;">
        HbA1c 7.2% (High) – 06 Feb 2026<br/>
        Creatinine 80 µmol/L – 06 Feb 2026
      </div>
    </div>
  </div>

  <!-- Floating Action Buttons -->
  <div style="position:absolute; bottom:12px; right:12px; display:flex; flex-direction:column; gap:6px;">
    <button style="padding:8px 10px; font-size:12px; border-radius:20px; border:none; background:#1a73e8; color:#fff;">+ Order</button>
    <button style="padding:8px 10px; font-size:12px; border-radius:20px; border:none; background:#34a853; color:#fff;">+ Note</button>
  </div>
</div>

Accessibility

  • Tabs implemented with proper ARIA roles (role="tablist", role="tab", aria-selected).
  • Patient banner fields have text labels for screen readers (e.g., “Name”, “MRN”, “Emirates ID”).
  • Floating buttons have descriptive aria-label attributes (“Add order for this patient”).
  • High contrast between text and background; avoid relying solely on colour for abnormal results (include “High”, “Low” text).

Responsive / Mobile

  • Single-column layout on phones; on tablets, tabs may show more labels and two-column content (e.g., problems + meds side-by-side).
  • Sections lazily load when selected to reduce bandwidth.
  • Offline-cached sections marked with an icon; tapping shows last sync time.

SCR-PHYSICIANPORTAL-003: Mobile Order Entry

Purpose

Allow providers to quickly enter and sign orders (medications, labs, imaging, consults, etc.) from mobile devices, leveraging favorites and order sets, with inline CDS alerts.

Field Specifications

Field Type Required Validation Default Notes
Order Type Selector Segmented control Yes IN (Medication, Lab, Imaging, Consult, Nursing, Diet) Medication Determines available catalogs
Favorites List List of chips/cards No — Provider’s favorites From physician_favorites
Order Search Text (autocomplete) Yes Min 3 chars Empty Searches relevant catalog
Selected Order Display card Yes Must be valid catalog item — Shows name, category, common details
Order Details Panel Dynamic form Yes Field-level validations per order type — E.g., dose, frequency, priority
CDS Alerts Summary Badge + text No — Hidden if none Shows count and severity
Sign Button Button Yes Disabled until required fields valid — Triggers order submission
Save as Draft Button No — — Saves locally or server-side as draft
Priority Dropdown Yes IN (STAT, Urgent, Routine, Scheduled) Routine Required for all orders
Comments / Clinical Indication Textarea Recommended Max 500 chars Empty For labs/imaging, may be required by policy

Validation Messages

Condition Message Severity
Order type not selected "Select an order type to continue." Error
Search < 3 chars "Enter at least 3 characters to search orders." Info
No matching orders "No orders found. Check spelling or change order type." Warning
Required detail missing "Please complete all required fields before signing." Error
CDS hard-stop "This order cannot be placed due to a safety rule: [rule description]." Error
Offline when signing "Cannot sign orders while offline. Save as draft and retry when online." Error
Telehealth + restricted order (if applicable) "This order type is restricted during telehealth encounters." Error

Actions / Buttons

Action Description
Tap favorite Pre-populates order details for that favorite
Select order from search Loads order details panel for configuration
Sign Validates, runs CDS, and submits order to CPOE; returns to Patient Chart
Save as Draft Saves order in draft state linked to encounter; visible in Task List
Cancel Discards unsaved changes and returns to Patient Chart

HTML Wireframe Mockup

Show HTML code
HTML
<div style="font-family: Arial, sans-serif; max-width: 420px; margin: 0 auto; border:1px solid #ccc; border-radius:8px; overflow:hidden;">
  <div style="background:#1a73e8; color:#fff; padding:10px 12px;">
    <h3 style="margin:0; font-size:16px;">Mobile Order Entry</h3>
    <div style="font-size:12px; opacity:0.9;">Patient: Fatima Al-Nahyan (MRN 000567)</div>
  </div>

  <div style="padding:10px 12px; border-bottom:1px solid #eee;">
    <div style="font-size:12px; margin-bottom:4px;">Order Type</div>
    <div style="display:flex; gap:4px;">
      <button style="flex:1; padding:6px; font-size:12px; border-radius:16px; border:1px solid #1a73e8; background:#1a73e8; color:#fff;">Medication</button>
      <button style="flex:1; padding:6px; font-size:12px; border-radius:16px; border:1px solid #ccc; background:#fff;">Lab</button>
      <button style="flex:1; padding:6px; font-size:12px; border-radius:16px; border:1px solid #ccc; background:#fff;">Imaging</button>
    </div>
  </div>

  <div style="padding:10px 12px; border-bottom:1px solid #eee;">
    <div style="font-size:12px; margin-bottom:4px;">Favorites</div>
    <div style="display:flex; flex-wrap:wrap; gap:6px; font-size:11px;">
      <span style="padding:4px 8px; border-radius:12px; border:1px solid #1a73e8; background:#e8f0fe;">CBC STAT</span>
      <span style="padding:4px 8px; border-radius:12px; border:1px solid #1a73e8; background:#e8f0fe;">CXR PA/LAT</span>
      <span style="padding:4px 8px; border-radius:12px; border:1px solid #1a73e8; background:#e8f0fe;">Metformin 500 mg BID</span>
    </div>
  </div>

  <div style="padding:10px 12px; border-bottom:1px solid #eee;">
    <input type="text" placeholder="Search orders..."
           style="width:100%; padding:8px; font-size:13px; border-radius:4px; border:1px solid #ccc;" />
  </div>

  <div style="padding:10px 12px; max-height:220px; overflow-y:auto;">
    <div style="font-weight:bold; font-size:13px; margin-bottom:6px;">Selected: Metformin 500 mg tablet</div>
    <div style="display:flex; gap:8px; margin-bottom:6px; font-size:12px;">
      <div style="flex:1;">
        <label style="display:block; font-size:11px;">Dose</label>
        <input type="number" value="500" style="width:100%; padding:6px; font-size:12px; border-radius:4px; border:1px solid #ccc;" />
      </div>
      <div style="flex:1;">
        <label style="display:block; font-size:11px;">Unit</label>
        <select style="width:100%; padding:6px; font-size:12px; border-radius:4px; border:1px solid #ccc;">
          <option>mg</option>
        </select>
      </div>
    </div>

    <div style="display:flex; gap:8px; margin-bottom:6px; font-size:12px;">
      <div style="flex:1;">
        <label style="display:block; font-size:11px;">Frequency</label>
        <select style="width:100%; padding:6px; font-size:12px; border-radius:4px; border:1px solid #ccc;">
          <option>BID</option>
          <option>OD</option>
        </select>
      </div>
      <div style="flex:1;">
        <label style="display:block; font-size:11px;">Priority</label>
        <select style="width:100%; padding:6px; font-size:12px; border-radius:4px; border:1px solid #ccc;">
          <option>Routine</option>
          <option>STAT</option>
        </select>
      </div>
    </div>

    <div style="margin-bottom:6px; font-size:12px;">
      <label style="display:block; font-size:11px;">Clinical Indication</label>
      <textarea rows="2" style="width:100%; padding:6px; font-size:12px; border-radius:4px; border:1px solid #ccc;">Type 2 diabetes mellitus</textarea>
    </div>

    <div style="font-size:11px; color:#d93025; margin-top:4px;">
      CDS: No major interactions. Renal function last checked 06 Feb 2026.
    </div>
  </div>

  <div style="padding:10px 12px; border-top:1px solid #eee; display:flex; justify-content:flex-end; gap:8px;">
    <button style="padding:8px 10px; font-size:12px; border-radius:4px; border:1px solid #ccc; background:#fff;">Draft</button>
    <button style="padding:8px 10px; font-size:12px; border-radius:4px; border:none; background:#1a73e8; color:#fff;">Sign</button>
  </div>
</div>

Accessibility

  • All form fields have <label> elements; error messages linked via aria-describedby.
  • CDS summary announced via aria-live="polite" when updated.
  • Segmented control for order type implemented with radio buttons for keyboard/screen reader compatibility.
  • Large touch targets for favorites and buttons.

Responsive / Mobile

  • Single-column layout on phones; on tablets, favorites may appear in a left column and details on the right.
  • Virtual keyboard does not obscure Sign button; screen scrolls appropriately.
  • Voice dictation integration (where supported by device) accessible via OS keyboard microphone.

SCR-PHYSICIANPORTAL-004: Results Review

Purpose

Enable clinicians to review lab and imaging results, focus on abnormal/critical values, acknowledge results (including critical results for compliance), and take follow-up actions.

Field Specifications

Field Type Required Validation Default Notes
Result List List/table Yes — — Grouped by date/test type
Abnormal Filter Toggle No Boolean On When on, shows abnormal/critical first
Result Type Filter Dropdown No IN (All, Labs, Imaging, Other) All Optional
Trend Chart Mini chart No — — For numeric lab values
Reference Ranges Text Yes — — From LOINC/test master
Acknowledge Button Button Conditional Required for critical results — Logs acknowledgment
Action Dropdown Dropdown No IN (Order follow-up test, Message patient, Message provider, Add task) — Creates linked actions
Acknowledgment Note Textarea Conditional Required if policy demands note Empty For critical results

Validation Messages

Condition Message Severity
No results available "No results available for the selected filters." Info
Critical result not acknowledged "Critical results must be acknowledged." Error
Action selected but not completed "Complete the selected action or clear it before leaving this screen." Warning
Backend error loading results "Unable to load results. Pull to refresh or try again later." Error

Actions / Buttons

Action Description
Tap result row Expands to show details, trend, reference range
Toggle Abnormal filter Re-sorts list to show abnormal/critical first
Acknowledge Records timestamp, user, and optional note; updates compliance logs
Select action (e.g., Add task) Opens inline mini-form to configure task/message/order
Swipe result (mobile) Quick actions: Acknowledge, Add task

Accessibility

  • Results list uses table semantics with headers for screen readers.
  • Critical results indicated by icon + text (“Critical”) not colour alone.
  • Acknowledge button labelled with result name for screen readers (e.g., “Acknowledge potassium result”).

Responsive / Mobile

  • On phones, result rows collapse into cards; tapping expands details.
  • Trend charts simplified to small sparklines; full chart accessible via tap.
  • Filters accessible via collapsible panel at top.

SCR-PHYSICIANPORTAL-005: Unified Inbox

Purpose

Provide a single, mobile-friendly inbox for patient messages, provider messages, system alerts, and result notifications, with swipe actions and delegation.

Field Specifications

Field Type Required Validation Default Notes
Inbox Tabs Tab bar Yes IN (Patient, Provider, System, Results) Patient Filters items by type
Message List List Yes — — From physician_inbox_items
Priority Badge Badge No IN (Low, Normal, High, Critical) Normal Colour + text
Status Text/badge Yes IN (Unread, Read, Actioned, Delegated) Unread
Search Messages Text No — Empty Search by patient, subject, sender
Filter: Assigned To Dropdown No IN (Me, My Team, All) Me For delegation
Action Buttons Buttons No — — Reply, Forward, Mark as done, Delegate
Compose Area Textarea Conditional Required when replying Empty For responses

Validation Messages

Condition Message Severity
No messages in tab "No items in this inbox tab." Info
Reply text empty "Message body is required to send a reply." Error
Delegate without recipient "Select a recipient to delegate this message." Error

Actions / Buttons

Action Description
Tap message Opens message detail with full thread and context
Swipe left/right (mobile) Quick actions: Mark as read, Add task, Delegate
Reply Opens compose area; sends response and logs to patient chart if patient-related
Forward Sends to another provider with optional note
Delegate Assigns to another user (e.g., nurse) and updates status to Delegated
Mark as done Sets status to Actioned and removes from primary view

Accessibility

  • Tabs and list items keyboard-navigable; swipe actions also available via long-press menu for non-swipe users.
  • Message subject and priority read out by screen readers.
  • Clear focus states and sufficient contrast for badges.

Responsive / Mobile

  • Mobile-first list layout; on tablets/web, message list on left and detail pane on right.
  • Compose area overlays bottom of screen on phones for easier typing.

SCR-PHYSICIANPORTAL-006: Schedule & Patient List

Purpose

Show provider’s daily/weekly schedule, clinic patients, inpatient census, on-call schedule, and manage swap requests and availability.

Field Specifications

Field Type Required Validation Default Notes
View Toggle Segmented control Yes IN (Day, Week) Day
Date Picker Date selector Yes Valid date Today
Daily Schedule List No Items must belong to provider — Appointments, surgeries, on-call
Clinic Patients List No — — For selected clinic session
Inpatient Census List No — — Assigned inpatients
On-call Schedule List No — — From Scheduling
Swap Requests List No — — Pending swaps
Availability Status Dropdown No IN (Available, Busy, In procedure, Off-duty) Available

Validation Messages

Condition Message Severity
No schedule items "No scheduled items for the selected date." Info
Swap request accept error "Unable to process swap request. Please try again or contact scheduling." Error

Actions / Buttons

Action Description
Tap schedule item Opens Patient Chart (if patient-related) or details
Change availability Updates provider status for messaging/on-call displays
Accept/decline swap Updates scheduling system and notifies other provider

Accessibility

  • Lists and controls keyboard accessible; status changes announced via aria-live.
  • Date picker has accessible labels and supports manual input.

Responsive / Mobile

  • On phones, schedule and patient lists are separate sections with collapsible headers.
  • On tablets, schedule on left and patient list on right for selected session.

SCR-PHYSICIANPORTAL-007: Clinical Handoff

Purpose

Support structured I-PASS handoffs between outgoing and incoming physicians, with patient lists, active issues, pending items, and acknowledgment tracking.

Field Specifications

Field Type Required Validation Default Notes
Patient List List Yes — — Patients included in handoff
I-PASS Fields Textareas/inputs Yes — — Illness severity, Patient summary, Action list, Situation awareness, Contingency plan
Active Issues Text Yes — — Key problems
Pending Items Text Yes — — Pending tests, consults
Accept Handoff Button Button Conditional Incoming provider only — Records acknowledgment
Handoff Status Badge Yes IN (Draft, Sent, Acknowledged, Archived) Draft

Validation Messages

Condition Message Severity
Required I-PASS field empty on send "Complete all required I-PASS fields before sending handoff." Error
Accept without review (if policy requires) "Scroll through all patients before accepting handoff." Warning (configurable)

Actions / Buttons

Action Description
Outgoing: Send Handoff Locks content and sends to incoming provider
Incoming: Accept Handoff Marks acknowledged and logs timestamp
Add/remove patient Adjusts patient list before sending (outgoing only)

Accessibility

  • I-PASS sections clearly labelled; headings used for navigation.
  • Handoff status announced to screen readers.

Responsive / Mobile

  • Patient list collapsible; each patient card expands to show I-PASS details.
  • On tablets, patient list on left, selected patient I-PASS on right.

SCR-PHYSICIANPORTAL-008: Task List

Purpose

Provide a unified, sortable, and filterable list of clinical tasks (auto-generated and manual), with delegation and completion workflows.

Field Specifications

Field Type Required Validation Default Notes
Task List List Yes — — From clinical_task_items
Priority Sort Dropdown No IN (By priority, By due time, By patient) By priority
Filters Chips/toggles No IN (All, Today, Overdue, Delegated) Today
Due Date/Time Display Yes — — From due_datetime
Patient Link Button/text No — — Opens Patient Chart
Complete Button Button No — — Marks task completed
Delegate Button Button No Requires recipient — Assigns task to another user
Add Task Button + form No Description required — Creates manual task

Validation Messages

Condition Message Severity
Add task without description "Task description is required." Error
Delegate without recipient "Select a user to delegate this task." Error

Actions / Buttons

Action Description
Tap task Opens detail view with full description and history
Complete Sets status to completed and logs timestamp
Delegate Opens user picker; reassigns task
Add Task Opens mini-form to create new task linked to patient (optional)

Accessibility

  • Task priority indicated by icon + text (“High priority”) for screen readers.
  • Overdue tasks announced with additional text (“Overdue”).

Responsive / Mobile

  • Compact list on phones; on tablets, filters pinned to left and tasks on right.
  • Swipe actions for complete/delegate on mobile.

SCR-PHYSICIANPORTAL-009: Mobile Documentation

Purpose

Allow providers to create, edit, and sign clinical notes (progress notes, brief updates, procedure notes) using mobile-optimized templates and voice dictation.

Field Specifications

Field Type Required Validation Default Notes
Note Type Selector Dropdown Yes IN (Progress, Brief update, Procedure, Consult) —
Template Selector Dropdown No Must be valid template — From mobile note templates master
Voice Dictation Button Button No Device must support — Starts/stops dictation
Auto-populated Fields Read-only text No — — Vitals, meds, labs, etc.
Note Body Rich textarea Yes Min length (configurable) Empty Main content
Save Draft Button No — — Saves note as draft
Sign Button Button Yes Disabled until required fields valid — Finalizes note

Validation Messages

Condition Message Severity
Note type not selected "Select a note type." Error
Note body too short "Add more detail to the note before signing." Warning/Error (configurable)
Attempt to sign offline "Cannot sign notes while offline. Save as draft and sign when online." Error

Actions / Buttons

Action Description
Select template Pre-populates note structure and headings
Voice dictation Inserts transcribed text at cursor position
Save Draft Saves note in draft state; visible in Task List
Sign Applies e-signature and sends note to EHR

Accessibility

  • Note body supports screen reader navigation by headings (if template uses headings).
  • Dictation button labelled clearly; alternative text entry always available.

Responsive / Mobile

  • Full-screen editor on phones; header with patient banner collapsible.
  • On tablets, note editor and reference panel (e.g., recent labs) can be side-by-side.

SCR-PHYSICIANPORTAL-010: Telehealth Consultation

Purpose

Provide a split-screen interface for video consultation, patient chart sidebar, inline order entry, and concurrent documentation during remote visits.

Field Specifications

Field Type Required Validation Default Notes
Video Interface Video component Yes Requires camera/mic permissions — Uses platform SDK
Patient Chart Sidebar Panel Yes — — Key summary from Patient Chart
Order Entry Panel Collapsible panel No Same validations as Mobile Order Entry Collapsed For telehealth-safe orders
Note Entry Textarea No — Empty For brief visit note
End Visit Button Button Yes — — Ends session and logs duration

Validation Messages

Condition Message Severity
Camera/mic permission denied "Camera and microphone access are required for telehealth consultation." Error
Network quality poor "Network quality is low. Video may be degraded." Warning

Actions / Buttons

Action Description
Start/Join session Connects provider to telehealth room
End Visit Ends call, logs encounter end time, and prompts to complete documentation
Open Order Entry Opens Mobile Order Entry panel scoped to telehealth-safe orders
Open Note Entry Opens Mobile Documentation panel for quick note

Accessibility

  • Video controls (mute, camera, end) keyboard accessible and labelled.
  • Provide captions or chat for patients with hearing impairment where integrated.

Responsive / Mobile

  • On phones, video takes top half, chart/controls bottom half; can toggle full-screen video.
  • On tablets, side-by-side layout: video on left, chart + orders/notes on right.

Common UI Patterns

Patient Banner

Usage

Displayed at the top of all clinical screens (Patient Chart, Order Entry, Results Review, Documentation, Telehealth).

Fields

  • Patient full name (Arabic + English if available)
  • MRN
  • Emirates ID (784-YYYY-NNNNNNN-C format)
  • DOB, age, sex
  • Location (facility, ward/clinic, bed)
  • Allergies summary (e.g., “No known allergies” or list)
  • Key alerts (e.g., isolation, fall risk) as icons + text

Validation

  • Emirates ID formatted as 784-YYYY-NNNNNNN-C; if invalid, show: “Emirates ID format must be 784-YYYY-NNNNNNN-C.”

Accessibility

  • Each field labelled for screen readers.
  • Icons accompanied by text (e.g., “Isolation precautions”).

Search Components

Patterns

  • Global patient search (Dashboard, Patient Chart entry)
  • Message search (Unified Inbox)
  • Order search (Mobile Order Entry)

Common Rules

  • Minimum characters: 2 for patients/messages, 3 for orders.
  • Debounce: 300–500 ms before sending query.
  • Show “No results found” with guidance.
  • Support Arabic and English names; search should be tolerant of transliteration differences where possible.

Accessibility

  • aria-label describing search purpose in current language.
  • Clear indication when search is in progress (spinner with aria-live).

Alert / Notification Patterns

Types

  • Critical clinical alerts (results, patient safety)
  • System alerts (downtime, maintenance)
  • Inbox notifications (new messages)
  • Task reminders

Visual

  • Use consistent colour coding: red (critical), amber (warning), blue (info), green (success) with text labels.
  • Badges show counts; tooltips or labels describe alert.

Behaviour

  • Push notifications via APNS/FCM deep-link into relevant screen.
  • In-app banners appear at top and can be dismissed.
  • Critical alerts require explicit acknowledgment where clinically required.

Accessibility

  • Alerts announced via aria-live="assertive" for critical, polite for others.
  • Do not rely solely on colour; include icon and text.

Loading States

Patterns

  • Skeleton loaders for lists (schedule, inbox, results).
  • Spinners for blocking operations (signing orders, joining telehealth).

Messages

  • “Loading [section name]…” with retry option on failure.
  • Timeouts show error with “Try again” button.

Accessibility

  • Loading indicators labelled for screen readers.
  • Avoid infinite spinners without feedback; show progress or timeout message.

Arabic/English Bilingual UI Considerations

Language Support

  • All screens must support English and Arabic labels, messages, and buttons.
  • User preference stored in physician_preferences (e.g., ui_language).

Layout

  • English: Left-to-right (LTR).
  • Arabic: Right-to-left (RTL) with mirrored layouts:
  • Navigation bars, tabs, and back buttons mirrored.
  • Patient banner fields order adjusted for readability.

Text

  • Use Unicode-compliant fonts that render Arabic clearly.
  • Ensure truncation does not break Arabic words incorrectly; prefer wrapping.

Accessibility

  • lang attribute set appropriately (en or ar) for screen readers.
  • Screen reader announcements respect language of content.
← Previous Physician Portal & Mobile App Data Specifications Next → Physician Portal & Mobile App Integration Specifications
content/portals/physician-portal/04-screen-requirements.md Generated 2026-02-20 22:54