> For the complete documentation index, see [llms.txt](https://docs.hypertune.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.hypertune.com/landing-page-optimization/guide.md).
# Guide
This guide builds on the SDK quickstart and analytics guide and shows you how to:
* Create custom object types to model your landing page configuration
* Create flags that use those custom object types
* Access those flags in your code
* Set up a multivariate AI loop to optimize your landing page
## Prerequisites
* [Set up Hypertune](/getting-started/set-up-hypertune.md)
* [Analytics guide](/analytics/guide.md)
## Create custom object types to model your landing page configuration
Go to the **Schema** view in the dashboard. Click the **+** button in the top-right of the sidebar. Select **Object**, enter a name, and click **Create**.
By default, the new object type has no fields.
Click **+ Add** to add a new field. Enter a name, and select **New object type** from the dropdown.
Enter a name for the new type and click **Create**.
Click **+ Add** to add a new field to it. Enter a name, set its type, and click **Create**.
Repeat for each field you want to add. You can switch to the code view to make this easier. Then, click **Save**.
```graphql
type LandingPage {
layout: LandingPageLayout!
hero: Hero!
ctaButton: CTAButton!
benefits: [Benefit!]!
}
type Hero {
headline: String!
subheadline: String!
imageSrc: String!
}
type CTAButton {
buttonSize: ButtonSize!
text: String!
color: String!
}
enum ButtonSize {
small,
medium,
large
}
type Benefit {
icon: String!
title: String!
description: String!
}
enum LandingPageLayout {
default,
split,
grid
}
```
## Create flags for your landing page configuration
Go to the **Flags** view in the dashboard. Click the **+** button in the top-right of the sidebar and select **Flag**.
Enter a name, set its type to the one you created earlier, and click **Create**.
Enter the initial configuration, then click **Save**.
## Access flags to retrieve landing page configuration
Regenerate the client:
{% tabs %}
{% tab title="npm" %}
```bash
npx hypertune
```
{% endtab %}
{% tab title="yarn" %}
```bash
yarn hypertune
```
{% endtab %}
{% tab title="pnpm" %}
```bash
pnpm hypertune
```
{% endtab %}
{% endtabs %}
Then use the generated methods for your flags to get the landing page configuration and log your conversion events:
{% code title="app/components/LandingPage.tsx" %}
```typescript
'use client'
import Benefits from './Benefits'
import CTAButton from './CTAButton'
import Hero from './Hero'
import LandingPageContainer from './LandingPageContainer'
import { useHypertune } from '@/generated/hypertune.react'
export default function LandingPage() {
const hypertune = useHypertune()
const landingPage = hypertune.landingPage()
return (
{
hypertune.signUp({ args: { properties: { method } } })
}}
/>
)
}
```
{% endcode %}
## Update your landing page configuration
Go to the **Flags** view in the dashboard, expand the top-level flag with your landing page configuration in the left sidebar, and select the nested flag that you want to configure.
Make your changes, then open the **Diff** view to review them. Click **Save**.
## Set up a multivariate AI loop to optimize your landing page
Go to the **Flags** view in the dashboard and select the first flag that you want to optimize.
Click **+ Experiment**, and select **New experiment** from the dropdown.
Select **AI loop** as the experiment type, enter a name, set the goal event type that you want to optimize for, and click **Create**.
An experiment dimension is automatically created and named after the selected flag. Click **Insert**.
By default, the dimension has two arms called Variant 1 and Variant 2. Click **+ Add variant** to add another. Set the variants to the values you want to test.
To delete an arm and its variant, select **Delete variant** from the options (**⋯**) button.
Select the next flag that you want to optimize.
Click **+ Experiment**, select the AI loop you created earlier from the Experiment dropdown. Then select **New dimension** from the Dimension dropdown.
Enter a name for the dimension and set its number of arms. By default, it's named after the selected flag. Click **Create**, then click **Insert**.
Set the variants to the values you want to test.
Repeat these steps for each flag you want to optimize, using the same AI loop in each one.
If you go to the **Experiments** view and select the AI loop, you can see all the dimensions you created.
Click **View changes** to see the changes you made, then click **Save**.
Now Hypertune will automatically learn the best combination of variants for each visitor segment to maximize your goal.
## Next steps
* Build an [impact analysis](/concepts/impact-analyses.md) or [funnel](/concepts/funnels.md) to view the performance of each variant or combination of variants.
* Add new dimensions to the AI loop.
* Add new variants to each dimension and remove poorly performing variants.