PM-MBTI/index.html at main · gerryjekova/PM-MBTI · 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
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Project Manager Personality Quiz</title>
    <link rel="stylesheet" href="style.css">
    <link href="https://fonts.googleapis.com/css2?family=Montserrat:wght@300;500;700&display=swap" rel="stylesheet">
    <link rel="stylesheet" href="https://s.pageclip.co/v1/pageclip.css" media="screen">
</head>
<body>
    <div class="container">
        <header>
            <div class="progress-bar">
                <div id="progress"></div>
            </div>
            <h1 class="glow">Project Manager Personality Quiz</h1>
            <p class="intro">Discover your personality archetype based on PM!</p>
        </header>

        <form id="quizForm">
            <div class="question">
                <h2>1. When starting a project, what’s your instinctive first move?</h2>
                <label><input type="radio" name="q1" value="DTRF,STRE"> Sketch the milestones, build the roadmap.</label>
                <label><input type="radio" name="q1" value="SARC,SARE"> Gather everyone and make sure they feel heard.</label>
                <label><input type="radio" name="q1" value="DTRC,DARC"> Rally the team and assign roles to get it moving.</label>
                <label><input type="radio" name="q1" value="SAEC,SARE"> Visualize the big picture before getting lost in tasks.</label>
            </div>

            <div class="question">
                <h2>2. In a team full of chaos and no structure, you...</h2>
                <label><input type="radio" name="q2" value="STRE,DTRF"> Step in to design and enforce processes.</label>
                <label><input type="radio" name="q2" value="SARC"> Try to understand what each person needs emotionally.</label>
                <label><input type="radio" name="q2" value="DTRC"> Take over and delegate like a boss.</label>
                <label><input type="radio" name="q2" value="SAEC"> Embrace the chaos and find new paths.</label>
            </div>

            <div class="question">
                <h2>3. Someone is lagging behind deadlines. You:</h2>
                <label><input type="radio" name="q3" value="DTRF"> Pull them aside and create an optimized workflow.</label>
                <label><input type="radio" name="q3" value="SARC"> Ask if they’re okay and what’s blocking them.</label>
                <label><input type="radio" name="q3" value="DTRC,DARC"> Pressure them to get their act together.</label>
                <label><input type="radio" name="q3" value="SAEC,STRF"> Help them reprioritize based on their energy.</label>
            </div>

            <div class="question">
                <h2>4. What’s your take on meetings?</h2>
                <label><input type="radio" name="q4" value="DTRF,STRE"> Essential for alignment, but keep them tight.</label>
                <label><input type="radio" name="q4" value="SARC,SARE"> A stage to inspire and connect.</label>
                <label><input type="radio" name="q4" value="DTRC"> A quick huddle to execute fast.</label>
                <label><input type="radio" name="q4" value="SAEC"> A chance to spark ideas, even if it’s messy.</label>
            </div>

            <div class="question">
                <h2>5. Under pressure, what’s your superpower?</h2>
                <label><input type="radio" name="q5" value="DTRF,STRE"> Keeping everything on track, no matter what.</label>
                <label><input type="radio" name="q5" value="DARC"> Turning chaos into action instantly.</label>
                <label><input type="radio" name="q5" value="SARC,STRF"> Staying calm and uplifting the team.</label>
                <label><input type="radio" name="q5" value="SAEC,SARE"> Finding creative solutions on the fly.</label>
            </div>

            <div class="question">
                <h2>6. What’s your kryptonite as a PM?</h2>
                <label><input type="radio" name="q6" value="DTRF,STRE"> Overplanning and missing the human side.</label>
                <label><input type="radio" name="q6" value="DTRC,DARC"> Pushing too hard and burning out others.</label>
                <label><input type="radio" name="q6" value="SARC"> Taking on too much emotional baggage.</label>
                <label><input type="radio" name="q6" value="SAEC,SARE"> Struggling to stick to a plan.</label>
            </div>

            <div class="question">
                <h2>7. Your go-to project tool is…</h2>
                <label><input type="radio" name="q7" value="DTRF,STRE"> A detailed Gantt chart or task board.</label>
                <label><input type="radio" name="q7" value="DTRC,DARC"> A quick chat app for fast updates.</label>
                <label><input type="radio" name="q7" value="SARC,SARE"> A whiteboard for team brainstorming.</label>
                <label><input type="radio" name="q7" value="SAEC"> Sticky notes and a playlist for vibes.</label>
            </div>

            <div class="question">
                <h2>8. How would you describe your leadership vibe?</h2>
                <label><input type="radio" name="q8" value="DTRF"> Calculated and strategic.</label>
                <label><input type="radio" name="q8" value="DTRC"> Bold and no-nonsense.</label>
                <label><input type="radio" name="q8" value="SARC"> Nurturing and team-first.</label>
                <label><input type="radio" name="q8" value="SAEC,SARE"> Free-flowing and adaptive.</label>
            </div>

            <div class="question">
                <h2>9. Your dream project team…</h2>
                <label><input type="radio" name="q9" value="DTRF,STRE"> Follows clear roles and routines.</label>
                <label><input type="radio" name="q9" value="DTRC,DARC"> Moves fast and tackles chaos head-on.</label>
                <label><input type="radio" name="q9" value="SARC,STRF"> Feels safe to share and collaborate.</label>
                <label><input type="radio" name="q9" value="SAEC,SARE"> Experiments and pushes boundaries.</label>
            </div>

            <div class="question">
                <h2>10. What gets your PM juices flowing?</h2>
                <label><input type="radio" name="q10" value="DTRF,STRE"> Cracking tough logistical puzzles.</label>
                <label><input type="radio" name="q10" value="DARC"> Conquering high-stakes deadlines.</label>
                <label><input type="radio" name="q10" value="SARC"> Seeing team members thrive.</label>
                <label><input type="radio" name="q10" value="SAEC,SARE"> Exploring bold new ideas.</label>
            </div>

            <div class="question">
                <h2>11. How do you bounce back from a project fail?</h2>
                <label><input type="radio" name="q11" value="DTRF"> Analyze and tweak the system.</label>
                <label><input type="radio" name="q11" value="DTRC,DARC"> Hit the ground running harder.</label>
                <label><input type="radio" name="q11" value="SARC"> Support the team and regroup.</label>
                <label><input type="radio" name="q11" value="SAEC,SARE"> Pivot with a fresh perspective.</label>
            </div>

            <div class="question">
                <h2>12. Your work energy in three words:</h2>
                <label><input type="radio" name="q12" value="DTRF,STRE"> Precise, focused, structured.</label>
                <label><input type="radio" name="q12" value="DTRC,DARC"> Driven, intense, ambitious.</label>
                <label><input type="radio" name="q12" value="SARC,STRF"> Warm, steady, empathetic.</label>
                <label><input type="radio" name="q12" value="SAEC,SARE"> Curious, dynamic, open.</label>
            </div>

            <div class="question">
                <h2>13. Which motto fits your PM style?</h2>
                <label><input type="radio" name="q13" value="DTRF,STRE"> “Order drives results.”</label>
                <label><input type="radio" name="q13" value="DTRC"> “Action beats hesitation.”</label>
                <label><input type="radio" name="q13" value="SARC"> “People make projects.”</label>
                <label><input type="radio" name="q13" value="SAEC,SARE"> “Innovation fuels progress.”</label>
            </div>

            <div class="question">
                <h2>14. You’d ditch a gig if…</h2>
                <label><input type="radio" name="q14" value="DTRF,STRE"> It’s a disorganized mess.</label>
                <label><input type="radio" name="q14" value="DTRC,DARC"> There’s no challenge or growth.</label>
                <label><input type="radio" name="q14" value="SARC,STRF"> The vibe is toxic or cold.</label>
                <label><input type="radio" name="q14" value="SAEC,SARE"> It stifles your creativity.</label>
            </div>

            <div class="question">
                <h2>15. Your role in a group project is…</h2>
                <label><input type="radio" name="q15" value="DTRF"> The master planner.</label>
                <label><input type="radio" name="q15" value="DARC"> The action driver.</label>
                <label><input type="radio" name="q15" value="SARC"> The team harmonizer.</label>
                <label><input type="radio" name="q15" value="SAEC,SARE"> The boundary pusher.</label>
            </div>

            <div class="question">
                <h2>16. As a mentee, you’d ask for…</h2>
                <label><input type="radio" name="q16" value="DTRF,STRE"> A proven system to follow.</label>
                <label><input type="radio" name="q16" value="DTRC,DARC"> A push to excel under pressure.</label>
                <label><input type="radio" name="q16" value="SARC,STRF"> Guidance on personal growth.</label>
                <label><input type="radio" name="q16" value="SAEC,SARE"> Freedom to explore my path.</label>
            </div>
              <button type="button" onclick="calculateResults()">Submit</button>
        </form>
    </div>

    <div id="resultsModal" class="modal">
        <div class="modal-content">
            <span class="close">×</span>
            <h2>Your PM Archetype</h2>
            <div id="archetype-image" class="archetype-image"></div>
            <p id="archetype"></p>
            <p id="description"></p>
            <p id="strengths"></p>
            <p id="gaps"></p>
            <p id="growthTip"></p>
            <p id="mentor"></p>
            <!-- form -->
            <form id="userSubmissionForm" action="https://send.pageclip.co/VafGLms8Q2it3UZm1NR6EVVISuDUKXgC/pm-match" class="pageclip-form" method="POST">
                <h3>Save Your Results</h3>
                <label type="question" for="userName">Name:</label>
                  <input type="text" id="userName" name="name" placeholder="Your name">
                <label type="question" for="userEmail">Email:</label>
                 <input type="email" name="email" placeholder="your@email.com" id="userEmail" required>
                <!-- Hidden fields to store results -->
                <input type="hidden" id="userArchetype" name="archetype">
                <input type="hidden" id="userDescription" name="description">
                <input type="hidden" id="userStrengths" name="strengths">
                <input type="hidden" id="userGaps" name="gaps">
                <input type="hidden" id="userGrowthTip" name="growthTip">
                <input type="hidden" id="userMentor" name="mentor">
                <!-- Submit button -->
                <button type="submit" class="pageclip-form__submit">
                  <span>Send My Results</span>
                </button>
                </form>
        </div>
    </div>
    <script src="script.js"></script>
     <script src="https://s.pageclip.co/v1/pageclip.js" charset="utf-8"></script>
</body>
</html>