# Ordio Mobile App – Diagrams

**Last Updated:** 2026-02-02

Architecture, navigation, and user journey diagrams for the Ordio Mitarbeiter-App.

## App Architecture (high level)

```mermaid
flowchart LR
  subgraph app [Mitarbeiter-App]
    Login[Login]
    Dashboard[Dashboard]
    Schichten[Schichtplanung]
    Zeit[Zeiterfassung]
    Abw[Abwesenheiten]
    Profile[Profile]
    Menu[Menu]
  end
  subgraph backend [Ordio Backend]
    API[API]
    Sync[Sync]
  end
  Login --> Dashboard
  Dashboard --> Schichten
  Dashboard --> Zeit
  Dashboard --> Abw
  Dashboard --> Menu
  Menu --> Profile
  app --> API
  API --> Sync
```

## Navigation Flow (main areas)

```mermaid
flowchart TD
  Start([App Open]) --> Login[Login]
  Login --> Dashboard[Dashboard]
  Dashboard --> Schichten[Schichten / Calendar]
  Dashboard --> Zeiterfassung[Zeiterfassung]
  Dashboard --> Abwesenheiten[Abwesenheiten]
  Dashboard --> Menu[Menu]
  Menu --> Profile[Profile]
  Menu --> ShiftApps[Shift Applications]
  Menu --> Checklists[Checklists]
  Menu --> Documents[Documents]
  Schichten --> ShiftDetail[Shift Detail]
  Zeiterfassung --> Starten[Starten / Beenden]
  Abwesenheiten --> Request[Request Absence]
```

## Feature Relationships

```mermaid
flowchart LR
  subgraph core [Core]
    Schichtplanung[Schichtplanung]
    Zeiterfassung[Zeiterfassung]
    Abwesenheiten[Abwesenheiten]
  end
  subgraph mobile [Mobile App]
    Shifts[View Shifts]
    Clock[Clock In/Out]
    Absence[Request Absence]
    Apps[Shift Applications]
    Checklist[Checklists]
    Docs[Documents]
  end
  Schichtplanung --> Shifts
  Schichtplanung --> Apps
  Zeiterfassung --> Clock
  Abwesenheiten --> Absence
  Shifts --> Apps
  mobile --> core
```

## User Journey: Time Tracking

```mermaid
sequenceDiagram
  participant U as User
  participant App as Mitarbeiter-App
  participant API as Ordio Backend
  U->>App: Open app, go to Zeiterfassung
  U->>App: Tap Starten
  App->>API: Clock in
  API-->>App: OK
  App-->>U: Show "Arbeit gestartet"
  U->>App: Tap Beenden (end of shift)
  App->>API: Clock out
  API-->>App: OK
  App-->>U: Show time entry
```

## User Journey: Absence Request

```mermaid
sequenceDiagram
  participant U as User
  participant App as Mitarbeiter-App
  participant API as Ordio Backend
  U->>App: Open Abwesenheiten
  U->>App: Submit request (dates, type)
  App->>API: Create absence request
  API-->>App: OK
  App-->>U: Show "Request submitted"
  Note over API: Manager approves/rejects
  API-->>App: Push notification
  App-->>U: Notify user of decision
```

## Screenshot Organization (by feature area)

Screens are grouped by `feature_area` from analysis. Current structure (mock analysis: all `other`):

- **other:** 90 screens (sequence 0–89)

After full AI analysis, expected areas: login, dashboard, schichtplanung, zeiterfassung, abwesenheiten, profile, settings, checklists, documents, shift_applications.

## Related Documentation

- [mobile-app-documentation.md](mobile-app-documentation.md) – Main mobile app documentation
- [mobile-app-screens.md](mobile-app-screens.md) – Screen-by-screen list
- [mobile-app-navigation.md](mobile-app-navigation.md) – Navigation flows