Customizing Branding

Every interview landing page can be tailored to match your brand and communicate the right message to participants. From the headline and description to trust badges, orb colors, and Open Graph images, the customize page gives you full control over first impressions.

Accessing the Customize Page

From your project dashboard, click on the Customize tab (or navigate to your project's customize page). This opens the editor where you can configure all the branding elements that participants see on your interview landing page.

The editor shows a live preview alongside the controls, so you can see exactly how your changes will look before saving.

What You Can Customize

Headline

The headline is the large text displayed prominently on the landing page. It is the first thing participants read, so make it count.

Default: Your project name.

Tips for good headlines:

• Focus on what the participant will be doing: "Share Your Onboarding Experience" is better than "Onboarding Research Study"
• Keep it under 60 characters for clean display on all screen sizes
• Use action-oriented language that invites participation

Examples:

• "Help Us Improve Your Checkout Experience"
• "Share Your Thoughts on [Product Name]"
• "Tell Us About Your Workflow"

Subheadline

The subheadline appears directly below the headline and provides a secondary line of context. Use it to add a brief supporting statement that complements your headline.

Tips:

• Keep it shorter than the headline
• Use it to answer "Why should I participate?" or to set expectations
• Leave it empty if your headline and description are sufficient on their own

Example:

• Headline: "Share Your Onboarding Experience"
• Subheadline: "A quick conversation to help us build a better product"

Description

The description appears below the headline and subheadline. This is where you explain the purpose of the interview and why the participant's input matters.

Tips:

• Keep it to two or three sentences
• Answer the question "Why should I participate?"
• Mention how the feedback will be used if possible

Example:

We are building the next version of our product and want to hear directly from people who use it daily. This short conversation helps us understand what is working well and where we can improve. Your feedback shapes what we build next.

CTA Button Text

You can customize the call-to-action button text that appears in the editor preview. This field is available for setting up your branding identity, though the actual landing page buttons display as "Start Voice Chat" and "Start Text Chat" with their respective icons.

Accent Color

Choose an accent color using the color picker to match your brand. The accent color is applied to interactive elements like buttons and highlights throughout the interview experience.

Orb Color Variant

The animated orb on the landing page comes in six color variants:

Choose the variant that best complements your brand colors and the tone of your research.

Trust Badges

Trust badges are small visual indicators that reassure participants. Each badge has an icon and a label.

You can enable or disable the built-in badges and add custom ones. Available badge icons include:

Built-in badges:

• Duration badge — shows an estimated time (e.g., "5-10 minutes")
• Anonymity badge — reassures participants about privacy (e.g., "Anonymous")

Custom badges: You can add up to four additional badges with your choice of icon and label text.

Example badge sets:

• "Confidential" (Shield) + "5-10 minutes" (Clock) + "Anonymous" (Lock)
• "Quick & Easy" (Star) + "Takes 5 min" (Clock) + "Your voice matters" (Heart)

Badges appear in a horizontal row below the description on the landing page.

Interaction Mode Settings

Control which interview modes are available to participants:

• Both voice and text — participants see two separate start buttons and choose their preferred mode (default)
• Voice only — only the voice start button appears
• Text only — only the text start button appears
• Default mode — if both are enabled, which mode is presented first

Voice mode requires that your project has a voice agent configured. If it does not, only text mode is available regardless of this setting.

Language Settings

Configure the default language for your interviews. When set, a language picker appears on the landing page so participants can select their preferred language. The AI interviewer will conduct the conversation in the chosen language.

Footer and Consent Text

Optional text fields that appear at the bottom of the landing page:

• Footer text — for privacy notices, contact information, or disclaimers
• Consent text — for research consent language
• Show Powered by — toggle visibility of the "Powered by Koji" badge

Open Graph Settings

Open Graph (OG) metadata controls the preview that appears when your interview link is shared on social media, Slack, email, or messaging apps.

Why OG Images Matter

A link shared on LinkedIn or Slack with a custom preview image gets significantly more clicks than one with a generic or missing preview. If you are distributing your interview through social channels, configuring OG metadata is one of the highest-leverage things you can do.

Configurable Fields

• OG Title — the title shown in link previews (falls back to your project headline)
• OG Description — the description shown in link previews (falls back to your project description)
• OG Image URL — a custom image for the preview

Image Specifications

• Dimensions: 1200 x 630 pixels (standard OG image size)
• Format: PNG or JPEG
• File size: Under 2 MB for fast loading
• Content: Include your brand logo, study title, or a visual that represents the research topic

If you do not set a custom OG image, a default preview is generated using your project name and Koji branding.

Testing Your OG Preview

After uploading your image, you can test how it looks on different platforms:

• Share the link in a private Slack channel to see the preview
• Use a tool like the LinkedIn Post Inspector or Twitter Card Validator to preview the card

OG images are cached by platforms, so changes may take some time to propagate.

Saving Your Changes

The customize editor tracks unsaved changes and shows a save button when modifications are detected. Click Save to apply your changes. They take effect immediately — the next participant who visits your landing page will see the updated branding.

The live preview in the editor reflects your changes in real time, so you can iterate quickly before saving.

Branding and the Embed Widget

When your interview is loaded through the embed widget, the same branding settings apply. The headline, description, and badges render inside the iframe using the theme specified in the embed code (dark or light).

OG images are not relevant for embeds since the landing page is rendered inside the iframe rather than shared as a link.

Best Practices

1. Write for your audience. If you are interviewing enterprise buyers, use professional language. If you are talking to Gen Z consumers, keep it casual and approachable.
2. Use the subheadline. A strong subheadline paired with a clear headline can communicate your message without participants needing to read the full description.
3. Show estimated time. A trust badge showing "5-10 minutes" or "Takes ~10 min" dramatically reduces drop-off.
4. Choose an orb color that fits your brand. The orb is a prominent visual element — pick a variant that complements your accent color.
5. Be honest about purpose. Participants appreciate knowing why they are being interviewed. Vague descriptions lead to lower completion rates.
6. Invest in the OG image. If social sharing is a key distribution channel, a branded preview image is worth the effort.
7. Test on mobile. Open your interview link on your phone to see how the landing page looks on a smaller screen.

Next Steps

• Interview Landing Page — see how all these elements come together
• Intake Forms and Consent — add data collection before the interview starts
• Publishing Your Study — make your customized interview live