Personality Archetype Quiz

A beautiful, interactive personality quiz that helps users discover their unique archetype and connect with the Santa Barbara community. Features confetti animations, iridescent design, and backend data storage with 9 distinct personality archetypes.

• 9 Personality Archetypes: Explorer, Alchemist, Connector, Visionary, Artisan, Sage, Nurturer, Guardian, and Catalyst
• Interactive Quiz Flow: Email collection → 9 personality questions → archetype selection → final message
• Confetti Animations: Celebratory confetti on every button click
• Iridescent Design: Purple, blue, and pink gradient theme with glassmorphism effects
• Backend Storage: SQLite database stores quiz results and user choices
• User Choice: Users can choose their preferred archetype after seeing results
• Mobile Responsive: Works perfectly on all device sizes

• Colors: Various shades of purple, blue, and pink creating an iridescent effect
• Style: Glassmorphism with backdrop blur and iridescent gradients
• Animations: Smooth transitions, confetti celebrations, and hover effects

• Traits: Adventurous, Curious, Resilient, Independent
• Description: Driven by curiosity and the desire to discover new horizons
• Color: Purple (#9333EA)

• Traits: Transformative, Intuitive, Wise, Spiritual
• Description: Seeks transformation and deeper understanding
• Color: Violet (#7B68EE)

• Traits: Empathetic, Collaborative, Social, Supportive
• Description: The bridge between people and ideas, building communities
• Color: Blue (#3B82F6)

• Traits: Creative, Innovative, Forward-thinking, Inspiring
• Description: Sees possibilities where others see obstacles
• Color: Pink (#EC4899)

• Traits: Creative, Expressive, Aesthetic, Passionate
• Description: A creator at heart, expressing soul through artistic endeavors
• Color: Purple (#8B5CF6)

• Traits: Wise, Reflective, Knowledgeable, Thoughtful
• Description: A seeker of wisdom and truth, guiding others toward understanding
• Color: Indigo (#6366F1)

• Traits: Caring, Compassionate, Supportive, Healing
• Description: Natural gift for caring and supporting others
• Color: Pink (#F472B6)

• Traits: Protective, Reliable, Practical, Stable
• Description: A protector and stabilizer, ensuring safety and security
• Color: Purple (#A855F7)

• Traits: Motivating, Dynamic, Action-oriented, Inspiring
• Description: A force of positive change, igniting transformation
• Color: Magenta (#D946EF)

1. Welcome Screen - Animated introduction with pulsing CTA
2. Email Collection - Community building step with validation
3. 9 Quiz Questions - Interactive questions with progress tracking
4. Results Display - Shows calculated archetype and score breakdown
5. Archetype Selection - User chooses their preferred archetype from all 9
6. Final Message - "You are a part of something new unfolding... we will be in touch."

• Confetti: Triggers on every button click using canvas-confetti
• Hover Effects: Smooth transforms and gradient backgrounds
• Progress Bar: Visual progress through the quiz
• Score Visualization: Animated bars showing archetype breakdown

The application stores:

• User email address
• Calculated archetype (from quiz logic)
• User-chosen archetype (their preference)
• Complete score breakdown for all 9 archetypes
• Timestamp of completion

Database table: archetype_quiz_results_v1

• Frontend: React 18.2.0 with TypeScript
• Styling: Custom CSS with glassmorphism and gradients
• Animations: Canvas Confetti library
• Icons: Font Awesome 6.4.0
• Backend: Val Town SQLite database
• Platform: Val Town serverless

The quiz includes 9 carefully crafted questions that assess different aspects:

1. Adventure Response - How you face new challenges
2. Weekend Preferences - Your ideal relaxation and growth activities
3. Social Perception - How friends see your core nature
4. Event Preferences - Types of gatherings that energize you
5. Team Dynamics - Your natural role in group settings
6. Reading Interests - Literature that resonates with you
7. Decision Making - Your primary decision-making approach
8. Fulfillment Sources - What truly satisfies your soul
9. Future Vision - What excites you about tomorrow

Each answer maps to one of the 9 archetypes, and the final score determines the suggested result.

1. Visit the quiz URL
2. Click "Begin Your Journey" (confetti!)
3. Enter email address (confetti!)
4. Answer 9 personality questions (confetti on each!)
5. View calculated results and score breakdown
6. Choose your preferred archetype from all 9 options (confetti!)
7. Receive final community message

• Detailed archetype guides and compatibility insights
• Email follow-up sequences based on chosen archetype
• Community matching features connecting similar archetypes
• Archetype-specific resources and recommendations
• Analytics dashboard for quiz administrators
• Social sharing with custom archetype graphics

• Single-file Val Town HTTP endpoint
• Handles both GET (serve HTML) and POST (save results) requests
• Uses React.createElement for client-side rendering
• Glassmorphism achieved with backdrop-filter and rgba backgrounds
• Confetti library imported via ESM for celebration effects
• 9-archetype system allows for more nuanced personality mapping