Astrato homepage hero shown on laptop and mobile devices against a dark red gradient background with candlestick chart motifs
Project overview

Astrato is a warehouse-native business intelligence platform. It lets data teams build live dashboards, embedded analytics, and operational data apps that run directly on their cloud warehouse – Snowflake, BigQuery, Databricks and others – with no data extracted or copied, plus the AI, security, and governance modern data teams rely on.

Our goal was to refresh Astrato’s digital presence and better communicate the value of its warehouse-native business intelligence platform.

Tasks
  • Refresh the website design and elevate the product story across a prioritized set of pages
  • Refresh and redraw key graphics and illustrations, with custom artwork for the homepage
  • Implement the design in Webflow using a component-based, section-driven approach so the client can edit and assemble pages independently
  • Refactor and optimize existing code
  • Restructure and streamline CMS collections
Tools
Figma
Figma
Webflow
Webflow
Solutions
Outcome
  • A premium redesign delivered under tight deadlines
  • Cleaner, optimized CMS collections and resolved technical issues
  • A reusable design system and Webflow components the team can manage independently
  • An expanded engagement, built on the client's trust

Solutions

From content to architecture

Astrato handed us finalized copy and references, but no structure. We mapped every block into a mind map and reshaped it into a clear flow.

Locking the narrative early kept every later design decision grounded and saved hours of redrawing visuals around an unsettled story.

From content to architecture – Board mapping Astrato's content into a mind map, transformed into a structured homepage sitemap with sections Hero, Value Proposition etc.
From content to architecture – Board mapping Astrato's content into a mind map, transformed into a structured homepage sitemap with sections Hero, Value Proposition etc.

From content to architecture

Astrato handed us finalized copy and references, but no structure. We mapped every block into a mind map and reshaped it into a clear flow.

Locking the narrative early kept every later design decision grounded and saved hours of redrawing visuals around an unsettled story.

From content to architecture

Astrato handed us finalized copy and references, but no structure. We mapped every block into a mind map and reshaped it into a clear flow.

Locking the narrative early kept every later design decision grounded and saved hours of redrawing visuals around an unsettled story.

From content to architecture – Board mapping Astrato's content into a mind map, transformed into a structured homepage sitemap with sections Hero, Value Proposition etc.

From content to architecture

Astrato handed us finalized copy and references, but no structure. We mapped every block into a mind map and reshaped it into a clear flow.

Locking the narrative early kept every later design decision grounded and saved hours of redrawing visuals around an unsettled story.

From content to architecture – Board mapping Astrato's content into a mind map, transformed into a structured homepage sitemap with sections Hero, Value Proposition etc.

From content to architecture

Astrato handed us finalized copy and references, but no structure. We mapped every block into a mind map and reshaped it into a clear flow.

Locking the narrative early kept every later design decision grounded and saved hours of redrawing visuals around an unsettled story.

From content to architecture – Board mapping Astrato's content into a mind map, transformed into a structured homepage sitemap with sections Hero, Value Proposition etc.

Research & Inspiration

We studied Astrato's competitive landscape: BI platforms and modern dark-theme SaaS sites. Collected references for layout, visual storytelling, and the "premium, futuristic, but clean" feel the client wanted.

Research & Inspiration – Collage of dark-theme SaaS and BI platform references, including dashboards, AI features, and testimonial cards, gathered for visual direction
Research & Inspiration – Collage of dark-theme SaaS and BI platform references, including dashboards, AI features, and testimonial cards, gathered for visual direction

Research & Inspiration

We studied Astrato's competitive landscape: BI platforms and modern dark-theme SaaS sites. Collected references for layout, visual storytelling, and the "premium, futuristic, but clean" feel the client wanted.

Research & Inspiration

We studied Astrato's competitive landscape: BI platforms and modern dark-theme SaaS sites. Collected references for layout, visual storytelling, and the "premium, futuristic, but clean" feel the client wanted.

Research & Inspiration – Collage of dark-theme SaaS and BI platform references, including dashboards, AI features, and testimonial cards, gathered for visual direction

Research & Inspiration

We studied Astrato's competitive landscape: BI platforms and modern dark-theme SaaS sites. Collected references for layout, visual storytelling, and the "premium, futuristic, but clean" feel the client wanted.

