Build, review and deploy with Git
From connecting to Git , to CI/CD and Branch Protection
role
Senior Product Designer
engineers
PM + 2 Backend + 1 Frontend
timeline
July 2023 - Jan 2024
company
Appsmith (Git Pod)
tldr
Connecting to Git is now 75% easier
A redesigned Git Connect flow simplified onboarding by breaking the process into smaller, visual-first steps — eliminating the need for external docs or guesswork.By reducing cognitive load and guiding users inline, we saw a 75% increase in successful Git connections — a big leap in clarity and completion
Jump to —
Appsmith & Git
Appsmith's Git integration in 2021 marks a major advancement, boosting
productivity and reliability in internal app development.
Overcoming complexities in native Git integration, its seamless inclusion empowers teams for rapid iterations, testing, and maintenance, simplifying code management and offering real-time insights
Amid Appsmith's rapid growth, Git's scalability has lagged. Priority on diverse features and ongoing experiments overlooked building strong foundations, causing poor user experience and hampering Git's reliability.
Git in Appsmith
The Challenge
We aimed to harness the full potential of Git, simplifying developers' workflows and enabling Appsmith's monetization. We prioritize a robust foundation and the integration of key features as our primary ambitions.
Our high-level goals were to —
Developing enterprise-grade SDLC-supportive features.
Make it intuitive and easy to collaborate and build.
Implementing a standardized Git platform aligned with core workflows.
Mapping the Strategy
To reach our goals, we're streamlining git for user-friendliness and accessibility. This approach prioritizes enhancing activation, allowing users to discover the potential of git through low-code tools.
Subsequently, it encourages the exploration of additional SDLC features and promotes the standardization of other functionalities.
Click on image to zoom
Git Connect & Import
Continuous delivery
Commit, merge & Revert
Releases & Easy Rollback
1
ROAD MAP OPENER - GIT CONNECT & IMPORT
Connecting to git
Half of our developers encounter difficulties activating Git within Appsmith, through community reporting 2-3 issues every week when connecting.
Our goal
Ensure developers connect to Git at the first attempt, aiming for a 100% success rate while minimizing errors. I collaborated closely with my product manager to explore diverse insights.
Before redesign of git connect & import
What does data say
50%
of active builders who use Git face an error during Git connect.
Git Connect
50%
of Git Connect API requests throw an error.
Git Connect
35%
of Active Builders who use Git face an error during importing an app via Git
Git Import
25%
of Import via Git API requests throw an error.
Git Import
Findings from current user sessions
What we learned from watching 80 Git Connect sessions through Smartlook
Connecting to a non-empty repo
This primarily occurs when users attempt to import an app without prior familiarity or when additional files/commits are added to the Git repo before connection, leading to errors.
3-dot icon beside the SSH key
Users engaging with the 3-dot icon beside the SSH key, seemingly seeking assistance or guidance due to confusion.
Repetitive User Frustration
This describes users' persistence in following a particular course of action despite receiving guidance or instructions about errors. This persistence causes frustration, which escalates over time.
Documentation to resolve errors
Users consistently turn to documentation for solutions. This highlights a gap between the platform's error-solving efforts and users' reliance on external resources.
Users can resolve errors
Connecting or importing via Git in Appsmith involves several steps—pasting the remote URL and SSH key—causing errors for some users during the process.
We were surprised when we see that many of the errors that occur during the process are with configuration and people are able to resolve them.
Most developers can resolve errors successfully,
indicating configuration issues.
Delving into the process
After mapping the current flow and investigating further, we discovered several minor errors that significantly misguide the user.
Figjam loading, give it 5-7 seconds
Pod braindrawing exercise
We kicked off the ideation for the Git Connect import revamp with a quick brainstorming exercise. Each team member sketched their vision for the new flow in under 5 minutes, focusing on simplicity, clarity, and developer context.
This helped surface diverse ideas fast, removed early biases, and set a shared creative foundation before diving into structured discussions.
Team jamming on Figjam
Akhil - Sr Product Manager
Ginil - Engineering manager
Anagh - Backend engineer
Nayan - Backend engineer
Other tools
We've explored several tools, but few offer true Git Connect functionality. Given the limited references, we're largely on our own, shaping a new pattern from the ground up.
Tools that have git connect flow
Start with sketches
The sketches converged around three core options, each presenting the import flow in a stepwise manner but with different formats—one used a linear progress tracker, another opted for an accordion layout, and the third integrated steps within a single scrollable view.
Option 1 - Define 3 steps first and go on-by-one
Option 2 - Step-by-step process with acknowledgment (horizontal)
Option 3 - Step-by-step process with steps acknowledgment (vertical)
Revised approach and final screens
We aligned on a linear step-by-step flow with contextual guidance to keep things clear and focused. The final screen simplifies repo selection, keys mapping, and setup into clean, actionable steps.
Refined approach
Final screens
Git service provider is different
No empty repository
Generate SSH key
Add deploy key
Live demo for Git Connect
Live demo for Git Import
User testing before pushing to prod
Users described the experience as smooth and intuitive, with GIFs and step-by-step cues guiding them through.
2
SECOND EPIC - CI/CD
CI/CD
Teams manage multiple environments via Git, but manual pull-deploy flows add overhead and risk. We're solving this by automating deployment via Continuous Delivery
Approaches Considered
Polling from instance
Instance fetches new commits every minute from configured branches.
✅ Easy setup
❌ Closed system, platform-heavy, potential scale issues
Trigger from CI (Chosen)
CI tool calls Pull API on push using generated workflow and API key.
✅ Open, scalable, fits into existing CI/CD
❌ Initial setup has more steps
Chosen after internal feedback
Scales better, integrates into existing developer workflows
Easier to extend across tools
and use cases
Figuring out the flow
We explored multiple activation paths and narrowed down to a flexible CI-triggered pull approach that fits diverse tooling needs. The focus was on minimizing manual setup while enabling seamless integration with GitHub, GitLab, and Bitbucket.
Easy activation
Ideation
CI/CD in action
Once configured, every push to the selected Git branch triggers an automated pull and deploy on the connected Appsmith instance. This eliminates manual intervention, keeps environments up to date, and ensures a smoother developer workflow. The system validates, builds, and ships changes — all via the CI/CD pipeline — offering a fast, reliable delivery loop.
Live demo
Website will be revised in actual code soon
@ Roop Krrish 2025