elite-frontend-ux-above-the-fold-essentials

Sub-skill of elite-frontend-ux: Above-the-Fold Essentials (+4).

5 stars

Best use case

elite-frontend-ux-above-the-fold-essentials is best used when you need a repeatable AI agent workflow instead of a one-off prompt.

Sub-skill of elite-frontend-ux: Above-the-Fold Essentials (+4).

Teams using elite-frontend-ux-above-the-fold-essentials should expect a more consistent output, faster repeated execution, less prompt rewriting.

When to use this skill

  • You want a reusable workflow that can be run more than once with consistent structure.

When not to use this skill

  • You only need a quick one-off answer and do not need a reusable workflow.
  • You cannot install or maintain the underlying files, dependencies, or repository context.

Installation

Claude Code / Cursor / Codex

$curl -o ~/.claude/skills/above-the-fold-essentials/SKILL.md --create-dirs "https://raw.githubusercontent.com/vamseeachanta/workspace-hub/main/.agents/skills/_archive/development/elite-frontend-ux/above-the-fold-essentials/SKILL.md"

Manual Installation

  1. Download SKILL.md from GitHub
  2. Place it in .claude/skills/above-the-fold-essentials/SKILL.md inside your project
  3. Restart your AI agent — it will auto-discover the skill

How elite-frontend-ux-above-the-fold-essentials Compares

Feature / Agentelite-frontend-ux-above-the-fold-essentialsStandard Approach
Platform SupportNot specifiedLimited / Varies
Context Awareness High Baseline
Installation ComplexityUnknownN/A

Frequently Asked Questions

What does this skill do?

Sub-skill of elite-frontend-ux: Above-the-Fold Essentials (+4).

Where can I find the source code?

You can find the source code on GitHub using the link provided at the top of the page.

SKILL.md Source

# Above-the-Fold Essentials (+4)

## Above-the-Fold Essentials

Must fit within one viewport:
1. Headline (5–10 words)
2. Supporting subheadline (value proposition)
3. Single primary CTA
4. Hero visual


## Section Flow

```
1. Hero (headline + CTA + visual)
2. Social proof (logos, snippet)
3. Problem / Solution
4. Features / Benefits (3–4 max)
5. Testimonials
6. Pricing (if applicable)
7. FAQ
8. Final CTA
9. Footer
```


## CTA Design

- Height: min 44px; padding: 2× font size
- Copy: action verbs, first-person ("Get my free trial" > "Sign up")
- Length: 2–5 words max
- One primary CTA per viewport


## Pricing Tables

- 3–4 tiers max (more causes paralysis)
- Highlight recommended tier
- Annual/monthly toggle showing savings
- CTA button on every tier


## Form Optimization

- Single column (120% fewer errors vs multi-column)
- Minimize fields (4 vs 11 fields = 120% more conversions)
- Never ask for phone unless essential (58% abandon)
- Labels above inputs; validate on blur, not while typing

---

Related Skills

gitignore-scaffold

5
from vamseeachanta/workspace-hub

Gitignore pattern setup and directory scaffolding — covers negation patterns, .gitkeep tracking, and git check-ignore verification workflows

frontend-design

5
from vamseeachanta/workspace-hub

Create distinctive, production-grade web interfaces with high design quality. Use for components, pages, dashboards, and full applications that need to stand out from generic AI aesthetics.

repo-cleanup-folders-to-delete-confirmed-safe

5
from vamseeachanta/workspace-hub

Sub-skill of repo-cleanup: Folders to DELETE (Confirmed Safe) (+3).

repo-cleanup-common-hidden-folders

5
from vamseeachanta/workspace-hub

Sub-skill of repo-cleanup: Common Hidden Folders (+2).

hidden-folder-audit-verify-hidden-folder-state

5
from vamseeachanta/workspace-hub

Sub-skill of hidden-folder-audit: Verify Hidden Folder State (+3).

hidden-folder-audit-step-1-inventory-all-hidden-folders

5
from vamseeachanta/workspace-hub

Sub-skill of hidden-folder-audit: Step 1: Inventory All Hidden Folders (+4).

hidden-folder-audit-specsarchive

5
from vamseeachanta/workspace-hub

Sub-skill of hidden-folder-audit: specs/archive/ (+1).

hidden-folder-audit-pre-audit

5
from vamseeachanta/workspace-hub

Sub-skill of hidden-folder-audit: Pre-Audit (+6).

hidden-folder-audit-migrate-agent-os-to-Codex

5
from vamseeachanta/workspace-hub

Sub-skill of hidden-folder-audit: Migrate .agent-os to .Codex (+4).

hidden-folder-audit-common-hidden-folders-reference

5
from vamseeachanta/workspace-hub

Sub-skill of hidden-folder-audit: Common Hidden Folders Reference.

hidden-folder-audit

5
from vamseeachanta/workspace-hub

Audit and consolidate hidden folders in a repository. Identifies duplicates, dead directories, and consolidation opportunities for .agent-os/, .ai/, .Codex/, and other hidden folders.

discipline-refactor-standard-folders-module-structure

5
from vamseeachanta/workspace-hub

Sub-skill of discipline-refactor: Standard Folders → Module Structure (+1).