Inspiration
We were inspired by how difficult it is for learners to build real intuition from static explanations and how frustrating it is for non-technical users to turn messy CSVs into clear, actionable insights. Too often, understanding breaks down not because the ideas are complex, but because the explanations don’t adapt. We set out to solve this by building a "universal visualizer" that makes complex ideas interactive, explorable, and intuitive.
What it does
VIZ-LENS uses Gemini models to turn any concept or dataset into an interactive learning and analysis experience. Gemini powers live visualizers, dataset explorers, quiz generation, code judging, and a conversational data assistant. Users can upload CSVs, explore AI-generated charts, take adaptive quizzes, step through logic visually, and even get real-time explanations and feedback from a Gemini-powered chatbot — all from a single dashboard.
How we built it
We built VIZ-LENS with a Next.js frontend using Framer Motion, Monaco Editor, and Chart.js, and an Express backend deeply integrated with Gemini (via Google AI Studio APIs). Gemini is used across the system: generating visualizations, creating quizzes and test cases, judging code submissions, analyzing datasets, producing insights, and powering the chatbot and dashboard logic. We used Google Cloud to manage API keys securely and designed prompt pipelines to enforce strict HTML and JSON outputs for safe rendering inside sandboxed iframes.
Challenges we ran into
The biggest challenges were enforcing structured outputs from Gemini, handling rate limits and partial failures, and making AI-generated content reliable at scale. Rendering dynamic, Gemini-generated visuals safely required sandboxed iframes and careful validation. We also had to balance performance and UX while coordinating multiple Gemini-powered features running simultaneously across the dashboard.
Accomplishments that we're proud of
We successfully built a system where Gemini is the core engine, not just an add-on — powering visualizers, quizzes, code judging, dataset analysis, and conversational assistance in real time. We’re especially proud of our prompt engineering pipelines, our safe visualization sandbox, and the seamless way users can move from raw data or concepts to clear, interactive understanding in seconds.
What we learned
We learned to design robust prompts for strict HTML/JSON outputs, manage Gemini model reliability, handle API limits gracefully, and build fast UIs that safely render AI-generated visuals and datasets.
What's next for VIZ-LENS
We plan to extend Gemini-powered reasoning, integrate veo3 and nano banana for explanation videos and images, add adaptive learning paths, support larger datasets, and introduce collaboration and advanced visual debugging to make VIZ-LENS even more powerful.
Built With
- chart.js
- express.js
- framer-motion
- google-ai-studio
- google-gemini-api
- monaco-editor
- next.js
- node.js
- react
- render
- tailwind-css
- typescript
- vercel
Log in or sign up for Devpost to join the conversation.