guias

Portafolio honesto en Astro: proyectos vs casos

Por qué separar la colección proyectos (CreativeWork) de casos (testimonios): mostrar trabajo real con schema correcto y sin métricas ni reseñas inventadas.

Portafolio honesto en Astro: proyectos vs casos

«Clínica Dental Sonríe.» «Estudio Creativo Mija.» «Constructora Horizonte.» Cinco testimonios pulidos, con nombre y cargo, en la home de una agencia de desarrollo —y ninguno de esos clientes existía—. No aparecían en el portafolio, no había forma de contactarlos, y la voz de los cinco era sospechosamente la misma: el ritmo uniforme del copy de marca, no el habla irregular de una persona real. Eran relleno, escritos para llenar un hueco. Cuando reconstruimos ese sitio, el primer reflejo fue mover esa «prueba social» a la colección casos del template y ya. Y ahí chocamos con una restricción incómoda pero correcta: casos exige una cita textual (quote) de un cliente. Sin esa cita real, quedaban dos malos caminos —inventarla (otra vez) o dejar el campo vacío y romper el schema—. La fricción era la pista: el portafolio y el testimonio no son la misma entidad.

Un negocio de servicios vende confianza, y la confianza se prueba con trabajo, no con adjetivos. El portafolio es, para una agencia o un despacho, lo que el catálogo es para una tienda: la página donde se decide. Pero meterlo a la fuerza en la colección de testimonios lo empuja a fabricar lo que no tiene. La salida es separar dos cosas que parecían una: proyectos es trabajo real que muestras por decisión propia, y su schema natural es CreativeWork; casos es prueba social en voz del cliente, una cita con su consentimiento. Esta guía explica por qué conviene esa separación y cómo modelar un portafolio que convence sin inventar nada —el que terminamos construyendo con catorce proyectos reales del portafolio, repartidos en tres sectores—.

Contexto: dos preguntas distintas

proyectos responde a «¿qué has hecho?», y la respuesta es tuya: la das sin pedir permiso porque es tu obra. casos responde a «¿qué dicen de ti?», y la respuesta es del cliente: requiere su voz y su autorización. Confundirlas es el origen del problema. Cuando intentas que una sola entidad responda las dos preguntas, te falta siempre un campo —o la cita, o la obra— y la tentación es rellenarlo. Separarlas te deja construir un portafolio rico hoy, con lo que tienes, y sumar testimonios reales después, cuando los consigas, sin que una entidad contamine a la otra.

El choque: por qué casos no es tu portafolio

La colección casos está diseñada para prueba social: su campo central es quote, la cita textual, y un rating opcional que solo se modela si es real y verificable —la regla B4 del sistema, que detallamos en Por qué nunca auto-emitir reseñas—. Eso es perfecto para un testimonio y hostil para un portafolio: quieres mostrar veinte trabajos tuyos, y no tienes veinte clientes dispuestos a firmar una cita. Forzar el portafolio dentro de casos te empuja exactamente a lo que B4 prohíbe. La incomodidad del schema no es un defecto del schema: es el schema haciendo su trabajo, avisándote de que estás metiendo una entidad en el molde de otra.

Modelar la colección proyectos

Cada proyecto es una entrada Markdown con datos verificables. Lo esencial: título, sector (para agrupar el índice), imagen real de la pieza, enlace al trabajo en vivo, y los tres bloques que cuentan la historia sin inventar números.