Research & Inspiration – Collage of dark-theme SaaS and BI platform references, including dashboards, AI features, and testimonial cards, gathered for visual direction

Research & Inspiration

We studied Astrato's competitive landscape: BI platforms and modern dark-theme SaaS sites. Collected references for layout, visual storytelling, and the "premium, futuristic, but clean" feel the client wanted.

Research & Inspiration – Collage of dark-theme SaaS and BI platform references, including dashboards, AI features, and testimonial cards, gathered for visual direction

Foundation

Astrato already had a brand book, so we adapted their palette into a refined dark theme instead of starting over.

We preserved the brand's display typeface for headlines and swapped the body font for stronger readability, then compiled colors, gradients, type, and components into a reusable UI Kit.

 Foundation – Astrato design system showing neutral, primary, and accent color scales, gradient swatches, and a typography hierarchy
 Foundation – Astrato design system showing neutral, primary, and accent color scales, gradient swatches, and a typography hierarchy

Foundation

Astrato already had a brand book, so we adapted their palette into a refined dark theme instead of starting over.

We preserved the brand's display typeface for headlines and swapped the body font for stronger readability, then compiled colors, gradients, type, and components into a reusable UI Kit.

Foundation

Astrato already had a brand book, so we adapted their palette into a refined dark theme instead of starting over.

We preserved the brand's display typeface for headlines and swapped the body font for stronger readability, then compiled colors, gradients, type, and components into a reusable UI Kit.

 Foundation – Astrato design system showing neutral, primary, and accent color scales, gradient swatches, and a typography hierarchy

Foundation

Astrato already had a brand book, so we adapted their palette into a refined dark theme instead of starting over.

We preserved the brand's display typeface for headlines and swapped the body font for stronger readability, then compiled colors, gradients, type, and components into a reusable UI Kit.

 Foundation – Astrato design system showing neutral, primary, and accent color scales, gradient swatches, and a typography hierarchy

Foundation

Astrato already had a brand book, so we adapted their palette into a refined dark theme instead of starting over.

We preserved the brand's display typeface for headlines and swapped the body font for stronger readability, then compiled colors, gradients, type, and components into a reusable UI Kit.

 Foundation – Astrato design system showing neutral, primary, and accent color scales, gradient swatches, and a typography hierarchy

Product graphics & Bento cards

To show the product without overwhelming the visitor, we refreshed and rebuilt the key dashboard graphics and feature illustrations.

Under tight deadlines we redrew the highest-impact visuals from scratch, reusing existing assets where it made sense, and tailoring select library illustrations for the bento cards so every tile stayed on-brand and purposeful.

Product graphics & Bento cards – Comparison of legacy and redesigned finance planning and call centre analytics dashboards with improved UI
Product graphics & Bento cards – Comparison of legacy and redesigned finance planning and call centre analytics dashboards with improved UI

Product graphics & Bento cards

To show the product without overwhelming the visitor, we refreshed and rebuilt the key dashboard graphics and feature illustrations.

Under tight deadlines we redrew the highest-impact visuals from scratch, reusing existing assets where it made sense, and tailoring select library illustrations for the bento cards so every tile stayed on-brand and purposeful.

Product graphics & Bento cards

To show the product without overwhelming the visitor, we refreshed and rebuilt the key dashboard graphics and feature illustrations.

Under tight deadlines we redrew the highest-impact visuals from scratch, reusing existing assets where it made sense, and tailoring select library illustrations for the bento cards so every tile stayed on-brand and purposeful.

Product graphics & Bento cards – Comparison of legacy and redesigned finance planning and call centre analytics dashboards with improved UI
 Product graphics & Bento cards – Grid of feature bento cards including Bookmarks, Executive Reports, Point-and-click Exploration, and AI-Powered Insights

Product graphics & Bento cards

To show the product without overwhelming the visitor, we refreshed and rebuilt the key dashboard graphics and feature illustrations.

Under tight deadlines we redrew the highest-impact visuals from scratch, reusing existing assets where it made sense, and tailoring select library illustrations for the bento cards so every tile stayed on-brand and purposeful.

