Make a shareable personality quiz with AI (no coding)

What you need

• A computer
• A free Claude account (claude.ai) or a free ChatGPT account
• One quiz topic (for example: "What kind of cat owner are you?" or "What is your team's meeting style?")

What you get

A quiz with a progress bar, result cards for each type, and a button to send your result to friends. The demo below is a "What is your AI style?" quiz.

Step by step

1. 1

   Pick a quiz topic

   Choose a topic that makes people around you ask "What did you get?" Examples are "What kind of cat owner are you?", "What kind of traveler are you?", or "What is your team's meeting style?"

   TipA topic that is too broad makes the questions bland. Narrowing it, like "travel style", is more fun.

2. 2

   Go to claude.ai and sign in

   Open claude.ai in your browser and sign in. If you use ChatGPT, go to chatgpt.com.

   You know it worked whenYou are ready when you see a chat box at the bottom of the screen.

3. 3

   Paste the prompt and send it

   In the prompt below, swap in your own topic and type names, then paste it into the chat box and send.

   Prompt to pasteCopy prompt

   Make a personality quiz to share with friends. It should run right in my browser. Put everything in a single file.
   
   Topic: What is your AI style?
   - 6 questions, each with 4 answer choices
   - Each choice adds points to one of four types. The type with the most points is the result
   - 4 types: Sprinter, Supervisor, Architect, Tinkerer
   - The result screen shows the type name, a one-line tagline, a 2-sentence description, and 2 tips
   - Add a "Share result" button on the result screen. On a phone it opens the share sheet. On a computer it copies the result text
   - A progress bar at the top showing which question I am on, and a "Start over" button
   - Design for a phone screen first
   Write the questions, answer choices, and type descriptions yourself and make them fun. Keep the tone plain and light, with no exaggeration.

   Make it yours

   • Swap in your own topic and your own four type names.
   • You can change the number of questions (6) and types (4). With more types, add more questions so the results come out evenly.
   • Change the line "Keep the tone plain and light" to something like "Write like a friend texting" to change the mood.

   Want more control? (a slightly more technical version)

   Copy this version

   Make a shareable personality quiz as one self-contained HTML file.
   Topic: What is your AI style?
   - 6 questions, 4 choices each. Each choice adds a point to one of four types
   - Show the type with the most points as the result. On a tie, use the type chosen on the last question
   - Result screen: type name, one-line tagline, 2-sentence description, 2 tips, and a "Copy result" button (use navigator.share if available, otherwise the clipboard)
   - Progress bar at the top, and a start over button
   - Include og:title and og:description meta tags
   - Mobile first, no external libraries
   - All UI text in English

   You know it worked whenIn Claude, a result panel opens on the right and the first question appears.

   TipIf ChatGPT only shows a long block of code, say "Show it so I can play it right away (use Canvas)."

4. 4

   Take the whole quiz yourself

   Answer all 6 questions in the result panel. Pick different choices each time to check that all four types can come up.

   You know it worked whenIf the questions advance and a result card appears at the end, it works. If one type shows up every time, fix it in the next step.

5. 5

   Change it by asking

   Polish the wording and results to your taste. Read the result text yourself and fix anything that sounds off.

   TipTry things like "Make question 3 funnier", "Shorten the Architect description by one line", "I only ever get Sprinter whatever I pick. Balance the points", or "Make the result card background light yellow".

6. 6

   Check the Share result button

   Press the "Share result" button on the result screen. On a computer, the text is copied and a message like "Copied" should appear. Paste it into a notes app to check.

   You know it worked whenIf the pasted text includes the type name and the one-line tagline, it works.

   TipAfter you make the link, say "Put this page address at the end of the shared text" so friends who receive it can take the quiz right away.

7. 7

   Turn it into a link and send it to friends

   This quiz has no photos or sign-up form, so Claude's Publish button is enough. Click Publish at the top right of the result panel, copy the link, and send it in WhatsApp or another chat. For the full steps, see "Share it as a link" below.

   You know it worked whenIf you open the link on your phone and finish the quiz, you are done.

If you get stuck

Try next

• If you make a separate result image for each type, the result card shows up in link previews. Use an image generation tool to make one image per type.
• If friends want to know which type came up most, add a "result stats" feature step by step.

Features used here

More recipes