AI-powered website development for an international fintech company in 15 days

AI
design

Client

MSB Gate is an international fintech company that helps small and mid-sized financial service providers build global payment infrastructure.

Large banks often avoid working directly with smaller businesses. MSB Gate bridges this gap by helping clients build the financial infrastructure they need: passing compliance checks, opening bank accounts, enabling international payments and working across multiple currencies.

Challenge

The market for these services is highly niche. One of the company's main goals was to show that it exists and can be trusted.

At the same time, almost the entire industry operates under NDAs. MSB Gate cannot disclose its banking partners, showcase well-known clients or share project details.

Goal

The challenge was unusual: build trust without the traditional trust signals companies usually rely on.

The website also needed to explain complex financial services in simple language, generate qualified leads and create a strong foundation for future SEO and content marketing.

And it all had to happen as quickly as possible without compromising quality.

Solution

We kept our standard product approach: first, we dug into the client's business and goals, then brought AI into the workflow. The new workflow helped us ship a high-quality website faster without changing the scope, timeline or budget. The first working version went live just 15 days after kickoff.

We learned how the business works

During stakeholder interviews, we identified MSB Gate's core competitive advantages.

MSB Gate moves faster than competitors in every area it can control. While final timelines depend on partner banks and cannot be guaranteed, the team keeps its own processes as fast and efficient as possible.

These insights became the foundation of the website.

Designed the landing page

We structured the homepage as a conversation with potential clients.

First, we explained what MSB Gate does and how its infrastructure works. Then we showed which industries the service supports and which business problems it solves.

Trust became a major focus. We explained how the compliance process works, how client verification happens and which safeguards help reduce operational risks. Based on our interviews with the team, we highlighted the company's strongest advantages and visualised the onboarding journey.

Project timelines required a careful approach. MSB Gate genuinely moves fast but cannot promise end-to-end delivery because part of the process depends on banks and clients themselves. Instead of making unrealistic claims, we only showed timelines for stages under the company's control: onboarding takes up to five days, while the following stages typically take two to three weeks.

Since public case studies were not an option, we built trust in other ways. We introduced the team, explained what happens after the first enquiry, encouraged visitors to book a call and turned the contact section into a trust-building element by showing photographs of the company's Canadian office and highlighting that real people stand behind the service.

Built the foundation for future growth

We designed the website architecture with future expansion in mind.

Today, many services and industries are presented directly on the homepage. As the website grows, each section can become a dedicated landing page. The homepage won't need to be redesigned — adding internal links will be enough.

This approach creates a scalable foundation for SEO and content growth without requiring the website architecture to be rebuilt.

Combined product thinking with AI

For this project, we fully tested our AI-powered frontend pipeline while keeping our standard product design process intact.

First, the team dug into the client's business and goals. Then we designed the page structure, aligned on the visual direction and only after that moved the project into AI-assisted development.

Prepared the design for AI-assisted development

The design team finalised the layouts and prepared them for automated implementation. We structured styles, design tokens and components so AI could turn them into a consistent design system.

We then uploaded the UI kit, project description and other materials into Claude. Instead of manually transferring each section, we gave it a structured workflow:

break the page into sections;
analyse each block separately;
compare the output with the designs;
assemble the full page section by section.

Within a few hours, Claude had prepared the first working version of the page.

After that, the team focused on where human expertise still matters most: reviewing the output, refining interface details, integrating WebGL (technology for creating interactive 3D graphics directly in the browser without additional software) and bringing the visuals to the final stage.

Moved the design into the browser

Instead of reviewing everything only in Figma, we started testing decisions directly in the browser. Many design choices are easier to evaluate in a working interface, so some of them were made after the first version of the product was already running.

This approach helped us refine responsive behaviour, card scrolling, WebGL performance and interactive states.

As a result, some differences between the original designs and the final version were intentional — they appeared after the team started working with the live website and validating decisions in a real environment.

Improved the interactive graphics

AI helped us improve the quality of the final product without extending the timeline.

Previously, WebGL animations, interactive elements and complex graphics required separate production work: development, 3D modelling, animation and lengthy integration.

Now, a significant part of this work can be accelerated with AI. To configure the animations and the globe, we built our own tools that allow us to adjust scene parameters through JSON (simple way to store settings as data) and quickly test different settings. Part of the time after the automated build went into these refinements.

In addition to the WebGL scene, we added animations for information blocks, cards and decorative elements.

As a result, we can now create more visually engaging products without extending timelines or increasing budgets.

Automated content management

While working on the project, we discovered another bottleneck. Every time the client updated the copy, the team had to transfer those changes manually.

To remove that repetitive work, we moved all website content into a single .md file that the client can edit through Google Docs.

This gave us a new workflow:

Client → Google Docs (.md) → Claude → website → Figma

Now, whenever the client updates the content, AI automatically:

updates the website;
synchronises the Figma files;
preserves every change.

Content is no longer tied to the development process.

The experiment also showed that projects like this often don't need a traditional CMS. For corporate websites, Google Docs combined with AI can provide a much simpler and more efficient workflow.

Optimised performance

We wanted to keep the complex WebGL graphics while achieving a high Google PageSpeed score — ensuring a fast user experience and strong performance for both users and search engines.

To achieve this, we optimised the graphics, built a dedicated tool for adjusting scene parameters, reduced the overall file size and changed the loading sequence. The core content appears immediately, while WebGL only starts after the user’s first interaction with the page.

This approach gives visitors a fast experience while ensuring search engines see a well-optimised website.

We launched the first version of the website in 15 days. It went live with responsive layouts, animations, WebGL and all required technical configurations.

The next step is to continue developing the project: adding a blog, dedicated service pages, SEO and GEO content. The website is now a fully functional MVP that already supports business goals while providing a strong foundation for future growth.

Review

We turned to Depot 42 to create a website for our consulting company, which provides compliance and legal support to financial companies operating in Canada. The challenge was to explain complex ideas and present specialised products in a simple, infographic-driven format that clients could easily understand.

Depot 42 completed the project quickly and presented our six main products clearly and accessibly. We especially appreciated their approach: the team worked not only as designers but also as marketing consultants, helping us structure the website so that it was visually appealing, logical, and clearly described our services.

We are very satisfied with the result. Our website now serves not only as a lead generator but also as a comprehensive presentation that we send to clients instead of a PDF. We are confident that our collaboration with Depot 42 will continue.