GFS Design System — Mobile Shipping & Receiving Suitelet

01 Mobile S&R Suitelet Overview Phone-first receiving, shipping, BOL capture, and barcode scanning for dock workers

This Suitelet is the primary tool for dock workers at both 131 Heartland Blvd, Edgewood NY and 2500 Freeland Road, Hermitage PA. Designed for gloved hands, outdoor lighting, and fast workflows. Every touch target is 48px minimum. Camera integration uses native HTML5 capture="environment" for rear-camera BOL photography.

Primary Users

Dock Workers

Warehouse staff, receivers, loaders

Device Target

375 x 812

iPhone / Android phone-first

Touch Targets

48px min

Gloved-hand safe, high contrast

Camera

BOL Capture

Photo attach via SuiteAttach RESTlet

■ This Suitelet connects to NetSuite via SuiteAttach RESTlet for BOL photo uploads. All data syncs to PO/SO transaction records.

02 Mobile Receiving Suitelet Full phone mockup (375x812) for receiving workflow with item checklist, temp readings, and BOL capture

9:41 ● WiFi 100%

Dock

☐ Receive 3

▶ Ship

📷 BOL

🕑 History

📷

PO-2026-1845 EXPECTED

Vendor Bongards Creameries

Items 3 line items

Appointment Today, 10:30 AM

Carrier Central Transport

Items to Receive 0 / 3

☐

Barrel Cheddar (640lb)

SKU: BC-640-001

x12

Actual Qty

Temp (F)

Condition

✓

Process Cheese (500lb)

SKU: PC-500-003

x8

Actual Qty

Temp (F)

Condition

☐

Butter Solids (60lb)

SKU: BS-060-012

x20

Actual Qty

Temp (F)

Condition

📷 Take Photo of BOL

📄 BOL p.1 ✕

+ Add More

📷 Take Photo of Product (Damage)

Receiving Notes

✓ CONFIRM RECEIPT

✗ REJECT DELIVERY

RECEIVE TAB — PO-2026-1845 ACTIVE

■ All checkboxes use 28px visible + 48px touch-target padding. Temp readings flag above 41F for refrigerated items. Short condition triggers amber highlight.

03 Mobile Shipping Suitelet Phone mockup for outbound shipment workflow with pallet scan, BOL generation, and driver info

2:15 ● WiFi 87%

Dock

☐ Receive

▶ Ship 2

📷 BOL

🕑 History

📷

SO-24891 READY

Customer Good Eats Deli Corp

Items 4 pallets, 2,400 lbs

Delivery 320 W 42nd St, New York

Ship Via GFS Fleet #12

                Pallet Verification (scan each)
              

✓

PLT-24891-01

Barrel Cheddar x6

640 lb

✓

PLT-24891-02

Barrel Cheddar x6

640 lb

✓

PLT-24891-03

Process Cheese x8

620 lb

—

PLT-24891-04

Butter Solids x10

500 lb

Total Weight (lbs)

Seal Number

Trailer Temp at Loading (F)

📄 GENERATE BOL

🖨 PRINT BOL (Dock Printer)

Driver Information

Driver Name

Company

Truck #

License

📷 Take Photo of Loaded Truck

▶ CONFIRM SHIPMENT

SHIP TAB — SO-24891 OUTBOUND

■ Pallet scan uses camera barcode reader. 3 of 4 pallets verified. Seal number and trailer temp are required fields before shipment confirmation.

04 BOL Camera Capture Dedicated camera viewfinder with crop, rotate, retake, and multi-page BOL support

9:43 ● WiFi 100%

✕ Cancel BOL CAPTURE 1 of ?

⚡

Align BOL within frame

🖼

🔄

Photo will be attached to PO/SO in NetSuite

VIEWFINDER — CAPTURING BOL PAGE 1

9:44 ● WiFi 100%

← Back REVIEW PHOTO Page 1

QUALITY: GOOD

BOL-2026-1845-page1.jpg

↻

Rotate

✂

Crop

📷

Retake

PG 1

+

Add more BOL pages

✓ USE THIS PHOTO

📷 TAKE NEXT PAGE

PHOTO REVIEW — CROP / ROTATE / RETAKE

■ Photo quality detection warns if image is blurry. Multiple pages can be captured for multi-page BOLs. All images use rear camera via capture="environment".

05 BOL Upload & Attach Photo upload to NetSuite via SuiteAttach RESTlet with progress tracking and confirmation

9:45 ● WiFi 99%

☐ Receive

▶ Ship

📷 BOL

🕑 History

                Uploading to NetSuite
              

📄

BOL-2026-1845-page1.jpg

1.2 MB · PO-2026-1845

UPLOADING... 75%

                Completed
              

✓

BOL-2026-1842-page1.jpg

