Forem: ujja

Fourbidden: A Serious AI Solution to 2+2, With Maximum Ceremony and No Resolution

ujja — Sun, 05 Apr 2026 10:04:34 +0000

This is a submission for the DEV April Fools Challenge

What I Built

I built Fourbidden, a fake AI product dedicated to solving one extremely serious global problem: 2+2.

The joke is that the problem could not be smaller, but the app treats it like the final summit of machine reasoning.

You ask a basic addition question, and instead of getting a basic addition answer, the app starts trying to sum up its own importance.

That means you get:

AI-generated loading statements that sound suspiciously strategic
circular explainers that get more philosophical and less useful over time
escalating terms and conditions that keep turning arithmetic into a compliance event
procedural next steps designed to preserve momentum without producing closure
dashboard widgets, warnings, and theatrical system language
surprise interactions like panic overlays, chaos toasts, prank label swaps, and a hidden Konami-style chaos mode

The T&C bit became one of my favorite parts of the whole thing.

The user is effectively told that before they can move closer to understanding 2+2, they must first acknowledge expanding legal nonsense, accept more conditions, and agree to one more procedural step. Then another. Then another.

So the core gag is not just overengineering. It is over-addition: treating the smallest possible math question like a high-risk, high-governance product flow.

It is a satire of software that cannot simply give you the answer, because it is too busy building a whole process around the answer.

Demo

Live demo: https://ujjavala.github.io/fourbidden/
Local version: http://localhost:3000
Main routes:
- Home: /
- About: /about
- Services: /services

Code

GitHub: https://github.com/ujjavala/fourbidden

Key route surface:

/api/explain
/api/loading
/api/terms
/api/steps
/api/loop
/api/widgets

How I Built It

I wanted the app to feel like a glossy software product that exists entirely to avoid resolving 2+2 in a straightforward way.

So instead of making a single punchline screen, I built a full fake workflow around the idea of “solving” the problem while constantly refusing to complete it.

Tech stack:

Next.js 14 (App Router)
React + TypeScript
Google AI (Gemini API) to generate the app's overblown explanations, loading copy, legal nonsense, escalation steps, loop logic, and widget chatter
Custom CSS for the bright cinematic UI, orbit effects, shimmer, flashes, and overly dramatic motion
Lucide React for icon-driven UI accents

Implementation choices that shape the vibe:

The main joke is taking the tiniest math problem and inflating it into a full-stack event.
The interface looks polished enough to imply a seed round and a brand strategy deck.
The T&C flow is central to the bit: the user keeps having to consent to more nonsense before progress can allegedly continue.
The text stays intentionally circular and jargon-heavy so the app never gives the satisfaction of a clean conclusion.
The click surprises add a second layer of April Fools chaos on top of the main workflow.
There is a static fallback path so the absurdity still works even when live AI calls are unavailable.

How I Leveraged Google AI

Gemini is the narrative engine for the whole product illusion.

I did not use it as a single chatbot response. I split the experience into multiple AI-backed roles so each part of the fake platform has its own voice and function.

/api/explain: produces long-form ceremonial non-answers
/api/loading: turns waiting into executive messaging
/api/terms: creates useless compliance clauses and acceptance loops around 2+2
/api/steps: invents process-heavy next actions
/api/loop: explains why completion is still not operationally appropriate
/api/widgets: generates fake platform telemetry and side-channel noise

To keep that experience stable, I added:

prompt caching with a short TTL
retry and backoff handling for quota and rate-limit failures
local fallback generators when Gemini is unavailable
client-side static mode for static hosting environments

That way the joke survives whether the AI is live, rate-limited, or completely absent.

Prize Categories

Best Google AI Usage

Google AI is not just providing flavor text here. It is powering the entire illusion that a hopelessly overbuilt software stack has been assembled to “solve” a single grade-school math prompt. Every stage of that ridiculous journey gets its own AI-generated nonsense.

Best Ode to Larry Masinter

This app is proudly unnecessary. It manufactures protocol, ceremony, terms, gates, and pseudo-serious internet behavior around a task that should end instantly. It feels like the kind of thing that technically works while making arithmetic worse.

Community Favorite

I think the joke lands quickly: everyone understands 2+2, and everyone also recognizes software that delivers process instead of outcomes. Combining those two ideas made it easy to build something immediate, silly, and annoyingly plausible.

