> For the complete documentation index, see [llms.txt](https://bhplugin.gitbook.io/tapotik-ai-angular/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://bhplugin.gitbook.io/tapotik-ai-angular/site-preview.md).

# Site Preview

**Tapotik AI** ships with **40+ fully designed pages** across four route groups. Each group has its own layout and chrome. Below is a complete map of what's included.

## Demo

Site: <https://tapotik-ai-angular.vercel.app/>

## 🌐 Marketing (`features/marketing/`)

Public-facing site with the shared navbar + footer.

| Page         | Route            | Description                                             |
| ------------ | ---------------- | ------------------------------------------------------- |
| Home         | `/`              | 15-section landing page with hero, bento, pricing, etc. |
| About        | `/about`         | Company story, team, values.                            |
| Features     | `/features`      | Full feature breakdown.                                 |
| Pricing      | `/pricing`       | Tiered plans with toggle.                               |
| Integrations | `/integrations`  | Connect with popular tools.                             |
| Changelog    | `/changelog`     | Product updates timeline.                               |
| Blog         | `/blog`          | Article index (filterable via `?category=`).            |
| Blog Post    | `/blog/:slug`    | 6 full articles.                                        |
| Careers      | `/careers`       | Open roles.                                             |
| Job Detail   | `/careers/:slug` | Individual role pages.                                  |
| Contact      | `/contact`       | Contact form (simulated submit).                        |
| Docs         | `/docs`          | 10 in-app documentation pages.                          |
| Privacy      | `/privacy`       | Legal policy.                                           |
| Terms        | `/terms`         | Legal terms.                                            |
| 404          | `**`             | Custom not-found page.                                  |

## 🤖 AI Products (`features/marketing/products/`)

Each product page has unique, interactive demo visuals.

| Page      | Route        | Description                                        |
| --------- | ------------ | -------------------------------------------------- |
| AI Chat   | `/ai-chat`   | Conversational assistant with multi-model support. |
| AI Image  | `/ai-image`  | Text-to-image generation.                          |
| AI Video  | `/ai-video`  | Cinematic text-to-video.                           |
| AI Voice  | `/ai-voice`  | Lifelike speech synthesis in 40+ languages.        |
| AI Agents | `/ai-agents` | Autonomous agents for complex workflows.           |

## 🔐 Auth (`features/auth/`)

Split-screen authentication layout.

| Page            | Route              |
| --------------- | ------------------ |
| Login           | `/login`           |
| Sign Up         | `/signup`          |
| Forgot Password | `/forgot-password` |

## 📊 Admin Dashboard (`features/dashboard/`)

A complete admin dashboard with its own app shell — collapsible sidebar navigation + topbar (`AppShell`). Includes overview analytics, per-product studios, agent management, multi-tab settings, and billing.

| Page         | Route                 | Description                                     |
| ------------ | --------------------- | ----------------------------------------------- |
| Overview     | `/dashboard`          | KPIs, charts, activity.                         |
| Chat Studio  | `/dashboard/chat`     | Chat workspace.                                 |
| Image Studio | `/dashboard/image`    | Image generation workspace.                     |
| Voice Studio | `/dashboard/voice`    | Voice generation workspace.                     |
| Agents       | `/dashboard/agents`   | Agent management.                               |
| Settings     | `/dashboard/settings` | Profile / workspace / API keys / notifications. |
| Billing      | `/dashboard/billing`  | Plan & invoices.                                |

## 🎬 Explore the Template

Run the project locally (see [**Installation**](/tapotik-ai-angular/installation.md)) and open [http://localhost:4000](http://localhost:4000/) to explore every page interactively.