0.9 MB · PO-2026-1842 · Bongards

ATTACHED TO NETSUITE View PO ↗

✓

BOL-2026-1842-page2.jpg

1.1 MB · PO-2026-1842 · Bongards

ATTACHED TO NETSUITE View PO ↗

!

BOL-2026-1838-page1.jpg

2.4 MB · PO-2026-1838 · Dairy Farmers

FAILED — TAP TO RETRY Retry ↻

                Upload History (last 7 days)
              

✓

BOL-2026-1830-page1.jpg

May 17 · SO-24880 · Good Eats Deli

ATTACHED View SO ↗

BOL TAB — UPLOAD PROGRESS & HISTORY

■ Uploads use SuiteAttach RESTlet with TBA authentication. Failed uploads can be retried. Each photo auto-links to the PO or SO from the most recent scan.

06 Mobile History & Search Recent transactions, search by PO/SO/vendor/date, tap to view details and re-upload

3:22 ● WiFi 91%

☐ Receive

▶ Ship

📷 BOL

🕑 History

🔍

↻ Pull to refresh

                Today — May 19, 2026
              

☐

PO-2026-1845 · Bongards

Received 9:45 AM · Dock 3 · 3 items · 1 short

›

▶

SO-24891 · Good Eats Deli

Shipped 2:30 PM · Dock 7 · 4 pallets

›

☐

PO-2026-1842 · Bongards

Received 7:15 AM · Dock 3 · 2 items

›

                Yesterday — May 18, 2026
              

▶

SO-24888 · Metro Fresh Foods

Shipped 4:10 PM · Dock 7 · 2 pallets

›

☐

PO-2026-1838 · Dairy Farmers

Received 11:00 AM · Dock 1 · 5 items · BOL failed

›

☐

PO-2026-1835 · Schreiber Foods

Received 8:30 AM · Dock 5 · 4 items

›

▶

SO-24885 · Apex Catering

Shipped 1:45 PM · Dock 7 · 1 pallet

›

⚠

1 BOL upload failed

PO-2026-1838 · Tap to re-upload

RETRY ›

HISTORY TAB — RECENT S&R TRANSACTIONS

■ History shows last 20 transactions grouped by date. Failed BOL uploads surface as alerts. Tap any row to view full details and re-upload attachments.

07 Barcode Scanner Integration Camera-based barcode scanning for PO, pallet, item, and BOL barcodes with torch toggle

10:02 ● WiFi 95%

✕ Close BARCODE SCANNER

⚡

Point camera at barcode

PO/SO

Pallet

Item

BOL

Or enter manually

›

Recent Scans

PO-2026-1845 10:01

PLT-24891-03 9:58

SCANNER — PO/SO MODE WITH TORCH

10:02 ● WiFi 95%

← Scanner SCAN RESULT

✓

Barcode Recognized

PO-2026-1845 · Bongards Creameries

☐

Start Receiving

📷

Capture BOL

📄

View Details

🔎

Scan Another

PO-2026-1845 EXPECTED

Vendor Bongards Creameries

Items 3 line items, 40 units

Expected Today, 10:30 AM

BOL Status Not Captured

SCAN RESULT — PO AUTO-LOOKUP

■ Scanner supports 4 modes: PO/SO lookup, pallet verification against pick list, item mark-received, and BOL link-to-transaction. Torch toggle for dark docks.

08 Offline Mode Design Queue transactions and photos locally when no WiFi at dock, sync on reconnect, resolve conflicts

11:15 ● No WiFi 72%

☐ Receive

▶ Ship

📷 BOL

🕑 History

You can still receive and ship

Transactions will sync when connection returns. Photos stored on device.

                Queued Transactions
              

⌛

Receipt: PO-2026-1846 · Schreiber

Queued 10:45 AM · 2 items · 1 photo

⌛

Shipment: SO-24892 · FreshMart

Queued 11:02 AM · 3 pallets · 2 photos

📷

BOL Photo: PO-2026-1847

Queued 11:10 AM · 1.3 MB

📷

                ⚠ Cached PO data only. New POs require connection.
              

OFFLINE MODE — 3 TRANSACTIONS QUEUED

11:32 ● WiFi 71%

BACK ONLINE — Syncing queued data...

☐ Receive

▶ Ship

📷 BOL

🕑 History

                Sync Progress
              

✓

Receipt: PO-2026-1846 · Schreiber

Synced successfully

✓

Shipment: SO-24892 · FreshMart

Synced successfully

!

BOL Photo: PO-2026-1847

Conflict: PO was updated by another user

Conflict Detected

                  PO-2026-1847 was modified by Sarah K. at 11:20 AM while you were offline. Your BOL photo was captured at 11:10 AM.
                

✓

Keep both — attach photo to updated PO

Recommended

—

Discard my photo

—

