Hugging Face's logo

Spaces:
Nuzwa
/
_Veo3_JSON_Prompt_Generator_Pro_
Running

App Files Community
Nuzwa commited on
Commit
bfc7d7d
·
verified ·
1 Parent(s): ea628c8

Create index.html

Browse files
Files changed (1) hide show
  1. index.html +139 -0
index.html ADDED
@@ -0,0 +1,139 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ <!DOCTYPE html>
2
+ <html lang="en">
3
+ <head>
4
+ <meta charset="UTF-8" />
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0" />
6
+ <title>CoachProAI - Cinematic Prompt Generator (Pro)</title>
7
+ <style>
8
+ body {
9
+ font-family: 'Segoe UI', sans-serif;
10
+ background: #f9f9fb;
11
+ color: #111;
12
+ margin: 0;
13
+ padding: 0;
14
+ }
15
+ .container {
16
+ max-width: 840px;
17
+ margin: 0 auto;
18
+ padding: 2rem;
19
+ }
20
+ h1 {
21
+ font-size: 2rem;
22
+ font-weight: bold;
23
+ margin-bottom: 1.5rem;
24
+ }
25
+ label {
26
+ font-weight: 600;
27
+ display: block;
28
+ margin-top: 1.2rem;
29
+ }
30
+ select, textarea, input {
31
+ width: 100%;
32
+ padding: 0.6rem;
33
+ margin-top: 0.3rem;
34
+ border-radius: 4px;
35
+ border: 1px solid #ccc;
36
+ font-size: 1rem;
37
+ box-sizing: border-box;
38
+ }
39
+ button {
40
+ background: #2D60E3;
41
+ color: #fff;
42
+ border: none;
43
+ padding: 0.75rem 1.5rem;
44
+ margin-top: 1.5rem;
45
+ font-size: 1rem;
46
+ border-radius: 5px;
47
+ cursor: pointer;
48
+ }
49
+ pre {
50
+ background: #f0f0f0;
51
+ padding: 1rem;
52
+ white-space: pre-wrap;
53
+ border-radius: 6px;
54
+ margin-top: 2rem;
55
+ }
56
+ </style>
57
+ </head>
58
+ <body>
59
+ <div id="root">
60
+ <div class="container">
61
+ <h1>🎬 CoachProAI Prompt Generator <span style="font-size: 0.9rem; font-weight: 400;">(Cinematic Pro Mode)</span></h1>
62
+
63
+ <label>🎯 Select Domain:</label>
64
+ <select id="domain">
65
+ <option value="education">Education</option>
66
+ <option value="ads">Advertisement</option>
67
+ <option value="product">Product Demo</option>
68
+ <option value="creator">Creator POV</option>
69
+ </select>
70
+
71
+ <label>📆 Scene Title / Task Focus:</label>
72
+ <input id="task" placeholder="e.g., Lesson Planning, Feedback Automation" />
73
+
74
+ <label>👤 Character Type:</label>
75
+ <select id="character">
76
+ <option value="Pakistani Male Teacher">Pakistani Male Teacher</option>
77
+ <option value="Pakistani Female Teacher">Pakistani Female Teacher</option>
78
+ <option value="South Asian Coach">South Asian Coach</option>
79
+ <option value="Young Creator (Female)">Young Creator (Female)</option>
80
+ <option value="Young Creator (Male)">Young Creator (Male)</option>
81
+ </select>
82
+
83
+ <label>🎥 Shot & Camera Composition:</label>
84
+ <input id="camera" placeholder="e.g., Medium shot, 35mm lens, dolly-in" />
85
+
86
+ <label>📹 Visual Scene Description:</label>
87
+ <textarea id="scene" rows="3" placeholder="e.g., teacher walks into bright classroom with sun flares"></textarea>
88
+
89
+ <label>💡 Lighting & Mood:</label>
90
+ <input id="lighting" placeholder="e.g., warm morning → neutral daylight with rim light" />
91
+
92
+ <label>🎞️ Props & Visual Details:</label>
93
+ <textarea id="props" rows="2" placeholder="e.g., chalkboard, sticky notes, glowing GPT orb"></textarea>
94
+
95
+ <label>🎵 Background Soundscape / Music:</label>
96
+ <input id="audio" placeholder="e.g., soft piano with ticking clock SFX, chill synth layer" />
97
+
98
+ <label>🔍 Visual Color Theme:</label>
99
+ <input id="colors" placeholder="e.g., cobalt, soft amber, charcoal accents" />
100
+
101
+ <label>🎙️ Voiceover (English):</label>
102
+ <textarea id="voEnglish" rows="3" placeholder="e.g., What if lesson prep only took 30 seconds?"></textarea>
103
+
104
+ <label>🌞 Voiceover (Roman Urdu):</label>
105
+ <textarea id="voRoman" rows="3" placeholder="e.g., Sochiye agar lesson planning sirf 30 seconds mein ho jaye?"></textarea>
106
+
107
+ <button onclick="generatePrompt()">🚀 Generate Prompt</button>
108
+
109
+ <pre id="output"></pre>
110
+ </div>
111
+ </div>
112
+
113
+ <script>
114
+ function generatePrompt() {
115
+ const prompt = {
116
+ title: document.getElementById("task").value + " Cinematic Video",
117
+ brand: "CoachProAI",
118
+ aspect_ratio: "16:9",
119
+ style: "cinematic",
120
+ domain: document.getElementById("domain").value,
121
+ character: document.getElementById("character").value,
122
+ camera: document.getElementById("camera").value,
123
+ scene: document.getElementById("scene").value,
124
+ lighting: document.getElementById("lighting").value,
125
+ props: document.getElementById("props").value,
126
+ audio: document.getElementById("audio").value,
127
+ colors: document.getElementById("colors").value,
128
+ voiceover: {
129
+ english: document.getElementById("voEnglish").value,
130
+ roman_urdu: document.getElementById("voRoman").value
131
+ },
132
+ keywords: ["cinematic", "coachproai", "consistent character", "16:9"]
133
+ };
134
+
135
+ document.getElementById("output").textContent = JSON.stringify(prompt, null, 2);
136
+ }
137
+ </script>
138
+ </body>
139
+ </html>