skills.rest
HellKaiser45
HellKaiser45COMMUNITY
Explore all skills by this author →
GitHub

frontend-skill

Create landing pages and app UI with restrained composition and bold imagery.

Updated Feb 4, 2026
Search Tags:#design#branding#ui#motion#visual-design#landing-page
One-click install
npx skills add https://github.com/HellKaiser45/Podlet --skill frontend-skill-hellkaiser45
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: frontend-skill
Source: https://github.com/HellKaiser45/Podlet/tree/main/.podlet/skills/frontend-skill
Command: npx skills add https://github.com/HellKaiser45/Podlet --skill frontend-skill-hellkaiser45

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Use when the task asks for a visually strong landing page, website, app, prototype, demo, or game UI. This skill enforces restrained composition, image-led hierarchy, cohesive content structure, and tasteful motion while avoiding generic cards, weak branding, and UI clutter.

Core Features & Use Cases

  • Enforces restrained composition, image-led hierarchy, cohesive content structure, and tasteful motion.
  • Provides a working model: write three things before building—visual thesis, content plan, interaction thesis.
  • Applies to landing pages, product sites, apps, prototypes, demos, or games with a premium, deliberate feel.

Quick Start

Provide a visual thesis, a content plan, and an interaction thesis, then deliver a premium landing-page concept with strong imagery and minimal copy.

Frequently Asked Questions about frontend-skill

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

FAQPage Schema
How do I design a premium landing page with strong visual hierarchy?▼

To design a premium landing page, enforce restrained composition with image-led hierarchy, one or two typefaces, a single accent color, and full-bleed hero sections to ensure a cohesive and deliberate visual result.

What is the best way to structure UI design before building a product site?▼

The best way to structure UI design is to write a visual thesis, a content plan, and an interaction thesis before building, ensuring the product site prioritizes one dominant idea and a clear hierarchy.

How do I avoid generic cards and weak branding in app UI design?▼

Avoid generic cards and weak branding in app UI design by applying restrained composition, cohesive content structure, and tasteful motion that enhances hierarchy rather than cluttering the interface.

Does this approach work for game UI and interactive prototypes?▼

Yes, this approach works for game UI and interactive prototypes by applying a premium, deliberate feel through bold imagery, minimal copy, and motion that enhances the visual hierarchy.

When should I not use a full-bleed hero section in visual design?▼

You should not use a full-bleed hero section when it compromises the cohesive content structure or fails to support the single dominant idea, though it is applied where appropriate for premium results.

Related Skills

Explore More Design & Creative Skills→
peteanderson80peteanderson80

frontend-skill

Plan landing pages and UI with visual thesis, content plan, and interaction thesis.

Community
Intermediate
idontcarlidontcarl

frontend-skill

Plan landing pages with a visual thesis, content plan, and interaction thesis.

Community
Intermediate
chenluhanchenluhan

frontend-skill

Creates UI mockups with unified themes and simplified layouts.

Community
Intermediate
rod97-1rod97-1
1

design-taste-frontend-v1

Enforce curated design taste rules for React and Next.js frontend interfaces.

Community
Advanced