карусель «The harness is the product»: 8 слайдов 1080×1350 с фото Alex (hyperframes)
Тезисы — из 42_Harness_Deck и Simbiot Whitepaper; стиль кость/карбон + лайм Shkor Labs. PNG-слайды и анимированная версия — snapshot/render того же index.html. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
This commit is contained in:
Simbiot Harness
parent
a08cd482f5
commit
09089902e9
28 changed files with 1498 additions and 0 deletions
|
|
@ -0,0 +1,443 @@
|
||||||
|
{
|
||||||
|
"ok": false,
|
||||||
|
"strict": false,
|
||||||
|
"browserSkipped": false,
|
||||||
|
"lint": {
|
||||||
|
"ok": true,
|
||||||
|
"errorCount": 0,
|
||||||
|
"warningCount": 11,
|
||||||
|
"infoCount": 0,
|
||||||
|
"findings": [
|
||||||
|
{
|
||||||
|
"code": "duplicate_media_discovery_risk",
|
||||||
|
"severity": "warning",
|
||||||
|
"message": "Detected 7 matching img entries with the same source/start/duration.",
|
||||||
|
"selector": "[data-composition-id]",
|
||||||
|
"dataAttributes": {},
|
||||||
|
"sourceFile": "/root/simbiot-harness/video/carousel-ai-future/index.html",
|
||||||
|
"bbox": {
|
||||||
|
"x": 0,
|
||||||
|
"y": 0,
|
||||||
|
"width": 0,
|
||||||
|
"height": 0
|
||||||
|
},
|
||||||
|
"time": 0,
|
||||||
|
"fixHint": "Avoid duplicated media nodes that can be discovered twice during compilation."
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"code": "timeline_track_too_dense",
|
||||||
|
"severity": "warning",
|
||||||
|
"message": "Track 1 has 8 timed elements in this HTML file. Smaller sub-compositions keep timelines easier to read, iterate on, and diff.",
|
||||||
|
"selector": "[data-composition-id]",
|
||||||
|
"dataAttributes": {},
|
||||||
|
"sourceFile": "/root/simbiot-harness/video/carousel-ai-future/index.html",
|
||||||
|
"bbox": {
|
||||||
|
"x": 0,
|
||||||
|
"y": 0,
|
||||||
|
"width": 0,
|
||||||
|
"height": 0
|
||||||
|
},
|
||||||
|
"time": 0,
|
||||||
|
"fixHint": "Move coherent scene groups into separate .html files under compositions/ and mount them from the parent with data-composition-src so the timeline stays easier to inspect, revise, and validate."
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"code": "nested_structure_needs_subcomposition",
|
||||||
|
"severity": "warning",
|
||||||
|
"message": "<div id=\"bg\"> is a timeline element that contains nested <div id=\"bg-grid\">. The timeline shows one row per top-level element, and the root composition is built only from sub-compositions.",
|
||||||
|
"selector": "#bg",
|
||||||
|
"dataAttributes": {},
|
||||||
|
"sourceFile": "/root/simbiot-harness/video/carousel-ai-future/index.html",
|
||||||
|
"bbox": {
|
||||||
|
"x": 0,
|
||||||
|
"y": 0,
|
||||||
|
"width": 0,
|
||||||
|
"height": 0
|
||||||
|
},
|
||||||
|
"time": 0,
|
||||||
|
"fixHint": "Move <div id=\"bg\"> and its contents into a sub-composition file and mount it with data-composition-src."
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"code": "nested_structure_needs_subcomposition",
|
||||||
|
"severity": "warning",
|
||||||
|
"message": "<section id=\"s1\"> is a timeline element that contains nested <div id=\"s1-photo\">. The timeline shows one row per top-level element, and the root composition is built only from sub-compositions.",
|
||||||
|
"selector": "#s1",
|
||||||
|
"dataAttributes": {},
|
||||||
|
"sourceFile": "/root/simbiot-harness/video/carousel-ai-future/index.html",
|
||||||
|
"bbox": {
|
||||||
|
"x": 0,
|
||||||
|
"y": 0,
|
||||||
|
"width": 0,
|
||||||
|
"height": 0
|
||||||
|
},
|
||||||
|
"time": 0,
|
||||||
|
"fixHint": "Move <section id=\"s1\"> and its contents into a sub-composition file and mount it with data-composition-src."
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"code": "nested_structure_needs_subcomposition",
|
||||||
|
"severity": "warning",
|
||||||
|
"message": "<section id=\"s2\"> is a timeline element that contains nested <div>. The timeline shows one row per top-level element, and the root composition is built only from sub-compositions.",
|
||||||
|
"selector": "#s2",
|
||||||
|
"dataAttributes": {},
|
||||||
|
"sourceFile": "/root/simbiot-harness/video/carousel-ai-future/index.html",
|
||||||
|
"bbox": {
|
||||||
|
"x": 0,
|
||||||
|
"y": 0,
|
||||||
|
"width": 0,
|
||||||
|
"height": 0
|
||||||
|
},
|
||||||
|
"time": 0,
|
||||||
|
"fixHint": "Move <section id=\"s2\"> and its contents into a sub-composition file and mount it with data-composition-src."
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"code": "nested_structure_needs_subcomposition",
|
||||||
|
"severity": "warning",
|
||||||
|
"message": "<section id=\"s3\"> is a timeline element that contains nested <div>. The timeline shows one row per top-level element, and the root composition is built only from sub-compositions.",
|
||||||
|
"selector": "#s3",
|
||||||
|
"dataAttributes": {},
|
||||||
|
"sourceFile": "/root/simbiot-harness/video/carousel-ai-future/index.html",
|
||||||
|
"bbox": {
|
||||||
|
"x": 0,
|
||||||
|
"y": 0,
|
||||||
|
"width": 0,
|
||||||
|
"height": 0
|
||||||
|
},
|
||||||
|
"time": 0,
|
||||||
|
"fixHint": "Move <section id=\"s3\"> and its contents into a sub-composition file and mount it with data-composition-src."
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"code": "nested_structure_needs_subcomposition",
|
||||||
|
"severity": "warning",
|
||||||
|
"message": "<section id=\"s4\"> is a timeline element that contains nested <div id=\"s4-photo\">. The timeline shows one row per top-level element, and the root composition is built only from sub-compositions.",
|
||||||
|
"selector": "#s4",
|
||||||
|
"dataAttributes": {},
|
||||||
|
"sourceFile": "/root/simbiot-harness/video/carousel-ai-future/index.html",
|
||||||
|
"bbox": {
|
||||||
|
"x": 0,
|
||||||
|
"y": 0,
|
||||||
|
"width": 0,
|
||||||
|
"height": 0
|
||||||
|
},
|
||||||
|
"time": 0,
|
||||||
|
"fixHint": "Move <section id=\"s4\"> and its contents into a sub-composition file and mount it with data-composition-src."
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"code": "nested_structure_needs_subcomposition",
|
||||||
|
"severity": "warning",
|
||||||
|
"message": "<section id=\"s5\"> is a timeline element that contains nested <div>. The timeline shows one row per top-level element, and the root composition is built only from sub-compositions.",
|
||||||
|
"selector": "#s5",
|
||||||
|
"dataAttributes": {},
|
||||||
|
"sourceFile": "/root/simbiot-harness/video/carousel-ai-future/index.html",
|
||||||
|
"bbox": {
|
||||||
|
"x": 0,
|
||||||
|
"y": 0,
|
||||||
|
"width": 0,
|
||||||
|
"height": 0
|
||||||
|
},
|
||||||
|
"time": 0,
|
||||||
|
"fixHint": "Move <section id=\"s5\"> and its contents into a sub-composition file and mount it with data-composition-src."
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"code": "nested_structure_needs_subcomposition",
|
||||||
|
"severity": "warning",
|
||||||
|
"message": "<section id=\"s6\"> is a timeline element that contains nested <div id=\"s6-photo\">. The timeline shows one row per top-level element, and the root composition is built only from sub-compositions.",
|
||||||
|
"selector": "#s6",
|
||||||
|
"dataAttributes": {},
|
||||||
|
"sourceFile": "/root/simbiot-harness/video/carousel-ai-future/index.html",
|
||||||
|
"bbox": {
|
||||||
|
"x": 0,
|
||||||
|
"y": 0,
|
||||||
|
"width": 0,
|
||||||
|
"height": 0
|
||||||
|
},
|
||||||
|
"time": 0,
|
||||||
|
"fixHint": "Move <section id=\"s6\"> and its contents into a sub-composition file and mount it with data-composition-src."
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"code": "nested_structure_needs_subcomposition",
|
||||||
|
"severity": "warning",
|
||||||
|
"message": "<section id=\"s7\"> is a timeline element that contains nested <div>. The timeline shows one row per top-level element, and the root composition is built only from sub-compositions.",
|
||||||
|
"selector": "#s7",
|
||||||
|
"dataAttributes": {},
|
||||||
|
"sourceFile": "/root/simbiot-harness/video/carousel-ai-future/index.html",
|
||||||
|
"bbox": {
|
||||||
|
"x": 0,
|
||||||
|
"y": 0,
|
||||||
|
"width": 0,
|
||||||
|
"height": 0
|
||||||
|
},
|
||||||
|
"time": 0,
|
||||||
|
"fixHint": "Move <section id=\"s7\"> and its contents into a sub-composition file and mount it with data-composition-src."
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"code": "nested_structure_needs_subcomposition",
|
||||||
|
"severity": "warning",
|
||||||
|
"message": "<section id=\"s8\"> is a timeline element that contains nested <div id=\"s8-photo\">. The timeline shows one row per top-level element, and the root composition is built only from sub-compositions.",
|
||||||
|
"selector": "#s8",
|
||||||
|
"dataAttributes": {},
|
||||||
|
"sourceFile": "/root/simbiot-harness/video/carousel-ai-future/index.html",
|
||||||
|
"bbox": {
|
||||||
|
"x": 0,
|
||||||
|
"y": 0,
|
||||||
|
"width": 0,
|
||||||
|
"height": 0
|
||||||
|
},
|
||||||
|
"time": 0,
|
||||||
|
"fixHint": "Move <section id=\"s8\"> and its contents into a sub-composition file and mount it with data-composition-src."
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"filesScanned": 1
|
||||||
|
},
|
||||||
|
"runtime": {
|
||||||
|
"ok": true,
|
||||||
|
"errorCount": 0,
|
||||||
|
"warningCount": 0,
|
||||||
|
"infoCount": 0,
|
||||||
|
"findings": []
|
||||||
|
},
|
||||||
|
"layout": {
|
||||||
|
"ok": false,
|
||||||
|
"errorCount": 1,
|
||||||
|
"warningCount": 0,
|
||||||
|
"infoCount": 2,
|
||||||
|
"findings": [
|
||||||
|
{
|
||||||
|
"code": "content_overlap",
|
||||||
|
"severity": "error",
|
||||||
|
"time": 8.916,
|
||||||
|
"selector": "#s3-ring > div:nth-of-type(6)",
|
||||||
|
"message": "Two text blocks overlap and may render unreadable.",
|
||||||
|
"rect": {
|
||||||
|
"left": 494.81,
|
||||||
|
"top": 1115.5,
|
||||||
|
"right": 585.17,
|
||||||
|
"bottom": 1144.5,
|
||||||
|
"width": 90.36,
|
||||||
|
"height": 29
|
||||||
|
},
|
||||||
|
"containerSelector": "#s3-sub",
|
||||||
|
"text": "memory",
|
||||||
|
"fixHint": "Give each block its own zone, or put data-layout-allow-overlap on the text or on a container inside the scene. A marker on the scene root does not apply.",
|
||||||
|
"dataAttributes": {},
|
||||||
|
"sourceFile": "index.html",
|
||||||
|
"bbox": {
|
||||||
|
"x": 494.81,
|
||||||
|
"y": 1115.5,
|
||||||
|
"width": 90.36,
|
||||||
|
"height": 29
|
||||||
|
},
|
||||||
|
"firstSeen": 8.916,
|
||||||
|
"lastSeen": 10.48,
|
||||||
|
"occurrences": 11,
|
||||||
|
"heldMs": 1564,
|
||||||
|
"times": [
|
||||||
|
8.916,
|
||||||
|
9.073,
|
||||||
|
9.229,
|
||||||
|
9.385,
|
||||||
|
9.542,
|
||||||
|
9.698,
|
||||||
|
9.855,
|
||||||
|
10.011,
|
||||||
|
10.168,
|
||||||
|
10.324,
|
||||||
|
10.48
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"code": "container_overflow",
|
||||||
|
"severity": "info",
|
||||||
|
"time": 1.556,
|
||||||
|
"selector": "#s1-photo",
|
||||||
|
"message": "Element extends outside a clipping layout container.",
|
||||||
|
"rect": {
|
||||||
|
"left": -10.75,
|
||||||
|
"top": -13.43,
|
||||||
|
"right": 1090.75,
|
||||||
|
"bottom": 1363.43,
|
||||||
|
"width": 1101.49,
|
||||||
|
"height": 1376.86
|
||||||
|
},
|
||||||
|
"containerSelector": "#s1",
|
||||||
|
"fixHint": "Resize/reposition the child or container, or mark intentional overflow with data-layout-allow-overflow.",
|
||||||
|
"containerRect": {
|
||||||
|
"left": 0,
|
||||||
|
"top": 0,
|
||||||
|
"right": 1080,
|
||||||
|
"bottom": 1350,
|
||||||
|
"width": 1080,
|
||||||
|
"height": 1350
|
||||||
|
},
|
||||||
|
"overflow": {
|
||||||
|
"left": 10.75,
|
||||||
|
"right": 10.75,
|
||||||
|
"top": 13.43,
|
||||||
|
"bottom": 13.43
|
||||||
|
},
|
||||||
|
"dataAttributes": {},
|
||||||
|
"sourceFile": "index.html",
|
||||||
|
"bbox": {
|
||||||
|
"x": -10.75,
|
||||||
|
"y": -13.43,
|
||||||
|
"width": 1101.49,
|
||||||
|
"height": 1376.86
|
||||||
|
},
|
||||||
|
"firstSeen": 1.556,
|
||||||
|
"lastSeen": 1.556,
|
||||||
|
"occurrences": 1,
|
||||||
|
"heldMs": 0,
|
||||||
|
"times": [
|
||||||
|
1.556
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"code": "container_overflow",
|
||||||
|
"severity": "info",
|
||||||
|
"time": 10.889,
|
||||||
|
"selector": "#s4-photo",
|
||||||
|
"message": "Element extends outside a clipping layout container.",
|
||||||
|
"rect": {
|
||||||
|
"left": -38.34,
|
||||||
|
"top": -22.72,
|
||||||
|
"right": 1118.34,
|
||||||
|
"bottom": 662.72,
|
||||||
|
"width": 1156.68,
|
||||||
|
"height": 685.44
|
||||||
|
},
|
||||||
|
"containerSelector": "#s4",
|
||||||
|
"fixHint": "Resize/reposition the child or container, or mark intentional overflow with data-layout-allow-overflow.",
|
||||||
|
"containerRect": {
|
||||||
|
"left": 0,
|
||||||
|
"top": 0,
|
||||||
|
"right": 1080,
|
||||||
|
"bottom": 1350,
|
||||||
|
"width": 1080,
|
||||||
|
"height": 1350
|
||||||
|
},
|
||||||
|
"overflow": {
|
||||||
|
"left": 38.34,
|
||||||
|
"right": 38.34,
|
||||||
|
"top": 22.72
|
||||||
|
},
|
||||||
|
"dataAttributes": {},
|
||||||
|
"sourceFile": "index.html",
|
||||||
|
"bbox": {
|
||||||
|
"x": -38.34,
|
||||||
|
"y": -22.72,
|
||||||
|
"width": 1156.68,
|
||||||
|
"height": 685.44
|
||||||
|
},
|
||||||
|
"firstSeen": 10.889,
|
||||||
|
"lastSeen": 10.889,
|
||||||
|
"occurrences": 1,
|
||||||
|
"heldMs": 0,
|
||||||
|
"times": [
|
||||||
|
10.889
|
||||||
|
]
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"duration": 28,
|
||||||
|
"samples": [
|
||||||
|
1.556,
|
||||||
|
4.667,
|
||||||
|
7.778,
|
||||||
|
10.889,
|
||||||
|
14,
|
||||||
|
17.111,
|
||||||
|
20.222,
|
||||||
|
23.333,
|
||||||
|
26.444
|
||||||
|
],
|
||||||
|
"transitionSamples": [],
|
||||||
|
"transitionSamplesDropped": 0,
|
||||||
|
"tolerance": 2,
|
||||||
|
"totalIssueCount": 3,
|
||||||
|
"truncated": false
|
||||||
|
},
|
||||||
|
"motion": {
|
||||||
|
"ok": true,
|
||||||
|
"errorCount": 0,
|
||||||
|
"warningCount": 0,
|
||||||
|
"infoCount": 0,
|
||||||
|
"findings": [],
|
||||||
|
"enabled": false,
|
||||||
|
"samples": 0
|
||||||
|
},
|
||||||
|
"contrast": {
|
||||||
|
"ok": true,
|
||||||
|
"errorCount": 0,
|
||||||
|
"warningCount": 2,
|
||||||
|
"infoCount": 0,
|
||||||
|
"findings": [
|
||||||
|
{
|
||||||
|
"code": "contrast_aa_failure",
|
||||||
|
"severity": "warning",
|
||||||
|
"message": "Contrast is 1.89:1; WCAG AA requires 4.5:1.",
|
||||||
|
"text": "06 / 08",
|
||||||
|
"fg": "rgb(168,162,151)",
|
||||||
|
"bg": "rgb(222,222,222)",
|
||||||
|
"ratio": 1.89,
|
||||||
|
"requiredRatio": 4.5,
|
||||||
|
"suggestedColor": "rgb(102,98,92)",
|
||||||
|
"large": false,
|
||||||
|
"selector": "div > section:nth-of-type(6) > div:nth-of-type(3) > div",
|
||||||
|
"dataAttributes": {},
|
||||||
|
"sourceFile": "index.html",
|
||||||
|
"bbox": {
|
||||||
|
"x": 895.859375,
|
||||||
|
"y": 69.5,
|
||||||
|
"width": 120.140625,
|
||||||
|
"height": 29
|
||||||
|
},
|
||||||
|
"time": 20.222,
|
||||||
|
"times": [
|
||||||
|
20.222
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"code": "contrast_aa_failure",
|
||||||
|
"severity": "warning",
|
||||||
|
"message": "Contrast is 1.17:1; WCAG AA requires 3:1.",
|
||||||
|
"text": "06",
|
||||||
|
"fg": "rgb(236,230,218)",
|
||||||
|
"bg": "rgb(214,214,214)",
|
||||||
|
"ratio": 1.17,
|
||||||
|
"requiredRatio": 3,
|
||||||
|
"suggestedColor": "rgb(123,120,114)",
|
||||||
|
"large": true,
|
||||||
|
"selector": "div > section:nth-of-type(6) > div:nth-of-type(3) > div > b",
|
||||||
|
"dataAttributes": {},
|
||||||
|
"sourceFile": "index.html",
|
||||||
|
"bbox": {
|
||||||
|
"x": 895.859375,
|
||||||
|
"y": 69.5,
|
||||||
|
"width": 34.328125,
|
||||||
|
"height": 29
|
||||||
|
},
|
||||||
|
"time": 20.222,
|
||||||
|
"times": [
|
||||||
|
20.222
|
||||||
|
]
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"enabled": true,
|
||||||
|
"samples": [
|
||||||
|
1.556,
|
||||||
|
7.778,
|
||||||
|
14,
|
||||||
|
20.222,
|
||||||
|
26.444
|
||||||
|
],
|
||||||
|
"checked": 33,
|
||||||
|
"passed": 31
|
||||||
|
},
|
||||||
|
"hdr": {
|
||||||
|
"autoPromotion": null,
|
||||||
|
"inspection": "available"
|
||||||
|
},
|
||||||
|
"snapshots": {
|
||||||
|
"enabled": false,
|
||||||
|
"files": [],
|
||||||
|
"times": [],
|
||||||
|
"findingFiles": []
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,349 @@
|
||||||
|
{
|
||||||
|
"ok": true,
|
||||||
|
"strict": false,
|
||||||
|
"browserSkipped": false,
|
||||||
|
"lint": {
|
||||||
|
"ok": true,
|
||||||
|
"errorCount": 0,
|
||||||
|
"warningCount": 11,
|
||||||
|
"infoCount": 0,
|
||||||
|
"findings": [
|
||||||
|
{
|
||||||
|
"code": "duplicate_media_discovery_risk",
|
||||||
|
"severity": "warning",
|
||||||
|
"message": "Detected 7 matching img entries with the same source/start/duration.",
|
||||||
|
"selector": "[data-composition-id]",
|
||||||
|
"dataAttributes": {},
|
||||||
|
"sourceFile": "/root/simbiot-harness/video/carousel-ai-future/index.html",
|
||||||
|
"bbox": {
|
||||||
|
"x": 0,
|
||||||
|
"y": 0,
|
||||||
|
"width": 0,
|
||||||
|
"height": 0
|
||||||
|
},
|
||||||
|
"time": 0,
|
||||||
|
"fixHint": "Avoid duplicated media nodes that can be discovered twice during compilation."
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"code": "timeline_track_too_dense",
|
||||||
|
"severity": "warning",
|
||||||
|
"message": "Track 1 has 8 timed elements in this HTML file. Smaller sub-compositions keep timelines easier to read, iterate on, and diff.",
|
||||||
|
"selector": "[data-composition-id]",
|
||||||
|
"dataAttributes": {},
|
||||||
|
"sourceFile": "/root/simbiot-harness/video/carousel-ai-future/index.html",
|
||||||
|
"bbox": {
|
||||||
|
"x": 0,
|
||||||
|
"y": 0,
|
||||||
|
"width": 0,
|
||||||
|
"height": 0
|
||||||
|
},
|
||||||
|
"time": 0,
|
||||||
|
"fixHint": "Move coherent scene groups into separate .html files under compositions/ and mount them from the parent with data-composition-src so the timeline stays easier to inspect, revise, and validate."
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"code": "nested_structure_needs_subcomposition",
|
||||||
|
"severity": "warning",
|
||||||
|
"message": "<div id=\"bg\"> is a timeline element that contains nested <div id=\"bg-grid\">. The timeline shows one row per top-level element, and the root composition is built only from sub-compositions.",
|
||||||
|
"selector": "#bg",
|
||||||
|
"dataAttributes": {},
|
||||||
|
"sourceFile": "/root/simbiot-harness/video/carousel-ai-future/index.html",
|
||||||
|
"bbox": {
|
||||||
|
"x": 0,
|
||||||
|
"y": 0,
|
||||||
|
"width": 0,
|
||||||
|
"height": 0
|
||||||
|
},
|
||||||
|
"time": 0,
|
||||||
|
"fixHint": "Move <div id=\"bg\"> and its contents into a sub-composition file and mount it with data-composition-src."
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"code": "nested_structure_needs_subcomposition",
|
||||||
|
"severity": "warning",
|
||||||
|
"message": "<section id=\"s1\"> is a timeline element that contains nested <div id=\"s1-photo\">. The timeline shows one row per top-level element, and the root composition is built only from sub-compositions.",
|
||||||
|
"selector": "#s1",
|
||||||
|
"dataAttributes": {},
|
||||||
|
"sourceFile": "/root/simbiot-harness/video/carousel-ai-future/index.html",
|
||||||
|
"bbox": {
|
||||||
|
"x": 0,
|
||||||
|
"y": 0,
|
||||||
|
"width": 0,
|
||||||
|
"height": 0
|
||||||
|
},
|
||||||
|
"time": 0,
|
||||||
|
"fixHint": "Move <section id=\"s1\"> and its contents into a sub-composition file and mount it with data-composition-src."
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"code": "nested_structure_needs_subcomposition",
|
||||||
|
"severity": "warning",
|
||||||
|
"message": "<section id=\"s2\"> is a timeline element that contains nested <div>. The timeline shows one row per top-level element, and the root composition is built only from sub-compositions.",
|
||||||
|
"selector": "#s2",
|
||||||
|
"dataAttributes": {},
|
||||||
|
"sourceFile": "/root/simbiot-harness/video/carousel-ai-future/index.html",
|
||||||
|
"bbox": {
|
||||||
|
"x": 0,
|
||||||
|
"y": 0,
|
||||||
|
"width": 0,
|
||||||
|
"height": 0
|
||||||
|
},
|
||||||
|
"time": 0,
|
||||||
|
"fixHint": "Move <section id=\"s2\"> and its contents into a sub-composition file and mount it with data-composition-src."
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"code": "nested_structure_needs_subcomposition",
|
||||||
|
"severity": "warning",
|
||||||
|
"message": "<section id=\"s3\"> is a timeline element that contains nested <div>. The timeline shows one row per top-level element, and the root composition is built only from sub-compositions.",
|
||||||
|
"selector": "#s3",
|
||||||
|
"dataAttributes": {},
|
||||||
|
"sourceFile": "/root/simbiot-harness/video/carousel-ai-future/index.html",
|
||||||
|
"bbox": {
|
||||||
|
"x": 0,
|
||||||
|
"y": 0,
|
||||||
|
"width": 0,
|
||||||
|
"height": 0
|
||||||
|
},
|
||||||
|
"time": 0,
|
||||||
|
"fixHint": "Move <section id=\"s3\"> and its contents into a sub-composition file and mount it with data-composition-src."
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"code": "nested_structure_needs_subcomposition",
|
||||||
|
"severity": "warning",
|
||||||
|
"message": "<section id=\"s4\"> is a timeline element that contains nested <div id=\"s4-photo\">. The timeline shows one row per top-level element, and the root composition is built only from sub-compositions.",
|
||||||
|
"selector": "#s4",
|
||||||
|
"dataAttributes": {},
|
||||||
|
"sourceFile": "/root/simbiot-harness/video/carousel-ai-future/index.html",
|
||||||
|
"bbox": {
|
||||||
|
"x": 0,
|
||||||
|
"y": 0,
|
||||||
|
"width": 0,
|
||||||
|
"height": 0
|
||||||
|
},
|
||||||
|
"time": 0,
|
||||||
|
"fixHint": "Move <section id=\"s4\"> and its contents into a sub-composition file and mount it with data-composition-src."
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"code": "nested_structure_needs_subcomposition",
|
||||||
|
"severity": "warning",
|
||||||
|
"message": "<section id=\"s5\"> is a timeline element that contains nested <div>. The timeline shows one row per top-level element, and the root composition is built only from sub-compositions.",
|
||||||
|
"selector": "#s5",
|
||||||
|
"dataAttributes": {},
|
||||||
|
"sourceFile": "/root/simbiot-harness/video/carousel-ai-future/index.html",
|
||||||
|
"bbox": {
|
||||||
|
"x": 0,
|
||||||
|
"y": 0,
|
||||||
|
"width": 0,
|
||||||
|
"height": 0
|
||||||
|
},
|
||||||
|
"time": 0,
|
||||||
|
"fixHint": "Move <section id=\"s5\"> and its contents into a sub-composition file and mount it with data-composition-src."
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"code": "nested_structure_needs_subcomposition",
|
||||||
|
"severity": "warning",
|
||||||
|
"message": "<section id=\"s6\"> is a timeline element that contains nested <div id=\"s6-photo\">. The timeline shows one row per top-level element, and the root composition is built only from sub-compositions.",
|
||||||
|
"selector": "#s6",
|
||||||
|
"dataAttributes": {},
|
||||||
|
"sourceFile": "/root/simbiot-harness/video/carousel-ai-future/index.html",
|
||||||
|
"bbox": {
|
||||||
|
"x": 0,
|
||||||
|
"y": 0,
|
||||||
|
"width": 0,
|
||||||
|
"height": 0
|
||||||
|
},
|
||||||
|
"time": 0,
|
||||||
|
"fixHint": "Move <section id=\"s6\"> and its contents into a sub-composition file and mount it with data-composition-src."
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"code": "nested_structure_needs_subcomposition",
|
||||||
|
"severity": "warning",
|
||||||
|
"message": "<section id=\"s7\"> is a timeline element that contains nested <div>. The timeline shows one row per top-level element, and the root composition is built only from sub-compositions.",
|
||||||
|
"selector": "#s7",
|
||||||
|
"dataAttributes": {},
|
||||||
|
"sourceFile": "/root/simbiot-harness/video/carousel-ai-future/index.html",
|
||||||
|
"bbox": {
|
||||||
|
"x": 0,
|
||||||
|
"y": 0,
|
||||||
|
"width": 0,
|
||||||
|
"height": 0
|
||||||
|
},
|
||||||
|
"time": 0,
|
||||||
|
"fixHint": "Move <section id=\"s7\"> and its contents into a sub-composition file and mount it with data-composition-src."
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"code": "nested_structure_needs_subcomposition",
|
||||||
|
"severity": "warning",
|
||||||
|
"message": "<section id=\"s8\"> is a timeline element that contains nested <div id=\"s8-photo\">. The timeline shows one row per top-level element, and the root composition is built only from sub-compositions.",
|
||||||
|
"selector": "#s8",
|
||||||
|
"dataAttributes": {},
|
||||||
|
"sourceFile": "/root/simbiot-harness/video/carousel-ai-future/index.html",
|
||||||
|
"bbox": {
|
||||||
|
"x": 0,
|
||||||
|
"y": 0,
|
||||||
|
"width": 0,
|
||||||
|
"height": 0
|
||||||
|
},
|
||||||
|
"time": 0,
|
||||||
|
"fixHint": "Move <section id=\"s8\"> and its contents into a sub-composition file and mount it with data-composition-src."
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"filesScanned": 1
|
||||||
|
},
|
||||||
|
"runtime": {
|
||||||
|
"ok": true,
|
||||||
|
"errorCount": 0,
|
||||||
|
"warningCount": 0,
|
||||||
|
"infoCount": 0,
|
||||||
|
"findings": []
|
||||||
|
},
|
||||||
|
"layout": {
|
||||||
|
"ok": true,
|
||||||
|
"errorCount": 0,
|
||||||
|
"warningCount": 0,
|
||||||
|
"infoCount": 2,
|
||||||
|
"findings": [
|
||||||
|
{
|
||||||
|
"code": "container_overflow",
|
||||||
|
"severity": "info",
|
||||||
|
"time": 1.556,
|
||||||
|
"selector": "#s1-photo",
|
||||||
|
"message": "Element extends outside a clipping layout container.",
|
||||||
|
"rect": {
|
||||||
|
"left": -10.75,
|
||||||
|
"top": -13.43,
|
||||||
|
"right": 1090.75,
|
||||||
|
"bottom": 1363.43,
|
||||||
|
"width": 1101.49,
|
||||||
|
"height": 1376.86
|
||||||
|
},
|
||||||
|
"containerSelector": "#s1",
|
||||||
|
"fixHint": "Resize/reposition the child or container, or mark intentional overflow with data-layout-allow-overflow.",
|
||||||
|
"containerRect": {
|
||||||
|
"left": 0,
|
||||||
|
"top": 0,
|
||||||
|
"right": 1080,
|
||||||
|
"bottom": 1350,
|
||||||
|
"width": 1080,
|
||||||
|
"height": 1350
|
||||||
|
},
|
||||||
|
"overflow": {
|
||||||
|
"left": 10.75,
|
||||||
|
"right": 10.75,
|
||||||
|
"top": 13.43,
|
||||||
|
"bottom": 13.43
|
||||||
|
},
|
||||||
|
"dataAttributes": {},
|
||||||
|
"sourceFile": "index.html",
|
||||||
|
"bbox": {
|
||||||
|
"x": -10.75,
|
||||||
|
"y": -13.43,
|
||||||
|
"width": 1101.49,
|
||||||
|
"height": 1376.86
|
||||||
|
},
|
||||||
|
"firstSeen": 1.556,
|
||||||
|
"lastSeen": 1.556,
|
||||||
|
"occurrences": 1,
|
||||||
|
"heldMs": 0,
|
||||||
|
"times": [
|
||||||
|
1.556
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"code": "container_overflow",
|
||||||
|
"severity": "info",
|
||||||
|
"time": 10.889,
|
||||||
|
"selector": "#s4-photo",
|
||||||
|
"message": "Element extends outside a clipping layout container.",
|
||||||
|
"rect": {
|
||||||
|
"left": -38.34,
|
||||||
|
"top": -22.72,
|
||||||
|
"right": 1118.34,
|
||||||
|
"bottom": 662.72,
|
||||||
|
"width": 1156.68,
|
||||||
|
"height": 685.44
|
||||||
|
},
|
||||||
|
"containerSelector": "#s4",
|
||||||
|
"fixHint": "Resize/reposition the child or container, or mark intentional overflow with data-layout-allow-overflow.",
|
||||||
|
"containerRect": {
|
||||||
|
"left": 0,
|
||||||
|
"top": 0,
|
||||||
|
"right": 1080,
|
||||||
|
"bottom": 1350,
|
||||||
|
"width": 1080,
|
||||||
|
"height": 1350
|
||||||
|
},
|
||||||
|
"overflow": {
|
||||||
|
"left": 38.34,
|
||||||
|
"right": 38.34,
|
||||||
|
"top": 22.72
|
||||||
|
},
|
||||||
|
"dataAttributes": {},
|
||||||
|
"sourceFile": "index.html",
|
||||||
|
"bbox": {
|
||||||
|
"x": -38.34,
|
||||||
|
"y": -22.72,
|
||||||
|
"width": 1156.68,
|
||||||
|
"height": 685.44
|
||||||
|
},
|
||||||
|
"firstSeen": 10.889,
|
||||||
|
"lastSeen": 10.889,
|
||||||
|
"occurrences": 1,
|
||||||
|
"heldMs": 0,
|
||||||
|
"times": [
|
||||||
|
10.889
|
||||||
|
]
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"duration": 28,
|
||||||
|
"samples": [
|
||||||
|
1.556,
|
||||||
|
4.667,
|
||||||
|
7.778,
|
||||||
|
10.889,
|
||||||
|
14,
|
||||||
|
17.111,
|
||||||
|
20.222,
|
||||||
|
23.333,
|
||||||
|
26.444
|
||||||
|
],
|
||||||
|
"transitionSamples": [],
|
||||||
|
"transitionSamplesDropped": 0,
|
||||||
|
"tolerance": 2,
|
||||||
|
"totalIssueCount": 2,
|
||||||
|
"truncated": false
|
||||||
|
},
|
||||||
|
"motion": {
|
||||||
|
"ok": true,
|
||||||
|
"errorCount": 0,
|
||||||
|
"warningCount": 0,
|
||||||
|
"infoCount": 0,
|
||||||
|
"findings": [],
|
||||||
|
"enabled": false,
|
||||||
|
"samples": 0
|
||||||
|
},
|
||||||
|
"contrast": {
|
||||||
|
"ok": true,
|
||||||
|
"errorCount": 0,
|
||||||
|
"warningCount": 0,
|
||||||
|
"infoCount": 0,
|
||||||
|
"findings": [],
|
||||||
|
"enabled": true,
|
||||||
|
"samples": [
|
||||||
|
1.556,
|
||||||
|
7.778,
|
||||||
|
14,
|
||||||
|
20.222,
|
||||||
|
26.444
|
||||||
|
],
|
||||||
|
"checked": 33,
|
||||||
|
"passed": 33
|
||||||
|
},
|
||||||
|
"hdr": {
|
||||||
|
"autoPromotion": null,
|
||||||
|
"inspection": "available"
|
||||||
|
},
|
||||||
|
"snapshots": {
|
||||||
|
"enabled": false,
|
||||||
|
"files": [],
|
||||||
|
"times": [],
|
||||||
|
"findingFiles": []
|
||||||
|
}
|
||||||
|
}
|
||||||
1
video/carousel-ai-future/.hyperframes/history-id
Normal file
1
video/carousel-ai-future/.hyperframes/history-id
Normal file
|
|
@ -0,0 +1 @@
|
||||||
|
5bd53911-66b8-4a0c-9dab-511418b519eb
|
||||||
371
video/carousel-ai-future/.hyperframes/video-state.json
Normal file
371
video/carousel-ai-future/.hyperframes/video-state.json
Normal file
|
|
@ -0,0 +1,371 @@
|
||||||
|
{
|
||||||
|
"version": 1,
|
||||||
|
"historyId": "5bd53911-66b8-4a0c-9dab-511418b519eb",
|
||||||
|
"currentRevision": "cb6944df-e4c3-4713-a9e1-bf2619c1d3fe",
|
||||||
|
"pendingChanges": false,
|
||||||
|
"files": {
|
||||||
|
"fonts/anton-400-latin.woff2": {
|
||||||
|
"hash": "d0fa07ff63dd60cbc0e2f58e29c802dca2a5ae0276c999f59c6111ab7bbaec3b",
|
||||||
|
"content": "/root/.cache/hyperframes/history/5bd53911-66b8-4a0c-9dab-511418b519eb/blobs/d0/d0fa07ff63dd60cbc0e2f58e29c802dca2a5ae0276c999f59c6111ab7bbaec3b"
|
||||||
|
},
|
||||||
|
"fonts/dm-sans-400-latin.woff2": {
|
||||||
|
"hash": "4ab51eb2cd7305d177187908d6397474d4520663f6c6e572feb0a64f4fa80006",
|
||||||
|
"content": "/root/.cache/hyperframes/history/5bd53911-66b8-4a0c-9dab-511418b519eb/blobs/4a/4ab51eb2cd7305d177187908d6397474d4520663f6c6e572feb0a64f4fa80006"
|
||||||
|
},
|
||||||
|
"fonts/dm-sans-700-latin.woff2": {
|
||||||
|
"hash": "35c5efa0e5daa52ee5c6500f5be354bf751fb65c4e49e1d6806c6eb5883e8fe9",
|
||||||
|
"content": "/root/.cache/hyperframes/history/5bd53911-66b8-4a0c-9dab-511418b519eb/blobs/35/35c5efa0e5daa52ee5c6500f5be354bf751fb65c4e49e1d6806c6eb5883e8fe9"
|
||||||
|
},
|
||||||
|
"fonts/fraunces-400-latin.woff2": {
|
||||||
|
"hash": "e558f39453a9c611908be04294b50dea5f21ae6c49b41c6e47f4115e91f90209",
|
||||||
|
"content": "/root/.cache/hyperframes/history/5bd53911-66b8-4a0c-9dab-511418b519eb/blobs/e5/e558f39453a9c611908be04294b50dea5f21ae6c49b41c6e47f4115e91f90209"
|
||||||
|
},
|
||||||
|
"fonts/fraunces-700-latin.woff2": {
|
||||||
|
"hash": "c38570d224b830056e69484bb9e768e1d3fa7ba4755c8891a3c6d366194d2ff3",
|
||||||
|
"content": "/root/.cache/hyperframes/history/5bd53911-66b8-4a0c-9dab-511418b519eb/blobs/c3/c38570d224b830056e69484bb9e768e1d3fa7ba4755c8891a3c6d366194d2ff3"
|
||||||
|
},
|
||||||
|
"fonts/inter-400-latin.woff2": {
|
||||||
|
"hash": "8909904ab6c872eb994093482a88a28eca2cd95912d7b6fecd72103b0dc07edc",
|
||||||
|
"content": "/root/.cache/hyperframes/history/5bd53911-66b8-4a0c-9dab-511418b519eb/blobs/89/8909904ab6c872eb994093482a88a28eca2cd95912d7b6fecd72103b0dc07edc"
|
||||||
|
},
|
||||||
|
"fonts/inter-600-latin.woff2": {
|
||||||
|
"hash": "f9a06e79cd3a2a20951c0f0e28f66dd0e6d3fda73911d640a2125c8fcb78f21a",
|
||||||
|
"content": "/root/.cache/hyperframes/history/5bd53911-66b8-4a0c-9dab-511418b519eb/blobs/f9/f9a06e79cd3a2a20951c0f0e28f66dd0e6d3fda73911d640a2125c8fcb78f21a"
|
||||||
|
},
|
||||||
|
"fonts/jetbrains-mono-400-latin.woff2": {
|
||||||
|
"hash": "14425ba9c695763c1547f48a206b7aa60350a33ae23de09f0407877f3fcd89eb",
|
||||||
|
"content": "/root/.cache/hyperframes/history/5bd53911-66b8-4a0c-9dab-511418b519eb/blobs/14/14425ba9c695763c1547f48a206b7aa60350a33ae23de09f0407877f3fcd89eb"
|
||||||
|
},
|
||||||
|
"fonts/jetbrains-mono-700-latin.woff2": {
|
||||||
|
"hash": "d0d4e818808f2a0ba39b2b09d1989366f63494e295f003c7ef436697378507e8",
|
||||||
|
"content": "/root/.cache/hyperframes/history/5bd53911-66b8-4a0c-9dab-511418b519eb/blobs/d0/d0d4e818808f2a0ba39b2b09d1989366f63494e295f003c7ef436697378507e8"
|
||||||
|
},
|
||||||
|
"fonts/space-grotesk-500-latin.woff2": {
|
||||||
|
"hash": "1b1a8131d9edf975d9decee81e2f2bf504812f7a4f498e5500f28a613e22e64c",
|
||||||
|
"content": "/root/.cache/hyperframes/history/5bd53911-66b8-4a0c-9dab-511418b519eb/blobs/1b/1b1a8131d9edf975d9decee81e2f2bf504812f7a4f498e5500f28a613e22e64c"
|
||||||
|
},
|
||||||
|
"fonts/space-grotesk-700-latin.woff2": {
|
||||||
|
"hash": "35f8aec56cfd5cbfdb03cc68733a54a0b05bb3617ffcd5fd332badc0b045ca55",
|
||||||
|
"content": "/root/.cache/hyperframes/history/5bd53911-66b8-4a0c-9dab-511418b519eb/blobs/35/35f8aec56cfd5cbfdb03cc68733a54a0b05bb3617ffcd5fd332badc0b045ca55"
|
||||||
|
},
|
||||||
|
"fonts/unbounded-400-latin.woff2": {
|
||||||
|
"hash": "b0a91553c77f72f04eb4e8756003d926a0414c1710236caeb42fa4854bf6217e",
|
||||||
|
"content": "/root/.cache/hyperframes/history/5bd53911-66b8-4a0c-9dab-511418b519eb/blobs/b0/b0a91553c77f72f04eb4e8756003d926a0414c1710236caeb42fa4854bf6217e"
|
||||||
|
},
|
||||||
|
"fonts/unbounded-700-latin.woff2": {
|
||||||
|
"hash": "477fa23002517a32f232316d859e7b672a044f20073babec8ed3dbcfdb8e041a",
|
||||||
|
"content": "/root/.cache/hyperframes/history/5bd53911-66b8-4a0c-9dab-511418b519eb/blobs/47/477fa23002517a32f232316d859e7b672a044f20073babec8ed3dbcfdb8e041a"
|
||||||
|
},
|
||||||
|
"gsap.min.js": {
|
||||||
|
"hash": "c174bfce53a729418d57a8ad8625e7247c793a22fef8e2851e3cfa3de9cd8280",
|
||||||
|
"content": "/root/.cache/hyperframes/history/5bd53911-66b8-4a0c-9dab-511418b519eb/blobs/c1/c174bfce53a729418d57a8ad8625e7247c793a22fef8e2851e3cfa3de9cd8280"
|
||||||
|
},
|
||||||
|
"hyperframes.json": {
|
||||||
|
"hash": "53dbce1e19aa713cbb12ee0bc4d206143b45ab15e6ffbfcaa8f69572d4d24d50",
|
||||||
|
"content": "/root/.cache/hyperframes/history/5bd53911-66b8-4a0c-9dab-511418b519eb/blobs/53/53dbce1e19aa713cbb12ee0bc4d206143b45ab15e6ffbfcaa8f69572d4d24d50"
|
||||||
|
},
|
||||||
|
"img/cover.jpg": {
|
||||||
|
"hash": "b354dea67ab39b2329a2b01a5b7764122e2ffd272df4ffacd495cc5cc560bdde",
|
||||||
|
"content": "/root/.cache/hyperframes/history/5bd53911-66b8-4a0c-9dab-511418b519eb/blobs/b3/b354dea67ab39b2329a2b01a5b7764122e2ffd272df4ffacd495cc5cc560bdde"
|
||||||
|
},
|
||||||
|
"img/portrait.jpg": {
|
||||||
|
"hash": "dbcde4d23c6009326bec35f0789fa87c58261a14320124446e0266f9ddf7a8e1",
|
||||||
|
"content": "/root/.cache/hyperframes/history/5bd53911-66b8-4a0c-9dab-511418b519eb/blobs/db/dbcde4d23c6009326bec35f0789fa87c58261a14320124446e0266f9ddf7a8e1"
|
||||||
|
},
|
||||||
|
"img/river.jpg": {
|
||||||
|
"hash": "fbc1363bb04d93e2e744e75c84c41b22fa6e6c154c191354c64eb61e827e8ed8",
|
||||||
|
"content": "/root/.cache/hyperframes/history/5bd53911-66b8-4a0c-9dab-511418b519eb/blobs/fb/fbc1363bb04d93e2e744e75c84c41b22fa6e6c154c191354c64eb61e827e8ed8"
|
||||||
|
},
|
||||||
|
"img/shkor-labs-icon-lime.svg": {
|
||||||
|
"hash": "5234334e6d63c4970e053571b0efef93f015d3bbac31468bd858adae4bf8f827",
|
||||||
|
"content": "/root/.cache/hyperframes/history/5bd53911-66b8-4a0c-9dab-511418b519eb/blobs/52/5234334e6d63c4970e053571b0efef93f015d3bbac31468bd858adae4bf8f827"
|
||||||
|
},
|
||||||
|
"img/shkor-labs-logo-dark-bg.svg": {
|
||||||
|
"hash": "aed6e9880779deb71db536d70d2d4f20dcc08fd5c7fdb4eff79d7947094ad27a",
|
||||||
|
"content": "/root/.cache/hyperframes/history/5bd53911-66b8-4a0c-9dab-511418b519eb/blobs/ae/aed6e9880779deb71db536d70d2d4f20dcc08fd5c7fdb4eff79d7947094ad27a"
|
||||||
|
},
|
||||||
|
"img/smile.jpg": {
|
||||||
|
"hash": "28e1338b51b1a00ed01c518438e8c5e58e7e61286d18a334140f9dcc530bc822",
|
||||||
|
"content": "/root/.cache/hyperframes/history/5bd53911-66b8-4a0c-9dab-511418b519eb/blobs/28/28e1338b51b1a00ed01c518438e8c5e58e7e61286d18a334140f9dcc530bc822"
|
||||||
|
},
|
||||||
|
"index.html": {
|
||||||
|
"hash": "9d1af25cd61121390a58b26a3dd644896c11f132443c55f9ca77efff39b0043e",
|
||||||
|
"content": "/root/.cache/hyperframes/history/5bd53911-66b8-4a0c-9dab-511418b519eb/blobs/9d/9d1af25cd61121390a58b26a3dd644896c11f132443c55f9ca77efff39b0043e"
|
||||||
|
},
|
||||||
|
"meta.json": {
|
||||||
|
"hash": "bc5031782c867773319fe5be5ac409f1b69b138d1603082ccc65f36a0d25165d",
|
||||||
|
"content": "/root/.cache/hyperframes/history/5bd53911-66b8-4a0c-9dab-511418b519eb/blobs/bc/bc5031782c867773319fe5be5ac409f1b69b138d1603082ccc65f36a0d25165d"
|
||||||
|
},
|
||||||
|
"package.json": {
|
||||||
|
"hash": "c56fd7910f4675b4e99427e9018a71155759d0356268fe5ede7359d6fb6456bc",
|
||||||
|
"content": "/root/.cache/hyperframes/history/5bd53911-66b8-4a0c-9dab-511418b519eb/blobs/c5/c56fd7910f4675b4e99427e9018a71155759d0356268fe5ede7359d6fb6456bc"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"revisions": {
|
||||||
|
"cb6944df-e4c3-4713-a9e1-bf2619c1d3fe": {
|
||||||
|
"actor": {
|
||||||
|
"kind": "outside",
|
||||||
|
"name": "Outside"
|
||||||
|
},
|
||||||
|
"label": "Changed outside the app",
|
||||||
|
"startedAt": 1792320695097,
|
||||||
|
"endedAt": 1792320695098,
|
||||||
|
"files": {
|
||||||
|
"index.html": {
|
||||||
|
"before": "/root/.cache/hyperframes/history/5bd53911-66b8-4a0c-9dab-511418b519eb/blobs/0c/0c197b07d415b250bfe1a493c1f68b8773f94968c74c96a87a948987cd4d2525",
|
||||||
|
"after": "/root/.cache/hyperframes/history/5bd53911-66b8-4a0c-9dab-511418b519eb/blobs/9d/9d1af25cd61121390a58b26a3dd644896c11f132443c55f9ca77efff39b0043e"
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"checks": {
|
||||||
|
"latest": {
|
||||||
|
"revision": "cb6944df-e4c3-4713-a9e1-bf2619c1d3fe",
|
||||||
|
"id": "d3d98fba-a47c-48b3-9af0-cfbe8fbd59d3"
|
||||||
|
},
|
||||||
|
"revisions": {
|
||||||
|
"cb6944df-e4c3-4713-a9e1-bf2619c1d3fe": [
|
||||||
|
{
|
||||||
|
"id": "d3d98fba-a47c-48b3-9af0-cfbe8fbd59d3",
|
||||||
|
"scope": "project",
|
||||||
|
"report": "/root/simbiot-harness/video/carousel-ai-future/.hyperframes/artifacts/checks/d3d98fba-a47c-48b3-9af0-cfbe8fbd59d3.json",
|
||||||
|
"metadata": {
|
||||||
|
"ok": true,
|
||||||
|
"browserSkipped": false,
|
||||||
|
"options": {
|
||||||
|
"samples": 9,
|
||||||
|
"atTransitions": false,
|
||||||
|
"maxIssues": 80,
|
||||||
|
"collapseStatic": true,
|
||||||
|
"tolerance": 2,
|
||||||
|
"timeout": 3000,
|
||||||
|
"contrast": true,
|
||||||
|
"strict": false,
|
||||||
|
"snapshots": false,
|
||||||
|
"browserGpuMode": "auto"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"createdAt": 1792320707993,
|
||||||
|
"contentHash": "8f82dca54ec0fbf416f376b51ae993f6c53b3b96a6a9958bb89b158f28cadb79",
|
||||||
|
"revision": "cb6944df-e4c3-4713-a9e1-bf2619c1d3fe",
|
||||||
|
"inputFingerprint": "1744ae12fc6ef23f9d39746874d400082951a71fdbd6f201089d434fcfad4253",
|
||||||
|
"inputScope": "local-project-files",
|
||||||
|
"attribution": "recorded-revision"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
|
"unversioned": [
|
||||||
|
{
|
||||||
|
"id": "98172ef6-c78c-434a-bc4e-0c36d8be2e31",
|
||||||
|
"scope": "project",
|
||||||
|
"report": "/root/simbiot-harness/video/carousel-ai-future/.hyperframes/artifacts/checks/98172ef6-c78c-434a-bc4e-0c36d8be2e31.json",
|
||||||
|
"metadata": {
|
||||||
|
"ok": false,
|
||||||
|
"browserSkipped": false,
|
||||||
|
"options": {
|
||||||
|
"samples": 9,
|
||||||
|
"atTransitions": false,
|
||||||
|
"maxIssues": 80,
|
||||||
|
"collapseStatic": true,
|
||||||
|
"tolerance": 2,
|
||||||
|
"timeout": 3000,
|
||||||
|
"contrast": true,
|
||||||
|
"strict": false,
|
||||||
|
"snapshots": false,
|
||||||
|
"browserGpuMode": "auto"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"createdAt": 1792320662829,
|
||||||
|
"contentHash": "d26a27fa55329b3065c5096e2f55f4123db05276510f538ab866f5462ac7b63c",
|
||||||
|
"revision": null,
|
||||||
|
"inputFingerprint": "cfc992ae267a5ae3bdea9ad7846fee347d074e0743a82b1d9cf83ef95df68284",
|
||||||
|
"inputScope": "local-project-files",
|
||||||
|
"attribution": "unversioned"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
|
"snapshots": {
|
||||||
|
"latest": {
|
||||||
|
"revision": "cb6944df-e4c3-4713-a9e1-bf2619c1d3fe",
|
||||||
|
"id": "5f718204-636d-4e6b-9fad-e726a82e1c02-7"
|
||||||
|
},
|
||||||
|
"revisions": {
|
||||||
|
"cb6944df-e4c3-4713-a9e1-bf2619c1d3fe": [
|
||||||
|
{
|
||||||
|
"scope": "full",
|
||||||
|
"id": "5f718204-636d-4e6b-9fad-e726a82e1c02-0",
|
||||||
|
"image": "/tmp/car/frame-00-at-3.3s.png",
|
||||||
|
"time": 3.3,
|
||||||
|
"metadata": {
|
||||||
|
"width": 1080,
|
||||||
|
"height": 1350,
|
||||||
|
"zoomScale": 1,
|
||||||
|
"browserGpuMode": "auto",
|
||||||
|
"warnings": [],
|
||||||
|
"partial": false
|
||||||
|
},
|
||||||
|
"createdAt": 1792320717653,
|
||||||
|
"contentHash": "a63e8c557535fe90a4da7fcfe14d39d0831641bfeaadbe194f9b8056600b2018",
|
||||||
|
"revision": "cb6944df-e4c3-4713-a9e1-bf2619c1d3fe",
|
||||||
|
"inputFingerprint": "1744ae12fc6ef23f9d39746874d400082951a71fdbd6f201089d434fcfad4253",
|
||||||
|
"inputScope": "local-project-files",
|
||||||
|
"attribution": "recorded-revision"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"scope": "full",
|
||||||
|
"id": "5f718204-636d-4e6b-9fad-e726a82e1c02-1",
|
||||||
|
"image": "/tmp/car/frame-01-at-6.8s.png",
|
||||||
|
"time": 6.8,
|
||||||
|
"metadata": {
|
||||||
|
"width": 1080,
|
||||||
|
"height": 1350,
|
||||||
|
"zoomScale": 1,
|
||||||
|
"browserGpuMode": "auto",
|
||||||
|
"warnings": [],
|
||||||
|
"partial": false
|
||||||
|
},
|
||||||
|
"createdAt": 1792320717654,
|
||||||
|
"contentHash": "e881b47a9079a0463cee4cb4a99366d8fef79669884c5fd070540bc077fe7633",
|
||||||
|
"revision": "cb6944df-e4c3-4713-a9e1-bf2619c1d3fe",
|
||||||
|
"inputFingerprint": "1744ae12fc6ef23f9d39746874d400082951a71fdbd6f201089d434fcfad4253",
|
||||||
|
"inputScope": "local-project-files",
|
||||||
|
"attribution": "recorded-revision"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"scope": "full",
|
||||||
|
"id": "5f718204-636d-4e6b-9fad-e726a82e1c02-2",
|
||||||
|
"image": "/tmp/car/frame-02-at-10.3s.png",
|
||||||
|
"time": 10.3,
|
||||||
|
"metadata": {
|
||||||
|
"width": 1080,
|
||||||
|
"height": 1350,
|
||||||
|
"zoomScale": 1,
|
||||||
|
"browserGpuMode": "auto",
|
||||||
|
"warnings": [],
|
||||||
|
"partial": false
|
||||||
|
},
|
||||||
|
"createdAt": 1792320717654,
|
||||||
|
"contentHash": "b8cc1a32a379f74fce35d656ea7916b91b55f2b74b3bf332f903cef9043e25d6",
|
||||||
|
"revision": "cb6944df-e4c3-4713-a9e1-bf2619c1d3fe",
|
||||||
|
"inputFingerprint": "1744ae12fc6ef23f9d39746874d400082951a71fdbd6f201089d434fcfad4253",
|
||||||
|
"inputScope": "local-project-files",
|
||||||
|
"attribution": "recorded-revision"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"scope": "full",
|
||||||
|
"id": "5f718204-636d-4e6b-9fad-e726a82e1c02-3",
|
||||||
|
"image": "/tmp/car/frame-03-at-13.8s.png",
|
||||||
|
"time": 13.8,
|
||||||
|
"metadata": {
|
||||||
|
"width": 1080,
|
||||||
|
"height": 1350,
|
||||||
|
"zoomScale": 1,
|
||||||
|
"browserGpuMode": "auto",
|
||||||
|
"warnings": [],
|
||||||
|
"partial": false
|
||||||
|
},
|
||||||
|
"createdAt": 1792320717654,
|
||||||
|
"contentHash": "166e0f79ec49fda554c8b6232c9df57d5349ab91d5a1dc94aeb3f5eb23eb2b09",
|
||||||
|
"revision": "cb6944df-e4c3-4713-a9e1-bf2619c1d3fe",
|
||||||
|
"inputFingerprint": "1744ae12fc6ef23f9d39746874d400082951a71fdbd6f201089d434fcfad4253",
|
||||||
|
"inputScope": "local-project-files",
|
||||||
|
"attribution": "recorded-revision"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"scope": "full",
|
||||||
|
"id": "5f718204-636d-4e6b-9fad-e726a82e1c02-4",
|
||||||
|
"image": "/tmp/car/frame-04-at-17.3s.png",
|
||||||
|
"time": 17.3,
|
||||||
|
"metadata": {
|
||||||
|
"width": 1080,
|
||||||
|
"height": 1350,
|
||||||
|
"zoomScale": 1,
|
||||||
|
"browserGpuMode": "auto",
|
||||||
|
"warnings": [],
|
||||||
|
"partial": false
|
||||||
|
},
|
||||||
|
"createdAt": 1792320717654,
|
||||||
|
"contentHash": "f71312294eacd3eba590d48c4e6e02a57c1e47d5d6bc17f5fa6eb8e0fe8f1f58",
|
||||||
|
"revision": "cb6944df-e4c3-4713-a9e1-bf2619c1d3fe",
|
||||||
|
"inputFingerprint": "1744ae12fc6ef23f9d39746874d400082951a71fdbd6f201089d434fcfad4253",
|
||||||
|
"inputScope": "local-project-files",
|
||||||
|
"attribution": "recorded-revision"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"scope": "full",
|
||||||
|
"id": "5f718204-636d-4e6b-9fad-e726a82e1c02-5",
|
||||||
|
"image": "/tmp/car/frame-05-at-20.8s.png",
|
||||||
|
"time": 20.8,
|
||||||
|
"metadata": {
|
||||||
|
"width": 1080,
|
||||||
|
"height": 1350,
|
||||||
|
"zoomScale": 1,
|
||||||
|
"browserGpuMode": "auto",
|
||||||
|
"warnings": [],
|
||||||
|
"partial": false
|
||||||
|
},
|
||||||
|
"createdAt": 1792320717654,
|
||||||
|
"contentHash": "3ee7ee22e951af47db52eb276144c2ffd10f8c18043bcf55c95e17974416284a",
|
||||||
|
"revision": "cb6944df-e4c3-4713-a9e1-bf2619c1d3fe",
|
||||||
|
"inputFingerprint": "1744ae12fc6ef23f9d39746874d400082951a71fdbd6f201089d434fcfad4253",
|
||||||
|
"inputScope": "local-project-files",
|
||||||
|
"attribution": "recorded-revision"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"scope": "full",
|
||||||
|
"id": "5f718204-636d-4e6b-9fad-e726a82e1c02-6",
|
||||||
|
"image": "/tmp/car/frame-06-at-24.3s.png",
|
||||||
|
"time": 24.3,
|
||||||
|
"metadata": {
|
||||||
|
"width": 1080,
|
||||||
|
"height": 1350,
|
||||||
|
"zoomScale": 1,
|
||||||
|
"browserGpuMode": "auto",
|
||||||
|
"warnings": [],
|
||||||
|
"partial": false
|
||||||
|
},
|
||||||
|
"createdAt": 1792320717654,
|
||||||
|
"contentHash": "a512464cce3ac8a6777b9de072f297fb08c22471807f46f5e7ce66ca3b7ebbca",
|
||||||
|
"revision": "cb6944df-e4c3-4713-a9e1-bf2619c1d3fe",
|
||||||
|
"inputFingerprint": "1744ae12fc6ef23f9d39746874d400082951a71fdbd6f201089d434fcfad4253",
|
||||||
|
"inputScope": "local-project-files",
|
||||||
|
"attribution": "recorded-revision"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"scope": "full",
|
||||||
|
"id": "5f718204-636d-4e6b-9fad-e726a82e1c02-7",
|
||||||
|
"image": "/tmp/car/frame-07-at-27.8s.png",
|
||||||
|
"time": 27.8,
|
||||||
|
"metadata": {
|
||||||
|
"width": 1080,
|
||||||
|
"height": 1350,
|
||||||
|
"zoomScale": 1,
|
||||||
|
"browserGpuMode": "auto",
|
||||||
|
"warnings": [],
|
||||||
|
"partial": false
|
||||||
|
},
|
||||||
|
"createdAt": 1792320717654,
|
||||||
|
"contentHash": "13dba2c729d6a816f76c192ed2c59949aee1608cb946be3301fee231192a1955",
|
||||||
|
"revision": "cb6944df-e4c3-4713-a9e1-bf2619c1d3fe",
|
||||||
|
"inputFingerprint": "1744ae12fc6ef23f9d39746874d400082951a71fdbd6f201089d434fcfad4253",
|
||||||
|
"inputScope": "local-project-files",
|
||||||
|
"attribution": "recorded-revision"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
},
|
||||||
|
"unversioned": []
|
||||||
|
},
|
||||||
|
"renders": {
|
||||||
|
"latest": {
|
||||||
|
"id": "7d2d6aaa-7754-4c53-9615-493a377f52ab",
|
||||||
|
"completedAt": 1792320762063,
|
||||||
|
"output": "/srv/raw.cil.by/simbiot/carousel-ai-future/carousel-animated.mp4",
|
||||||
|
"status": "completed",
|
||||||
|
"revision": "cb6944df-e4c3-4713-a9e1-bf2619c1d3fe"
|
||||||
|
},
|
||||||
|
"retainedRevisions": [
|
||||||
|
"cb6944df-e4c3-4713-a9e1-bf2619c1d3fe"
|
||||||
|
]
|
||||||
|
},
|
||||||
|
"pendingArtifactCleanup": []
|
||||||
|
}
|
||||||
BIN
video/carousel-ai-future/fonts/anton-400-latin.woff2
Normal file
BIN
video/carousel-ai-future/fonts/anton-400-latin.woff2
Normal file
Binary file not shown.
BIN
video/carousel-ai-future/fonts/dm-sans-400-latin.woff2
Normal file
BIN
video/carousel-ai-future/fonts/dm-sans-400-latin.woff2
Normal file
Binary file not shown.
BIN
video/carousel-ai-future/fonts/dm-sans-700-latin.woff2
Normal file
BIN
video/carousel-ai-future/fonts/dm-sans-700-latin.woff2
Normal file
Binary file not shown.
BIN
video/carousel-ai-future/fonts/fraunces-400-latin.woff2
Normal file
BIN
video/carousel-ai-future/fonts/fraunces-400-latin.woff2
Normal file
Binary file not shown.
BIN
video/carousel-ai-future/fonts/fraunces-700-latin.woff2
Normal file
BIN
video/carousel-ai-future/fonts/fraunces-700-latin.woff2
Normal file
Binary file not shown.
BIN
video/carousel-ai-future/fonts/inter-400-latin.woff2
Normal file
BIN
video/carousel-ai-future/fonts/inter-400-latin.woff2
Normal file
Binary file not shown.
BIN
video/carousel-ai-future/fonts/inter-600-latin.woff2
Normal file
BIN
video/carousel-ai-future/fonts/inter-600-latin.woff2
Normal file
Binary file not shown.
BIN
video/carousel-ai-future/fonts/jetbrains-mono-400-latin.woff2
Normal file
BIN
video/carousel-ai-future/fonts/jetbrains-mono-400-latin.woff2
Normal file
Binary file not shown.
BIN
video/carousel-ai-future/fonts/jetbrains-mono-700-latin.woff2
Normal file
BIN
video/carousel-ai-future/fonts/jetbrains-mono-700-latin.woff2
Normal file
Binary file not shown.
BIN
video/carousel-ai-future/fonts/space-grotesk-500-latin.woff2
Normal file
BIN
video/carousel-ai-future/fonts/space-grotesk-500-latin.woff2
Normal file
Binary file not shown.
BIN
video/carousel-ai-future/fonts/space-grotesk-700-latin.woff2
Normal file
BIN
video/carousel-ai-future/fonts/space-grotesk-700-latin.woff2
Normal file
Binary file not shown.
BIN
video/carousel-ai-future/fonts/unbounded-400-latin.woff2
Normal file
BIN
video/carousel-ai-future/fonts/unbounded-400-latin.woff2
Normal file
Binary file not shown.
BIN
video/carousel-ai-future/fonts/unbounded-700-latin.woff2
Normal file
BIN
video/carousel-ai-future/fonts/unbounded-700-latin.woff2
Normal file
Binary file not shown.
11
video/carousel-ai-future/gsap.min.js
vendored
Normal file
11
video/carousel-ai-future/gsap.min.js
vendored
Normal file
File diff suppressed because one or more lines are too long
12
video/carousel-ai-future/hyperframes.json
Normal file
12
video/carousel-ai-future/hyperframes.json
Normal file
|
|
@ -0,0 +1,12 @@
|
||||||
|
{
|
||||||
|
"$schema": "https://hyperframes.heygen.com/schema/hyperframes.json",
|
||||||
|
"registry": "https://raw.githubusercontent.com/heygen-com/hyperframes/main/registry",
|
||||||
|
"paths": {
|
||||||
|
"blocks": "compositions",
|
||||||
|
"components": "compositions/components",
|
||||||
|
"assets": "assets"
|
||||||
|
},
|
||||||
|
"media": {
|
||||||
|
"autoProxy": true
|
||||||
|
}
|
||||||
|
}
|
||||||
BIN
video/carousel-ai-future/img/cover.jpg
Normal file
BIN
video/carousel-ai-future/img/cover.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 54 KiB |
BIN
video/carousel-ai-future/img/portrait.jpg
Normal file
BIN
video/carousel-ai-future/img/portrait.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 171 KiB |
BIN
video/carousel-ai-future/img/river.jpg
Normal file
BIN
video/carousel-ai-future/img/river.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 218 KiB |
1
video/carousel-ai-future/img/shkor-labs-icon-lime.svg
Normal file
1
video/carousel-ai-future/img/shkor-labs-icon-lime.svg
Normal file
|
|
@ -0,0 +1 @@
|
||||||
|
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" width="512" height="512"><title>Shkor Labs</title><rect width="512" height="512" rx="112" fill="#c6ff4d"/><circle cx="256" cy="256" r="160" fill="none" stroke="#050506" stroke-width="26" stroke-dasharray="39.00 52.00" stroke-linecap="round"/><circle cx="256" cy="256" r="60.80" fill="#050506"/></svg>
|
||||||
|
After Width: | Height: | Size: 362 B |
1
video/carousel-ai-future/img/shkor-labs-logo-dark-bg.svg
Normal file
1
video/carousel-ai-future/img/shkor-labs-logo-dark-bg.svg
Normal file
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 11 KiB |
BIN
video/carousel-ai-future/img/smile.jpg
Normal file
BIN
video/carousel-ai-future/img/smile.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 117 KiB |
293
video/carousel-ai-future/index.html
Normal file
293
video/carousel-ai-future/index.html
Normal file
|
|
@ -0,0 +1,293 @@
|
||||||
|
<!doctype html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8" />
|
||||||
|
<meta name="viewport" content="width=1080, height=1350" />
|
||||||
|
<title>Alex Shkor — The harness is the product</title>
|
||||||
|
<script src="./gsap.min.js"></script>
|
||||||
|
<style>
|
||||||
|
@font-face { font-family: "Fraunces"; font-weight: 400; src: url("fonts/fraunces-400-latin.woff2") format("woff2"); }
|
||||||
|
@font-face { font-family: "Fraunces"; font-weight: 700; src: url("fonts/fraunces-700-latin.woff2") format("woff2"); }
|
||||||
|
@font-face { font-family: "DM Sans"; font-weight: 400; src: url("fonts/dm-sans-400-latin.woff2") format("woff2"); }
|
||||||
|
@font-face { font-family: "DM Sans"; font-weight: 700; src: url("fonts/dm-sans-700-latin.woff2") format("woff2"); }
|
||||||
|
@font-face { font-family: "JetBrains Mono"; font-weight: 400; src: url("fonts/jetbrains-mono-400-latin.woff2") format("woff2"); }
|
||||||
|
@font-face { font-family: "JetBrains Mono"; font-weight: 700; src: url("fonts/jetbrains-mono-700-latin.woff2") format("woff2"); }
|
||||||
|
|
||||||
|
:root { --carbon: #050506; --carbon2: #111113; --bone: #ece6da; --dim: #a8a297; --lime: #c6ff4d; --line: rgba(236, 230, 218, 0.14); }
|
||||||
|
* { margin: 0; padding: 0; box-sizing: border-box; }
|
||||||
|
html, body { width: 1080px; height: 1350px; overflow: hidden; background: var(--carbon); }
|
||||||
|
body { color: var(--bone); font-family: "DM Sans", sans-serif; }
|
||||||
|
#root { position: relative; width: 100%; height: 100%; overflow: hidden; }
|
||||||
|
.clip { position: absolute; inset: 0; }
|
||||||
|
.mono { font-family: "JetBrains Mono", monospace; }
|
||||||
|
.serif { font-family: "Fraunces", serif; }
|
||||||
|
.lime { color: var(--lime); }
|
||||||
|
em { font-style: normal; color: var(--lime); }
|
||||||
|
|
||||||
|
#bg { background: radial-gradient(900px 1100px at 70% 20%, #18181b 0%, var(--carbon) 70%); }
|
||||||
|
#bg-grid { position: absolute; inset: 0; background-image: linear-gradient(var(--line) 1px, transparent 1px), linear-gradient(90deg, var(--line) 1px, transparent 1px); background-size: 90px 90px; opacity: 0.35; }
|
||||||
|
|
||||||
|
/* общая рамка слайда */
|
||||||
|
.slide { overflow: hidden; }
|
||||||
|
.top { position: absolute; left: 64px; right: 64px; top: 56px; display: flex; justify-content: space-between; align-items: center; z-index: 5; }
|
||||||
|
.top img { display: block; width: 56px; height: 56px; }
|
||||||
|
.count { font-size: 22px; letter-spacing: 0.18em; color: #c9c3b8; background: rgba(5, 5, 6, 0.72); padding: 10px 16px; border-radius: 20px; }
|
||||||
|
.count b { color: var(--bone); font-weight: 700; }
|
||||||
|
.foot { position: absolute; left: 64px; right: 64px; bottom: 54px; display: flex; justify-content: space-between; align-items: center; font-size: 22px; letter-spacing: 0.14em; color: var(--dim); text-transform: uppercase; z-index: 5; }
|
||||||
|
.swipe { display: flex; align-items: center; gap: 14px; color: var(--lime); }
|
||||||
|
.swipe svg { display: block; width: 44px; height: 20px; }
|
||||||
|
.kick { font-size: 24px; letter-spacing: 0.26em; color: var(--lime); text-transform: uppercase; }
|
||||||
|
.body { position: absolute; left: 64px; right: 64px; }
|
||||||
|
.q { font-family: "Fraunces", serif; font-weight: 700; letter-spacing: -0.02em; line-height: 1.04; }
|
||||||
|
.sub { font-size: 34px; line-height: 1.4; color: var(--dim); }
|
||||||
|
.rule { width: 120px; height: 6px; background: var(--lime); }
|
||||||
|
.photo { position: absolute; overflow: hidden; }
|
||||||
|
.photo img { display: block; width: 100%; height: 100%; object-fit: cover; }
|
||||||
|
|
||||||
|
/* S1 обложка */
|
||||||
|
#s1 .photo { right: 0; top: 0; width: 1080px; height: 1350px; }
|
||||||
|
#s1 .photo img { object-position: 60% 20%; }
|
||||||
|
#s1-fade { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(5, 5, 6, 0.1) 0%, rgba(5, 5, 6, 0.15) 35%, rgba(5, 5, 6, 0.92) 64%, #050506 82%); }
|
||||||
|
#s1 .body { bottom: 150px; }
|
||||||
|
#s1 .q { font-size: 104px; margin-top: 26px; }
|
||||||
|
#s1-by { margin-top: 34px; font-size: 30px; color: var(--bone); }
|
||||||
|
#s1-by span { color: var(--dim); }
|
||||||
|
|
||||||
|
/* S2 модели дешевеют */
|
||||||
|
#s2 .body { top: 210px; }
|
||||||
|
#s2 .q { font-size: 96px; margin-top: 30px; }
|
||||||
|
#s2-chart { position: absolute; left: 64px; right: 64px; bottom: 150px; height: 360px; }
|
||||||
|
#s2 .sub { margin-top: 40px; max-width: 860px; }
|
||||||
|
|
||||||
|
/* S3 харнес вокруг модели */
|
||||||
|
#s3 .body { top: 190px; }
|
||||||
|
#s3 .q { font-size: 80px; margin-top: 26px; }
|
||||||
|
#s3-ring { position: absolute; left: 50%; top: 560px; width: 560px; height: 560px; margin-left: -280px; }
|
||||||
|
#s3-core { position: absolute; left: 180px; top: 180px; width: 200px; height: 200px; border-radius: 50%; border: 2px solid var(--line); background: var(--carbon2); display: flex; flex-direction: column; align-items: center; justify-content: center; }
|
||||||
|
#s3-core b { font-size: 28px; letter-spacing: 0.16em; }
|
||||||
|
#s3-core span { font-size: 18px; color: var(--dim); margin-top: 6px; letter-spacing: 0.1em; }
|
||||||
|
#s3-orbit { position: absolute; inset: 40px; border-radius: 50%; border: 2px dashed rgba(198, 255, 77, 0.45); }
|
||||||
|
.chip { position: absolute; width: 170px; margin-left: -85px; margin-top: -26px; height: 52px; border-radius: 26px; background: var(--lime); color: var(--carbon); font-size: 22px; font-weight: 700; display: flex; align-items: center; justify-content: center; }
|
||||||
|
#s3 .sub { position: absolute; left: 64px; right: 64px; bottom: 96px; font-size: 30px; }
|
||||||
|
|
||||||
|
/* S4 ничего не принадлежит */
|
||||||
|
#s4 .photo { left: 0; top: 0; width: 1080px; height: 640px; }
|
||||||
|
#s4 .photo img { object-position: 50% 30%; }
|
||||||
|
#s4-fade { position: absolute; left: 0; right: 0; top: 380px; height: 262px; background: linear-gradient(180deg, rgba(5, 5, 6, 0), #050506); }
|
||||||
|
#s4 .body { top: 640px; }
|
||||||
|
#s4 .q { font-size: 76px; margin-top: 22px; }
|
||||||
|
#s4 .sub { margin-top: 30px; font-size: 32px; }
|
||||||
|
|
||||||
|
/* S5 ответы vs капитал */
|
||||||
|
#s5 .body { top: 230px; }
|
||||||
|
.pair { margin-top: 44px; }
|
||||||
|
.pair .q { font-size: 84px; }
|
||||||
|
.pair .q.dimq { color: var(--dim); }
|
||||||
|
#s5 .rule { margin: 54px 0; }
|
||||||
|
#s5 .sub { margin-top: 56px; font-size: 32px; }
|
||||||
|
|
||||||
|
/* S6 оргструктура */
|
||||||
|
#s6 .photo { right: 0; top: 0; width: 520px; height: 1350px; }
|
||||||
|
#s6 .photo img { object-position: 50% 20%; }
|
||||||
|
#s6-fade { position: absolute; right: 0; top: 0; width: 520px; height: 1350px; background: linear-gradient(90deg, #050506 0%, rgba(5, 5, 6, 0.25) 45%, rgba(5, 5, 6, 0) 100%); }
|
||||||
|
#s6 .body { top: 250px; right: 420px; }
|
||||||
|
#s6 .q { font-size: 84px; margin-top: 26px; }
|
||||||
|
#s6 .sub { margin-top: 36px; font-size: 30px; }
|
||||||
|
#s6-split { display: flex; gap: 8px; margin-top: 40px; }
|
||||||
|
#s6-split i { display: block; width: 46px; height: 46px; border-radius: 50%; }
|
||||||
|
.hum { background: var(--bone); }
|
||||||
|
.agt { background: transparent; border: 4px solid var(--lime); }
|
||||||
|
|
||||||
|
/* S7 агенты нанимают агентов */
|
||||||
|
#s7 .body { top: 200px; }
|
||||||
|
#s7 .q { font-size: 92px; margin-top: 26px; }
|
||||||
|
#s7-net { position: absolute; left: 64px; right: 64px; top: 560px; height: 440px; }
|
||||||
|
#s7 .sub { position: absolute; left: 64px; right: 64px; bottom: 140px; font-size: 32px; }
|
||||||
|
|
||||||
|
/* S8 финал */
|
||||||
|
#s8 .photo { left: 64px; top: 170px; width: 300px; height: 300px; border-radius: 50%; border: 6px solid var(--lime); }
|
||||||
|
#s8 .body { top: 530px; }
|
||||||
|
#s8 .q { font-size: 76px; }
|
||||||
|
#s8-cta { margin-top: 50px; display: flex; align-items: center; gap: 26px; }
|
||||||
|
#s8-btn { padding: 22px 40px; border-radius: 40px; background: var(--lime); color: var(--carbon); font-size: 34px; font-weight: 700; }
|
||||||
|
#s8-x { font-size: 32px; color: var(--bone); }
|
||||||
|
#s8-logo { position: absolute; left: 64px; bottom: 120px; width: 380px; }
|
||||||
|
</style>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<div id="root" data-composition-id="main" data-start="0" data-duration="28" data-width="1080" data-height="1350">
|
||||||
|
<div id="bg" class="clip" data-start="0" data-duration="28" data-track-index="0"><div id="bg-grid"></div></div>
|
||||||
|
|
||||||
|
<!-- 1 обложка -->
|
||||||
|
<section id="s1" class="clip slide" data-start="0" data-duration="3.5" data-track-index="1">
|
||||||
|
<div class="photo" id="s1-photo"><img src="img/cover.jpg" alt="" /></div>
|
||||||
|
<div id="s1-fade"></div>
|
||||||
|
<div class="top"><img src="img/shkor-labs-icon-lime.svg" alt="" /><div class="count mono"><b>01</b> / 08</div></div>
|
||||||
|
<div class="body">
|
||||||
|
<div class="kick mono" id="s1-k">6 thoughts on the future of AI</div>
|
||||||
|
<div class="q" id="s1-q">The model is not the product. <em>The harness is.</em></div>
|
||||||
|
<div id="s1-by">Alex Shkor <span>· founder, Shkor Labs & Cooperative 42</span></div>
|
||||||
|
</div>
|
||||||
|
<div class="foot mono"><span>cil.by</span><span class="swipe">swipe <svg viewBox="0 0 44 20"><path d="M0 10 H40 M30 2 L40 10 L30 18" stroke="#c6ff4d" stroke-width="3" fill="none" /></svg></span></div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<!-- 2 модели дешевеют -->
|
||||||
|
<section id="s2" class="clip slide" data-start="3.5" data-duration="3.5" data-track-index="1">
|
||||||
|
<div class="top"><img src="img/shkor-labs-icon-lime.svg" alt="" /><div class="count mono"><b>02</b> / 08</div></div>
|
||||||
|
<div class="body">
|
||||||
|
<div class="kick mono">01 · Models</div>
|
||||||
|
<div class="q" id="s2-q">Models are rented, interchangeable and trending to <em>free</em>.</div>
|
||||||
|
<div class="sub" id="s2-sub">Supply grows every quarter. Prices race to zero. Building on the model alone means building on sand.</div>
|
||||||
|
</div>
|
||||||
|
<svg id="s2-chart" viewBox="0 0 952 360">
|
||||||
|
<line x1="0" y1="340" x2="952" y2="340" stroke="rgba(236,230,218,0.25)" stroke-width="2" />
|
||||||
|
<path id="s2-line" d="M0 30 C 160 40, 240 110, 360 170 S 600 290, 952 326" fill="none" stroke="#c6ff4d" stroke-width="6" stroke-linecap="round" />
|
||||||
|
<text x="0" y="22" fill="#a8a297" font-family="JetBrains Mono" font-size="20">PRICE PER TOKEN</text>
|
||||||
|
<text x="952" y="310" fill="#c6ff4d" font-family="JetBrains Mono" font-size="22" text-anchor="end">→ 0</text>
|
||||||
|
</svg>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<!-- 3 харнес вокруг модели -->
|
||||||
|
<section id="s3" class="clip slide" data-start="7" data-duration="3.5" data-track-index="1">
|
||||||
|
<div class="top"><img src="img/shkor-labs-icon-lime.svg" alt="" /><div class="count mono"><b>03</b> / 08</div></div>
|
||||||
|
<div class="body">
|
||||||
|
<div class="kick mono">02 · The harness</div>
|
||||||
|
<div class="q" id="s3-q">The harness is everything <em>around</em> the model.</div>
|
||||||
|
</div>
|
||||||
|
<div id="s3-ring">
|
||||||
|
<div id="s3-orbit"></div>
|
||||||
|
<div id="s3-core"><b class="mono">MODEL</b><span class="mono">a commodity</span></div>
|
||||||
|
<div class="chip" style="left:280px;top:40px">principles</div>
|
||||||
|
<div class="chip" style="left:488px;top:160px">decisions</div>
|
||||||
|
<div class="chip" style="left:488px;top:400px">skills</div>
|
||||||
|
<div class="chip" style="left:280px;top:520px">memory</div>
|
||||||
|
<div class="chip" style="left:72px;top:400px">tools</div>
|
||||||
|
<div class="chip" style="left:72px;top:160px">rituals</div>
|
||||||
|
</div>
|
||||||
|
<div class="sub" id="s3-sub">The model thinks. The harness decides what it thinks about, how, and for whom.</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<!-- 4 ничего не принадлежит -->
|
||||||
|
<section id="s4" class="clip slide" data-start="10.5" data-duration="3.5" data-track-index="1">
|
||||||
|
<div class="photo" id="s4-photo"><img src="img/river.jpg" alt="" /></div>
|
||||||
|
<div id="s4-fade"></div>
|
||||||
|
<div class="top"><img src="img/shkor-labs-icon-lime.svg" alt="" /><div class="count mono"><b>04</b> / 08</div></div>
|
||||||
|
<div class="body">
|
||||||
|
<div class="kick mono">03 · The trap</div>
|
||||||
|
<div class="q" id="s4-q">A year of working with AI, and most people own <em>nothing</em> of it.</div>
|
||||||
|
<div class="sub" id="s4-sub">Every correction you type lives in a chat window. Scattered, forgotten, locked in someone else’s product.</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<!-- 5 ответы vs капитал -->
|
||||||
|
<section id="s5" class="clip slide" data-start="14" data-duration="3.5" data-track-index="1">
|
||||||
|
<div class="top"><img src="img/shkor-labs-icon-lime.svg" alt="" /><div class="count mono"><b>05</b> / 08</div></div>
|
||||||
|
<div class="body">
|
||||||
|
<div class="kick mono">04 · The shift</div>
|
||||||
|
<div class="pair">
|
||||||
|
<div class="q dimq" id="s5-a">Working with AI gives you answers.</div>
|
||||||
|
<div class="rule" id="s5-r"></div>
|
||||||
|
<div class="q" id="s5-b">Working on your harness gives you <em>equity</em>.</div>
|
||||||
|
</div>
|
||||||
|
<div class="sub" id="s5-sub">Competitors can rent the same models. They cannot copy two years of your harness.</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<!-- 6 пол-людей пол-агентов -->
|
||||||
|
<section id="s6" class="clip slide" data-start="17.5" data-duration="3.5" data-track-index="1">
|
||||||
|
<div class="photo" id="s6-photo"><img src="img/portrait.jpg" alt="" /></div>
|
||||||
|
<div id="s6-fade"></div>
|
||||||
|
<div class="top"><img src="img/shkor-labs-icon-lime.svg" alt="" /><div class="count mono"><b>06</b> / 08</div></div>
|
||||||
|
<div class="body">
|
||||||
|
<div class="kick mono">05 · The org</div>
|
||||||
|
<div class="q" id="s6-q">The org chart is half human, <em>half agents</em>.</div>
|
||||||
|
<div id="s6-split"><i class="hum"></i><i class="hum"></i><i class="hum"></i><i class="agt"></i><i class="agt"></i><i class="agt"></i></div>
|
||||||
|
<div class="sub" id="s6-sub">In our studio a board decision at 10:00 is law across every agent by 10:04.</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<!-- 7 агенты нанимают агентов -->
|
||||||
|
<section id="s7" class="clip slide" data-start="21" data-duration="3.5" data-track-index="1">
|
||||||
|
<div class="top"><img src="img/shkor-labs-icon-lime.svg" alt="" /><div class="count mono"><b>07</b> / 08</div></div>
|
||||||
|
<div class="body">
|
||||||
|
<div class="kick mono">06 · Next</div>
|
||||||
|
<div class="q" id="s7-q">Next, agents <em>hire agents</em>.</div>
|
||||||
|
</div>
|
||||||
|
<svg id="s7-net" viewBox="0 0 952 440">
|
||||||
|
<g stroke="rgba(198,255,77,0.55)" stroke-width="3" class="s7l">
|
||||||
|
<line x1="120" y1="220" x2="360" y2="90" /><line x1="120" y1="220" x2="360" y2="350" />
|
||||||
|
<line x1="360" y1="90" x2="600" y2="220" /><line x1="360" y1="350" x2="600" y2="220" />
|
||||||
|
<line x1="600" y1="220" x2="840" y2="90" /><line x1="600" y1="220" x2="840" y2="350" /><line x1="360" y1="90" x2="840" y2="90" />
|
||||||
|
</g>
|
||||||
|
<g class="s7n">
|
||||||
|
<circle cx="120" cy="220" r="34" fill="#ece6da" /><circle cx="360" cy="90" r="30" fill="none" stroke="#c6ff4d" stroke-width="6" />
|
||||||
|
<circle cx="360" cy="350" r="30" fill="none" stroke="#c6ff4d" stroke-width="6" /><circle cx="600" cy="220" r="34" fill="#c6ff4d" />
|
||||||
|
<circle cx="840" cy="90" r="30" fill="none" stroke="#c6ff4d" stroke-width="6" /><circle cx="840" cy="350" r="30" fill="none" stroke="#c6ff4d" stroke-width="6" />
|
||||||
|
</g>
|
||||||
|
</svg>
|
||||||
|
<div class="sub" id="s7-sub">The agent mesh becomes a labor market. A tuned harness for a niche becomes a product you can sell.</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<!-- 8 финал -->
|
||||||
|
<section id="s8" class="clip slide" data-start="24.5" data-duration="3.5" data-track-index="1">
|
||||||
|
<div class="photo" id="s8-photo"><img src="img/smile.jpg" alt="" /></div>
|
||||||
|
<div class="top" style="justify-content:flex-end"><div class="count mono"><b>08</b> / 08</div></div>
|
||||||
|
<div class="body">
|
||||||
|
<div class="q" id="s8-q">Everyone will have a harness in five years. <em>Own yours</em>, before it owns your future.</div>
|
||||||
|
<div id="s8-cta"><div id="s8-btn">Start at cil.by</div><div id="s8-x" class="mono">@alexshkor</div></div>
|
||||||
|
</div>
|
||||||
|
<img id="s8-logo" src="img/shkor-labs-logo-dark-bg.svg" alt="" />
|
||||||
|
</section>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
const tl = gsap.timeline({ paused: true });
|
||||||
|
const IN = (sel, at, from = { opacity: 0, y: 36 }, d = 0.6) =>
|
||||||
|
tl.fromTo(sel, from, { opacity: 1, x: 0, y: 0, scale: 1, duration: d, ease: "power3.out" }, at);
|
||||||
|
tl.fromTo("#bg-grid", { y: 0 }, { y: 90, duration: 28, ease: "none" }, 0);
|
||||||
|
|
||||||
|
// 1
|
||||||
|
tl.fromTo("#s1-photo", { scale: 1.12 }, { scale: 1, duration: 3.4, ease: "power2.out" }, 0);
|
||||||
|
IN("#s1-k", 0.3, { opacity: 0, y: 16 }, 0.5);
|
||||||
|
IN("#s1-q", 0.5);
|
||||||
|
IN("#s1-by", 1.1, { opacity: 0, y: 16 }, 0.5);
|
||||||
|
// 2
|
||||||
|
IN("#s2-q", 3.7);
|
||||||
|
const L = document.getElementById("s2-line").getTotalLength();
|
||||||
|
tl.fromTo("#s2-line", { strokeDasharray: L, strokeDashoffset: L }, { strokeDashoffset: 0, duration: 1.4, ease: "power2.inOut" }, 4.1);
|
||||||
|
IN("#s2-sub", 4.6, { opacity: 0, y: 16 }, 0.5);
|
||||||
|
// 3
|
||||||
|
IN("#s3-q", 7.2);
|
||||||
|
tl.fromTo("#s3-orbit", { rotation: 0 }, { rotation: 60, duration: 3.5, ease: "none" }, 7);
|
||||||
|
tl.fromTo("#s3 .chip", { opacity: 0, scale: 0.6 }, { opacity: 1, scale: 1, duration: 0.4, stagger: 0.12, ease: "back.out(2)" }, 7.6);
|
||||||
|
IN("#s3-sub", 8.6, { opacity: 0, y: 16 }, 0.5);
|
||||||
|
// 4
|
||||||
|
tl.fromTo("#s4-photo", { scale: 1.1 }, { scale: 1, duration: 3.4, ease: "power2.out" }, 10.5);
|
||||||
|
IN("#s4-q", 10.8);
|
||||||
|
IN("#s4-sub", 11.5, { opacity: 0, y: 16 }, 0.5);
|
||||||
|
// 5
|
||||||
|
IN("#s5-a", 14.2);
|
||||||
|
tl.fromTo("#s5-r", { scaleX: 0, transformOrigin: "left center" }, { scaleX: 1, duration: 0.5, ease: "power3.inOut" }, 14.8);
|
||||||
|
IN("#s5-b", 15.1);
|
||||||
|
IN("#s5-sub", 15.8, { opacity: 0, y: 16 }, 0.5);
|
||||||
|
// 6
|
||||||
|
tl.fromTo("#s6-photo", { x: 80, opacity: 0 }, { x: 0, opacity: 1, duration: 0.8, ease: "power3.out" }, 17.5);
|
||||||
|
IN("#s6-q", 17.8);
|
||||||
|
tl.fromTo("#s6-split i", { opacity: 0, scale: 0.4 }, { opacity: 1, scale: 1, duration: 0.3, stagger: 0.1, ease: "back.out(2)" }, 18.4);
|
||||||
|
IN("#s6-sub", 19.1, { opacity: 0, y: 16 }, 0.5);
|
||||||
|
// 7
|
||||||
|
IN("#s7-q", 21.2);
|
||||||
|
tl.fromTo("#s7-net .s7n circle", { opacity: 0, scale: 0.3, transformOrigin: "50% 50%" }, { opacity: 1, scale: 1, duration: 0.35, stagger: 0.1, ease: "back.out(2)" }, 21.7);
|
||||||
|
tl.fromTo("#s7-net .s7l line", { opacity: 0 }, { opacity: 1, duration: 0.3, stagger: 0.08 }, 22.1);
|
||||||
|
IN("#s7-sub", 22.7, { opacity: 0, y: 16 }, 0.5);
|
||||||
|
// 8
|
||||||
|
IN("#s8-photo", 24.6, { opacity: 0, scale: 0.8 }, 0.6);
|
||||||
|
IN("#s8-q", 24.9);
|
||||||
|
IN("#s8-cta", 25.6, { opacity: 0, y: 16 }, 0.5);
|
||||||
|
IN("#s8-logo", 26.0, { opacity: 0 }, 0.6);
|
||||||
|
|
||||||
|
window.__timelines = window.__timelines || {};
|
||||||
|
window.__timelines["main"] = tl;
|
||||||
|
</script>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
5
video/carousel-ai-future/meta.json
Normal file
5
video/carousel-ai-future/meta.json
Normal file
|
|
@ -0,0 +1,5 @@
|
||||||
|
{
|
||||||
|
"id": "carousel-ai-future",
|
||||||
|
"name": "carousel-ai-future",
|
||||||
|
"createdAt": "2026-10-17T10:55:57.466Z"
|
||||||
|
}
|
||||||
11
video/carousel-ai-future/package.json
Normal file
11
video/carousel-ai-future/package.json
Normal file
|
|
@ -0,0 +1,11 @@
|
||||||
|
{
|
||||||
|
"name": "carousel-ai-future",
|
||||||
|
"private": true,
|
||||||
|
"type": "module",
|
||||||
|
"scripts": {
|
||||||
|
"dev": "npx --yes hyperframes@0.8.168 preview",
|
||||||
|
"check": "npx --yes hyperframes@0.8.168 check",
|
||||||
|
"render": "npx --yes hyperframes@0.8.168 render",
|
||||||
|
"publish": "npx --yes hyperframes@0.8.168 publish"
|
||||||
|
}
|
||||||
|
}
|
||||||
Loading…
Reference in a new issue