Sansan has revolutionized its processes, from design to implementation, by leveraging Dev Mode MCP Server and Code Connect. A new development phase is underway through human-AI collaboration.

Sansan's "AI-First" MCP Deployment

Figma's Dev Mode MCP (Model Context Protocol) Server is a mechanism designed to integrate the design and development processes, providing an AI-powered development experience.

The business database “Sansan" has strengthened its presence with business card management services and has since developed a wide range of services under its corporate vision of "serving as essential corporate infrastructure", including the accounting DX solution “Bill One”and the business transaction management solution “Contract One”. In particular, the Contract One development team is transforming the workflow from design to implementation by leveraging the Dev Mode MCP Server and Code Connect, ushering in a new era of development in which AI and humans collaborate.

Sansan started using Figma around 2019. Initially, it was mainly used by product designers, but later its use expanded to include departments such as the engineering, sales, and customer success departments. Figma has become a common platform that connects internal and external stakeholders. For instance, it is used to present prototypes to customers to convey future feature concepts, as well as to enable various departments to provide feedback. As the design system became more established, Figma grew into a familiar and approachable tool for everyone at Sansan.

To learn more about Sansan's design system, visit https://ui.one-design-system.sansan.com/?path=/docs/one-ui-component-library--docs

Mr. Takenori Oshima, Head of Contract One Engineering Unit, recalls: "It allows a diverse range of members, including those from sales and customer success, to interact on the same platform. This naturally led to a culture of aggregating everything on there."

Additionally, Sansan adopted the "AI First" slogan for 2025 and announced a company-wide policy to accelerate AI adoption. To signify this shift, the Contract One team launched LLM Week and decided to temporarily stop all human coding as they took on the challenge of entrusting everything to AI.

Mr. Oshima continued, "We believed it was important for everyone to accomplish something using AI at least once. We thought that, by experiencing both successes and failures, we could have next-level discussions."

However, this initiative posed an unprecedented challenge and risked stalling front-end development. Mr. Takeshi Inoue from the Contract One Dev Group led efforts to counteract this. "To be ready in time for LLM Week, we hurried to figure out how we could use AI efficiently. The Dev Mode MCP Server had just launched around that time. There was no information within the community at the time, and the only hints we could find were on Figma's official website. Through trial and error, we adjusted the prompts until we were finally able to make it usable."

Mr. Oshima explained the reasoning behind the decision to adopt the Dev Mode MCP server: "Our basic idea was to first try LLM Week and then make a decision based on its results. Rather than being strict about which ideas to adopt, we decided to try anything with potential. Figma was already available for use within the company, and due to the nature of our service, which involves handling contracts, the AI tools we could use were limited. In other words, the Dev Mode MCP Server was familiar to us and easy to deploy."

Thus, Sansan quickly adopted the Dev Mode MCP Server. By combining it with Code Connect, we bridged the gap between design and implementation, paving the way for large-scale AI deployment in our development process.

The realities of utilizing MCP that accelerated the development of new features

The Contract One team, which deployed the Dev Mode MCP Server and Code Connect, first conducted repeated trials in the field of new feature development. Mr. Inoue speaks about that time as follows:

"Code Connect is convenient because it generates a template just by running a code. However, since the design system was not very mature, there was a gap between Figma's design and React's component implementation. Therefore, tasks were still required to gradually fill in those gaps. But, since we already had a design system in place, I feel the deployment itself proceeded smoothly."

In terms of actual developments, Sansan proactively used the Dev Mode MCP Server to create new screens for Contract One. The "AI Company Summary" feature, released in August 2025, was implemented using the Dev Mode MCP Server. Mr. Inoue: "By selecting the component we want to create in Figma and entering the prepared prompts, we can quickly generate screens of a certain quality. While it's not perfect, having the basic framework come together quickly can significantly reduce the workload."

