@utopia-studio-design/design-system-cli 0.6.2 → 0.7.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +28 -14
- package/bin/utopia-ds-mcp.mjs +6 -2
- package/bin/utopia-ds.mjs +94 -21
- package/data/docs/arabic-friendly.md +19 -2
- package/data/docs/billing-setup.md +80 -0
- package/data/docs/cer-003-032-033-round-8-repair.md +41 -0
- package/data/docs/cer-007-checkout.md +51 -0
- package/data/docs/cer-008-011-qa-repair.md +64 -0
- package/data/docs/cer-016-023-round-6-repair.md +92 -0
- package/data/docs/cer-024-031-round-7-repair.md +51 -0
- package/data/docs/cer-033-035-036-round-12-repair.md +37 -0
- package/data/docs/cer-035-037-round-10-repair.md +34 -0
- package/data/docs/ceramic-release-2026-09-06.md +11 -0
- package/data/docs/charts.md +34 -3
- package/data/docs/chat-service-methodology.md +181 -0
- package/data/docs/code-block.md +20 -0
- package/data/docs/creative-production.md +149 -0
- package/data/docs/designer-agent-backend-contract.md +552 -0
- package/data/docs/email-resend.md +29 -0
- package/data/docs/foundations.md +46 -8
- package/data/docs/guide.md +9 -9
- package/data/docs/handover-billing-aiden.md +132 -0
- package/data/docs/logo-maker-methodology.md +109 -0
- package/data/docs/presentation-asset-repository.md +53 -0
- package/data/docs/product-architecture.md +42 -0
- package/data/docs/quick-start-ai.md +4 -4
- package/data/docs/shadcn-conversion.md +1 -1
- package/data/docs/sidebar-placement.md +56 -0
- package/data/docs/theme-authoring.md +6 -3
- package/data/manifests/catalog.json +42 -46
- package/data/manifests/components.json +317 -66
- package/data/manifests/logo-skills.json +174 -0
- package/data/manifests/motion-profiles.json +2 -2
- package/data/manifests/patterns.json +201 -7
- package/data/manifests/presentation-assets.schema.json +44 -0
- package/data/manifests/templates.json +87 -1
- package/data/manifests/theme-dextrum.json +7 -7
- package/data/manifests/theme-prism-mono.json +19 -0
- package/data/manifests/theme-utopia-cloudblur.json +135 -0
- package/data/manifests/theme-utopia-default.json +31 -31
- package/data/manifests/theme-vyapti.json +17 -1
- package/data/manifests/theme-y2k-pop.json +18 -0
- package/data/manifests/themes.json +285 -57
- package/data/templates/analytics-dashboard/main.tsx +14 -1
- package/data/templates/calendar-application/main.tsx +14 -1
- package/data/templates/chat-workspace/README.md +12 -0
- package/data/templates/chat-workspace/index.html +11 -0
- package/data/templates/chat-workspace/main.tsx +97 -0
- package/data/templates/chat-workspace/styles.css +19 -0
- package/data/templates/chat-workspace/template.manifest.json +13 -0
- package/data/templates/composition-registry-lab/main.tsx +12 -1
- package/data/templates/dashboard-composer/main.tsx +14 -1
- package/data/templates/database-workspace/main.tsx +14 -1
- package/data/templates/interaction-lab/main.tsx +12 -1
- package/data/templates/quantum-verification-story/README.md +12 -0
- package/data/templates/quantum-verification-story/components.json +21 -0
- package/data/templates/quantum-verification-story/eslint.config.mjs +13 -0
- package/data/templates/quantum-verification-story/next-env.d.ts +7 -0
- package/data/templates/quantum-verification-story/next.config.mjs +11 -0
- package/data/templates/quantum-verification-story/package-lock.json +7535 -0
- package/data/templates/quantum-verification-story/package.json +46 -0
- package/data/templates/quantum-verification-story/postcss.config.js +6 -0
- package/data/templates/quantum-verification-story/src/app/assessment/page.tsx +138 -0
- package/data/templates/quantum-verification-story/src/app/ceramic-theme.css +48 -0
- package/data/templates/quantum-verification-story/src/app/deployment/page.tsx +178 -0
- package/data/templates/quantum-verification-story/src/app/fonts/IBMPlexSansArabic-Bold.ttf +0 -0
- package/data/templates/quantum-verification-story/src/app/fonts/IBMPlexSansArabic-Medium.ttf +0 -0
- package/data/templates/quantum-verification-story/src/app/fonts/IBMPlexSansArabic-Regular.ttf +0 -0
- package/data/templates/quantum-verification-story/src/app/fonts/ReadexPro-Variable.ttf +0 -0
- package/data/templates/quantum-verification-story/src/app/fonts/TWKLausanne-350.ttf +0 -0
- package/data/templates/quantum-verification-story/src/app/fonts/TWKLausanne-500.ttf +0 -0
- package/data/templates/quantum-verification-story/src/app/fonts/TWKLausanne-700.ttf +0 -0
- package/data/templates/quantum-verification-story/src/app/globals.css +175 -0
- package/data/templates/quantum-verification-story/src/app/layout.tsx +45 -0
- package/data/templates/quantum-verification-story/src/app/not-found.tsx +39 -0
- package/data/templates/quantum-verification-story/src/app/page.tsx +24 -0
- package/data/templates/quantum-verification-story/src/app/products/page.tsx +132 -0
- package/data/templates/quantum-verification-story/src/app/utopia-default.css +312 -0
- package/data/templates/quantum-verification-story/src/components/RotatingText.css +36 -0
- package/data/templates/quantum-verification-story/src/components/RotatingText.tsx +189 -0
- package/data/templates/quantum-verification-story/src/components/brand-mark.tsx +14 -0
- package/data/templates/quantum-verification-story/src/components/console-preview-section.tsx +57 -0
- package/data/templates/quantum-verification-story/src/components/console-preview.tsx +72 -0
- package/data/templates/quantum-verification-story/src/components/fade-up.tsx +54 -0
- package/data/templates/quantum-verification-story/src/components/floating-network.tsx +125 -0
- package/data/templates/quantum-verification-story/src/components/footer.tsx +83 -0
- package/data/templates/quantum-verification-story/src/components/harvest-timeline.tsx +70 -0
- package/data/templates/quantum-verification-story/src/components/lattice-diagram.tsx +73 -0
- package/data/templates/quantum-verification-story/src/components/lattice-field.tsx +129 -0
- package/data/templates/quantum-verification-story/src/components/nav.tsx +104 -0
- package/data/templates/quantum-verification-story/src/components/presentation-layout.tsx +91 -0
- package/data/templates/quantum-verification-story/src/components/readiness-estimator.tsx +135 -0
- package/data/templates/quantum-verification-story/src/components/scramble-text.tsx +60 -0
- package/data/templates/quantum-verification-story/src/components/section-backdrop.tsx +38 -0
- package/data/templates/quantum-verification-story/src/components/sections/clients.tsx +140 -0
- package/data/templates/quantum-verification-story/src/components/sections/contact.tsx +125 -0
- package/data/templates/quantum-verification-story/src/components/sections/hero.tsx +92 -0
- package/data/templates/quantum-verification-story/src/components/sections/moat.tsx +73 -0
- package/data/templates/quantum-verification-story/src/components/sections/offer.tsx +113 -0
- package/data/templates/quantum-verification-story/src/components/sections/pilot.tsx +63 -0
- package/data/templates/quantum-verification-story/src/components/sections/problem.tsx +53 -0
- package/data/templates/quantum-verification-story/src/components/text-particle.tsx +204 -0
- package/data/templates/quantum-verification-story/src/components/ticker.tsx +27 -0
- package/data/templates/quantum-verification-story/src/components/ui/badge.tsx +29 -0
- package/data/templates/quantum-verification-story/src/components/ui/button.tsx +55 -0
- package/data/templates/quantum-verification-story/src/components/ui/card.tsx +46 -0
- package/data/templates/quantum-verification-story/src/components/ui/cursor-driven-particle-typography.tsx +288 -0
- package/data/templates/quantum-verification-story/src/components/ui/input.tsx +20 -0
- package/data/templates/quantum-verification-story/src/components/ui/label.tsx +21 -0
- package/data/templates/quantum-verification-story/src/components/ui/separator.tsx +25 -0
- package/data/templates/quantum-verification-story/src/components/ui/textarea.tsx +19 -0
- package/data/templates/quantum-verification-story/src/lib/utils.ts +6 -0
- package/data/templates/quantum-verification-story/tailwind.config.js +95 -0
- package/data/templates/quantum-verification-story/template.manifest.json +23 -0
- package/data/templates/quantum-verification-story/tsconfig.json +42 -0
- package/data/templates/saas-solution-homepage/main.tsx +91 -14
- package/data/templates/saas-solution-homepage/privacy/index.html +1 -0
- package/data/templates/saas-solution-homepage/styles.css +47 -2
- package/data/templates/saas-solution-homepage/team/index.html +1 -0
- package/data/templates/saas-solution-homepage/template.manifest.json +41 -0
- package/data/templates/saas-solution-homepage/terms/index.html +1 -0
- package/lib/api.mjs +52 -3
- package/lib/template-runtime.mjs +56 -0
- package/package.json +2 -2
|
@@ -0,0 +1,149 @@
|
|
|
1
|
+
# Presentation and marketing production
|
|
2
|
+
|
|
3
|
+
Ceramic supplies the semantic theme, registered brand assets, production
|
|
4
|
+
constraints, and a copyable prompt. The website does **not** create a PPTX or
|
|
5
|
+
campaign export merely because a user selects an output. Run the copied prompt
|
|
6
|
+
in an agent or tool that can read the supplied files, create artifacts, and
|
|
7
|
+
open the results for inspection.
|
|
8
|
+
|
|
9
|
+
## Create a presentation
|
|
10
|
+
|
|
11
|
+
1. Open **Templates → Presentations → Presentation Studio**.
|
|
12
|
+
2. Choose the deck purpose, theme source, and deliverables.
|
|
13
|
+
3. When reusing a deck system, attach the approved `.pptx` or `.potx` source.
|
|
14
|
+
4. Keep `public/media` as the default image source, or provide a read-only
|
|
15
|
+
GitHub asset repository with `ceramic.assets.json`.
|
|
16
|
+
5. Review and copy **Full creation prompt**. The short template-card copy is
|
|
17
|
+
not the production prompt.
|
|
18
|
+
6. Paste the prompt into a presentation-capable agent and attach the brief,
|
|
19
|
+
evidence, template, logo, fonts, images, and data sources.
|
|
20
|
+
7. Approve the slide outline before visual production.
|
|
21
|
+
8. Require an editable PPTX, review PDF, source files, asset report, and QA
|
|
22
|
+
report.
|
|
23
|
+
|
|
24
|
+
The creation agent must keep unsupported claims as `[NEEDS INPUT]`. It must not
|
|
25
|
+
invent metrics, citations, testimonials, logos, or Arabic production copy.
|
|
26
|
+
|
|
27
|
+
### Presentation inputs
|
|
28
|
+
|
|
29
|
+
- Story: audience, meeting goal, core message, evidence, and final ask.
|
|
30
|
+
- Theme: a registered Ceramic theme, brand repository, or approved PPT source.
|
|
31
|
+
- Identity: registered logo or wordmark, fonts, and usage policy.
|
|
32
|
+
- Imagery: licensed assets from `public/media` or the external asset manifest.
|
|
33
|
+
- Data: a traceable source for every number and chart.
|
|
34
|
+
|
|
35
|
+
### Presentation delivery gate
|
|
36
|
+
|
|
37
|
+
- Open both PPTX and PDF; a successful file write is not proof of a valid deck.
|
|
38
|
+
- The registered logo appears on cover and closing slides, keeps its aspect
|
|
39
|
+
ratio, and remains vector when the format supports it.
|
|
40
|
+
- Every slide is legible at 16:9 with no overflow, clipping, accidental font
|
|
41
|
+
substitution, or unreadably small text.
|
|
42
|
+
- Editable information uses native shapes and charts where editing matters.
|
|
43
|
+
- Arabic uses approved copy, `dir="rtl"`, logical alignment, Arabic type roles,
|
|
44
|
+
and verified mixed-script and numeral behavior.
|
|
45
|
+
- The asset report lists source, license, output format, and slide numbers.
|
|
46
|
+
|
|
47
|
+
## Create marketing assets
|
|
48
|
+
|
|
49
|
+
1. Open **Themes**, choose the permitted theme, then choose **Use with AI →
|
|
50
|
+
Marketing Assets**. Signed-in users may start from the Brand Workspace.
|
|
51
|
+
2. Supply one approved campaign brief: goal, audience, message, proof, CTA,
|
|
52
|
+
channels, dimensions, deadline, and approval state.
|
|
53
|
+
3. Attach the approved logo, real product screenshots, licensed imagery, and
|
|
54
|
+
localized copy.
|
|
55
|
+
4. Copy the generated production prompt into a file-capable creation tool.
|
|
56
|
+
5. Create one semantic master and derive the requested channel variants.
|
|
57
|
+
6. Inspect every export independently before release.
|
|
58
|
+
|
|
59
|
+
### Marketing outputs
|
|
60
|
+
|
|
61
|
+
- Editable master with content separated from layout.
|
|
62
|
+
- Explicit channel variants such as 1:1, 4:5, 9:16, and 16:9.
|
|
63
|
+
- Clear file names containing campaign, channel, locale, and version.
|
|
64
|
+
- Metadata for source, license, locale, version, and approval state.
|
|
65
|
+
- QA results for safe area, crop, contrast, copy, file size, and RTL.
|
|
66
|
+
|
|
67
|
+
Never fabricate a product screenshot, performance claim, testimonial,
|
|
68
|
+
partnership, or localized production sentence. Keep missing approved content as
|
|
69
|
+
`[NEEDS INPUT]`.
|
|
70
|
+
|
|
71
|
+
## Asset repository contract
|
|
72
|
+
|
|
73
|
+
Read `presentation-asset-repository.md` for the complete schema. The generator
|
|
74
|
+
may read images and manifest metadata but must never execute code from an asset
|
|
75
|
+
repository. Select imagery by subject, mood, orientation, and focal point, not
|
|
76
|
+
as random decoration.
|
|
77
|
+
|
|
78
|
+
---
|
|
79
|
+
|
|
80
|
+
# إنتاج العروض ومواد التسويق
|
|
81
|
+
|
|
82
|
+
يوفّر Ceramic الثيم الدلالي وأصول العلامة المسجلة وقيود الإنتاج وموجّها قابلا
|
|
83
|
+
للنسخ. الموقع **لا ينشئ** ملف PPTX أو صور الحملة بمجرد اختيار نوع المخرج. يجب
|
|
84
|
+
تشغيل الموجّه المنسوخ في وكيل أو أداة تستطيع قراءة الملفات وإنشاء المخرجات
|
|
85
|
+
وفتحها للفحص.
|
|
86
|
+
|
|
87
|
+
## إنشاء عرض تقديمي
|
|
88
|
+
|
|
89
|
+
1. افتح **القوالب ← العروض التقديمية ← Presentation Studio**.
|
|
90
|
+
2. اختر هدف العرض ومصدر الثيم والمخرجات المطلوبة.
|
|
91
|
+
3. عند إعادة استخدام نظام عرض، أرفق ملف `.pptx` أو `.potx` المعتمد.
|
|
92
|
+
4. استخدم `public/media` كمصدر افتراضي للصور، أو أدخل مستودع GitHub للقراءة
|
|
93
|
+
فقط يحتوي `ceramic.assets.json`.
|
|
94
|
+
5. راجع وانسخ **موجّه الإنشاء الكامل**. وصف بطاقة القالب ليس موجّه الإنتاج.
|
|
95
|
+
6. ألصق الموجّه في وكيل يدعم إنشاء العروض وأرفق الموجز والأدلة والقالب والشعار
|
|
96
|
+
والخطوط والصور ومصادر البيانات.
|
|
97
|
+
7. وافق على مخطط الشرائح قبل بدء التصميم.
|
|
98
|
+
8. اطلب PPTX قابلا للتحرير وPDF للمراجعة وملفات المصدر وتقرير الأصول وتقرير QA.
|
|
99
|
+
|
|
100
|
+
يجب أن يترك الوكيل الادعاءات غير المدعومة بعلامة `[NEEDS INPUT]`. لا يجوز له
|
|
101
|
+
اختلاق الأرقام أو المراجع أو الشهادات أو الشعارات أو النص العربي النهائي.
|
|
102
|
+
|
|
103
|
+
### مدخلات العرض
|
|
104
|
+
|
|
105
|
+
- القصة: الجمهور وهدف الاجتماع والرسالة الأساسية والأدلة والطلب النهائي.
|
|
106
|
+
- الثيم: ثيم Ceramic مسجل أو مستودع علامة أو مصدر PPT معتمد.
|
|
107
|
+
- الهوية: الشعار أو wordmark والخطوط وسياسة الاستخدام.
|
|
108
|
+
- الصور: أصول مرخصة من `public/media` أو manifest المستودع الخارجي.
|
|
109
|
+
- البيانات: مصدر قابل للتتبع لكل رقم ورسم.
|
|
110
|
+
|
|
111
|
+
### بوابة تسليم العرض
|
|
112
|
+
|
|
113
|
+
- افتح PPTX وPDF فعليا؛ نجاح كتابة الملف لا يثبت صلاحية العرض.
|
|
114
|
+
- يظهر الشعار المسجل في الغلاف والخاتمة ويحافظ على نسبته ويبقى متجها عندما
|
|
115
|
+
تدعم الصيغة ذلك.
|
|
116
|
+
- تبقى كل شريحة مقروءة بنسبة 16:9 من دون overflow أو قص أو استبدال خط غير مقصود
|
|
117
|
+
أو نص صغير جدا.
|
|
118
|
+
- تستخدم المعلومات التي تتطلب التعديل أشكالا ورسومات أصلية.
|
|
119
|
+
- تستخدم العربية نصا معتمدا و`dir="rtl"` ومحاذاة منطقية وأدوار الطباعة العربية،
|
|
120
|
+
مع فحص النص المختلط والأرقام.
|
|
121
|
+
- يسجل تقرير الأصول المصدر والترخيص والصيغة النهائية وأرقام الشرائح.
|
|
122
|
+
|
|
123
|
+
## إنشاء مواد تسويقية
|
|
124
|
+
|
|
125
|
+
1. افتح **Themes** واختر الثيم المسموح، ثم **Use with AI ← Marketing Assets**.
|
|
126
|
+
يمكن للمستخدم المسجل البدء من Brand Workspace.
|
|
127
|
+
2. قدّم موجز حملة واحدا معتمدا: الهدف والجمهور والرسالة والدليل وCTA والقنوات
|
|
128
|
+
والمقاسات والموعد وحالة الموافقة.
|
|
129
|
+
3. أرفق الشعار المعتمد ولقطات المنتج الحقيقية والصور المرخصة والنص الموطّن.
|
|
130
|
+
4. انسخ موجّه الإنتاج إلى أداة إنشاء تستطيع التعامل مع الملفات.
|
|
131
|
+
5. أنشئ master دلاليا واحدا ثم اشتق نسخ القنوات المطلوبة.
|
|
132
|
+
6. افحص كل ملف تصدير بصورة مستقلة قبل النشر.
|
|
133
|
+
|
|
134
|
+
### مخرجات التسويق
|
|
135
|
+
|
|
136
|
+
- master قابل للتحرير يفصل المحتوى عن التخطيط.
|
|
137
|
+
- نسخ صريحة للقنوات مثل 1:1 و4:5 و9:16 و16:9.
|
|
138
|
+
- أسماء ملفات واضحة تتضمن الحملة والقناة واللغة والإصدار.
|
|
139
|
+
- بيانات وصفية للمصدر والترخيص واللغة والإصدار وحالة الموافقة.
|
|
140
|
+
- نتائج QA للمساحة الآمنة والقص والتباين والنص وحجم الملف وRTL.
|
|
141
|
+
|
|
142
|
+
لا تختلق لقطة منتج أو ادعاء أداء أو شهادة أو شراكة أو نصا عربيا نهائيا. اترك
|
|
143
|
+
المحتوى الذي لم يعتمد بعد بعلامة `[NEEDS INPUT]`.
|
|
144
|
+
|
|
145
|
+
## عقد مستودع الأصول
|
|
146
|
+
|
|
147
|
+
اقرأ `presentation-asset-repository.md` لمعرفة المخطط الكامل. يمكن للمولّد قراءة
|
|
148
|
+
الصور وبيانات manifest، لكنه لا ينفذ أي كود من مستودع الأصول. اختر الصور حسب
|
|
149
|
+
الموضوع والمزاج والاتجاه ونقطة التركيز، لا كزخرفة عشوائية.
|