CilaHQ - Webflow Website Design

Dennis Afariyu

CilaHQ Website Design Visit Site →

Client: Cila Project: HQ Website Design Platform: Webflow (custom front-end), integrated with internal app
Cila is an AI-powered hiring assistant built to streamline how companies attract, assess, and select candidates. The website needed to reflect both the intelligence and automation behind the product and the human-centered outcomes it enables — fairer assessments, better conversations, and stronger teams. The design also had to support rapid experimentation across positioning, messaging, and feature rollout, without losing the warmth and clarity that make hiring feel personal.

Goals

Communicate Cila’s core capabilities clearly to first-time visitors
Build trust through clean, professional, and minimal design
Integrate product demos and walkthroughs without slowing performance
Allow flexibility for fast A/B testing of headlines and layouts
Optimize loading speed and SEO for buyer-oriented keywords

Process

We approached the project with a conversion-first mindset, prioritizing clarity and action. The layout was built around a narrative structure:
Problem → Messy, manual hiring
Insight → AI can structure and automate early stages
Solution → Cila as a hiring co-pilot
Proof → Demos, UI previews, social proof (later to be added)
Action → CTA to start hiring with Cila
We paired this with lightweight n product and decor animations illustrations using the almightty Rive

Creative Direction: Calm, Not Cold

We set a tone of stillness and balance across the site. We didn’t want the usual hyper-speed, overstimulated SaaS homepage. Instead, the brand would breathe — calm illustrations, subtle wind-driven motion, and a centered product demo wrapped in softness.

Key Visual Motif

A treehouse, a modern home, and a young tree: metaphors for stages of a growing team
Watercolor-style illustrations that animate gently in the wind, creating a feeling of serenity
These visuals frame the actual UI to remind visitors: behind every job post, there's a human story

Interactive Animations

To bring cila to life without overwhelming the visitor, we built in a series of subtle interactions:
Hover effects on some cards
Timed entrance transitions on headings and key sections, designed to flow in softly — not snap into view
Ambient movement around the illustrations (light shifts, shadow adjustments, wind particles) that suggest a living environment
These animations were intentionally understated. Their purpose wasn’t to impress but to create atmosphere

Technical Execution

RIVE used to animate trees swaying softly with page scroll and product demos
Component-based structure using a custom in-house CMS
Responsive optimization across devices, maintaining illustration alignment across breakpoints

Outcome

The result is a website that feels intelligent, precise, and calm mirroring the product itself.
Like this project

Posted Jun 20, 2025

A calm, human-centered site blending watercolor illustrations with subtle animations to showcase Cila’s AI hiring tool in a clear, warm, and modern way.

AdBoost Site Design
AdBoost Site Design
BLA Design Group
BLA Design Group
Endue Software (Webflow Design & Dev)
Endue Software (Webflow Design & Dev)
Linero AI (3D Webflow Website)
Linero AI (3D Webflow Website)

Join 50k+ companies and 1M+ independents

Contra Logo

© 2025 Contra.Work Inc