If it makes people laugh and also mutter, "why does this feel plausible," then it did its job.

[Boost]

ujja — Fri, 20 Mar 2026 11:35:27 +0000

Notion MCP Challenge Submission 🧠

ujja

Mar 12

I Built EchoHR: The HR System That Doesn’t Ghost You

#devchallenge #notionchallenge #mcp #ai

Comments 63

5 min read

Big drop for EchoHR 🚀 🔧 Postgres queue + worker, idempotent + HMAC webhooks, retries/backoff, metrics ✨ Cleaner UX with hero video, logo, and clearer lifecycle ⚙️ More reliable setup + Docker flow (migrate seed worker) Check out the blog for more 👇

ujja — Tue, 17 Mar 2026 06:08:56 +0000

Notion MCP Challenge Submission 🧠

ujja

Mar 12

I Built EchoHR: The HR System That Doesn’t Ghost You

#devchallenge #notionchallenge #mcp #ai

Comments 63

5 min read

I Built EchoHR: The HR System That Doesn’t Ghost You

ujja — Thu, 12 Mar 2026 02:26:38 +0000

This is a submission for the Notion MCP Challenge

Rejections hurt. But ghosting hurts even more.

EchoHR is a Notion-native employee lifecycle system that ensures candidates and employees always receive timely updates, feedback, and visibility across their entire journey.

The goal is simple:

No candidate or employee should ever feel ghosted.

What I Built

EchoHR is a fully automated employee lifecycle management system built on top of Notion MCP.

It provisions an entire HR operating system inside Notion, including:

20+ interconnected lifecycle data sources
versioned workspace hubs
relations and rollups across the entire employee journey
automation playbooks
AI-ready fields for feedback and summaries
startup-scale demo datasets

The system covers the complete lifecycle:

Candidates → Applications → Interviews → Offers → Onboarding → Check-ins → Goals → Achievements → Performance Reviews → Compensation → Offboarding → Alumni

All records are connected through Notion relations and rollups, enabling a complete view of every employee journey.

To make experimentation easy for hackathons and demos, EchoHR can provision the entire workspace with one command.

This instantly creates:

lifecycle pipelines
feedback workflows
onboarding journeys
review systems
promotion tracking
exit processes
dashboards and demo data

Video Demo

Suggested demo flow:

One-command provisioning of the EchoHR workspace
Hiring pipeline with candidate progress
Automated onboarding journeys
AI-generated interview summaries
Slack notification workflows
Lifecycle dashboards and reporting

Show us the code

GitHub repository:

https://github.com/ujjavala/EchoHR

The repository includes everything needed to spin up a fully functional EchoHR workspace.

How I Used Notion MCP

EchoHR uses Notion MCP as the operational layer for lifecycle management.

It enables AI agents, automation workflows, and integrations to operate directly on structured HR data.

Notion MCP (hosted)

Notion MCP provides the primary CRUD and schema layer for lifecycle operations.

It is used for:

provisioning databases
creating lifecycle records
updating candidate stages
logging check-ins
posting AI summaries

EchoHR includes a one-click workspace provisioning command:

npm run demo

These provisions:

pages
data sources
relations
rollups
demo records
automation playbooks

Agents can then operate on the workspace through MCP.

Slack MCP

Slack MCP enables human-first notifications so important updates never stall.

Examples include:

candidate update reminders
onboarding alerts
offer acceptance notifications
overdue feedback pings

This ensures recruiters and managers stay responsive.

Figma MCP

EchoHR integrates with design workflows through Figma MCP.

Example automation:

When a Figma frame is marked Ready for Review:

A review task is created in Notion
The task links to the relevant check-in
A Slack notification is posted

This bridges the design → product → engineering workflow.

Calendar MCP Pattern

EchoHR uses calendar MCP patterns to schedule lifecycle events.

Examples:

interview loops
onboarding meetings
post-offer check-ins

Agents create tasks in Notion and schedule them via calendar integrations.

OpenAI MCP (automation server)

EchoHR includes an automation server that processes lifecycle notes and generates structured summaries.

Under the Hood: MCP as an Orchestration Layer

Beyond individual integrations, EchoHR uses MCP as a coordination layer across systems.

