Embedded Files
WHOLE CLASS
SMALL GROUPS
INDEPENDENT PRACTICE
Implementation Ideas & Workflows
ELA: Use Story Spinner as a creative writing station warm-up to help students analyze narrative structure through randomized character, setting, and conflict prompts.
Math: Have students write word problems incorporating the spun characters and settings to practice contextualizing multi-step algebraic equations.
Science: Select the Sci-Fi preset to prompt students to draft speculative fiction stories grounded in accurate planetary science, space physics, or robotic systems.
Social Studies: Load the Historical preset for students to craft narrative journals from the perspective of historical figures facing period-authentic challenges.
World Languages: Spin target vocabulary in custom mode for students to write or orally present short descriptive skits in their target language.
Art: Prompt students to illustrate scenes or design concept art based on the unique visual combinations generated by the reels.
CTE: Have digital media students upload custom JSON prompt lists to model modular database structures and user-interface inputs.
"Build Your Own" AI Prompt
Want to create your own version of this sort of app?
To get started, put prompt below into GEMINI.
"Act as an expert K-12 educational web developer. Create a single-file HTML, CSS, and JavaScript interactive web application called "Story Spinner". The app must feature a colorful slot-machine interface with three synchronized reels (Character, Setting, Conflict) powered by smooth CSS translations and Web Audio API slot-machine sound effects with a mute toggle. Provide built-in themed prompt presets (Fantasy, Sci-Fi, Mystery, School, Historical, Animals) and an "Edit Prompts" modal that allows teachers to input custom lists, paste spreadsheet data, or import/export prompt configurations via JSON files. Include a "Spin!" button with staggered reel stop times, a formatted story output box, a "Copy Prompt" button, and custom modal alerts. Ensure a modern design using Tailwind CSS, Google Fonts ('Fredoka One' and 'Nunito'), animated gradient backgrounds, and full mobile responsiveness."
How to Deploy What Gemini Builds
Quick Option (Gemini Canvas): Run and use the app directly inside Gemini Canvas mode to generate assets live.
Shareable Option (Google Sites / Canvas LMS): Ask Gemini to "provide a single HTML code block." Copy the code, go to your Google Site or Canvas page, select Embed > Embed Code, and paste it in.
File Option (Google Drive): Save the HTML code as an .html file and upload it to Google Drive to share directly with students/staff.
COMP3 & Tech Apps TEKS Alignment
COMP3 Strategy
Decomposition
Students break down complex narrative composition into discrete structural elements (character, setting, and conflict) before synthesizing them into a unified story.
Tech Apps TEKS Strand
Grades 6–8 Computational Thinking
Students apply algorithmic logic to structure and manipulate organized data sets using custom input formats and interactive web tools.
Page updated
Report abuse