Jeden Skill in Manus ausführen
mit einem Klick

Jeden Skill in Manus mit einem Klick ausführen

frontend-ux-chakra

Sterne3

Forks0

Aktualisiert1. März 2026 um 19:50

Use this skill when improving UX/UI in React frontend using Chakra UI, especially navigation clarity, operational dashboards, and accessible components for emergency workflows.

Installation

Mit Codex oder Claude installieren Kopieren Sie diesen Prompt, fügen Sie ihn in Codex, Claude oder einen anderen Assistant ein und lassen Sie die Skill-Seite prüfen und installieren.

In Manus ausführen

Quelle

nhmatsumoto

nhmatsumoto/sos_location

GitHub-Repository öffnen Creator-Repositorys ansehen

Download

In Manus ausführen

Verwandte BerufeSOC

Basierend auf der SOC-Berufsklassifikation

SoftwareentwicklerInformatik- und Mathematikberufe·SOC 15-1252

SKILL.md

readonly

name	frontend-ux-chakra
description	Use this skill when improving UX/UI in React frontend using Chakra UI, especially navigation clarity, operational dashboards, and accessible components for emergency workflows.

Frontend UX Chakra

Quando usar

Pedidos para melhorar UX/UI.
Necessidade de design system consistente em páginas operacionais.
Refatorar telas com foco em rapidez de ação.

Workflow

Mapear jornada principal (ex.: abrir ocorrência, acionar equipe, concluir).
Criar shell com navegação clara (dashboard, mapa, boletins).
Implementar componentes Chakra:
- Card para KPI operacional.
- Input/Textarea/select para captura rápida.
- Table + Badge para status e prioridade.
Validar acessibilidade visual (contraste, estados e hierarquia).
Executar npm run lint e npm run build.

Padrões

Evitar telas super carregadas: separar contexto (KPI) de execução (CRUD).
Botões de ação imediata sempre visíveis.
Status semântico: aberto (vermelho), em ação (laranja), concluído (verde).

Mehr aus diesem Repository

gleiches Repository

sos-location-orchestration

nhmatsumoto/sos_location

Use when translating SOS Location natural-language requests into a structured software-engineering plan, including domain language, specialist agents/skills, simulation flows, and AI refinement pipeline requirements.

2026-04-023

plateau-source-indexing

nhmatsumoto/sos_location

Use this skill when implementing or updating crawling/indexing of PLATEAU and geospatial portals, including source metadata registry and evidence artifacts.

2026-03-183

atlas-geodata-fusion

nhmatsumoto/sos_location

Use this skill to integrate Atlas-aligned geospatial sources (GSI, GeoSampa, INDE, OpenTopography, Earthdata) into SOS Location risk models and 3D scene pipelines.

2026-03-173

coastal-tsunami-modeling

nhmatsumoto/sos_location

Use this skill for coastal and tsunami scenario modeling, including tide/ocean sensor integration, wave ETA estimation, and evacuation map generation.

2026-03-173

multi-hazard-simulation-sdk

nhmatsumoto/sos_location

Use this skill when designing or implementing a reusable SDK for multi-disaster simulation (wildfire, flood, earthquake, tsunami) with scenario contracts and uncertainty handling.

2026-03-173

architecture-urban-infra

nhmatsumoto/sos_location

Use this skill for architecture and built-environment analysis focused on access, safety, and operational flow.

2026-03-033

name	frontend-ux-chakra
description	Use this skill when improving UX/UI in React frontend using Chakra UI, especially navigation clarity, operational dashboards, and accessible components for emergency workflows.

Frontend UX Chakra

Quando usar

Pedidos para melhorar UX/UI.
Necessidade de design system consistente em páginas operacionais.
Refatorar telas com foco em rapidez de ação.

Workflow

Mapear jornada principal (ex.: abrir ocorrência, acionar equipe, concluir).
Criar shell com navegação clara (dashboard, mapa, boletins).
Implementar componentes Chakra:
- Card para KPI operacional.
- Input/Textarea/select para captura rápida.
- Table + Badge para status e prioridade.
Validar acessibilidade visual (contraste, estados e hierarquia).
Executar npm run lint e npm run build.

Padrões

Evitar telas super carregadas: separar contexto (KPI) de execução (CRUD).
Botões de ação imediata sempre visíveis.
Status semântico: aberto (vermelho), em ação (laranja), concluído (verde).