Product graphics & Bento cards – Comparison of legacy and redesigned finance planning and call centre analytics dashboards with improved UI Product graphics & Bento cards – Grid of feature bento cards including Bookmarks, Executive Reports, Point-and-click Exploration, and AI-Powered Insights

Product graphics & Bento cards

To show the product without overwhelming the visitor, we refreshed and rebuilt the key dashboard graphics and feature illustrations.

Under tight deadlines we redrew the highest-impact visuals from scratch, reusing existing assets where it made sense, and tailoring select library illustrations for the bento cards so every tile stayed on-brand and purposeful.

Product graphics & Bento cards – Comparison of legacy and redesigned finance planning and call centre analytics dashboards with improved UI Product graphics & Bento cards – Grid of feature bento cards including Bookmarks, Executive Reports, Point-and-click Exploration, and AI-Powered Insights

Website design & Build

We designed, aligned, and implemented the pages in Webflow using a component-based approach.

Website Design & Build – Homepage of the Astrato business intelligence platform showcasing embedded analytics, cloud data dashboards, and enterprise BI features.
Website Design & Build – Homepage of the Astrato business intelligence platform showcasing embedded analytics, cloud data dashboards, and enterprise BI features.

Website design & Build

We designed, aligned, and implemented the pages in Webflow using a component-based approach.

Website design & Build

We designed, aligned, and implemented the pages in Webflow using a component-based approach.

Website Design & Build – Homepage of the Astrato business intelligence platform showcasing embedded analytics, cloud data dashboards, and enterprise BI features.

Website design & Build

We designed, aligned, and implemented the pages in Webflow using a component-based approach.

Website Design & Build – Homepage of the Astrato business intelligence platform showcasing embedded analytics, cloud data dashboards, and enterprise BI features.

Website design & Build

We designed, aligned, and implemented the pages in Webflow using a component-based approach.

Website Design & Build – Homepage of the Astrato business intelligence platform showcasing embedded analytics, cloud data dashboards, and enterprise BI features.

Customer stories

We redesigned the Customer stories collection to match the new dark brand. The existing CMS was researched, optimized, and stripped of unused fields, keeping the structure lean and easy for the team to maintain and extend.

Customer stories – Astrato Customer stories overview and case study pages showcasing customer success stories, testimonials, and embedded analytics use cases
Customer stories – Astrato Customer stories overview and case study pages showcasing customer success stories, testimonials, and embedded analytics use cases

Customer stories

We redesigned the Customer stories collection to match the new dark brand. The existing CMS was researched, optimized, and stripped of unused fields, keeping the structure lean and easy for the team to maintain and extend.

Customer stories

We redesigned the Customer stories collection to match the new dark brand. The existing CMS was researched, optimized, and stripped of unused fields, keeping the structure lean and easy for the team to maintain and extend.

Customer stories – Astrato Customer stories overview and case study pages showcasing customer success stories, testimonials, and embedded analytics use cases

Customer stories

We redesigned the Customer stories collection to match the new dark brand. The existing CMS was researched, optimized, and stripped of unused fields, keeping the structure lean and easy for the team to maintain and extend.

Customer stories – Astrato Customer stories overview and case study pages showcasing customer success stories, testimonials, and embedded analytics use cases

Customer stories

We redesigned the Customer stories collection to match the new dark brand. The existing CMS was researched, optimized, and stripped of unused fields, keeping the structure lean and easy for the team to maintain and extend.

Customer stories – Astrato Customer stories overview and case study pages showcasing customer success stories, testimonials, and embedded analytics use cases

Blog & Resources

The Blog collection got the same treatment. A refreshed reading experience aligned to the new visual system, built on a cleaned-up CMS so publishing stays fast and consistent.

Blog & Resources – Astrato About page featuring the founding team's background, paired with a visualization layer feature showcasing customizable chart styling and branding.
Blog & Resources – Astrato About page featuring the founding team's background, paired with a visualization layer feature showcasing customizable chart styling and branding.

Blog & Resources

The Blog collection got the same treatment. A refreshed reading experience aligned to the new visual system, built on a cleaned-up CMS so publishing stays fast and consistent.

Blog & Resources

The Blog collection got the same treatment. A refreshed reading experience aligned to the new visual system, built on a cleaned-up CMS so publishing stays fast and consistent.

