Skip to content

Instantly share code, notes, and snippets.

@ixtk
Last active May 11, 2025 08:08
Show Gist options
  • Save ixtk/32307ce8eb3e73effa9762f5aa5e70b2 to your computer and use it in GitHub Desktop.
Save ixtk/32307ce8eb3e73effa9762f5aa5e70b2 to your computer and use it in GitHub Desktop.

Figma Design

Bluff Grid: Know Me Edition

As a logged-in user

  • I see the homepage:

    • Button to Host a New Game
    • Button to Join a Game
    • Navigation bar with my username and profile picture (as a clickable button) displayed
  • General information and CTA for the bluff grid game

  • I click the Host a New Game button:

    • I am redirected to the new game lobby.
    • I see a unique link to share with others, and a "Game Code" displayed to allow others to join.
    • I send the code to my friends and wait for them to join the game. The page shows how many players have joined and whether they’re ready to start the game.
    • Once all players have clicked "Ready", I click Start Game to begin.
  • I click Join a Game:

    • I paste the game code into the input field.
    • I am redirected to the lobby page of that particular game.
    • I see a list of players in the game, including the host and my own name, showing whether each player is ready or not.
    • I can choose to select one of my pre-created bluff grids from the dropdown menu or click "Randomize" option to let the system pick a bluff grid for me (from my own profile)
    • I click the Ready button to indicate I'm prepared to play.
  • As a player during a game round:

    • I see the bluff grid of the current player and have a limited time to guess which statement is true.
    • I select one of the 9 statements, and click "Confirm" to lock in my answer.
    • At the top fo the bluff grid, I see each player's name, faded. Once they have selected their answers, opacity reverts back to 100, indicating they have locked their answers.
    • If I see my own bluff grid in a particular round, I don't get to vote for true statemet. I'm merely automatically "ready".
    • After all players have submitted and locked in their guesses, the results are automatically revealed. The next page opens with the bluff grid statements but true ones are green-bordered. False statements are red-bordered. At the bottom right corner of every bluff grid, I can see who selected it (small rounded profile image):
    • I see who guessed correctly and who was fooled.
    • I can see who selected each statement.
    • This process repeats for every round
  • As the host during the game:

    • Before the game begins, in the lobby, I can immediately click "start game". As a host, I only see "start game" and NOT "ready" button
    • I can navigate to the next round by clicking a "Next Round" button.
    • I have the option to click "Start Over" to rehost the same game with the same players. This resets the game state and shows the lobby screen again.
  • Final Scoreboard:

    • The final points for each player are added up. In each round, points are awarded for correct guesses (5pts) and for successfully fooling others (3pts) with a false statement.
    • Each player’s final points are displayed along with a ranking (e.g., 1st, 2nd, 3rd).
    • The winner (the player with the most points) is highlighted.
  • I click on My Profile (profile image buggon) from the the navigation bar:

    • I see my username, profile picture, a list of my bluff grids, and a button labeled "Add a New Bluff Grid".
    • Bluff grids are displayed by their title in the list
    • I click the "Add a New Bluff Grid" button to create a new grid.
    • A form is displayed with 9 input fields, one labeled "TRUTH" and the remaining 8 labeled "FALSE".
    • I input statements into the boxes and click Save to create the bluff grid.
    • After saving, the form disappears, and I see my updated bluff grid list again.
  • On the profile page I click on any bluff grid in my list to view or edit it:

    • I can see all my statements in the grid and whether they are marked true/false (red-bordered or green-bordered)
    • I can click Edit to modify the bluff grid, change the truth statement, or add/remove false ones.
    • I can click Delete to remove the bluff grid from my profile.

As a logged-out user

  • General information and CTA for the bluff grid game
  • I see log in/sign up prompts
  • I cannot:
    • Create a bluff grid.
    • Host or join a new game.

AI Multiplayer Quizzer:

As a logged-in user

  • I see the homepage:

    • Create a Quiz button
    • Join Game button
    • Navigation bar with username and profile picture
    • Call-to-action text explaining the app
  • I click Create a Quiz:

    • Redirected to quiz generation page
    • Input field labeled Topic / Prompt
    • Radio buttons for difficulty selection (easy, medium, hard)
    • AI (Gemini) generates 5–10 multiple-choice questions
    • Each question has 4 answer choices, 1 correct
    • Regenerate button replaces individual questions
    • Save Quiz stores quiz under user-defined title
    • Saved quiz appears as a card in the user profile
  • I click on a quiz card:

    • View full list of questions and answers
    • Edit to modify content, delete individual questions
    • Delete to remove quiz
  • I click Host Game on a quiz card:

    • Redirected to a game lobby
    • Unique link and 6-digit game code shown
    • List of joined players with profile image, name, ready status
    • Start Game button becomes active when all are ready
  • I click Join Game:

    • Paste game code to enter lobby
    • See other players, host, quiz topic
    • Click Ready to signal readiness

As a player during a game

  • For each question:

    • Timer counts down (e.g. 15 seconds)
    • One question, four answer choices displayed
    • Select an answer and click Submit
    • After time expires it auto moves to the next question
    • +10 for correct answer
    • Automatically moves to next question
    • Process repeats for all questions in the quiz
  • After final question:

    • Final scoreboard with rankings
    • Top 3 players highlighted
    • View Stats shows per-question performance:
    • Correct/incorrect and who selected what
  • Host options:

    • Rematch to replay same quiz with same players
    • New Game to host a different quiz

As a logged-out user

  • Landing page shows:

    • Call-to-action text
    • Log In / Sign Up buttons
    • Explore Quizzes for read-only preview
  • Cannot:

    • Create or join games
    • Generate quizzes
    • Save or edit content
  • Any restricted action redirects to login

For real time stuff, we will use websockets.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment