{"slug": "outsideclass-a-little-less-screen-a-little-more-world", "title": "OutsideClass: A Little Less Screen, a Little More World", "summary": "A teacher built OutsideClass, an MIT-licensed learning website that uses Google's open-weight Gemma model, served through the Gemini API, to turn a learner's question into an explanation plus a short real-world observation activity. The app keeps the API key server-side, validates bounded inputs with a request timeout and structured responses, and stores optional personalization preferences only in the browser, with prepared samples runnable locally without an API key.", "body_md": "*This is a submission for the [Hacktoberfest Open-Source AI Challenge Week 1: Touch Grass](https://dev.to/challenges/hacktoberfest-week1-2026-10-05)*\n\nA learner can read an explanation of symmetry and still walk past a leaf without noticing either half.\n\nThat gap is where **OutsideClass** starts.\n\nI built a learning website that turns a question into something you can notice, compare and explain in the world around you. It uses Google's open-weight **Gemma** model to prepare an explanation and, when the topic suits it, a short observation activity.\n\nThe learning loop is simple:\n\n**Ask a question. Read the activity. Put the screen away. Observe. Return with something you noticed.**\n\nAs a teacher, I care about what remains after someone closes a lesson. Can they recognise the idea somewhere else? Can they describe their evidence? Can they consider another explanation?\n\nOutsideClass gives those questions a place in the learning process.\n\nAn activity card provides a focus, manageable steps, safety notes and questions to think about afterwards. Learners can save reflections, attach their own evidence photos, try practice questions and revisit their discoveries in a notebook.\n\nFor example, the prepared pattern activity asks learners to compare two nearly matching halves of a leaf. They do not need to pick it. The interesting part is looking closely enough to notice where the halves agree and where they differ.\n\nThe diagram introduces the comparison. The learner's observation supplies the evidence.\n\nOutsideClass is designed for **learners, parents and teachers**. Activities can be adapted to the time available, weather, time of day and a family or classroom group. Seated and window-based participation are available too.\n\nThe aim is to make the screen a starting point, then give attention back to the world.\n\n**A little less screen. A little more world.**\n\nYou can explore the app without signing up or providing a phone number.\n\nHere is a quick way to try it:\n\nThree prepared samples let visitors explore the format without making a fresh model request. They are clearly labelled as samples.\n\nThe current app also includes:\n\nPersonalisation is deliberately simple. An optional first name or nickname and a Learner, Teacher or Parent role can personalise the greeting. These preferences stay in the browser. They are not a verified account and do not provide automatic device sync.\n\nI have also prepared a ten-minute walkthrough covering the learning flow, notebook, practice, image consent and Updates. Its examples are demonstrations, not a report of a completed outdoor lesson.\n\nThe walkthrough was assembled using Brag, Hyperframes and F5-TTS, with my own voice recording as the narration reference.\n\nThe repository is public, and the application source is **MIT-licensed**.\n\nThe repository and its first commits were created on **October 6, 2026**, during this challenge.\n\nThe README covers local setup, Gemma configuration, privacy boundaries and current limitations. The prepared samples can run locally without an API key.\n\nThe starting configuration uses **`gemma-4-26b-a4b-it`**, served through Google's Gemini API.\n\nThe API is the hosting interface. The model requested by OutsideClass is **Gemma**.\n\nGemma generates learning explanations, observation activities and practice questions from the learner's question and selected context. Follow-up requests can include the earlier answer, while return visits can use the learner's selected observation context.\n\nThis makes Gemma part of the main learning flow: it prepares the material that the learner takes into an observation and returns to afterwards.\n\nThe server validates bounded inputs, applies a request timeout and asks for a structured response. It checks the returned content before rendering it.\n\nThe API key stays on the server.\n\nSafety guidance also lives in application code. The app can add relevant notes for children, groups, weather and participation choices, rather than depending entirely on a generated response to remember them.\n\nGenerated explanations can still be wrong. Adults should review lessons for children, and practice results are learning feedback rather than formal grades.\n\nOutsideClass uses HTML, CSS and browser JavaScript, with a Node.js development server and a Vercel API handler for hosted inference. The application has no runtime npm dependencies.\n\nSaved cards and reflections live in browser localStorage. Evidence photos use IndexedDB. A service worker caches supported pages and resources after an online visit.\n\nThere are two separate image flows:\n\nWeather and time of day are selected manually. The app does not require GPS, camera or microphone access.\n\nA lesson pack excludes personal reflections and photos. A notebook backup can contain them. Keeping those exports separate helps teachers share a lesson without accidentally sharing a learner's private work.\n\nAn attractive activity card is not enough if a learner loses the reflection they just wrote.\n\nDuring testing, finishing a timer after returning to its card exposed a problem with unsaved practice answers. I fixed that flow so timer completion preserves the open card's work.\n\nNotebook capacity also refuses new cards at the limit instead of silently removing older discoveries.\n\nThe current release passes **72 automated tests and its build check**. Coverage includes response validation, provider failures, image consent, practice scoring, storage failures, timer recovery and backup restoration.\n\nDesktop browser checks exercised live Gemma responses and restoring notes, practice results and evidence photos into a fresh notebook. I also tested the app on my phone, and the flows I tried worked.\n\nThe current limits are clear:\n\nFor me, the value is being able to inspect and change the learning process around an open-weight model.\n\nGemma's available weights leave room to explore a different inference deployment later, including local inference on suitable hardware. That option matters for an app intended to move learning beyond a reliable internet connection.\n\nFor this release, I chose hosted inference so learners can open the website without downloading a model. OutsideClass does not currently run Gemma locally, and changing providers would require adapting the server integration.\n\nOpening the application source is equally useful.\n\nSomeone can inspect how questions become activities, read the safety rules, change the prompts, select another supported Gemma model or build on the notebook tools. A teacher working with a different curriculum can examine the assumptions and adapt them.\n\nThe combination gives others access to the application logic today and a path to experiment with the model's deployment in the future.\n\nThe privacy boundaries come from the application design: notebook reflections and evidence photos stay local, while submitted questions and consented question images are processed by Google.\n\nThat boundary needs to be explained honestly.\n\nFor this challenge, the working contribution is a learning loop that connects an open-weight model to observation, evidence and reflection.\n\nThe next question should sometimes come from something the learner noticed outside, rather than another suggestion on a screen.\n\nThe GitHub repository includes the implementation, commit history and verification notes behind the build. A public DevRelay session is not included in this submission.\n\n**Best Use of Gemma**\n\nOutsideClass uses Google's Gemma open-weight model to generate its learning explanations, observation activities and practice questions.\n\nGemma powers the core feature connecting a learner's question to an activity they can take into the world.\n\nGemma is developed by Google. Hosted access is documented in [Google's Gemma API guide](https://ai.google.dev/gemma/docs/core/gemma_on_gemini_api). Its model and service terms apply separately from the application's MIT licence.", "url": "https://wpnews.pro/news/outsideclass-a-little-less-screen-a-little-more-world", "canonical_source": "https://dev.to/phoniexcryptz001/outsideclass-a-little-less-screen-a-little-more-world-2p6k", "published_at": "2026-10-08 18:47:52+00:00", "updated_at": "2026-10-08 18:50:08.057737+00:00", "lang": "en", "topics": ["generative-ai", "large-language-models", "ai-products", "ai-tools"], "entities": ["OutsideClass", "Gemma", "Google", "Gemini API", "Hacktoberfest"], "also_reported_by": [], "alternates": {"html": "https://wpnews.pro/news/outsideclass-a-little-less-screen-a-little-more-world", "markdown": "https://wpnews.pro/news/outsideclass-a-little-less-screen-a-little-more-world.md", "text": "https://wpnews.pro/news/outsideclass-a-little-less-screen-a-little-more-world.txt", "jsonld": "https://wpnews.pro/news/outsideclass-a-little-less-screen-a-little-more-world.jsonld"}}