@yojahny/wp-design-library 1.2.0 → 1.3.0

package/entries/veed/entry.md

@@ -0,0 +1,98 @@
+---
+slug: veed
+title: 'VEED: AI video creation platform'
+tier: inspiration
+source:
+  kind: public-site
+  url: https://www.veed.io/
+  license: Captured from a Refero-hosted recording and the live site; description only, no redistribution of the source.
+captured:
+  method: both
+  at: '2026-09-24'
+  tool: wp-design-library@1.2.0
+  captures:
+    - method: frames
+      input: https://images.refero.design/styles/refero.design/video/78c29fbf-be4e-4fc4-ad25-b377b1c6c751.mp4
+      artifacts:
+        - key: entries/veed/1/strip.webp
+          bytes: 239780
+          sha256: d18b9392525a700aadb1a55172390c8cfd55706e7035a1a093915653f097cede
+          uploaded: true
+      frames: 23
+      duration_ms: 11267
+    - method: both
+      input: https://www.veed.io/
+      artifacts:
+        - key: entries/veed/2/strip.webp
+          bytes: 389818
+          sha256: a203e2016d1ed93a2ca3f51297f0f2151d8f4fb18b6724269c5fbeb4001ed120
+          uploaded: true
+        - key: entries/veed/2/measure.json
+          bytes: 5957
+          sha256: 68777c4b3c38d474c2a5cebccabff6b0c76ab507ff3d446a1af02d781c4a2ded
+          uploaded: true
+        - key: entries/veed/2/screen-1440.png
+          bytes: 372084
+          sha256: d3d62a04e1adb830c125804e298e3df6ffc0f0ae56bfe6afe7e1c3ee1cb6514e
+          uploaded: true
+        - key: entries/veed/2/screen-390.png
+          bytes: 90686
+          sha256: 166d40b1f9597e84a82d89cc1994e168052df2eda906a570c3aafca1fd7ec255
+          uploaded: true
+media:
+  frames: 23
+  duration_ms: 11267
+roles:
+  - hero
+  - proof
+  - feature
+  - capability
+  - closing
+  - footer
+feel:
+  - light
+  - dark
+  - saas
+  - playful
+  - depth
+palette:
+  canvas: '#ffffff'
+  ink: '#111111'
+  accent: '#9cff39'
+type:
+  display: bold neutral sans, compact leading
+  body: neutral sans, concise product measure
+motion:
+  devices:
+    - reveal
+    - pan
+    - stack
+    - stagger
+  notes: >-
+    Eyeballed from 23 sampled frames, not measured. A sparse AI-video hero gives way to a moving row of creator
+    portraits and generated-video previews. Dark product panels stack examples, then editor controls and use-case cards
+    reveal in sequence before testimonial and footer content.
+ported_from: null
+---
+
+## What it does
+
+A video creation platform landing page that demonstrates social-ready output before explaining the AI generation and editing workflow. Creator faces and sample videos make the abstract promise tangible.
+
+## Section roster
+
+1. AI-video hero and creation action.
+2. Creator portraits and team proof.
+3. Generated video examples.
+4. Editing and brand controls.
+5. Use-case cards and closing action.
+
+## Why it works
+
+Showing sample output early makes the offer credible, while the restrained white canvas and green accent keep product UI easy to read. The cost is that video previews and dense editing controls need efficient loading and accessible alternatives.
+
+## Sources
+
+- [Refero style page](https://styles.refero.design/style/fff821ec-a3bf-41a5-aea2-626185bcd227) and its [recorded MP4](https://images.refero.design/styles/refero.design/video/78c29fbf-be4e-4fc4-ad25-b377b1c6c751.mp4) supply the sampled motion and section sequence.
+- The live capture at https://www.veed.io/ supplies current copy, responsive screenshots, and measured layout.
+- The sources share the same AI-video direction. Trust the recording for example-card movement and the live site for current tools and pricing.

package/entries/webflow/entry.md

@@ -0,0 +1,108 @@
+---
+slug: webflow
+title: 'Webflow: layered website-experience platform'
+tier: inspiration
+source:
+  kind: public-site
+  url: https://webflow.com/
+  license: Captured from a Refero-hosted recording and the live site; description only, no redistribution of the source.
+captured:
+  method: both
+  at: '2026-09-22'
+  tool: wp-design-library@1.2.0
+  captures:
+    - method: frames
+      input: 'https://images.refero.design/styles/refero.design/video/4271252f-7d14-4594-8489-b8c23a843bd9.mp4'
+      artifacts:
+        - key: entries/webflow/1/strip.webp
+          bytes: 367942
+          sha256: c2c5e860ff83f814d4db8c7a9e83a9a6c0a2b2aca69171dd984cea4540846a97
+          uploaded: true
+      frames: 36
+      duration_ms: 29320
+    - method: both
+      input: https://webflow.com/
+      artifacts:
+        - key: entries/webflow/2/strip.webp
+          bytes: 316688
+          sha256: 4ae2299a39d0f8f06ce898d9dafc7ef75bcf172eeba99d582f4018ed9037902b
+          uploaded: true
+        - key: entries/webflow/2/measure.json
+          bytes: 5564
+          sha256: 01dde97a6e81d37aed1aa3684707be2b6cc0b0cea3193243e0d194a94dbe4077
+          uploaded: true
+        - key: entries/webflow/2/screen-1440.png
+          bytes: 284671
+          sha256: 326c76e7779a2ce13eb2687ad017d7709cc3f34e21b79108dd075c26cc275404
+          uploaded: true
+        - key: entries/webflow/2/screen-390.png
+          bytes: 54072
+          sha256: 03b140fef199644dafdd8aa1576769a5fcce2c9c57bf2761a7919c821897f16f
+          uploaded: true
+media:
+  frames: 36
+  duration_ms: 29320
+roles:
+  - hero
+  - feature
+  - proof
+  - capability
+  - testimonial
+  - explainer
+  - closing
+  - footer
+feel:
+  - light
+  - saas
+  - premium
+  - minimal
+  - depth
+palette:
+  canvas: '#ffffff'
+  ink: '#080808'
+  accent: '#146ef5'
+type:
+  display: bold modern sans, heavy weight, tight tracking
+  body: neutral sans, regular weight, open product-marketing measure
+motion:
+  devices:
+    - reveal
+    - pin
+    - pan
+    - parallax
+    - stagger
+    - stack
+    - tabs
+  notes: >-
+    Eyeballed from 36 sampled frames, not measured. The recorded hero layers a blue gradient bed behind product-choice
+    cards, then pins a browser canvas while Webflow UI panels pan and stack around a live site preview. Capability
+    sections reveal as staggered image-and-metric columns, customer proof advances through portrait cards, and later AI
+    and collaboration canvases slide into place before updates, community work, and the footer. The current live page
+    has changed its hero and carries a persistent cookie panel; exact tab, carousel, and pointer behavior cannot be
+    established from sampled frames.
+ported_from: null
+---
+
+## What it does
+
+Webflow presents its website-experience platform through a choice-led hero, visual building canvas, publishing and optimization capabilities, customer outcomes, AI-assisted workflows, recent updates, and community-made work.
+
+## Section roster
+
+1. Product-choice hero and primary conversion actions.
+2. Layered builder canvas showing design and code workflows.
+3. Build, publish, and optimize feature columns.
+4. Brand-scale proof and customer outcome cards.
+5. Agentic web-marketing and collaboration explanation.
+6. AI knowledge and business workflow canvas.
+7. Updates, conference material, Made in Webflow gallery, and footer.
+
+## Why it works
+
+Large direct typography and real product canvases explain a technically broad platform without hiding the interface, while blue accents keep conversion and navigation obvious across a long page. The cost to weigh is that stacked UI screenshots, customer cards, and changing campaign content create a heavy page that can age quickly and compete for attention.
+
+## Sources
+
+- The [Refero style page](https://styles.refero.design/style/31471407-598a-45fd-a505-d921980d8855) and its MP4 supply the earlier growth-engine hero, builder-canvas choreography, feature stacking, customer-card sequence, and complete scroll narrative.
+- The live capture at https://webflow.com/ supplies the current Build for what’s next hero, present campaign content, navigation, responsive screenshots, and measured layout.
+- The hero and some downstream campaign sections differ materially; the live page is trusted for current structure and copy, while the recording is retained as the motion reference for the captured design version.

package/entries/zkpass/entry.md

@@ -0,0 +1,103 @@
+---
+slug: zkpass
+title: 'zkPass: cryptographic trust-network landing'
+tier: inspiration
+source:
+  kind: public-site
+  url: https://zkpass.org/
+  license: Captured from a Refero-hosted recording and the live site; description only, no redistribution of the source.
+captured:
+  method: both
+  at: '2026-09-24'
+  tool: wp-design-library@1.2.0
+  captures:
+    - method: frames
+      input: https://images.refero.design/styles/refero.design/video/225d4ed7-26d4-4495-b8d3-c6b32d9af232.mp4
+      artifacts:
+        - key: entries/zkpass/1/strip.webp
+          bytes: 246594
+          sha256: 35b485103534d1ac10bc1116b644e19eb41cdbb066d381f366de71b9295b3d63
+          uploaded: true
+      frames: 36
+      duration_ms: 20717
+    - method: both
+      input: https://zkpass.org/
+      artifacts:
+        - key: entries/zkpass/2/strip.webp
+          bytes: 264812
+          sha256: 473a2275e5161b08fca4d61ac72d3f2507589197e9e32a09e66a1ea48619e296
+          uploaded: true
+        - key: entries/zkpass/2/measure.json
+          bytes: 4020
+          sha256: 2bbe4c4567883a5b1e1d3ef48dc51cf2a981837fb654dd5c87ea2adbfe61cc43
+          uploaded: true
+        - key: entries/zkpass/2/screen-1440.png
+          bytes: 450714
+          sha256: c5d496cde94be116f563652bb4fb9c6ada3506383d6102f0fd758191fdfd246b
+          uploaded: true
+        - key: entries/zkpass/2/screen-390.png
+          bytes: 68539
+          sha256: 6adc33d258808e9085e2db57ac09f88eb774287440db9048ea8226b987be6a1a
+          uploaded: true
+media:
+  frames: 36
+  duration_ms: 20717
+roles:
+  - hero
+  - explainer
+  - capability
+  - proof
+  - feature
+  - closing
+  - footer
+feel:
+  - dark
+  - brutalist
+  - cold
+  - premium
+  - depth
+palette:
+  canvas: '#050605'
+  ink: '#eeeee8'
+  accent: '#c4ff35'
+type:
+  display: high-contrast editorial serif and technical sans
+  body: compact technical sans, dense protocol measure
+motion:
+  devices:
+    - reveal
+    - wipe
+    - pan
+    - stagger
+    - spotlight
+  notes: >-
+    Eyeballed from 36 sampled frames, not measured. A black particle field and neon green symbol open the page.
+    Oversized Proof and Credit statements wipe between dark product panels; verification flows, code-like diagrams, and
+    principle rows reveal in sequence before the green closing mark. Exact particle simulation, verification demo
+    behavior, pointer response, and reduced-motion behavior are not measurable from sampled frames.
+ported_from: null
+---
+
+## What it does
+
+A privacy and verification protocol landing page that organizes a technical product around proof, credit, and reusable trust. Near-black surfaces and acid-green signals make the system feel cryptographic while large headings give dense material a readable hierarchy.
+
+## Section roster
+
+1. Particle-field hero and privacy claim.
+2. Proof and credit product framing.
+3. Three verification methods.
+4. Human and agent audience paths.
+5. Technical primitives and protocol principles.
+6. Product diagrams and dispatches.
+7. Closing proof statement and footer.
+
+## Why it works
+
+The green signal color guides attention through otherwise dense technical panels, while oversized serif assertions make each concept memorable. The cost is that small diagram labels and low-light UI require strong contrast and responsive simplification.
+
+## Sources
+
+- [Refero style page](https://styles.refero.design/style/3a398f82-579e-4ec4-a442-9962bf007edf) and its [recorded MP4](https://images.refero.design/styles/refero.design/video/225d4ed7-26d4-4495-b8d3-c6b32d9af232.mp4) supply the opening particle field, product transitions, verification panels, protocol chapters, and closing.
+- The live capture at https://zkpass.org/ supplies current terminology, responsive screenshots, and measured layout.
+- The sources agree closely. Trust the recording for transition continuity and the live page for current protocol claims.

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@yojahny/wp-design-library",
-  "version": "1.2.0",
+  "version": "1.3.0",
   "description": "Design reference corpus and MCP server for claude-wp-builder",
   "repository": {
     "type": "git",