Review side by side

✓ RESOLVE CONFLICT

RECONNECTED — SYNC + CONFLICT RESOLUTION

■ Offline mode uses IndexedDB for transaction queue and Cache API for photos. Conflict resolution defaults to "keep both" for BOL attachments. Queued count badge shows in header.

09 Push Notifications Delivery arrivals, shipment readiness, temperature alerts, and upload confirmations

10:22 ● WiFi 88%

Notifications Mark all read

🚚

Delivery arriving: Bongards, Dock 3, ETA 10 min

PO-2026-1848 · 3 items · Refrigerated

2m ago

▶

Shipment ready: SO-24891, Dock 7

Good Eats Deli · 4 pallets · Driver on site

8m ago

🌡

Temperature alert: Dock 5 trailer at 44F

Exceeds 41F threshold · Action required

15m ago

✓

BOL upload complete for PO-2026-1845

2 pages attached · Bongards Creameries

25m ago

Earlier Today

🚚

Delivery arriving: Dairy Farmers, Dock 1

PO-2026-1844 · 5 items

2h ago

▶

Shipment ready: SO-24889, Dock 7

Metro Fresh · 2 pallets

3h ago

NOTIFICATIONS — 4 NEW ALERTS

■ Temperature alerts trigger immediately above 41F for refrigerated and 0F for frozen. Delivery ETAs come from carrier GPS integration. Notifications use Web Push API.

10 Mobile App Shell Reusable app shell with bottom tabs, splash screen, pull-to-refresh, and home screen icon

9:40 ● WiFi 100%

GFS

SHIPPING & RECEIVING

Loading...

SPLASH SCREEN — GFS + FROSTY LOADING

9:41 ● WiFi 100%

Dock

To Receive

3

POs expected today

To Ship

2

SOs ready at dock

Quick Actions

📷

SCAN

📄

BOL

🕑

HISTORY

Next Expected

PO-2026-1848 ETA 10 MIN

Vendor Bongards

Dock Dock 3

☐ Receive

▶ Ship

📷 BOL

🔎 Scan

⋯ More

APP SHELL — BOTTOM TAB NAVIGATION

Home Screen Icon & PWA Manifest

GFS S&R

60x60 icon

name: "GFS Shipping & Receiving"
short_name: "GFS S&R"
display: "standalone"
theme_color: "#092F64"
background_color: "#092F64"
orientation: "portrait"
scope: "/app/sr/"

Swipe & Gesture Reference

→ Swipe Right

Mark item as received (on checklist row)

↓ Pull Down

Refresh current data from NetSuite

← Swipe Left

Quick actions (photo, notes, flag)

Long Press

Multi-select items for bulk actions

■ PWA manifest enables "Add to Home Screen" for installable app experience. Bottom tab navigation keeps primary actions in the easy-reach thumb zone. Frosty face serves as the app icon.

11 Implementation Notes Technical specifications for camera API, NetSuite integration, and accessibility

Camera Integration

            // BOL capture uses rear camera

            <input type="file"

            accept="image/*"

            capture="environment">
          
            // Supported formats

            JPEG, PNG, HEIF/HEIC

            Max file size: 10MB

            Auto-compress above 5MB

NetSuite Integration

            // Upload via SuiteAttach RESTlet

            POST /restlet/suiteattach

            Auth: TBA (Token-Based)

            Payload: multipart/form-data
          
            // Supported record types

            Purchase Order (PO)

            Sales Order (SO)

            Item Fulfillment

            Item Receipt

Dock Accessibility

          Touch targets: 48px minimum

          Font size: 16px body minimum

          Contrast: WCAG AA (4.5:1)

          Haptic feedback on scan success

          Audio beep on barcode read

          Landscape lock: disabled

          Glove mode: extra padding on inputs

          High-contrast mode: available

Offline Storage

          IndexedDB: transaction queue

          Cache API: photos (up to 50MB)

          Service Worker: app shell cache

          Sync: Background Sync API

          Conflict: last-write-wins + manual

          Retention: 7 days offline max

          Status: navigator.onLine + ping

Facilities

          HQ: 131 Heartland Blvd

          Edgewood, NY 11717

          Docks 1-5 (Receive), 6-8 (Ship)

          Facility 2: 2500 Freeland Road

          Hermitage, PA 16148

          Docks 1-3 (Receive), 4-5 (Ship)

Data Flow

          // Receive flow

          Scan PO → Verify items →

          Log temp → Capture BOL →

          Confirm → Item Receipt created

          // Ship flow

          Scan SO → Verify pallets →

          Log driver → Generate BOL →

          Confirm → Item Fulfillment created

■ Suitelet deployed as NetSuite Suitelet with PWA wrapper. TBA authentication for all RESTlet calls. Service worker enables offline-first architecture.