Rufus-Testing-Assistant/index.html at main · flipando-AI/Rufus-Testing-Assistant · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
<!DOCTYPE html>
<html lang="en" >
<head>
  <meta charset="UTF-8">
  <title>CodePen - ab testing</title>
  <link rel="stylesheet" href="./style.css">

</head>
<body>
<!-- partial:index.partial.html -->
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>CodePen - Rufus- Testing Assistant</title>
  <link rel="stylesheet" href="./style.css">
</head>
<body>
<!-- partial:index.partial.html -->
<div class="app-header">
  <h1>Testing Assistant:</h1>
  <h2>Sugerencias de Iteraciones</h2>
  <div class="app-info">
    <p>Tu compañero inteligente para sugerir iteraciones y hacer que tus A/B testings sean más divertidos que un emoji fiestero 🎉💡 ¡Genera ideas brillantes con solo un toque y descubre insights geniales! 💡💡
      <br>
      <br>
      📈 Descubre las sugerencias más ingeniosas para tus iteraciones.
      <br>
      🔍 Plantea testeos emocionantes para obtener valiosos aprendizajes.
      <br>
      🔮 Deja que la magia de los A/B testings te guíe hacia el éxito.
    </p>
    <div class="app-tags">
      <span class="tag">⭐ Marketing</span>
      <span class="tag">🌐 Social Media</span>
      <span class="tag">📣 Content Creation</span>
      <span class="tag">🚀 Campaigns</span>
      <span class="tag">🔍 SEO</span>
    </div>
    <div class="metrics-info">
      <span class="metric">84</span>
      <span class="metric-label">Total uses</span>
      <span class="metric">1</span>
      <span class="metric-label">Saved</span>
      <span class="metric">2 days ago</span>
    </div>
  </div>
</div>

<div class="container">
  <div class="prompt">
    <h2>Prompt:</h2>
    <div id="promptText"></div>
  </div>
  <div class="form-container">
    <h1>Edit tags</h1>

    <form id="inputForm">
      <div class="form-group">
        <label for="input1">Cliente:</label>
        <textarea id="input1" name="input1" data-hint="Ingresar nombre completo del cliente"></textarea>
        <div class="hint-box"></div>
      </div>

      <div class="form-group">
        <label for="input2">Especificaciones de la audiencia objetivo:</label>
        <textarea id="input2" name="input2" data-hint=""></textarea>
        <div class="hint-box"></div>
      </div>

      <div class="form-group">
        <label for="input3">Key Messages:</label>
        <textarea id="input3" name="input3" data-hint=""></textarea>
        <div class="hint-box"></div>
      </div>

      <div class="form-group">
        <label for="input4">Objetivo Creativo:</label>
        <textarea id="input4" name="input4" data-hint=""></textarea>
        <div class="hint-box"></div>
      </div>

      <div class="form-group">
        <label for="input5">Objetivo Performance:</label>
        <textarea id="input5" name="input5" data-hint=""></textarea>
        <div class="hint-box"></div>
      </div>

      <div class="form-group">
        <label for="input6">Como has pensado comunicarlo: Ángulos?</label>
        <textarea id="input6" name="input6" data-hint="Ejemplos: Educacional, Socialproof, Use Cases, Genérico"></textarea>
        <div class="hint-box"></div>
      </div>

      <div class="form-group">
        <label for="input7">Tono?</label>
        <textarea id="input7" name="input7" data-hint="Ejemplos: Emocional, humor, genérico"></textarea>
        <div class="hint-box"></div>
      </div>

      <div class="form-group">
        <label for="input8">Recurso Comunicacional (Como)?</label>
        <textarea id="input8" name="input8" data-hint="Ejemplos: 123, Pregunta Respuesta, Pregunta, Afirmación, estadistica, call to action"></textarea>
        <div class="hint-box"></div>
      </div>

      <div class="form-group">
        <label for="input9">Con qué recursos Visuales: - Ejecucion (Ad)?</label>
        <textarea id="input9" name="input9" data-hint="Ejemplos: UGC, Animación, Quickfire, Footage, Animación + Footage, Ilustración, Ilustración + Footage"></textarea>
        <div class="hint-box"></div>
      </div>

      <div class="form-group">
        <label for="input10">Fondo?</label>
        <textarea id="input10" name="input10" data-hint="Ejemplos: Footage, Pleno, Degradado, Pleno + Ilustración"></textarea>
        <div class="hint-box"></div>
      </div>

      <button type="submit">Generate Prompt</button>
    </form>
  </div>
</div>

<button id="copyButton">Copy Prompt</button>
<button id="editButton">Edit Prompt</button>
<button id="copyInputsButton">Copy Inputs as JSON</button>
</div>
<!-- partial -->
<script src="./script.js"></script>
</body>
</html>
<!-- partial -->
  <script  src="./script.js"></script>

</body>
</html>