gpt-taste

Generate GSAP-based UI layouts with Python-driven randomization and AIDA structure.

7|Updated Apr 9, 2026
One-click install
npx skills add https://github.com/fatihkan/badi --skill gpt-taste-fatihkan
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: gpt-taste
Source: https://github.com/fatihkan/badi/tree/main/.claude/skills/frontend-taste/gpt-taste
Command: npx skills add https://github.com/fatihkan/badi --skill gpt-taste-fatihkan

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Elite UX/UI & Advanced GSAP Motion Engineer. Enforces Python-driven true randomization for layout variance, strict AIDA page structure, wide editorial typography (bans 6-line wraps), gapless bento grids, strict GSAP ScrollTriggers (pinning, stacking, scrubbing), inline micro-images, and massive section spacing.

Core Features & Use Cases

  • Python-driven true randomization to select hero layout, typography, and component assemblies, ensuring varied, premium outputs.
  • AIDA structure & spacing enforces cinematic Attention, Interest, Desire, and Action sections with clear hierarchy and generous vertical rhythm.
  • GSAP motion stack delivers scroll-driven reveals, pinned sections, and interactive micro-animations across breakpoints.

Quick Start

Provide a seed prompt and asset pack to generate a hero-driven page following the AIDA layout.

Frequently Asked Questions about gpt-taste

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I generate premium frontend layouts with GSAP scroll animations?

Generate premium frontend layouts with GSAP scroll animations by enforcing strict ScrollTriggers, pinned sections, and cinematic reveals. This approach orchestrates component assemblies and motion stacks to produce production-ready, scroll-driven UI artifacts.

What is the best way to structure a marketing landing page using the AIDA model?

The best way to structure a marketing landing page using the AIDA model is to enforce clear hierarchy across Attention, Interest, Desire, and Action sections. This layout provides generous vertical rhythm and massive section spacing for cinematic user flow.

Can I use GSAP ScrollTriggers for pinned sections and scrubbing in complex UIs?

Yes, you can use GSAP ScrollTriggers for pinned sections and scrubbing in complex UIs. The motion stack delivers scroll-driven reveals, pinned sections, and interactive micro-animations that function consistently across responsive breakpoints.

How do I create gapless bento grids and wide editorial typography for web design?

Create gapless bento grids and wide editorial typography by resetting default design biases and enforcing strict layout constraints. This method bans six-line text wraps, ensuring dense grid arrangements and varied, premium visual outputs.

Does Python-driven randomization help vary frontend component assemblies and hero sections?

Python-driven randomization helps vary frontend component assemblies and hero sections by selecting layout patterns and typography dynamically. This true randomization ensures varied, premium outputs and eliminates repetitive design generation biases.