Notion acts as the operational control plane, while automation and heavier workflows are handled via webhooks and an external automation server.

This enables:

event-driven workflows (no polling)
cross-tool orchestration (Notion + Slack + Figma + OpenAI)
real-time feedback loops (notes → AI → Notion → Slack)
scalability patterns like rate limiting, batching, and optional external storage

The goal is to keep humans in the loop, while MCP handles coordination across the lifecycle.

Example endpoint:

/webhooks/meeting-notes

This converts raw notes into:

interview feedback summaries
candidate-safe responses
manager action items

The summaries are written back into Notion records automatically.

Core Components

Notion Workspace Seeder

The workspace seeder provisions the entire HR operating system.

It creates:

lifecycle databases
relations and rollups
templates
automation playbooks
demo datasets

Running the setup creates a fully operational HR workspace inside Notion.

Automation Server

EchoHR includes a lightweight automation server that connects Notion to external systems.

Endpoints include:

POST /webhooks/notion

POST /webhooks/figma

POST /webhooks/meeting-notes

POST /summaries/interview

POST /summaries/review

POST /summaries/exit

POST /slack/notify

GET /health

These endpoints power automated workflows across the employee lifecycle. They are triggered by Notion lifecycle events and external signals, enabling event-driven automation instead of polling.

Example Automations

Candidate Workflow

When a new candidate is created in Notion:

An application record is automatically created
An SLA follow-up task is assigned to the recruiter

Offer Workflow

When an offer status becomes Accepted:

An onboarding journey is created
The first three monthly check-ins are scheduled
onboarding tasks are generated

Design Workflow

When a Figma frame is marked Ready for Review:

A review task is created in Notion
The task attaches to the relevant check-in
A Slack notification is posted

AI-Powered Feedback

EchoHR integrates with OpenAI to generate summaries for:

interview feedback
performance reviews
exit interviews

Example flow:

Interview notes are captured
/webhooks/meeting-notes processes them
AI generates candidate-safe summaries and manager action items
The results are written back into Notion
Slack notifications ensure feedback never stalls

Demo Dataset

To make the system immediately usable, EchoHR seeds a realistic startup environment with:

~50 employees
founders and executives
HR and people operations
managers and ICs
open roles
active hiring pipelines
onboarding journeys
performance reviews
promotions and compensation events
recognition and pulse surveys
exit processes

This allows dashboards and workflows to be demonstrated instantly.

One-Command Setup

Run:

npm run demo

This automatically:

provisions the Notion workspace
creates lifecycle databases
seeds demo records
configures relations and rollups
persists install state for idempotent re-runs

You can also create a fresh versioned workspace:

npm run demo \-- \--force-new

Each installation creates a new workspace version, such as:

EchoHR HQ v1
EchoHR HQ v2

This makes experimentation safe during hackathons.

The Differentiator

Most HR software focuses on compliance and reporting.

EchoHR focuses on human experience.

It introduces the concept of:

Zero-Ghosting Lifecycle Management

Candidates should never wonder:

"Did they forget about me?"

Employees should never wonder:

"Am I doing well here?"

EchoHR enforces transparency through automated lifecycle checkpoints:

candidate update deadlines
interview feedback reminders
onboarding check-ins
review timelines
promotion visibility
exit follow-ups

Everything is tracked through interconnected Notion data sources.

Limitations (Current Notion Constraints)

Some capabilities are limited by the current Notion API.

Database Views

The API cannot create board, timeline, or gallery views.

EchoHR automatically creates a page called:

Set up Views (5–10 min)

This guides users through configuring dashboards manually.

Visual Styling

Notion does not support custom CSS through the API.

Visual structure uses:

page covers
emojis
callouts
curated views

Charts

Notion charts depend on workspace features.

If unavailable, charts can be embedded from external sources such as:

Google Sheets
Datawrapper

Formula Updates

Formula properties cannot currently be modified after creation through the API.

They must be defined during provisioning.

Why This Matters

Hiring and employee management systems often fail at one simple thing:

communication.

Candidates get ghosted.

Employees receive little feedback.

Performance reviews disappear into silence.

EchoHR demonstrates how Notion + MCP + AI automation can create a transparent and human-first operating system for people operations.

Instead of spreadsheets and disconnected tools, teams get a single lifecycle workspace where every stage is visible and actionable.

