> ## Documentation Index
> Fetch the complete documentation index at: https://moonshot.app/llms.txt
> Use this file to discover all available pages before exploring further.

# Introduction

> Design AI experiences in Figma by integrating real AI responses

<Frame caption="See your design respond to AI">
  <iframe width="100%" height="440px" src="https://www.loom.com/embed/54fab2dff1f8441bad815ff2c9d136bf?sid=8829debc-ca07-4067-a592-1d3b59d63b4d" />
</Frame>

## Requirements

To use the [Moonshot AI Designer plugin](https://www.figma.com/community) you will need a Figma account and OpenAI API key.

<CardGroup cols={2}>
  <Card title="Figma" icon="figma" href="https://www.figma.com/">
    Log in or create an account. Both browser and desktop versions are supported.
  </Card>

  <Card title="OpenAI API key" icon="key" href="https://platform.openai.com/api-keys">
    Log in or create an OpenAI account, then create an API key.
  </Card>
</CardGroup>

## Designing AI products

The following resources will help you learn how to design AI products by integrating AI responses with your designs.

<CardGroup cols={1}>
  <Card title="Learn the basics" icon="book" href="basics" horizontal>
    Understand the core concepts that bring AI into your design.
  </Card>

  <Card title="View guided examples" icon="arrow-progress" href="tutorials" horizontal>
    See how to build different AI products step-by-step.
  </Card>
</CardGroup>