skills.rest
Andrejr82
Andrejr82COMMUNITY
Explore all skills by this author →
GitHub

frontend-design

Guide web interface design decisions using UX psychology and design principles.

Updated Feb 6, 2026
Search Tags:#design thinking#visual design#web design#frontend development#ui design#ux principles
One-click install
npx skills add https://github.com/Andrejr82/Caculinha_BI --skill frontend-design-andrejr82
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: frontend-design
Source: https://github.com/Andrejr82/Caculinha_BI/tree/main/.agent/skills/frontend-design
Command: npx skills add https://github.com/Andrejr82/Caculinha_BI --skill frontend-design-andrejr82

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) and scripts (resource) components.

What problem does it solve?

This Skill provides a framework for making informed, user-centric design decisions, moving beyond generic templates to create unique and effective web interfaces.

Core Features & Use Cases

  • Design Principles: Offers guidance on color theory, typography, layout, and visual effects.
  • UX Psychology: Integrates principles like Hick's Law and Fitts' Law into design choices.
  • Anti-Patterns: Actively steers users away from common AI-generated design clichés.
  • Use Case: When tasked with designing a new landing page, use this Skill to ensure the design is not only aesthetically pleasing but also strategically sound, considering user psychology and brand identity.

Quick Start

Use the frontend-design skill to audit the design of the provided project files for adherence to UX psychology principles.

Frequently Asked Questions about frontend-design

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

FAQPage Schema
How do I apply UX psychology principles like Hick's Law to web design?▼

Apply UX psychology to web design by using frameworks that guide UI component decisions based on principles like Hick's Law and Fitts' Law, ensuring user-centric interfaces that reduce cognitive load and improve interaction efficiency.

How do I avoid common anti-patterns and AI-generated design clichés in frontend development?▼

Avoid AI-generated design clichés in frontend development by enforcing a design thinking framework that prioritizes brand identity and user-centricity over generic templates, actively steering decisions away from common visual anti-patterns.

What is the best way to choose color palettes and typography for a new landing page?▼

The best way to choose color palettes and typography for a landing page is to apply a structured design thinking framework that evaluates color theory and visual effects against your brand identity and user psychology requirements.

Can I audit existing project files for adherence to UX design principles?▼

Yes, you can audit existing project files for UX design principles by evaluating the UI layouts and components against established UX psychology rules to identify areas where user-centricity and visual design standards are compromised.

When do I need a design thinking framework for frontend development?▼

You need a design thinking framework for frontend development when creating new web interfaces that require strategic, user-centric decisions beyond basic templates, ensuring layouts and visual effects align with both brand identity and UX psychology.

Related Skills

Explore More Design & Creative Skills→
truchottruchot
2

direction-artistique

Define visual identity, brand language, and governance for projects.

Community
Advanced
pratikrath126pratikrath126
42

frontend-design

Guide frontend design decisions with UX psychology, typography, and color theory.

Community
Intermediate
mintuzmintuz
3

web-design

Provides design principles for UI layout, typography, color, and component states.

Community
Intermediate
achmfachmf

frontend-design

Apply UX psychology principles to web interface color, typography layouts, and animations.

Community
Intermediate