Communitygithub.com

Página de caso

Convertir notas, imágenes, un deck o enlaces en una página de caso, un PDF y Markdown, sin resultados inventados.

¿Qué es Página de caso?

Arma un caso de portafolio que cubre el reto, el hallazgo, la idea, el proceso, el oficio, los resultados y los créditos. La misma historia se puede ajustar a una empresa o un puesto, y salir como página adaptable, PDF o Markdown para Behance, Notion o LinkedIn. No inventa resultados ni citas.

Compatible con✓Claude Code~Codex CLI~Cursor
npx skills add https://github.com/BeautifulEngine/case-study/tree/HEAD/case-study

Preguntar en tu IA favorita

Abre un nuevo chat con esta habilidad de agente ya precargada.

Documentación

Caso de Estudio (Case Study)

Convierte el material bruto de un proyecto (notas, imágenes, una presentación, enlaces, un correo de cliente) en un caso de estudio que muestre cómo piensa la persona y qué cambió gracias a su trabajo. Una historia, tres formatos: una página web, un PDF y Markdown.

Uso

/case-study <nombre del proyecto> [para <empresa o rol>] [corto | largo]

Adjunta lo que exista: imágenes, un PDF de presentación, notas, enlaces de prensa, resultados. Las solicitudes simples también funcionan:

  • "Escribe un caso de estudio para el lanzamiento de la asociación Sphere. Notas e imágenes adjuntas."
  • "Convierte esta presentación en un caso de estudio para portafolio, versión corta."
  • "Caso de estudio para mi proyecto de auto artístico, orientado a roles en agencias de experiencia."
  • "Reescribe este caso de estudio para una solicitud de líder de diseño en Netflix." (adjunta el caso existente)

Extensión. Por defecto es de aproximadamente 600–900 palabras con 6–10 imágenes. "corto" es una tarjeta de 150–250 palabras para una cuadrícula de portafolio o una publicación en LinkedIn. "largo" añade detalles de proceso para una audiencia de equipos de diseño.

Pregunta una vez lo que solo la persona sabe

Antes de escribir, recopila: su rol y lo que hizo personalmente (versus el equipo), el equipo y colaboradores a los que dar crédito, el cliente y si se puede mencionar el nombre del cliente, los resultados (números, prensa, premios, citas) con su origen, y qué está bajo NDA. Si falta algo, pregunta en un mensaje corto, luego continúa con lo disponible y marca las lagunas en la respuesta.

Archivos. <skill-dir> significa la carpeta de este skill, la que contiene este SKILL.md. Las plantillas están en assets/, los scripts en scripts/, y los pasos compartidos para PDF (fuentes, colores, renderizado, verificación) están en references/rendering.md.

Reglas estrictas

  • Nunca inventes resultados, citas, números, clientes o premios. Usa solo lo que la persona proporcionó o lo que verificaste en una fuente pública (cítala). Sin resultados, escribe sobre lo que el trabajo hizo posible y di qué agregar.
  • Su rol, claramente. Di lo que la persona hizo, y da crédito a otros por nombre o rol. "Lideré" solo si lideró.
  • Respeta la confidencialidad. Omite cualquier cosa bajo NDA o no publicada. Pregunta si no estás seguro de si se puede mencionar el nombre del cliente; ofrece una versión anonimizada ("una empresa global de deportes y entretenimiento").
  • Las imágenes son suyas. Usa solo imágenes que la persona proporcionó o cuyos derechos posee para mostrar. Escribe texto alternativo y un pie de foto para cada una. No tomes imágenes de clientes o marcas de la web para el caso de estudio.
  • Muestra el pensamiento. Cada caso de estudio responde: ¿cuál era el problema?, ¿qué notaste?, ¿qué decidiste y por qué?, ¿qué hiciste?, ¿qué cambió?
  • Sin crédito a Beautiful Engine ni otras marcas de terceros: el caso de estudio pertenece a la persona.

Flujo de trabajo

  1. Recopila y lee todo lo adjunto. Si es una presentación o PDF, extrae los fotogramas clave como imágenes (pdftoppm -r 110 -png presentacion.pdf frame) y elige los más fuertes.
  2. Encuentra la historia en 4 frases: el desafío, el insight, la idea, el resultado. Eso se convierte en el subtítulo y los encabezados de las secciones.
  3. Adapta (cuando se da una empresa o rol): comienza con la parte del trabajo que coincida con sus necesidades, usa su vocabulario donde encaje honestamente, y elige las imágenes que lo demuestren. Si hay un Brief de Empresa para esa empresa en la conversación, úsalo.
  4. Escribe case-study.md: título, subtítulo de una línea, un bloque de metadatos (cliente, rol, equipo, año, disciplinas), luego Desafío, Insight, Idea, Proceso, Artesanía, Resultados, Créditos. Párrafos cortos, colocaciones de imágenes con pies de foto, y citas destacadas solo si son reales.
  5. Construye la página a partir de assets/case-study-template.html:
    • copia las imágenes en images/ junto a ella;
    • configura colores y fuentes con el estilo de portafolio propio de la persona si lo tiene (mira su sitio), de lo contrario neutro, dejando que el trabajo lleve el color;
    • para el PDF: enlaza las fuentes con scripts/fonts.py y renderiza según references/rendering.md;
    • para la versión web: guarda una copia como index.html con los ENLACES DE FUENTES reemplazados por un <link> de Google Fonts para las mismas familias, para que funcione al alojarlo.
  6. Renderiza, audita, verifica la hoja de contactos del PDF y abre la página web con ancho de teléfono si hay un navegador disponible.
  7. Entrega el PDF, la carpeta web (index.html + images/, comprimida en zip) y case-study.md. En la respuesta: la historia de 4 frases, cualquier cosa omitida por confidencialidad, y los hechos o números que la harían más sólida.

Nombres de salida: <Proyecto>-Caso-de-Estudio.pdf, <Proyecto>-Caso-de-Estudio-web.zip, <Proyecto>-Caso-de-Estudio.md.

Skills relacionados