La versión corta
- Un buen caso de estudio cuenta una historia en tres partes: el problema, el trabajo y el resultado.
- El resultado debe aparecer en la primera pantalla o en la primera diapositiva, porque muchos lectores nunca llegan al final.
- Cada sección de un caso de estudio debe tener su propio visual, desde una imagen del antes hasta los bocetos del proceso y el trabajo terminado en uso.
- Afirma solo los resultados que puedas mostrar, y pide permiso al cliente antes de nombrarlo o compartir cifras.
- Un mismo caso de estudio puede publicarse como página web, PDF, diapositiva de una presentación comercial y carrusel para redes si comparte un aspecto coherente.
En esta página
Un buen diseño de casos de estudio sigue tres actos: el problema, el trabajo y el resultado. Abre con un titular que diga el resultado, muestra lo que fallaba antes, recorre las decisiones que lo cambiaron y demuestra que funcionó con la pieza terminada en uso real. Da a cada acto su propio visual y mantén los textos breves. Un posible cliente debería entender qué hiciste y por qué importó en el tiempo que tarda en recorrer una pantalla.
La estructura de un buen caso de estudio
Diseñadores, agencias, consultores y empresas de software escriben casos de estudio, y la forma que funciona es la misma para todos. Se lee como un relato breve con un punto de giro claro, y pone el final tanto al principio como al final.
- 1
Titular: el resultado
«Una carta que redujo a la mitad las preguntas al pedir» gana a «Rediseño de restaurante». Nombra al cliente y el trabajo en una línea debajo.
- 2
El problema
Qué fallaba, para quién y por qué importaba al negocio. Dos o tres frases y una imagen del antes.
- 3
El enfoque
Las dos o tres decisiones que marcaron la diferencia, y por qué. No cada paso que diste.
- 4
El trabajo
Las piezas terminadas, en grande y en contexto: en un móvil, en una estantería, en la calle.
- 5
El resultado
Qué cambió, con palabras del cliente o con cifras que tengas permiso para compartir.
- 6
El siguiente paso
Una línea que invite a contactarte a quien tenga un problema parecido.
Elige con el mismo cuidado qué proyectos contar. Tres casos de estudio que encajen con los clientes que quieres a continuación valen más que diez que cubran todo lo que has hecho. Si quieres más trabajo con restaurantes, empieza por el restaurante; si quieres clientes de software, empieza por el panel de control, aunque fuera un encargo más pequeño.
Visuales para cada parte de la historia
Un muro de mockups terminados le dice al lector que sabes hacer cosas bonitas. No le dice que sabes resolver su problema. Asigna a cada sección un visual que demuestre lo que esa sección afirma.
Evita
Evita
Evita
Visual que lo demuestra
Evita
Una diapositiva de problema: el asunto dicho con claridad, desde el lado del cliente, en una línea.
La diapositiva de resultado con el mismo estilo. El resultado es el titular, con su fuente indicada debajo.
El ejemplo de arriba es inventado para mostrar la forma, pero fíjate en la línea de fuente bajo el resultado. Una cifra con su atribución se lee como prueba; una cifra sola se lee como marketing. La jerarquía visual ayuda a decidir qué poner en grande.
Maquetación de un caso de estudio en una página web
En un portafolio o en la web de una empresa, un caso de estudio es una página larga. La mayoría de los visitantes lee la primera pantalla, ojea los encabezados y mira las imágenes. Diseña justo para eso.
Evita
- Una imagen principal a pantalla completa sin palabras
- El resultado escondido al final del todo
- Párrafos largos entre imágenes
- Todas las imágenes del mismo tamaño
- Ninguna forma de contactarte al final
Haz
- Titular, cliente y resultado en la primera pantalla
- Un recuadro de resumen: cliente, rol, plazos, resultado
- Encabezados que cuenten la historia leídos solos
- Imágenes principales grandes, imágenes de detalle más pequeñas
- Un siguiente paso claro y un enlace al siguiente caso de estudio
Un fondo constante para separadores de sección, citas y paneles de resultados hace que una página larga se sienta como una sola pieza y da a la vista un sitio donde descansar entre imágenes. Consejos para el portafolio de un diseñador y portafolio de desarrollador tratan el resto de la web que lo rodea.
Un caso de estudio en varios formatos
Un caso de estudio da demasiado trabajo para publicarlo una sola vez. La misma historia puede vivir como una página en tu web, un PDF para adjuntar a propuestas, dos diapositivas en una presentación comercial y un carrusel en LinkedIn o Instagram. Cada uno necesita su propio tamaño.
Diapositiva 1920×1080
1920 × 1080
PDF A4 2480×3508
2480 × 3508
Carrusel 1080×1350
1080 × 1350
Portada de Behance 1616×1264
1616 × 1264
- Carrusel: una diapositiva por acto, más una portada y una diapositiva de contacto. Carruseles de LinkedIn muestra el formato.
- Presentación comercial: una diapositiva de problema y otra de resultado, como la pareja de arriba.
- PDF: de dos a cuatro páginas A4 o Carta; mira diseño de one pager para resúmenes en una sola hoja.
- Webs de portafolio: una portada al tamaño de la plataforma, como el tamaño de portada de Behance.
Gradiently ayuda aquí porque un Mark se renderiza de nuevo a cada tamaño: diseña el caso de estudio una vez y Pro lo adapta a todos los formatos en un paso, con el mismo fondo y la misma tipografía en la diapositiva, el PDF y las páginas del carrusel.
Preguntas frecuentes
¿Qué debe incluir un caso de estudio?
Un titular con el resultado, el problema, tu enfoque, el trabajo terminado en contexto, el resultado y un siguiente paso para el lector.
¿Qué extensión debe tener un caso de estudio de diseño?
La suficiente para mostrar el punto de giro y nada más. Los buenos se pueden ojear en un minuto y leer enteros en cinco.
¿Puedo escribir un caso de estudio sin datos de resultados?
Sí. Usa una cita del cliente o una descripción de lo que cambió que el cliente apruebe. Nunca inventes cifras.
¿Dónde va el resultado en un caso de estudio?
En el titular o en la primera pantalla, y otra vez con más detalle al final. Muchos lectores nunca llegan abajo.
¿Qué formato debe tener un caso de estudio?
Una página web es su casa principal, con un PDF para propuestas, diapositivas para presentaciones y un carrusel para redes, todo con el mismo estilo.
Escrito por Gradiently
El equipo detrás de Gradiently, una herramienta de diseño creada en torno a los Marks: degradados vivos que hacen que todo lo que diseñas parezca tuyo.
Ver nuestro perfil