dataset
Prototype Spec v2.8 MotorSignal UI Engineering Package Design Mockups — Non-Verified Backend

Consolidated Mobile Flows & Architecture Handoff

Target Frame: 390 × 844 CSS px Touch Target Minimum: ≥48×48dp

Core Remaining Screen Flows (Default Viewports)

High-fidelity 390×844 prototype viewports with persistent 6-destination navigation and explicit sample-data notation.

Frames 1–3 of 3
1. Community Feed & Moderation Social > Feed
09:41
signal_cellular_alt wifi battery_full
Social Network Sample Data
AM
@ApexMarcus PRO
Bay Area Twisty Club • 2h ago

Sunday Skyline & Pescadero Carve

Clean coastal run before fog rolled into Pescadero. 2024 Ducati Streetfighter V4 feeling dialed on new rubber.

Distance

68.4 MI

Peak Lean

51° R

Duration

1h 14m

flag Flagged by Community Review
speed

Aggressive Speed Content Hidden

Public highway speed exceeded community safety guideline (+40% above zone speed ceiling). GPS telemetry map blurred.

Proposed Flow: Pack Live Beacon

Broadcast real-time pack proximity during scheduled weekend group rides.

Requires field connectivity testing before production release.
2. Two-Step Create Group Ride Step 1 of 2
09:42
signal_cellular_alt wifi battery_full

Create Group Ride

STEP 1: LOGISTICS & ROUTE
1/2
Skyline Blvd → Hwy 84
68.4 MI Calculated

Pescadero Coastal Loop

Elevation: +2,140 ft • Est. 1h 45m

pin_drop
qr_code_2

Next Step: Join Code & Invites

Step 2 generates your pack join code (#SKY92) and shareable QR code.

3. Account, Security & Sensors Truthful States
09:43
signal_cellular_alt wifi battery_full
Account & System
Build 2.8.4
B

Bill Ponders

bponders12@gmail.com

Tier: MotorSignal Free Active

Standard GPS logging, local ride archives, and public feed access. Multi-sensor telemetry sync requires Pro subscription.

Sensor Connections 1 Active • 1 Disconnected
smartphone

Internal Phone IMU

Active (100Hz Gyro / Accel)

Online
bluetooth_searching

External Bike IMU Sensor

Disconnected • No Paired BLE

Account Security
security

Two-Factor Authentication (2FA)

Status: Disabled (Not Configured)

Protect cloud session telemetry and garage specs with TOTP authenticator or hardware passkeys.

Telemetry Sync Scope Proposed Protocol

Automatic synchronization is a proposed background service pending device battery and bandwidth testing. Deletions distinguish between local cache vs. cloud archive purge.

Interactive Modal Architecture & System Dialogs

Specifications for Share Ride recipient selection, scoped deletion confirmation, and network fallback states.

share

Share Telemetry Replay

Recipient Selection

Select specific riders, pack channels, or external platforms to dispatch session telemetry.

delete_forever

Delete Ride Session

Scoped Purge

Specify deletion scope. Do not assume cloud records are automatically expunged when clearing phone storage.

cloud_download

Data Pipeline Protocol

Architecture Note
1. File Download Stage

When replaying a cloud ride, client fetches the complete binary `.pb` or SQLite session record before parsing. Not live video-style streaming.

2. Local Memory Buffering

"100% Buffered" indicator denotes in-memory decompression of 100Hz IMU vectors to prevent scrubbing stutter.

3. Proposed Auto-Sync Rule

Automatic background sync is documented as proposed UX pending validation of operating system background execution limits.

Edge & Exception States Matrix

Comprehensive fallback patterns for loading, empty filters, network error, offline queueing, and permission denial.

progress_activity

Loading Telemetry

Downloading session binary (14.2 MB) from encrypted cloud store...

State: Downloading
filter_alt_off

No Rides Found

No telemetry recorded for "Track Mode" under selected date filter.

State: Empty
cloud_off

Sync Failure

Cloud handshake timed out. Remote server unreachable.

State: Error
save

Offline Queued

2 rides stored locally in SQLite database cache pending uplink.

Auto-sync Proposed State: Queued
location_disabled

Location Denied

Precise background GPS permission required for route telemetry.

State: Denied

Consolidated Design Tokens & Multi-Platform Handoff

Authoritative token values, component patterns, and platform safe-area implementation contracts.

palette Semantic Color Architecture

Canvas Surface #0B1326
Card Primary #111C38
Card Secondary #17223B
Border / Stroke #2A3652
Brand Cyan Accent #06B6D4
Active Recording (REC) #10B981
Caution / Pause Ride #F59E0B
Danger / Scoped Delete #EF4444

touch_app Touch Targets & Type Hierarchy

Standard Interactive Minimum:

48px × 48px CSS / Flutter Logical Pixels

Enforced on all list items, segmented tabs, menu dots, and header navigation buttons.

Primary Riding Controls:

56px–64px Target Height

Pinned Pause and Finish Ride actions maximize hit-area under motorcycle vibration.

Typography Stack:
  • Speed Hero: 72px JetBrains Mono bold
  • Metrics: 16–24px JetBrains Mono bold
  • Headings: 14–18px Inter bold
  • Labels/Captions: 10–12px Inter medium

devices Platform Safe Areas & Implementation

Flutter Implementation:

Use SafeArea(top: true, bottom: true) or query MediaQuery.of(context).padding for Notch, Dynamic Island, and gesture bar clearances.

Web / PWA Implementation:

Apply env(safe-area-inset-top) to sticky app bars and env(safe-area-inset-bottom) to fixed navigation sheets.

Map Overlay Separation Goal:

Top-right map controls vs. bottom telemetry is designated as a layout goal pending physical multi-device testing across varied screen aspect ratios.