EchoHR isn’t just an HR system — it’s an example of how MCP can orchestrate tools into a cohesive, event-driven lifecycle engine.

One where communication is not an afterthought, but a guaranteed outcome.

The Enablers Who Helped Me Code Forward

ujja — Tue, 10 Mar 2026 03:31:44 +0000

This is a submission for the 2026 WeCoded Challenge: Echoes of Experience

Sometimes the difference between giving up and moving forward is just one person who believes in you.

I started coding when I was around nine years old.

My first program was written in LOGO, where I spent hours writing tiny programs using a funny-looking triangular turtle that moved across the screen. You could tell it to move forward, turn, and draw shapes, and slowly patterns would emerge. To a kid, it felt magical. A few instructions and suddenly the computer was drawing something I had imagined.

Back then I had no idea what a career in tech looked like. I just knew I loved making computers do things.

One thing that made my journey different from many stories I hear today was the support I received at home. My family, especially my dad, supported my interest in computers wholeheartedly. At a time when many people still questioned whether girls should pursue technology, he never did. To him it was simple — if I enjoyed it, I should pursue it.

That early encouragement made a huge difference.

The Myth of the Solo Journey

When people talk about careers in tech, the story is often about individual effort — perseverance, hard work, determination.

And while those things matter, looking back I realise something else played an equally important role: enablers.

Throughout my journey there were always people who gave me a small push forward at the right moment.

Not huge dramatic gestures. Just small nudges that made a big difference.

The First Catalyst

Early in my career I had a tech lead who noticed something about me before I fully recognised it myself.

I loved clean code.

I loved experimenting.

Hackathons excited me.

Instead of letting that remain just a personal interest, he organised a hackathon within the team.

At the time it seemed like just a fun activity. But in reality, it gave me confidence. It validated that my curiosity and enthusiasm for building things mattered.

Sometimes all someone needs is that small signal that their passion is worth investing in.

Finding My Voice

Later in another organisation I faced a different challenge.

I was technically confident, but public speaking terrified me.

Speaking up in meetings, presenting ideas, addressing a room full of people — those things didn't come naturally to me.

An office head in that organisation noticed this and gently pushed me out of my comfort zone.

Encouraging me to present.

Encouraging me to speak up.

Encouraging me to trust my voice.

I still remember a very simple piece of advice he gave me.

He said, “Start small. Just say hi to people in the morning.”

His reasoning was simple. If I greeted people in the hallway or by the coffee machine, when I later saw them in a meeting room they wouldn’t feel like strangers anymore. The room would feel a little less intimidating.

He also said something that stuck with me — smile. Maybe crack a small joke to ease the tension.

It sounded almost too simple at the time, but it worked. Slowly those rooms full of unfamiliar faces started turning into rooms with colleagues I already knew, even if only through a quick morning hello.

And little by little, speaking up didn’t feel so scary anymore.

Today I speak about topics I care deeply about, especially identity and authentication in tech — something I am incredibly passionate about.

The Reality of Being Heard

If you’ve worked in tech long enough, you’ve probably seen this happen.

Sometimes a woman's voice is ignored.

Ideas get overlooked.

Comments go unheard.

Credit sometimes travels in unexpected directions.

It happens.

But another truth exists too.

There are also people who amplify voices.

People who pause the room and say,

"I think she was making a really good point."

People who make sure ideas get the attention they deserve.

Over time I’ve realised the tech industry isn't defined only by the people who silence voices.

It’s also shaped by the people who make sure those voices are heard.

Recognising the Enablers

Even today in my current workplace I am fortunate to work with amazing people who create that kind of environment.

Looking back, my journey was never just about learning new technologies, frameworks, or systems.

It was also about recognising the people who helped me move forward.

The enablers.

The mentors.

The leaders.

The colleagues.

The allies.

The people who saw potential and helped unlock it.

Paying It Forward

The biggest lesson from my journey is this:

If you’ve had enablers in your life, the best thing you can do is become one for someone else.

Encourage the curious junior developer.

Support the quiet voice in the meeting.

Create spaces where people can experiment and grow.

Sometimes a small push can change someone’s entire trajectory.

I know it did for me.

And to all the girls who want to code but feel like they can’t,

