A sleek, mobile-friendly web game inspired by NYT Connections, where players group words into categories—each representing an AI concept. Built with Three.js for neon visuals and particle effects.
- AI-Themed Categories: Each day, the game fetches 4 new AI-related categories, with 4 words in each group, generated by OpenAI. The words are shuffled for a fresh challenge daily.
- Dynamic Daily Content: Uses a secure Netlify Function to generate and serve new AI word groups every day. No API keys are exposed to the frontend.
- Drag-and-Drop Gameplay: Select and group tiles by dragging or tapping.
- Sleek Neon UI: Futuristic, glowing tiles and subtle particle effects using Three.js.
- Responsive Design: Fully mobile-friendly and text wraps inside tiles.
- On each visit, the game fetches a new set of 16 AI-related words (4 groups of 4) from a Netlify Function powered by OpenAI.
- The 16 words are shuffled and displayed on the grid. Players must deduce the hidden categories and group the words correctly.
- When a group is solved, its category name is revealed.
- If the backend/API is unavailable, the game falls back to a static set of AI categories and words.
- Clone the repo:
git clone https://github.com/yourusername/connections-ai-edition.git cd connections-ai-edition
- Start a local server (Python 3):
python3 -m http.server 8000
- Open http://localhost:8000 in your browser.
- Add your OpenAI API key as an environment variable (
OPENAI_API_KEY
) in your Netlify site settings. - The Netlify Function at
netlify/functions/generateWords.js
handles all OpenAI requests securely. - The frontend fetches daily word groups from
/.netlify/functions/generateWords
.
- HTML/CSS/JS
- Three.js for particle effects and visuals
- Netlify Functions for secure backend logic
- OpenAI API for daily AI word generation
- To change fallback AI categories/words, edit the fallback groups in
main.js
. - To adjust prompt or word formatting, edit the Netlify Function
generateWords.js
.
Inspired by NYT Connections. Built for learning and fun!