Chata.ai Blog Redesign and CMS Integration Project

The goal of this project was to redesign and restructure the blog experience of Chata.ai into a scalable, CMS-driven content system.

The clients had a clear vision supported by references and examples. My role was to translate these expectations into a structured, consistent system aligned with the existing SaaS design language.

While the blog contained valuable content, it lacked consistency with the rest of the product and suffered from weak hierarchy, suboptimal reading flow, and no structured topic system for content organization and navigation.

The objective was to redesign the blog UI and build a flexible CMS architecture supporting multi-category content, improved discoverability, and smoother navigation between topics and articles.

The blog experience was visually and structurally disconnected from the main SaaS product, creating inconsistency across the user experience.

Article layouts were not optimized for reading: hierarchy was unclear, headings were too dominant, and imagery disrupted content flow.

The main challenge was structural rather than visual.

The clients wanted a topic-based CMS system where articles could belong to up to two categories, along with a persistent navigation system enabling users to explore topics within the reading experience.

This required a seamless experience where navigation between topics and articles felt continuous rather than like page transitions.

Additionally, the blog index needed category filtering while maintaining clarity and simplicity.

The challenge was to design a scalable CMS system that:

supports multi-category content

enables topic-based navigation across articles

maintains seamless browsing without breaking user flow

integrates into a consistent SaaS design system

The project started by translating the client’s references into a structured system aligned with the existing product.

I analyzed the existing blog to identify friction in content consumption and navigation, then reframed the experience as a connected system rather than isolated pages.

The work focused on:

aligning UI with the SaaS design system

improving article readability and hierarchy

restructuring the blog index for category-based browsing

building a scalable CMS-driven topic architecture

A key focus was designing navigation logic that allowed users to explore topics without feeling page transitions, preserving continuity across the experience.

The CMS structure became the backbone of both navigation and content organization, enabling scalable and flexible categorization.

A scalable CMS-driven topic system was built to structure the entire blog.

Each article can belong to up to two topics, enabling flexible categorization without rigid constraints.

This system powers both navigation and discovery, allowing users to browse content through a unified topic layer.

A dynamic filtering system on the blog index reinforces this structure, creating a continuous browsing experience across articles and topics.

The article page was redesigned to improve readability and content flow.

Hierarchy was refined to reduce visual competition between title, imagery, and body content, creating a clearer reading structure.

Typography and spacing adjustments improved readability and established a smoother content rhythm.

The result is a more focused reading experience aligned with the SaaS design system.

Blog cards were redesigned to improve scanability and emphasize article titles over metadata.

Supporting information like date and reading time was reduced in visual weight to improve clarity.

The reading experience was enhanced with a CMS-connected dynamic Table of Contents (TOC), implemented via code.

The TOC adapts automatically to article structure, enabling easier navigation in long-form content while remaining scalable across all CMS entries.

The blog is now a structured and scalable content system fully integrated into the Chata.ai SaaS experience.

It is no longer a disconnected layer, but a cohesive extension of the product with consistent design and clear information architecture.

The CMS-driven topic system enables flexible categorization and improves content discoverability, while unified navigation ensures a seamless browsing experience.

Article readability has been significantly improved through clearer hierarchy and layout refinements.

The blog index is now easier to scan and navigate, with stronger emphasis on content relevance.

Finally, the CMS-connected TOC improves usability for long-form reading and reinforces structural clarity across all articles.

Scalable CMS-driven topic system (up to 2 categories per article)

Unified navigation logic across topics, articles, and index

Improved content discovery through category filtering

Redefined article hierarchy for better readability

Enhanced blog cards for faster scanning

CMS-integrated dynamic Table of Contents (TOC)

Stronger visual consistency with SaaS design system

Improved reading flow and reduced visual noise