{
  "name": "Scenemock chat platform specifications",
  "updated": "2026-10-22",
  "units": "All measurements are logical points (CSS px) except canvas.w / canvas.h, which are the device-pixel backing store at canvas.scale (= 3x).",
  "note": "Canvas sizes are device pixels at 3×; the iMessage canvas is 1206 × 2622, i.e. 402 × 874 points on the calibrated iPhone 17 Pro (iOS 26.4). All other measurements are device-independent points. The 390 × 844 / 47 pt layout from the first spec draft is kept as an uncalibrated variant and is not the default.",
  "platforms": {
    "imessage": {
      "platform": "imessage",
      "label": "iMessage (iOS 18)",
      "blurb": "Blue outgoing bubbles, a Dynamic Island status bar and an iOS 14–18 version matrix.",
      "osRange": "iOS 14 – 18",
      "grade": "A",
      "calibratedOn": "iPhone 17 Pro simulator, iOS 26.4 (2026-10-22)",
      "canvas": {
        "w": 1206,
        "h": 2622,
        "scale": 3,
        "safeTop": 62,
        "safeBottom": 34
      },
      "statusBar": {
        "kind": "ios-island",
        "h": 62,
        "icons": [
          "signal",
          "wifi",
          "battery"
        ],
        "island": {
          "w": 125.3,
          "h": 36.7,
          "top": 14
        }
      },
      "header": {
        "h": 44,
        "avatar": 36,
        "border": true
      },
      "bubble": {
        "maxWidthPct": 0.72,
        "padX": 16,
        "padY": 10,
        "radius": 18,
        "tail": "round",
        "mergeSame": true
      },
      "text": {
        "size": 17,
        "lineHeight": 22,
        "family": "Inter"
      },
      "meta": {
        "tick": "none",
        "timePos": "below",
        "labels": {
          "sent": "Sent",
          "delivered": "Delivered",
          "read": "Read"
        }
      },
      "composerPlaceholder": "iMessage",
      "themes": {
        "light": {
          "pageBg": "#FFFFFF",
          "wallpaperDim": 0,
          "bubbleAlpha": 1,
          "inBg": "#E9E9EB",
          "outBg": "#0B93F6",
          "inInk": "#000000",
          "outInk": "#FFFFFF",
          "statusBarInk": "#000000",
          "headerBg": "rgba(255,255,255,0.92)"
        },
        "dark": {
          "pageBg": "#000000",
          "wallpaperDim": 0.35,
          "bubbleAlpha": 0.95,
          "inBg": "#26252A",
          "outBg": "#0B93F6",
          "inInk": "#FFFFFF",
          "outInk": "#FFFFFF",
          "statusBarInk": "#FFFFFF",
          "headerBg": "rgba(28,28,30,0.92)"
        },
        "black": {
          "pageBg": "#000000",
          "wallpaperDim": 0.6,
          "bubbleAlpha": 0.9,
          "inBg": "#26252A",
          "outBg": "#0B93F6",
          "inInk": "#FFFFFF",
          "outInk": "#FFFFFF",
          "statusBarInk": "#FFFFFF",
          "headerBg": "rgba(0,0,0,0.92)"
        }
      }
    },
    "whatsapp": {
      "platform": "whatsapp",
      "label": "WhatsApp-style",
      "blurb": "Green outgoing bubbles, double ticks, wallpapers, lock screens and DM layouts.",
      "osRange": "Android 13 – 15 / iOS 15 – 18",
      "grade": "B",
      "canvas": {
        "w": 1080,
        "h": 2400,
        "scale": 3,
        "safeTop": 32,
        "safeBottom": 24
      },
      "statusBar": {
        "kind": "android",
        "h": 24,
        "icons": [
          "signal",
          "wifi",
          "battery"
        ]
      },
      "header": {
        "h": 56,
        "avatar": 36,
        "border": false
      },
      "bubble": {
        "maxWidthPct": 0.75,
        "padX": 18,
        "padY": 12,
        "radius": 7.5,
        "tail": "point",
        "mergeSame": true
      },
      "text": {
        "size": 14.2,
        "lineHeight": 19,
        "family": "Inter"
      },
      "meta": {
        "tick": "double",
        "timePos": "inside",
        "labels": {
          "sent": "",
          "delivered": "",
          "read": ""
        }
      },
      "composerPlaceholder": "Message",
      "themes": {
        "light": {
          "pageBg": "#EFEAE2",
          "wallpaperDim": 0,
          "bubbleAlpha": 1,
          "inBg": "#FFFFFF",
          "outBg": "#DCF8C6",
          "inInk": "#111B21",
          "outInk": "#111B21",
          "statusBarInk": "#000000",
          "headerBg": "#FFFFFF"
        },
        "dark": {
          "pageBg": "#0B141A",
          "wallpaperDim": 0.35,
          "bubbleAlpha": 0.95,
          "inBg": "#202C33",
          "outBg": "#005C4B",
          "inInk": "#E9EDEF",
          "outInk": "#E9EDEF",
          "statusBarInk": "#FFFFFF",
          "headerBg": "#202C33"
        },
        "black": {
          "pageBg": "#000000",
          "wallpaperDim": 0.6,
          "bubbleAlpha": 0.9,
          "inBg": "#202C33",
          "outBg": "#005C4B",
          "inInk": "#E9EDEF",
          "outInk": "#E9EDEF",
          "statusBarInk": "#FFFFFF",
          "headerBg": "#000000"
        }
      }
    },
    "messenger": {
      "platform": "messenger",
      "label": "Messenger-style",
      "blurb": "Blue gradient bubbles with rounded geometry for DM and notification layouts.",
      "osRange": "iOS 15 – 18 / Android 13 – 15",
      "grade": "B",
      "canvas": {
        "w": 1080,
        "h": 2400,
        "scale": 3,
        "safeTop": 32,
        "safeBottom": 24
      },
      "statusBar": {
        "kind": "ramless",
        "h": 24,
        "icons": [
          "signal",
          "wifi",
          "battery"
        ]
      },
      "header": {
        "h": 56,
        "avatar": 36,
        "border": false
      },
      "bubble": {
        "maxWidthPct": 0.7,
        "padX": 18,
        "padY": 12,
        "radius": 18,
        "tail": "round",
        "mergeSame": true
      },
      "text": {
        "size": 15,
        "lineHeight": 20,
        "family": "Inter"
      },
      "meta": {
        "tick": "none",
        "timePos": "inside",
        "labels": {
          "sent": "",
          "delivered": "",
          "read": ""
        }
      },
      "composerPlaceholder": "Aa",
      "themes": {
        "light": {
          "pageBg": "#FFFFFF",
          "wallpaperDim": 0,
          "bubbleAlpha": 1,
          "inBg": "#F0F0F0",
          "outBg": "#0084FF",
          "inInk": "#000000",
          "outInk": "#FFFFFF",
          "statusBarInk": "#000000",
          "headerBg": "#FFFFFF"
        },
        "dark": {
          "pageBg": "#18191A",
          "wallpaperDim": 0.35,
          "bubbleAlpha": 0.95,
          "inBg": "#3A3B3C",
          "outBg": "#0084FF",
          "inInk": "#E4E6EB",
          "outInk": "#FFFFFF",
          "statusBarInk": "#FFFFFF",
          "headerBg": "#242526"
        },
        "black": {
          "pageBg": "#000000",
          "wallpaperDim": 0.6,
          "bubbleAlpha": 0.9,
          "inBg": "#3A3B3C",
          "outBg": "#0084FF",
          "inInk": "#E4E6EB",
          "outInk": "#FFFFFF",
          "statusBarInk": "#FFFFFF",
          "headerBg": "#000000"
        }
      }
    },
    "android": {
      "platform": "android",
      "label": "Google Messages (Android)",
      "blurb": "Material-style bubbles with RCS read receipts and dual-SIM status icons.",
      "osRange": "Android 13 – 15",
      "grade": "B",
      "canvas": {
        "w": 1080,
        "h": 2400,
        "scale": 3,
        "safeTop": 24,
        "safeBottom": 24
      },
      "statusBar": {
        "kind": "android",
        "h": 24,
        "icons": [
          "dual-sim",
          "signal",
          "wifi",
          "battery"
        ]
      },
      "header": {
        "h": 64,
        "avatar": 40,
        "border": false
      },
      "bubble": {
        "maxWidthPct": 0.75,
        "padX": 20,
        "padY": 12,
        "radius": 20,
        "tail": "round",
        "mergeSame": true
      },
      "text": {
        "size": 16,
        "lineHeight": 21,
        "family": "Inter"
      },
      "meta": {
        "tick": "none",
        "timePos": "inside",
        "labels": {
          "pending": "Sending",
          "sent": "Sent",
          "delivered": "Delivered",
          "read": "Read"
        }
      },
      "composerPlaceholder": "Text message",
      "themes": {
        "light": {
          "pageBg": "#FFFFFF",
          "wallpaperDim": 0,
          "bubbleAlpha": 1,
          "inBg": "#F1F3F4",
          "outBg": "#D3E3FD",
          "inInk": "#1F1F1F",
          "outInk": "#041E49",
          "statusBarInk": "#000000",
          "headerBg": "#FFFFFF"
        },
        "dark": {
          "pageBg": "#1F1F1F",
          "wallpaperDim": 0.35,
          "bubbleAlpha": 0.95,
          "inBg": "#2D2F31",
          "outBg": "#3D4F6B",
          "inInk": "#E3E3E3",
          "outInk": "#E3E3E3",
          "statusBarInk": "#FFFFFF",
          "headerBg": "#1F1F1F"
        },
        "black": {
          "pageBg": "#000000",
          "wallpaperDim": 0.6,
          "bubbleAlpha": 0.9,
          "inBg": "#2D2F31",
          "outBg": "#3D4F6B",
          "inInk": "#E3E3E3",
          "outInk": "#E3E3E3",
          "statusBarInk": "#FFFFFF",
          "headerBg": "#000000"
        }
      }
    }
  }
}