← スキル一覧に戻る
astro-ux
by Soborbo
⭐ 1🍴 0📅 2026年1月19日
Manusで実行SKILL.md
name: astro-ux description: UX patterns and section templates for Astro lead generation sites. Hero, features, testimonials, CTAs, FAQ sections. Use for page section design.
Astro UX Skill
Purpose
Provides UX patterns and section templates for lead generation pages.
Core Rules
- Mobile-first design — 375px base, scale up
- Clear visual hierarchy — One primary CTA per viewport
- Trust before ask — Social proof before form
- Minimal friction — Short forms, clear labels
- Accessible — Keyboard nav, focus states, contrast
Section Types
Conversion Sections
| Section | Purpose | Key Elements |
|---|---|---|
| Hero | First impression + CTA | Headline, subhead, CTA, trust badge |
| CTA Banner | Mid-page conversion | Headline, button, urgency |
| Form Section | Lead capture | Form, benefits, trust |
| Final CTA | Last chance | Summary, strong CTA |
Trust Sections
| Section | Purpose | Key Elements |
|---|---|---|
| Testimonials | Social proof | Quote, name, photo, stars |
| Logos | Authority | Client/partner logos |
| Stats | Credibility | Numbers, context |
| Reviews | Third-party proof | Google/Trustpilot reviews |
Content Sections
| Section | Purpose | Key Elements |
|---|---|---|
| Features | Benefits | Icon, title, description |
| How It Works | Process | Numbered steps |
| FAQ | Objection handling | Questions, answers |
| About | Trust building | Story, team, values |
Mobile Patterns
- Sticky mobile CTA bar
- Thumb-friendly buttons (44px min)
- Collapsible navigation
- Touch-friendly form inputs
Page Flow
Hero (with CTA)
↓
Trust Signal (logos/stats)
↓
Features/Benefits
↓
Social Proof (testimonials)
↓
How It Works
↓
CTA Banner
↓
FAQ
↓
Final CTA
↓
Footer
Related Skills
section-skeleton— Component structurepage-structure— Section orderingastro-components— UI components
Definition of Done
- Mobile-first responsive
- Clear CTA hierarchy
- Trust elements before forms
- Accessible (a11y checked)
- Fast loading (no heavy assets in viewport)
スコア
総合スコア
50/100
リポジトリの品質指標に基づく評価
✓SKILL.md
SKILL.mdファイルが含まれている
+20
○LICENSE
ライセンスが設定されている
0/10
○説明文
100文字以上の説明がある
0/10
○人気
GitHub Stars 100以上
0/15
○最近の活動
3ヶ月以内に更新がある
0/10
○フォーク
10回以上フォークされている
0/5
✓Issue管理
オープンIssueが50未満
+5
✓言語
プログラミング言語が設定されている
+5
○タグ
1つ以上のタグが設定されている
0/5
レビュー
💬
レビュー機能は近日公開予定です