Blog & Resources – Astrato About page featuring the founding team's background, paired with a visualization layer feature showcasing customizable chart styling and branding.

Blog & Resources

The Blog collection got the same treatment. A refreshed reading experience aligned to the new visual system, built on a cleaned-up CMS so publishing stays fast and consistent.

Blog & Resources – Astrato About page featuring the founding team's background, paired with a visualization layer feature showcasing customizable chart styling and branding.

Blog & Resources

The Blog collection got the same treatment. A refreshed reading experience aligned to the new visual system, built on a cleaned-up CMS so publishing stays fast and consistent.

Blog & Resources – Astrato About page featuring the founding team's background, paired with a visualization layer feature showcasing customizable chart styling and branding.

Components approach

We built every section as a reusable Webflow component, so Astrato's team can edit content and assemble new pages on their own. No developer needed.

Components approach – Wireframe overlay showing reusable Webflow components for testimonials, reports, and CTA sections mapped onto website mockup
Components approach – Wireframe overlay showing reusable Webflow components for testimonials, reports, and CTA sections mapped onto website mockup

Components approach

We built every section as a reusable Webflow component, so Astrato's team can edit content and assemble new pages on their own. No developer needed.

Components approach

We built every section as a reusable Webflow component, so Astrato's team can edit content and assemble new pages on their own. No developer needed.

Components approach – Wireframe overlay showing reusable Webflow components for testimonials, reports, and CTA sections mapped onto website mockup

Components approach

We built every section as a reusable Webflow component, so Astrato's team can edit content and assemble new pages on their own. No developer needed.

Components approach – Wireframe overlay showing reusable Webflow components for testimonials, reports, and CTA sections mapped onto website mockup

Components approach

We built every section as a reusable Webflow component, so Astrato's team can edit content and assemble new pages on their own. No developer needed.

Components approach – Wireframe overlay showing reusable Webflow components for testimonials, reports, and CTA sections mapped onto website mockup

Astrato website overview

Grounded in a clear structure, a refined dark brand, and custom visuals, the final site turns Astrato's complex product into an experience that's easy to read and a pleasure to scroll.

Astrato website overview – Before-and-after comparison of the Astrato homepage hero, showing the shift from the old purple gradient design to the refined dark BI Layer redesign
Astrato website overview – Before-and-after comparison of the Astrato homepage hero, showing the shift from the old purple gradient design to the refined dark BI Layer redesign

Astrato website overview

Grounded in a clear structure, a refined dark brand, and custom visuals, the final site turns Astrato's complex product into an experience that's easy to read and a pleasure to scroll.

Astrato website overview

Grounded in a clear structure, a refined dark brand, and custom visuals, the final site turns Astrato's complex product into an experience that's easy to read and a pleasure to scroll.

Astrato website overview – Before-and-after comparison of the Astrato homepage hero, showing the shift from the old purple gradient design to the refined dark BI Layer redesign

Astrato website overview

Grounded in a clear structure, a refined dark brand, and custom visuals, the final site turns Astrato's complex product into an experience that's easy to read and a pleasure to scroll.

Astrato website overview – Before-and-after comparison of the Astrato homepage hero, showing the shift from the old purple gradient design to the refined dark BI Layer redesign
Astrato website overview – Astrato homepage displayed across a laptop and demo apps gallery, connected by dotted lines showing the component-based page structure

Astrato website overview

Grounded in a clear structure, a refined dark brand, and custom visuals, the final site turns Astrato's complex product into an experience that's easy to read and a pleasure to scroll.

Astrato website overview – Before-and-after comparison of the Astrato homepage hero, showing the shift from the old purple gradient design to the refined dark BI Layer redesign
Astrato website overview – Astrato homepage displayed across a laptop and demo apps gallery, connected by dotted lines showing the component-based page structure
No items found.

Outcome

  • A premium redesign delivered under tight deadlines
  • Cleaner, optimized CMS collections and resolved technical issues
  • A reusable design system and Webflow components the team can manage independently
  • An expanded engagement, built on the client's trust

More works

Have a project in mind?

Let’s discuss your goals, challenges, and how WebFolks can help you move forward.

200+
Projects shipped
70+
Clients supported
Startups & Enterprises
Trusted by growing teams