Of course, devising effective ways to use these tools is also essential. Mr. Inoue: "The key is not to let it do everything all at once. First, we provide the Figma URL to help it grasp the overall picture. Then, in the next step, we break down the components. Through this workflow, we provide instructions incrementally. For example, in terms of CSS styling, we adjust the prompts to make them easier for the AI to understand by providing examples of our company's internal definitions. It's so satisfying when our efforts produce the desired results."

Through trial and error, we accumulated the know-how that helped transform the Dev Mode MCP Server into a practical tool for Sansan's development teams.

Sansan's development style, defined through rapid plan-do-check-act (PDCA) cycles

Following its implementation for Contract One, the Dev Mode MCP Server spread rapidly within Sansan. Mr. Oshima reflects on this:

"The Dev Mode MCP Server wasn't exclusive to Contract One. It also sparked initiatives in other departments that recognized its potential. Usage increased so much in August that we ran out of accounts, prompting us to purchase more immediately. Some teams have started using Figma from the design phase, and it's gradually becoming the standard within the company."

The effectiveness was more pronounced in projects where information was aggregated in Figma. "If all the information is available in Figma, development time can be significantly reduced." While conditions differ in existing projects and a direct comparison isn't possible, the impression is that work time can be reduced by about half in new developments. I believe that the data structure's interpretability by both humans and AI is leading to increased efficiency. During LLM Week, 80% of pull requests were AI-generated. However, from a workload reduction standpoint, there are still many challenges. The process is partially effective, but there is room for improvement."

Mr. Inoue has also calmly analyzed the results. "During LLM Week, some metrics actually showed a decrease in productivity. This made us realize how important it is to clearly identify the areas where AI can truly excel and those where it cannot. That is precisely why it is essential to share the knowledge gained, including both successes and failures. Implementation speed has clearly improved, and many team members have commented on the tool's usefulness. For instance, it's common for changes to be made after a sprint review. However, if we receive updates through Figma, we can apply those changes immediately. This process is better suited to gradual improvement than delivering something perfect all at once. Being able to revise designs based on user reactions is a great benefit.

Mr. Oshima: "The Dev Mode MCP Server is a perfect fit for the current phase of Contract One, which involves continuous cycles of releases and improvements. AI features, in particular, are still in the exploration phase. However, by using the MCP, we can quickly complete the PDCA cycle. I believe that is its greatest strength."

Mr. Inoue: “Contract One is a product that can be used by a wide range of people, not only in legal, but also in sales and the back office. That's precisely why we want to make the UI more intuitive and user-friendly. To that end, we aim to leverage the Dev Mode MCP Server, which allows us to respond quickly and effectively to changes. Our goal is to further improve Code Connect's completeness for that purpose."

A new development phase based on human-AI collaboration

Mr. Oshima envisions expanding the use of AI beyond UI development to encompass the entire process. "If we think of a UI as a single component, then we should be able to treat it as such within a program. This will dramatically speed up the entire development process. People can discuss ideas on Figma, and the AI can handle the implementation. If we can achieve this division of labor, I believe it will lead to a much more interesting world for engineers. One of the key challenges is articulating tacit knowledge. For parts where the answer is the same no matter who looks at them, we can leave them to AI. However, for things where interpretations vary from person to person, leaving it to AI leads to inconsistencies. Clarifying the gap between the two will expand the scope of AI utilization even further."

Company-wide, Sansan is entering a phase of "discontinuous growth" that surpasses the current trajectory.

Mr. Oshima: "Even with Contract One, we are pursuing growth that goes beyond our current trajectory. That is why we need to rapidly accelerate our development speed. We believe that a workflow enabling seamless progression from design to implementation in Figma will be the key breakthrough. If we can build a framework where humans and AI work together in harmony, the Dev Mode MCP Server has the potential to become a central tool in that ecosystem." Further refining this framework will allow us to reach a level of development that satisfies everyone, similar to Toyota's "autonomation" (human-machine collaboration), where people can focus on judgment and creativity while machines handle operations.