6. Ship to mobile

The mobile renderer reads the same Model and page metadata as the web designer, but presents them in a touch-first layout. This chapter exposes the CRM on the iOS and Android apps.

Estimated time: 20 minutes.

6.1 Enable the models for mobile

Open Mobile → Object visibility and toggle on:

  • crm_lead — list + detail + form
  • crm_account — list + detail (no form on mobile)
  • crm_opportunity — list + detail + form

The renderer will derive the field set from the model. Override per-field with mobile.disabled = true if a field should not appear on small screens (e.g. notes may be too long).

6.2 Customise the renderer

Open Designer → Mobile pages → crm_opportunity/list:

  • Card layout — title title, subtitle account.name, trailing amount
  • Swipe action — call crm.opportunity.advance
  • Filter chips — stage, owner
{
  "kind": "mobile-list",
  "model": "crm_opportunity",
  "card": {
    "title": "title",
    "subtitle": "account.name",
    "trailing": "amount"
  },
  "swipeActions": [
    { "command": "crm.opportunity.advance", "label": "Advance" }
  ],
  "filterChips": ["stage", "owner"]
}

Mobile list view layout is configured the same way; capture pending until the mobile demo build is ready.

6.3 Pickers and secondary entries

For the account reference on the Lead form, configure a picker with a search index over account.name + account.domain. Required reference fields on mobile must use a picker; free-text entry is a red line (see mobile UX rules).

6.4 Verify

  • Install the test app, log in as the same user
  • All three models appear in the navigation
  • Create a Lead from mobile → row appears on the web list
  • Swipe-advance an opportunity → stage changes; web detail updates
  • Try qualification from mobile — required-field validation shows field-level errors, not a generic toast

Refer to mobile low-code UX rules for the full verification checklist before declaring this chapter done.

Next

Chapter 7 → Promote and release