# Build Polished Frontend Experiences

Frontend projects often need coordinated design, motion, media, and copy. This skill provides one workflow for building and refining complete experiences.

## Install

```bash
npx skillstore add minimax-ai/frontend-dev
```

## Metadata

- Status: approved
- Slug: minimax-ai-frontend-dev
- Version: 1.0.0
- Author version: 1.0.0
- Skillstore revision: r2
- Version status: not\_bumped
- Tree hash: 85d5be46a60668143a833a5d98779c563cddddee81a16a17eb65fcbeef675765
- Author: MiniMax-AI
- GitHub username: MiniMax-AI
- License: MIT
- Repository: https://github.com/MiniMax-AI/skills/tree/main/skills/frontend-dev
- Ref: 02be9409c79ca1183f7844009c14d9df684d0cf9
- Supported tools: Claude, Codex, Claude Code
- Audit status: complete
- Agent install advisory: confirmation\_required
- Manual install advisory: allowed
- Artifact signature: available
- Audit attestation: unavailable
- Human verification: not\_verified
- Risk factors: external\_commands, env\_access, filesystem, network, scripts
- Quality score: 38
- Quality tier: warning
- Public page: https://skillstore.pages.dev/skills/minimax-ai-frontend-dev
- Manifest: https://skillstore.pages.dev/api/skills/minimax-ai-frontend-dev/manifest

## Capabilities

- Plans responsive page structure for HTML and major component frameworks.
- Provides Framer Motion, GSAP, CSS, and Three.js animation guidance.
- Generates images, video, speech, and music through included MiniMax scripts.
- Drafts landing-page copy with AIDA, PAS, and FAB frameworks.
- Creates static or interactive generative art using bundled fonts and p5.js templates.

## Use Cases

- Launch a Product Page: Create responsive sections, focused copy, local media, and restrained motion for a new offer.
- Upgrade an Interface: Refine component structure, interaction states, performance, and accessibility in an existing frontend.
- Produce Campaign Media: Coordinate page visuals, short video, narration, music, and conversion copy for a campaign.

## Prompt Templates

### Build a Simple Landing Page

```
Build a responsive landing page for [product]. Include a hero, benefits, proof, pricing, FAQ, and clear calls to action.
```

### Refresh an Existing Frontend

```
Review this [framework] project. Improve layout, typography, states, mobile behavior, and accessibility while preserving current features and brand constraints.
```

### Add a Motion System

```
Design motion for [page]. Choose suitable tools, define reduced-motion behavior, isolate expensive effects, and verify cleanup and mobile performance.
```

### Create a Multimedia Experience

```
Build an immersive [campaign or product] experience using local generated media, conversion copy, responsive components, cinematic motion, and documented quality checks.
```

## Limitations

- MiniMax media generation requires a valid API key, configured endpoint, network access, and available account balance.
- Generated media may require review for quality, rights, safety, and brand compliance.
- Framework dependencies are not bundled and may require separate installation.
- The skill does not replace browser testing, accessibility audits, or production security review.

## Best Practices

- Confirm media prompts, destination paths, provider endpoints, and expected costs before generation.
- Verify installed dependencies and existing framework conventions before changing project structure.
- Test responsive states, keyboard access, reduced motion, loading behavior, and asset availability before delivery.

## Anti Patterns

- Do not expose API keys in commands, logs, screenshots, generated files, or troubleshooting output.
- Do not upload local file contents without checking scope and obtaining explicit user approval.
- Do not combine heavy animation libraries in one component or ignore reduced-motion preferences.

## Security Audit

- Audited at: 2026-08-09T08:37:04.656\+00:00
- Summary: Most static alerts are false positives from Markdown, license text, normal media writes, and documented MiniMax API access. Confirmed risks include terminal key disclosure, unrestricted lyrics-file upload, and bearer credentials sent to an unvalidated API base.

## Stats

- Views: 313
- Downloads: 7
- Favorites: 0
- Popularity score: 0