---
name: fed-playbook
description: "What a Front-End Developer reaches for in RBA Skills to scaffold components, enforce accessibility, and document UI changes through delivery."
disciplines:
  - engineering
tags:
  - playbook
  - role-guide
  - fed
author:
  name: Kassie Gibbons
  url: https://rba.com
---

# Front-End Developer Playbook

FEDs build what users see and touch — translating designs into working interfaces, implementing accessibility, and making the experience hold up across devices and browsers. Your work is what clients demo to their executives. This is your RBA Skills toolkit.

## Create — build the interface

| Reach for | Why |
|---|---|
| `component-scaffold` skill | Scaffold production components fast. |
| **design-to-code-builder** (`figma-component-scaffold`, `design-token-extract`, `design-system-sync`, `component-a11y-gate`) | Go from Figma + tokens to accessible components. |
| `rba-design-system` resource | RBA tokens, accessible palette, focus-state CSS, WCAG guidance. |
| `alt-text-writer` / `form-spec-builder` skills | Accessible images and well-specified forms. |
| `user-story-writer` skill | Understand and flag frontend-specific story issues. |

## Test & Review — prove it holds up

| Reach for | Why |
|---|---|
| **accessibility-auditor** (`accessibility-wcag-scan`, `accessibility-aria-review`) | Catch WCAG and ARIA issues before the demo. |
| **code-review-enforcer** → `a11y-linter` / `standards-check` | Enforce accessibility and standards in review. |
| `cwv-quick-check` skill | Sanity-check Core Web Vitals. |

## Deliver — document the change

| Reach for | Why |
|---|---|
| **release-notes-generator** → `release-notes-developer` | Document UI changes and deployment steps. |
| `git-commit-pr-writer` skill | Clean commits and PR descriptions. |

## FED Tips

- **WCAG AA is required on all web output.** See `rba-design-system` for the accessible palette, focus-state CSS, and the full checklist.
- **Brand aqua `#14BADB` fails WCAG at 2.31:1.** Use it for decorative elements only — never as text color or a data indicator.