to all the women and marginalised voices who sometimes feel unheard or silenced in tech:

Look around.

There are often people who quietly support you, encourage you, and believe in you — sometimes even before you believe in yourself.

Find those people.

Recognise them.

Hold on to them.

Because once you identify the enablers in your life, you’ll realise something powerful. You were never coding alone.

And if you ever feel like you don’t belong in tech, remember this:

Sometimes all it takes is one enabler to change your trajectory — and someday, that enabler might be you.

Rethinking AI Assistants: A Privacy-First Approach with Google Gemini

ujja — Wed, 04 Mar 2026 11:09:32 +0000

Built with Google Gemini: Writing Challenge

ujja

Feb 28

Building a Privacy-First Mobile Speech Assistant Using Google Gemini

#devchallenge #geminireflections #gemini #llm

Comments 14

5 min read

CommonGround: Designing Digital Spaces for Safety, Healing, and Connection

ujja — Wed, 04 Mar 2026 11:08:35 +0000

DEV Weekend Challenge: Community

ujja

Feb 28

Building Safer Online Spaces with CommonGround

#showdev #devchallenge #weekendchallenge

Comments 1

4 min read

What It Really Takes to Migrate 20+ Domains and 100+ SQL Tables from .NET to GraphQL

ujja — Wed, 04 Mar 2026 11:07:25 +0000

ujja

Feb 27

How We’re Surviving 20+ Domains and 100+ SQL Tables While Migrating Our Legacy .NET Backend to GraphQL

#csharp #typescript #docker #dotnet

Comments

5 min read

Building Safer Online Spaces with CommonGround

ujja — Sat, 28 Feb 2026 07:42:15 +0000

This is a submission for the DEV Weekend Challenge: Community

The Community

CommonGround is built for three interconnected communities that need safe, dignified spaces to heal and connect:

DV Survivors - Individuals escaping domestic violence who need anonymous, safe spaces to share their stories and connect with others who understand their experiences. They require strict privacy protections and gentle, non-triggering interactions.
People Reintegrating After Incarceration - Individuals rebuilding their lives after incarceration who need judgment-free support, community connection, and resources to successfully reintegrate into society.
Community Volunteers - Compassionate individuals who want to help vulnerable populations but need clear guidelines, AI-powered safety tools, and structured ways to provide support without causing harm.

This app is specifically designed for audiences who serve these populations and need trauma-informed digital tools that maintain dignity while ensuring safety.

What I Built

CommonGround is a trauma-informed community support web application that creates safe, AI-moderated spaces for vulnerable populations to connect, share, and heal together.

Core Features:

🎭 Three Persona System

Safety Seeker (DV survivors with anonymity focus)
Fresh Start (reintegration support with no judgment)
Community Support (volunteers with guided interactions)

🛡️ Trauma-Informed Onboarding

Gentle, non-invasive persona selection
Goal-setting with dignity-first language
Privacy controls with clear explanations
No forced disclosures or triggering questions

💬 Story Circles (AI-Moderated Group Spaces)

Safe group discussions with real-time AI moderation
Suggested gentle edits to maintain respectful tone
Private and public circle options
Story sharing with dignity-preserving prompts

🤝 CoCreate Activities

Kindness Wall: Community gratitude and affirmation board
Shared Story: Collaborative storytelling experience
Interactive Community Map: Real Leaflet-powered map with pinned safe locations, resources, and community spaces with Google Maps integration

📍 Support Services

Curated safe resources
Location-based service finder
Crisis hotlines and immediate support options

🔔 Complete Notification System

Real-time notification banner with swipe-to-dismiss
Navigation to relevant content
Non-intrusive, gentle alerts

📊 Reflection Tools

Personal progress tracking
Mood journaling
Safe self-reflection prompts

Design Principles:

Trauma-Safe Color Palette:

Soft Indigo (#5C6BC0) - Trust and calm
Calm Teal (#4DB6AC) - Healing and growth
Warm Amber (#FFB74D) - Hope and warmth

Typography: Inter font family for accessibility and readability

UX Patterns:

Gentle animations with Motion (Framer Motion)
Dignity-first language throughout
No dark patterns or forced engagement
Clear exit paths on every screen
Respectful micro-interactions

Demo

Video URL

Demo App URL

Code

Github URL

How I Built It

This is a fully functional web application built with Figma Make. The app includes:

✅ Complete authentication flow with persona selection
✅ Three-step trauma-informed onboarding
✅ Full dashboard with all features accessible
✅ Working Story Circles with real chat interface
✅ Interactive CoCreate activities including real map functionality
✅ Support services directory
✅ Notification system with routing
✅ Profile management
✅ Responsive design for mobile and desktop

Key User Flows:

Login → Select Persona → Onboarding (Welcome → Goals → Privacy) → Dashboard
Dashboard → Story Circles → Join Circle → Share Story
Dashboard → CoCreate → Interactive Map → Explore Safe Locations
Notification Banner → Click → Navigate to relevant feature

Key Technical Implementations:

Router Architecture:

// React Router Data Mode with protected routes
export const router = createBrowserRouter([
  {
    element: <RootLayout />,
    children: [
      { path: '/login', Component: Login },
      { path: '/', element: <ProtectedRoute><Welcome /></ProtectedRoute> },
      { path: '/home/*', element: <OnboardingCheck><HomeDashboard /></OnboardingCheck> },
      // ... more routes
    ],
  },
]);

Notification System:

// Swipeable notification banner with navigation
<motion.div
  drag="x"
  onDragEnd={(_, info) => {
    if (Math.abs(info.offset.x) > 100) onDismiss();
  }}
  onClick={() => navigate(notification.link)}
>

Interactive Map with Leaflet:

// Real map with markers, popups, and Google Maps integration
<MapContainer center={userLocation} zoom={13}>
  <TileLayer url="https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png" />
  {safeLocations.map(location => (
    <Marker position={location.coordinates}>
      <Popup>
        <a href={googleMapsUrl} target="_blank">Get Directions</a>
      </Popup>
    </Marker>
  ))}
</MapContainer>

How I Built It

Core Technologies:

Frontend Framework:

React 18 with TypeScript for type-safe component development
React Router (Data Mode) for client-side routing with protected routes
Vite for fast development and optimized builds

Styling & Design:

Tailwind CSS v4 for utility-first styling with custom design tokens
Motion (Framer Motion) for gentle, trauma-informed animations
Custom trauma-safe color palette defined in CSS variables

Key Libraries:

Lucide React - Beautiful, accessible icons throughout the interface
React Leaflet - Interactive community maps with real geolocation
date-fns - Date formatting for timestamps and schedules
AnimatePresence - Smooth enter/exit animations for modals and notifications

Architecture Decisions:

1. Trauma-Informed First

Every interaction designed to preserve dignity
Gentle language and non-triggering prompts
Clear exit paths and no forced engagement
Privacy by default with opt-in sharing

2. Persona-Based Experience

Three distinct user journeys based on needs
Personalized onboarding for each persona
Tailored content and features per user type
Flexible navigation adapting to user context

3. Component-Driven Architecture

Reusable, modular components
Consistent design patterns across features
Easy to maintain and extend
Type-safe props and state management

4. State Management Strategy

Local storage for authentication and onboarding state
React hooks (useState, useEffect) for component state
URL-based routing for navigation state
Future-ready for Supabase backend integration

5. Accessibility & Responsiveness

Mobile-first responsive design
Semantic HTML throughout
Keyboard navigation support
Screen reader friendly structure

Development Workflow:

Design System First - Established trauma-safe color palette and typography
Component Library - Built reusable UI components following design system
User Flows - Implemented complete user journeys for each persona
Interactive Features - Added real map, notifications, and dynamic content
Polish & Refinement - Gentle animations, micro-interactions, and UX improvements

Future Enhancements:

Supabase Integration for persistent data storage
Real-time AI Moderation for Story Circles using AI APIs
Push Notifications for mobile web experience
Progressive Web App features for offline support
Multi-language Support for broader accessibility
Analytics Dashboard for program administrators

Built with dignity, designed for healing, powered by community.

CommonGround represents the future of trauma-informed digital services for vulnerable populations - where technology serves humanity with respect, safety, and compassion.

Building a Privacy-First Mobile Speech Assistant Using Google Gemini

ujja — Sat, 28 Feb 2026 05:22:47 +0000

This is a submission for the Built with Google Gemini: Writing Challenge

What I Built with Google Gemini

I built a privacy-first mobile speech assistant designed to support people who stutter. The app focuses on fluency analysis, speech planning, roleplay practice, and pacing guidance — while keeping architecture simple and user data controlled.

But this project did not begin with Gemini.

It began with a question:

Can I build a fully offline, LLM-powered mobile speech assistant?

Phase 1: The Offline Mobile LLM Experiment

Before Gemini entered the picture, I spent significant time exploring on-device inference for mobile.

I experimented with:

Quantized GGUF models
llama.cpp bridges in React Native
Native C++ integrations
On-device transcription pipelines
Fully offline speech + reasoning workflows

Technically, I got models running.

But in practice, I encountered serious constraints:

Model weights increased app size dramatically
Memory pressure on mid-tier Android devices
Latency spikes when speech recognition and LLM ran together
Complex EAS builds and JNI debugging
Difficult JS ↔ native boundary stability

Speech applications are highly latency-sensitive. Even a few seconds of delay breaks confidence during fluency practice.

At that point, I asked the community:

Has anyone shipped a production-ready offline LLM mobile app without heavy compromises?

The responses were honest:

Yes, but you compromise heavily
Quantization reduces quality
Great for demos, harder for real UX
Choose two: size, speed, or reasoning quality

Phase 2: Hackathon Build

After those discussions, I participated in a hackathon and built a web-based speech pacing assistant using:

Elm for predictable state management
Elixir + Phoenix Channels for real-time behavior
Local LLM inference
Rule-based fallback logic

That project, Pacemate, focused on:

Real-time speech analysis
AI-powered fluency guidance
Progress tracking

It was intentionally local-first and privacy-conscious.

The reception was strong. Developers appreciated:

The clarity of architecture
The hybrid fallback design
The focus on real user experience instead of AI novelty

That positive response made me revisit the earlier community feedback more seriously.

If offline mobile LLMs introduce friction, and speech apps demand low latency and stability — maybe the right solution was not extreme offline purity.

That is when I began exploring Google Gemini 2.5 Flash.

Phase 3: Integrating Google Gemini

Instead of forcing everything on-device, I redesigned the mobile architecture to be hybrid and lightweight.

The current mobile stack:

React Native 0.81 + Expo SDK 54
Native speech recognition (Apple Speech Framework on iOS, Google Speech Recognizer on Android)
Google Generative AI SDK
Structured prompt architecture
Rule-based offline fallback

There is no mandatory backend.

The runtime flow:

User speaks.
Native speech recognition transcribes locally.
Transcript is sent directly to Gemini using a user-provided API key.
Gemini returns structured JSON feedback.
The app parses and renders categorized results.

API keys are:

User-controlled
Stored locally via AsyncStorage
Never routed through my own server

This keeps the AI boundary extremely thin.

How Gemini Is Used Technically

Gemini is used as a structured reasoning engine, not a free-form chatbot.

Example fluency analysis prompt:

Analyze the following transcript for fluency.

Return strictly formatted JSON:

{

"summary": "",

"strengths": [],

"improvementAreas": [],

"rephraseSuggestions": []

}

Transcript:

"""

{userTranscript}

"""

Implementation safeguards:

Explicit schema constraints in prompt
Deterministic key naming
JSON-only instruction enforcement
Defensive TypeScript parsing
Automatic fallback if parsing fails

Gemini 2.5 Flash was consistent enough with structure that I eliminated the need for a backend validation service.

That dramatically simplified the system.

Roleplay and Context Handling

For conversational practice scenarios:

Conversation history is stored locally.
Each turn is sent with prior context.
Gemini maintains continuity and supportive tone.

Example message structure:

[

{ role: "system", content: "You are supportive and concise." },

{ role: "user", content: "Hi, I’d like to order a coffee." }

]

The challenge was balancing realism with guidance. I constrained prompts to:

Avoid overly verbose responses
Maintain conversational authenticity
Provide subtle, not overwhelming, fluency feedback

Gemini handled tone surprisingly well for this sensitive use case.

Hybrid Architecture: Cloud + Fallback

Rather than choosing cloud or offline exclusively, I implemented both.

When:

Internet is available
API key is configured

→ Gemini powers:

Fluency analysis
Sentence rephrasing
Roleplay interactions

When:

Offline
No API key
Rate limit exceeded

→ Rule-based fallback activates.

Fallback includes:

Basic pacing heuristics
Template-based conversational responses
Simple word substitutions
Encouragement patterns

The app never hard-fails.

Graceful degradation became a core design principle.

Demo

Conceptually, the mobile experience works like this:

User speaks into the device.
Real-time transcription appears.
Within ~2 seconds, structured fluency feedback is displayed.
User can switch to roleplay mode for interactive practice.
Offline mode still provides guidance without AI.

Total app size remains around 50MB because no model weights are bundled.

There is no backend deployment required.

As the app is still under development and currently running in a stealth environment, I’ve recorded a demo video instead.

What I Learned

This journey reshaped how I think about mobile AI systems.

Technical lessons:

Offline LLMs are viable but operationally heavy on mobile.
Quantization reduces size but impacts reasoning quality.
Latency matters more than locality in speech applications.
Prompt engineering can replace backend microservices.
Structured schema prompts significantly improve reliability.

Architectural lessons:

Community insight can accelerate decision-making.
Hackathon validation can clarify real-world constraints.
Hybrid systems are often more resilient than extreme designs.
Engineering maturity is about choosing the right complexity level.

Google Gemini Feedback

What Worked Well

Strong instruction following with structured JSON outputs
Fast response times suitable for speech workflows
Supportive and adaptive tone
Clean SDK integration
No infrastructure management overhead

Gemini 2.5 Flash offered a practical balance between speed and reasoning depth.

Where I Experienced Friction

Occasional JSON formatting drift requiring defensive parsing
Free-tier rate limits needing UX consideration
Internet dependency for advanced features
User onboarding for API key setup

However, compared to embedding large LLMs directly into a mobile app, these trade-offs were manageable.

This project started with an attempt to push fully offline mobile LLMs.

After community feedback, a hackathon build, and real-world validation, it evolved into a privacy-first hybrid architecture powered by Google Gemini.

The biggest lesson was not about compression or inference tricks.

It was about architectural judgment.

Sometimes the most advanced system is the one with the fewest moving parts.

Tech for good, built and shared on DEV 💛. I built a stutter-friendly app for calm, supportive, judgment-free speaking practice, with gentle feedback and privacy-first design at its core. Built with Elm, Elixir, and Copilot CLI. Thoughts?

ujja — Fri, 20 Feb 2026 23:22:59 +0000

GitHub Copilot CLI Challenge Submission

ujja

Feb 14

I built a Stutter-Friendly App in 1 Day with Elm, Elixir, and Copilot

#devchallenge #githubchallenge #cli #githubcopilot

Comments 16

9 min read

Is Creativity Dying in the Age of AI-Generated Websites?

ujja — Wed, 18 Feb 2026 02:49:22 +0000

Lately, I’ve been noticing a curious trend. I visit one website, and then another, and… it’s almost the same. Layouts feel eerily familiar, interactions feel almost identical, and the overall "feel" is uncanny. What’s even more striking is that many of these sites have emerged in just the last year or two.

It makes me wonder. Is AI actually stifling creativity? Or is it just accelerating convergence in design?

Many of these websites appear to be built end-to-end with AI-assisted tools. From layout to copy to interaction patterns, it feels like someone hit a "VibeCode" button and got the whole package. The upside is obvious. Faster development, consistent quality, and lower cost. The downside? They all start to look and feel the same.

I could be wrong, but it seems like the proliferation of these AI-driven templates might be leading to a kind of homogenisation. The uniqueness that used to come from a designer’s experimentation or a developer’s creative twist is now being replaced by AI "best practices."

That’s not to say AI is inherently bad for innovation. It can supercharge ideas, help smaller teams punch above their weight, and unlock possibilities that were previously too time-consuming. But if everyone leans too heavily on AI-generated defaults, we might end up in a world where every new site looks like a slightly different clone of the last one.

So maybe the real challenge isn’t AI itself. It’s how we use it. If we rely on it blindly, innovation can stagnate. But if we treat it as a creative partner, a tool rather than a template factory, there’s still room for fresh ideas, bold experiments, and genuine originality.

The question I keep coming back to is this. In a world where AI can do "most of it" automatically, how do we ensure we’re still pushing boundaries instead of just reproducing what already exists?