const proyectos = defineCollection({
  loader: glob({ pattern: '**/*.md', base: './src/content/proyectos' }),
  schema: z.object({
    title: z.string().min(10).max(110),
    description: z.string().min(70).max(160),
    sector: z.enum(['incendios', 'eventos', 'seguridad']), // tus sectores reales
    image: z.string().regex(/^\/images\//),
    liveUrl: z.string().url().optional(),   // el trabajo en vivo
    stack: z.array(z.string()).optional(),
    services: z.array(z.string()).optional(),
    reto: z.string(),       // qué problema había
    solucion: z.string(),   // qué hiciste
    resultado: z.string(),  // qué cambió — SIN métricas inventadas
    order: z.number().default(0),
    draft: z.boolean().default(false),
  }).strict(),
});

Fíjate en lo que no está: no hay quote, no hay rating. Un proyecto no necesita la voz del cliente para existir; le basta con ser verdad y poder mostrarse.

Reto, solución, resultado — sin inventar métricas

La estructura «reto → solución → resultado» es la columna vertebral de un caso de portafolio, y el resultado es donde la honestidad se pone a prueba. Es tentador escribir «aumentamos las ventas un 240 %» cuando no se midió nada. No lo hagas: una métrica inventada es tan grave como una reseña falsa, y además es trivial de desmentir —un cliente, un competidor o un periodista la revientan con una pregunta—. El resultado honesto describe lo entregado y verificable: «un sitio Astro estático, con catálogo en Markdown y formulario propio, que el cliente administra sin depender de nadie». Si de verdad hay un dato medido, cítalo con su fuente. Un portafolio sin números fabricados es, paradójicamente, más persuasivo que uno empapelado de porcentajes que nadie puede confirmar.

El índice por sector y la ficha L3

El portafolio honra los niveles del sistema: un índice L2 (/portafolio) que agrupa los proyectos por sector en tarjetas, y una ficha L3 (/portafolio/[slug]) por proyecto, con su captura grande, los tres bloques de la historia, un aside con servicios y stack, y el enlace al trabajo en vivo. El reparto del schema sigue la regla del emisor único: el índice emite un solo CollectionPage con su ItemList; cada ficha emite su CreativeWork; ninguna tarjeta del índice emite schema propio. Esa disciplina mantiene el grafo limpio, sin los veinte CreativeWork duplicados que aparecen cuando cada tarjeta «quiere» su schema.

Patrones avanzados

Imágenes reales, no stock. El portafolio es la prueba, y una prueba ilustrada con foto de banco de imágenes no prueba nada. Usa el hero real de cada sitio entregado, una captura del trabajo. En la reconstrucción, copiamos la imagen real desde la carpeta de cada proyecto en vivo; cuesta más que tirar de un stock, y es justo ese costo el que vuelve creíble la página.

Cero enlaces a competencia. Los liveUrl apuntan a tu propio trabajo y a tus dominios; los enlaces salientes editoriales van solo a fuentes de autoridad. Un portafolio que enlaza a sitios de la competencia regala autoridad y confunde la señal de marca. Es una política, no una preferencia.

El proyecto reservado. No todo trabajo se puede mostrar: hay clientes bajo acuerdo de confidencialidad o piezas que no quieres atribuir. Para esos, o no entran al portafolio, o entran como draft: true hasta tener permiso. Nunca un proyecto a medias de permiso publicado «porque se ve bien».

La captura literal contra la captura honesta. El ideal es un screenshot real del navegador, capturado en una máquina con Chrome o Playwright. Si tu entorno de build no tiene navegador —un sandbox headless, por ejemplo—, usa el hero del propio sitio como imagen provisional y registra el screenshot literal como deuda. Lo que no se hace es maquetar un mockup ficticio que finja ser el sitio.

Edge cases

Cuando sí tienes un testimonio real. Entonces vive en casos, con su quote textual, su autor y —solo si es verificable— su rating. Un proyecto en proyectos puede enlazarse con su caso en casos por referencia: la obra y la voz del cliente, cada una en su colección, tejidas sin mezclarse.

El portafolio sin un solo testimonio. Es un escenario normal al empezar. Lanza con proyectos —no necesita testimonios— y suma casos cuando consigas citas reales. Es infinitamente mejor un portafolio honesto sin testimonios que uno con cinco «Clínica Dental Sonríe» inventadas.

Métricas reales pero confidenciales. A veces hay un número medido y bueno, pero el cliente no deja publicarlo. La salida honesta es el rango o la forma cualitativa («redujo a la mitad el tiempo de publicación»), nunca el número inflado «porque suena mejor».

Tabla: proyectos vs casos

Dimensiónproyectoscasos
Pregunta que responde¿Qué has hecho?¿Qué dicen de ti?
VozTuyaDel cliente
Campo centralreto / solucion / resultadoquote (cita real)
SchemaCreativeWorktestimonio (+ rating si es real)
Requiere consentimientoNo (es tu obra)Sí (cita del cliente)
Riesgo de fabricaciónMétricas inventadasCitas / ratings falsos

Checklist

  • Separa proyectos (tu trabajo, CreativeWork) de casos (testimonios con quote).
  • Modela reto / solucion / resultado; el resultado sin métricas inventadas.
  • Construye índice L2 por sector + ficha L3 por proyecto; emisor de schema único por página.
  • Usa imágenes reales de cada pieza, no stock; captura literal como deuda si falta navegador.
  • Respeta cero enlaces a competencia; los liveUrl apuntan a tu propio trabajo.
  • Verifica: astro check en cero, CollectionPage/CreativeWork sin duplicados, build verde.

Preguntas frecuentes

¿Por qué no usar una sola colección para todo?

Porque mezclan dos intenciones con requisitos distintos: el portafolio es tu obra (la muestras cuando quieras) y el testimonio es la voz del cliente (requiere su cita y consentimiento). Una sola colección te obliga a inventar el campo que falte, y ese invento es justo el problema que queremos evitar.

¿Qué schema emito en el portafolio?

CollectionPage con ItemList en el índice, y CreativeWork en cada ficha de proyecto, una sola emisión por página. Si además tienes testimonios reales, viven en casos con su propio schema, enlazados por referencia pero no fundidos en el portafolio.

¿Puedo poner una calificación con estrellas en un proyecto?

Solo si es una calificación real y verificable de un cliente, y entonces pertenece a casos, no a proyectos. Inventar un rating o agregarlo a un AggregateRating global es exactamente lo que la regla B4 prohíbe, y desde 2026 ni siquiera pinta estrellas en la SERP para servicios.

¿Y si no tengo ningún testimonio todavía?

Lanza el portafolio solo con proyectos. No necesita testimonios para funcionar. Suma casos cuando consigas citas reales con permiso. Un portafolio honesto sin testimonios convierte mejor que uno con citas que el visitante huele a inventadas.

¿Está mal enlazar al sitio en vivo del cliente?

Al contrario: ese liveUrl es la prueba más fuerte del portafolio, siempre que sea tu trabajo y tengas permiso de mostrarlo. Lo que se evita es enlazar a competidores o a sitios ajenos a la pieza presentada.

¿Cómo muestro el proyecto si no puedo capturar un screenshot real?

Usa el hero del propio sitio en vivo como imagen provisional y registra el screenshot literal de navegador como deuda, para capturarlo en una máquina con Chrome o Playwright. Nunca un mockup ficticio que finja ser el sitio: eso vuelve a la fabricación que el portafolio honesto evita.

Sigue leyendo

¿Listo para dar el siguiente paso?

Cuéntanos qué necesitas y te respondemos hoy mismo.

¿Necesitas ayuda?