New

Now in Claude, ChatGPT, Cursor & more with our MCP server

Back to docs
Interview Experience

Interview Landing Page

The first thing participants see when they click your interview link — branded page with study details and mode selection.

The landing page is your interview's front door. It is the first thing participants see when they click your link, and it plays a major role in whether they decide to continue. A well-configured landing page builds trust, sets expectations, and makes it easy to get started.

What Participants See

When someone clicks your interview link, they arrive at a branded page that includes:

The Animated Orb

At the top of the page, participants see an animated orb that gently pulses and responds to interaction. The orb comes in six color variants — aurora, sunset, ocean, lavender, mint, and peach — which you can configure in your branding settings. This creates a modern, inviting first impression that signals the interview is powered by conversational AI rather than a traditional form or survey.

Project Headline

Below the orb, your project's headline is displayed prominently. This is the main text participants read first, so it should clearly convey what the interview is about.

Default: Your project name.

You can customize it to something more descriptive, like "Share Your Thoughts on Our New Onboarding Experience" or "Help Us Build a Better Product." See Customizing Branding for how to edit this.

Subheadline

An optional subheadline appears directly below the headline, providing a secondary line of context. Use it to add a brief supporting statement that complements your headline without repeating it.

Description

Below the headline and subheadline, a short description provides additional context. This is your chance to explain:

  • What the interview covers
  • Why the participant's input matters
  • How the feedback will be used

Keep it to two or three sentences. Participants are deciding whether to commit their time, so be clear and concise.

Trust Badges

The landing page can display trust badges — small indicators with icons and labels that reassure participants. Examples include:

  • Confidential — responses are kept private
  • 5-10 minutes — sets time expectations
  • Anonymous — no personal information required

These badges are configurable and can use different icons (shield, clock, star, check, lock, heart). You can add up to four custom badges alongside the built-in duration and anonymity badges. They appear in a subtle row below the description.

Language Picker

If your study supports multiple languages or you have configured a default language other than English, a language picker appears on the landing page. Participants can select their preferred language before starting the interview, and the AI interviewer will conduct the conversation in that language.

Starting the Interview

If both voice and text modes are enabled, participants see two separate call-to-action buttons:

  • Start Voice Chat (with a phone icon)
  • Start Text Chat (with a keyboard icon)

The two buttons are separated by the word "or," making it clear that participants can choose either mode. Neither option is labeled as recommended — the choice is left entirely to the participant.

If your project is configured for a single mode (voice-only or text-only), only the corresponding button appears and participants proceed directly.

Note: The CTA button text you configure in branding settings applies to the customize preview but does not change the text of these landing page buttons, which remain "Start Voice Chat" and "Start Text Chat."

The Intake Form (Optional)

If you have configured an intake form, it appears after the participant clicks one of the start buttons. The form collects information like name, email, or custom fields before the interview begins.

If no intake form is configured, clicking the start button launches the interview immediately.

How the Landing Page Adapts

Imported Participants

When a participant arrives via a unique tracking link (from a CSV import), their pre-filled data is loaded automatically. If the intake form is enabled, their fields appear already populated.

Embedded Interviews

When the interview is loaded through the embed widget, the landing page renders inside the iframe. It adapts to the available space and respects the theme setting (dark or light) configured in the embed code.

Mobile Devices

The landing page is fully responsive. On mobile, the layout adjusts to fit smaller screens, and the start buttons stack vertically for easier tapping.

Study Closed or Capacity Reached

If your study has been closed or has reached its response limit, participants see a friendly overlay letting them know the study is no longer accepting responses. This prevents over-collection and helps you manage your study lifecycle.

Open Graph Preview

When your interview link is shared on social media, email previews, or messaging apps, the Open Graph metadata controls what people see. This includes:

  • Title — your OG title (or project headline as fallback)
  • Description — your OG description (or project description as fallback)
  • Image — a custom OG image if you have uploaded one, rendered at 1200 x 630 pixels

A polished OG preview significantly increases click-through rates, especially on LinkedIn and Slack. Configure yours in the Customizing Branding settings.

Custom URL Slugs

Your interview link uses a URL slug that you can customize for a cleaner, more branded URL. Instead of a random identifier, you can set a slug like "user-research-2024" so your link becomes something like koji.so/i/user-research-2024. See Customizing Interview Slugs for details.

Design and Theming

The landing page follows Koji's design system with a clean, modern aesthetic. It supports both dark and light themes and centers the content for a focused, distraction-free experience.

The background features a subtle gradient, and the overall layout is intentionally minimal. There are no sidebars, navigation menus, or competing elements — just your headline, description, and the path to getting started.

What Makes a Good Landing Page

Here are a few tips for maximizing conversion from landing page visitor to interview participant:

  1. Write a compelling headline. Focus on the value to the participant. Instead of "Product Research Study," try "Help Shape the Future of [Product Name]."
  2. Use the subheadline for context. Add a brief supporting line that sets expectations or builds curiosity.
  3. Keep the description short. Two to three sentences that answer "What is this?" and "Why should I participate?"
  4. Set time expectations. Use trust badges to show estimated duration. Participants are more likely to start when they know it will only take a few minutes.
  5. Configure OG images. If you are sharing on social media, an eye-catching preview image makes a big difference in click-through rates.
  6. Choose a memorable slug. A clean, descriptive URL is easier to share and looks more professional.

Next Steps

Further reading on the blog

<!-- further-reading:blog -->