Skip to main content

developer-portal-pro

Use when designing API portals, SDK docs, developer onboarding, keys, logs, and integration pages. Pro version focused on quickstart clarity, examples, credentials, and operational feedback; emphasizes deep information architecture, strong hierarchy, explicit states, responsive behavior, accessibility, and validation checks.

Datos de origen

Repositorio
Mr-Q526/TeamCC-Platform
Última actividad en el origen
15 de abril de 2026 a las 03:16
Idioma detectado de SKILL.md
inglés
Estrellas
7
Forks
1

Opciones de instalación

De forma predeterminada está seleccionado el prompt que primero revisa el origen. Puedes cambiar a un comando directo o descargar una copia local.

Revisa los archivos de origen

Lee SKILL.md y los archivos complementarios que muestra SkillsMP antes de decidir si quieres instalarlo.

Explorador de archivos
4 archivos

Mostrando SKILL.md

SKILL.md
Instrucciones de origen · Vista previa de solo lectura
schemaVersion
2026-04-11T00:00:00.000Z
skillId
frontend/developer-portal-pro
name
developer-portal-pro
displayName
Developer Portal PRO
description
Use when designing API portals, SDK docs, developer onboarding, keys, logs, and integration pages. Pro version focused on quickstart clarity, examples, credentials, and operational feedback; emphasizes deep information architecture, strong hierarchy, explicit states, responsive behavior, accessibility, and validation checks.
aliases
["developer-portal-pro","Developer Portal PRO","developerportalpro","开发者","开发者门户","developer portal","developer","portal"]
version
0.1.0
sourceHash
sha256:e4d2303226f56f800769895abcf8404c81927327b18e6258f6971551aba220f6
domain
frontend
departmentTags
["frontend-platform"]
sceneTags
["design"]
# Developer Portal PRO Use this skill when the task is to design API portals, SDK docs, developer onboarding, keys, logs, and integration pages. Goal: produce a high-quality, production-ready page or interface that supports quickstart clarity, examples, credentials, and operational feedback. ## Variant intent - Use the rigorous version when quality, accessibility, conversion, and maintainability matter. - Optimize for deep information architecture, strong hierarchy, explicit states, responsive behavior, accessibility, and validation checks. - Prefer concrete UI decisions over generic advice. ## Default workflow 1. Define the primary user, task, and success action. 2. Map the minimum page structure needed for the scenario. 3. Establish hierarchy: what must be understood first, second, and third. 4. Design responsive behavior for mobile and desktop. 5. Add states: loading, empty, error, success, disabled, and permission where relevant. 6. Run the final checks before delivery. ## Design rules - Use clear section names and user-facing copy. - Make the primary action visually dominant and repeat it only when it helps. - Keep navigation and secondary actions subordinate to the main task. - Use spacing, typography, and alignment before adding decorative containers. - Do not hide critical information behind hover-only interactions. - Preserve keyboard access, readable contrast, and touch targets. ## Pro guidance - Build a strong visual and interaction thesis before writing components. - Include proof, context, and state transitions when they affect trust. - Use component variants intentionally: default, hover, active, focus, disabled, loading, error, and empty. - Validate information architecture, accessibility, and responsive behavior explicitly. - Avoid filler sections, ornamental cards, and copy that does not change user confidence. ## Reject these failures - Ambiguous primary action - Important status or pricing hidden below the fold - Dense UI with no scan order - Decorative visuals that compete with the task - Missing mobile behavior ## Final checks - Can the target user understand the page purpose in under five seconds? - Is the next action clear without reading every paragraph? - Are edge states and responsive behavior accounted for?
Ver en GitHub