DATALi BUSiNESS WEBSiTE

🧭 Overview

Datali is a Swiss AI company offering data science and artificial intelligence solutions for B2B clients. The company needed a modern, conversion-focused website to strengthen its brand identity and encourage potential business partners to book a discovery call.

I led the project from concept to implementation, working closely with the client and their copywriter to align business goals with visual and technical execution.

🎯 Objectives

- Create a professional, trustworthy web presence aligned with the AI & data-driven brand identity.

- Encourage potential clients to book a discovery call through clear CTAs and persuasive design.

- Equip Datali with a flexible CMS for publishing case studies and managing multilingual content.

- Modernize the company’s branding for a cleaner, more high-tech aesthetic.

💡 Process

1. Research & Discovery

I began by benchmarking competing AI and data science company websites to identify best practices in layout, tone, and UX flow. After stakeholder discussions, we defined essential content types (services, case studies, and company presentation) and conversion paths.

2. Visual Identity & UI Design

Datali’s original branding used a dated yellow logo. I reworked the identity to achieve a sleek black-and-white logotype, keeping yellow as a subtle accent color for CTAs and highlights.

A new monospace typeface, Kode Mono, was selected to convey a contemporary, “AI-powered” feel consistent with Datali’s technological focus.

3. UX & Interaction Design

Fast wireframing helped quickly validate content structure and navigation. To retain user attention and prevent “instant scrolling,” I designed:

- a smooth intro animation on load,

- subtle scroll-triggered section reveals to guide reading rhythm.

4. Development & Implementation

The site was implemented using Next.js for performance and SEO, and PayloadCMS (backed by PostgreSQL) to give the client full control over content.

We customized shadcn/ui for a consistent, accessible component library aligned with Datali’s new design language.

For version control and collaboration, we used GitLab with issues and pull requests, deploying via CI/CD pipelines to a self-hosted Kubernetes cluster.

5. CMS & Content Architecture

One of the key challenges was designing a flexible CMS structure for case studies. Since case studies required mixed content (text, visuals, statistics, quotes, and embeds), I implemented modular content blocks that can be dynamically inserted inside rich text—offering flexibility without breaking structure.

We also implemented multilingual support (English, German, French) to reflect Switzerland’s language diversity.

⚙️ Challenges & Solutions

Challenge Solution

Highly flexible case study pages Created custom dynamic block system inside PayloadCMS rich text editor

Multilingual content support Built localized routing & translation layers for EN/DE/FR

Reducing bounce rate Added intro animation and smooth section-based reveal animations

Client maintainability Provided CMS-based editing tools and documentation for content updates

📈 Results

- Significant increase in site traffic and contact inquiries after launch.

- The client gained full autonomy through CMS-driven content management.

- The new design clearly differentiates Datali in the B2B AI space, improving brand credibility.

🔍 Reflections

This was my first commercial project using PayloadCMS, which has a steep learning curve. Working through it strengthened my understanding of headless CMS design, modular content modeling, and enterprise-grade deployment pipelines.

If I were to revisit this project, I would focus even more on CMS flexibility, ensuring minimal hard-coded structures and improving editor experience with more configurable content patterns.