The developer's emotional companion
GitHub tracks what you did. DuoGit makes you want to do it again. A cross-platform mobile app that turns cold commit data into motivating emotional feedback — filling the gap between utilitarian dev tools and generic gamification.
GitHub lacks the emotional dimension
The GitHub contribution graph is a powerful data visualization, but it offers purely passive, technical feedback. There are no proactive "nudges" or emotional reinforcements when a developer is at risk of breaking their streak.
Current solutions are either strictly utilitarian coding tools or generic gamification (habit-tracking) apps that don't differentiate meaningful code contributions from generic daily tasks.
● The Problem
Users care deeply about their coding streaks, but the native GitHub experience lacks the "nudge" factor. Generic apps require manual input, adding friction and failing to connect directly with developer workflows.
● The Opportunity
Define a new product category that addresses both technical tracking and emotional engagement. An interactive widget combining a familiar psychological trigger (a mascot) with direct GitHub API integration.
The "worried mascot" is a powerful psychological trigger.
Inspiration came from evaluating adjacent markets. Duolingo proved that emotional mascots and streak mechanics drive retention. However, no competitor combined these elements specifically for software development integration.
"Generic habit trackers lack software development context... they require manual input and do not differentiate meaningful code from generic tasks."
— UX Strategic Insight #4Defining Success for DuoGit
The goal is not just to build a widget, but to foster positive behavioral change among developers — moving from sporadic, high-stress commits to consistent, stress-free daily routines.
Behavioral Metrics
Daily Commit Rate
Increase baseline from ~1 commit/day to ≥3 commits/day
Weekly Streak Duration
Increase baseline from 2-3 days to 5+ consecutive days
Post-Streak Recovery
Improve rate of recovery within 3 days from <30% to >60%
Emotional Satisfaction
Perceived Progress Clarity
Target a 50% increase in user-reported clarity (Survey 1-10)
Streak-related Anxiety
Target a 40% reduction in reported stress levels
Guilt-free Motivation
Ensure users feel motivated by the ghost mascot, not guilty
The Streak Journey Flow
The widget introduces a simple but effective daily loop based on the GitHub commit status. It seamlessly maps the emotional state of the character to the user's progress.
Active Streak
User sees "HAPPY" status. Taps the widget, performs their daily commit, and the widget verifies the streak.
At Risk
Widget displays warning (e.g., "Quedan 5h"). User sees the alert, feels the urgency, and is driven to commit.
Streak Lost
Streak is broken ("0 DÍAS"). User acknowledges the loss and is prompted to start a new streak with a first commit.
Three widgets, one behavioral loop
Designed as the next phase, the widget layer surfaces the most critical state — streak health — directly on the home screen. Three sizes, each with a distinct role: reinforce progress, broadcast rank, or trigger recovery before the streak breaks.
Visualizing GitHub Progress
DuoGit provides GitHub integration presented dynamically across the app's screens and widget states natively on iOS & Android, using emotional feedback to drive behavior.
Dynamic Mascot States
4 illustrated avatar expressions — Happy, Worried, Sad, Neutral — each with a unique glow halo. The emotional state mirrors commit activity in real time.
SPACE Metrics Dashboard
Four performance dimensions — Efficiency, Satisfaction, Performance, Activity — each with SVG sparkline charts, AI insights, and trend indicators.
Liga Ranking System
8 creative developer ranks from Jr Dev 🌱 to 10x Dev 🚀, unlocked by streak consistency. Visualized as a progress arc on the mascot ring in Profile.
Profile Ring
SVG circular progress arc colored by current rank, mascot clipped inside the circle, floating badges with levitation animation and percentage at the arc tip.
GitHub OAuth
Direct integration via expo-auth-session. Connects automatically to commits — no manual tracking required.
Home Screen Widget
iOS & Android widget showing live streak, mascot state and daily commit status at a glance from the home screen.
GitHub OAuth — What's Coming
The next screen to ship. A GitHub-native authorization flow via expo-auth-session — no manual tracking, no CSV uploads. Connect once and every commit syncs automatically.
expo-auth-session for a proper OAuth 2.0 flow — no password stored, no third-party keys, just GitHub's own consent screen.The iOS Widget Family
The widget scales gracefully across three sizes — all designed to live on the home screen, the first thing you see when you unlock your phone. A unified 60/40 zoning model keeps data left, emotional state right, every time.
The Mobile App — 9 Screens
Beyond the widget, DuoGit ships as a full React Native app. Each screen is purpose-built around a single behavioral goal: making the developer's progress impossible to ignore.
Login
Dashboard
SPACE Metrics
Liga
Profile
Status
StreakGitHub OAuth
League RankLoginDashboardSPACE MetricsLigaProfileStatusStreakGitHub OAuthLeague RankLiga — Competitive Ranking
8 creative developer ranks from Jr Dev 🌱 to 10x Dev 🚀, unlocked by streak consistency. The league screen turns solo habit-building into a social game — without the toxicity.
Emotional System & Market Position
The app maps directly to specific user feelings during their daily routine. This deliberate anthropomorphism creates an engagement hook that utilitarian tools lack.
Bringing it all together
DuoGit is not yet in production — these are design targets benchmarked against industry data, not live metrics. The interaction loop is built and testable; the numbers below reflect what success looks like once real users are in.
↻ What's next
The immediate path is GitHub OAuth via expo-auth-session to replace mock data with live commits, followed by the home screen widget — the original trigger for the product concept.
Longer term I'd explore team streaks (shared mascot between coworkers) and unlockable avatar skins per Liga rank — the 4 emotional states are already shipped, new skins per rank would deepen the reward loop without adding friction.
UI Kit built for behavioral clarity
Every visual decision is codified — colors map directly to emotional states, not aesthetics. The system ships as NativeWind tokens inside the React Native codebase.
🎨 Color Tokens
Backgrounds
State Colors
Typography
📦 Core Components
MetricCard
Displays a single SPACE metric with icon, trend badge, value and unit. Reused across Dashboard and Metrics screens.
SparkLineChart
Inline SVG line chart for commit activity trends. Renders inside MetricCard without external dependencies.
MascotDisplay
Renders mascot image with glow halo based on state. Accepts size and grayscale props for widget contexts.
NativeWind Tokens
All colors defined as Tailwind extensions — bg-background-dark, text-accent, text-neon-orange — consistent across all screens.