| 1 | spec_version: 1 |
| 2 | id: frame-data-chart-nyt |
| 3 | name: NYT Data Chart |
| 4 | description: > |
| 5 | New York Times-style animated data chart with counter animation and editorial typography. |
| 6 | |
| 7 | engine: hyperframes |
| 8 | engine_version: ^0.4.0 |
| 9 | source_entry: source/index.html |
| 10 | |
| 11 | category: data-viz |
| 12 | subcategory: bar-chart |
| 13 | tags: [chart, bar, data, nyt, journalism, number-counter] |
| 14 | |
| 15 | best_for: |
| 16 | - "Editorial data viz" |
| 17 | - "Annual report" |
| 18 | - "Comparison reveal" |
| 19 | |
| 20 | output: |
| 21 | formats: [mp4, webm] |
| 22 | default_format: mp4 |
| 23 | resolution: |
| 24 | default: { width: 1920, height: 1080 } |
| 25 | supported_aspects: ["16:9", "9:16", "1:1"] |
| 26 | fps: |
| 27 | default: 60 |
| 28 | supported: [30, 60] |
| 29 | duration: |
| 30 | type: variable |
| 31 | min_sec: 5 |
| 32 | max_sec: 20 |
| 33 | alpha: false |
| 34 | audio: |
| 35 | supported: true |
| 36 | expected_inputs: [bgm] |
| 37 | |
| 38 | inputs: |
| 39 | schema: |
| 40 | type: object |
| 41 | required: [title, data] |
| 42 | properties: |
| 43 | title: |
| 44 | type: "string" |
| 45 | maxLength: 100 |
| 46 | description: "Chart headline" |
| 47 | subtitle: |
| 48 | type: "string" |
| 49 | maxLength: 200 |
| 50 | description: "Secondary line / source" |
| 51 | data: |
| 52 | type: "array" |
| 53 | minItems: 2 |
| 54 | maxItems: 12 |
| 55 | items: |
| 56 | type: object |
| 57 | required: ['label', 'value'] |
| 58 | properties: |
| 59 | label: { type: string } |
| 60 | value: { type: number } |
| 61 | duration_sec: |
| 62 | type: "number" |
| 63 | minimum: 5 |
| 64 | maximum: 20 |
| 65 | default: 8 |
| 66 | examples: |
| 67 | - {"title": "OD plugin library", "subtitle": "by category, 2026-05", "data": [{"label": "Templates", "value": 231}, {"label": "Skills", "value": 15}, {"label": "Systems", "value": 150}, {"label": "Craft", "value": 11}], "duration_sec": 8} |
| 68 | |
| 69 | license: |
| 70 | spdx: Apache-2.0 |
| 71 | attribution_required: false |
| 72 | redistribution_allowed: true |
| 73 | commercial_use: true |
| 74 | |
| 75 | author: |
| 76 | name: nexu-io |
| 77 | url: https://github.com/nexu-io |
| 78 | contact: open-design@nexu.io |
| 79 | |
| 80 | version: 0.1.0 |
| 81 | changelog: |
| 82 | - version: 0.1.0 |
| 83 | date: 2026-05-27 |
| 84 | notes: Cherry-picked from open-design/repo/skills/frame-data-chart-nyt/example.html |
| 85 | |
| 86 | preview: |
| 87 | poster: preview.png |
| 88 | |
| 89 | performance: |
| 90 | reference_render: |
| 91 | duration_sec: 8 |
| 92 | render_wall_clock_sec: 14 |
| 93 | machine: "M2 MacBook Air" |
| 94 |