Radius: A Landing Page for an AI Product Storytelling Tool

Overview Radius is an AI tool that helps teams turn their product into interactive demos and videos in minutes. I designed the full landing page in Figma, from layout and structure to the final UI. My goal was to explain a technical product in a simple, friendly way and get visitors to sign up.

The Problem AI and SaaS products are often hard to explain. Visitors land on the page, don’t understand the value quickly, and leave. The page had to say what Radius does in seconds, show it in action, and prove it works for people like them.

My Approach I treated the page as a guided story. It starts with the promise, shows how the tool works, speaks to different team needs, backs everything with proof, and ends with a clear next step. Every section answers one question a visitor is likely to ask.

Key Design Decisions

1. A hero that explains and lets you try. The headline “Your product story, beautifully crafted by AI in minutes" states the benefit right away. A soft pink and purple gradient gives it a modern AI feel without making it cold. An input box (“Try with your website!”) lets visitors start immediately, and two buttons serve two types of visitors: “Sign up for free” for those ready to act and “Talk to a GTM Expert” for those who want guidance.

2. Social proof in the first scroll. A line about companies using Radius, followed by a clean row of logos, builds trust before visitors need to read more.

3. A simple four-step feature slider. “Capture from anywhere,” “Generate videos & visuals,” “Share & Embed,” and “Analyze instantly” each get a small visual and a short line. Visitors understand the whole workflow without reading a long explanation.

4. A dark, immersive section for use cases. The switch to a deep navy gradient breaks up the page and gives "storytelling that moves customers forward” a focused feel. Each use case (marketing, enablement and training, and customer success) has a clear label, a short description, a feature checklist, and a photo. The layout alternates left and right, so the section stays interesting while scrolling.

5. Proof with real numbers. The “Customer stories” section uses a card grid to highlight results like faster content creation and higher conversions, each paired with a company logo. Big numbers are easy to scan and make the benefits feel concrete.

6. Integrations made visual. The “Connected Workflows” section shows integrations in an orbit-style graphic around the Radius logo, with simple categories listed beside it. It shows that the tool fits into what teams already use.

7. A strong ending. The page closes with a bright “Create AI-powered content that converts"—a call to action, then an email signup and an organized footer—so visitors who scroll all the way down still have a clear next step.

8. A consistent visual style. A glowing blue primary button stands out on every section, with a softer secondary button next to it. Soft shadows, rounded cards, and generous white space keep the page clean and easy to read. The palette of deep navy, electric blue, and soft pink-purple feels modern, trustworthy, and a little playful.

The Result A clean, modern landing page that explains an AI product in plain language, shows the workflow step by step, builds trust with proof, and keeps the sign-up action visible throughout the page.

Tools Used Figma

Let’s Work Together Have a product that’s hard to explain? Message me and let’s turn it into a clear, engaging website.