skills.rest
nguyenphp
nguyenphpCOMMUNITY
Explore all skills by this author →
GitHub

frontend-design

Provide frontend design guidelines for marketing websites and landing pages.

41|12|Updated Jan 16, 2026
Search Tags:#design#marketing#landing page#frontend#conversion#ux
One-click install
npx skills add https://github.com/nguyenphp/antigravity-marketing --skill frontend-design-nguyenphp
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: frontend-design
Source: https://github.com/nguyenphp/antigravity-marketing/tree/main/templates/.agent/skills/frontend-design
Command: npx skills add https://github.com/nguyenphp/antigravity-marketing --skill frontend-design-nguyenphp

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This Skill addresses the challenge of designing marketing websites and landing pages that not only look good but are optimized for conversion and user engagement.

Core Features & Use Cases

  • Design Principles: Understand essential elements of landing page anatomy, color psychology, and typography.
  • Visual Hierarchy & UX: Learn best practices for guiding user attention and improving form usability.
  • Mobile & Performance: Optimize designs for mobile devices and fast page load times.
  • Use Case: A marketing team needs to design a new landing page for an upcoming product launch. This Skill provides the foundational design principles to ensure the page is effective, visually appealing, and drives sign-ups.

Quick Start

Apply frontend design principles to create a high-converting landing page.

Frequently Asked Questions about frontend-design

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

FAQPage Schema
What is the best way to design a high-converting landing page?▼

To design a high-converting landing page, apply visual hierarchy, color psychology, and typography guidelines to guide user attention, build trust elements, and drive sign-ups effectively.

How do I improve conversion rates on my marketing website?▼

Improve conversion rates on your marketing website by optimizing page speed, designing effective forms, and prioritizing A/B testing to refine visual hierarchy and trust elements.

What essential sections does a marketing website need?▼

Essential sections for a marketing website include foundational landing page anatomy components that establish visual hierarchy, integrate trust elements, and optimize user experience for conversions.

Does page speed optimization affect landing page conversion?▼

Page speed optimization directly affects landing page conversion by improving user engagement on mobile devices, ensuring fast load times, and supporting overall frontend design performance.

How do I optimize landing page forms for mobile UX?▼

Optimize landing page forms for mobile UX by applying form design best practices, ensuring mobile considerations are met, and maintaining visual hierarchy to streamline user engagement.

When should I use A/B testing on a landing page?▼

Use A/B testing on a landing page to validate design principles, measure conversion rate improvements, and refine visual hierarchy or trust elements based on user engagement data.

Related Skills

Explore More Design & Creative Skills→
Kirankumar2604Kirankumar2604

branding-generator

Generate brand identity kits with naming, color palettes, and typography.

Community
Advanced
RepairYourTechRepairYourTech
6

page-cro

Analyze marketing web pages and recommend prioritized conversion optimization changes.

Community
Advanced
baasith6baasith6

adding-analytics

Integrate PostHog analytics into web applications for event tracking and feature flagging.

Community
Intermediate
PMDevSolutionsPMDevSolutions
7

screenshot-intake

Convert website screenshots or live URLs into structured build specifications.

Official
Advanced