frontend-ui-ux

Designer-turned-developer who crafts stunning UI/UX even without design mockups

1.15x

Quality

25%

Does it follow best practices?

Impact

97%

1.15x

Average score across 3 eval scenarios

Securityby

Passed

No known issues

Optimize this skill with Tessl

npx tessl skill review --optimize ./src/features/builtin-skills/frontend-ui-ux/SKILL.md

Evaluation results

98%

21%

Hearthstone Roasters — Brand Landing Page

Typography and color palette

Criteria

Without context

With context

No Inter font

100%

No Roboto or Arial

100%

No Space Grotesk

100%

Font pairing

100%

CSS color variables

100%

No purple-on-white gradient

100%

Dominant color

100%

Sharp accent color

100%

Non-solid background

100%

Unconventional layout

46%

86%

95%

18%

Aether Labs — Feature Showcase Page

Staggered animation and motion

Criteria

Without context

With context

animation-delay stagger

46%

100%

Incremental delay values

100%

Scroll-triggered effect

100%

Non-trivial hover state

100%

CSS or Motion as primary engine

100%

No GSAP or anime.js

100%

Motion library for React

100%

Unconventional layout

33%

66%

No generic fonts

100%

Non-solid background

100%

Portfolio Hero Section — Senior Product Designer

Design direction and visual depth

Criteria

Without context

With context

Tone label in notes

100%

Purpose in notes

100%

Differentiation in notes

80%

100%

Non-solid hero background

100%

Texture or grain effect

100%

Depth or atmosphere element

100%

Unconventional layout

100%

No Inter or Roboto

100%

No Arial or Space Grotesk

100%

CSS color variables

100%

Repository: code-yeongyu/oh-my-openagent
Commit: beb89fa

Evaluated: 2 days ago
Agent: Claude Code
Model: Claude Sonnet 4.6

Table of Contents

Hearthstone Roasters — Brand Landing Page Aether Labs — Feature Showcase Page Portfolio Hero Section — Senior Product Designer

Is this your skill?

If you maintain this skill, you can claim it as your own. Once claimed, you can manage eval scenarios, bundle related skills, attach documentation or rules, and ensure cross-agent compatibility.