La biblioteca de casos prácticos de diseño
98 ejemplos de diseño de sitios web, apps, paneles, presentaciones y diseños gráficos, incluidas plantillas oficiales de OpenDesign. Abre un proyecto para consultar sus decisiones de composición y un prompt sugerido; los nombres de los modelos solo aparecen cuando están documentados.
98 ejemplos de diseño · tres series · 10 modelos documentados
Casos prácticos
Filtra los proyectos por tipo de resultado, finalidad, serie o modelo que los generó.
Sitios web
Kimi Careers por OpenDesign
Una página de empleo narrada a través de ocho escenas lunares, con transiciones vinculadas al desplazamiento y un proceso de solicitud ilustrado en cuatro pasos.
Ejemplo de hackathon
Sitios web
Bianjing After Dark por OpenDesign
Un recorrido nocturno interactivo por una Bianjing imaginaria de la era Song, que combina una ciudad fluvial siempre presente, poesía, faroles y capítulos de ritmo multilingüe.
LLM Arena · GPT 6 Sol
Sitios web
Bianjing After Dark por OpenDesign
Sigue un río iluminado por faroles a través de cinco capítulos de Bianjing After Dark, desde la puerta de la ciudad y el mercado nocturno hasta la poesía y el lanzamiento de faroles.
LLM Arena · Claude Opus 5.5
Paneles
Halcyon Cove por OpenDesign
Organiza un día con seis paradas en Halcyon Cove: vincula lugares guardados, ubicaciones en el mapa y tiempos a pie en un solo panel.
LLM Arena · Claude Opus 5
Apps
Abyssal Log por OpenDesign
Una colección de especímenes marinos vinculada a misiones de buceo. Cada registro desconocido explica la tarea y el progreso necesarios para descubrirlo.
LLM Arena · Claude Opus 5
Paneles
Life System por OpenDesign
Una puntuación semanal, métricas del mapa corporal, ritmos diarios y cinco experimentos en un panel de escritorio, explicados mediante cuatro vistas de detalle con anotaciones.
Ejemplo de hackathon
Sitios web
Ember & Pepper por OpenDesign
Platos estrella y detalles de visita, junto con un cuadro de reserva para quienes estén listos para reservar.
LLM Arena · GPT 5.6 Sol
Apps
Harbor Skirmish por OpenDesign
Una pequeña isla costera con rutas por las azoteas, tres espacios para armas y una divertida interfaz en primera persona.
LLM Arena · GPT 6 Astra
Presentaciones
Agent-Native Workspace por OpenDesign
Una historia de producto en tres diapositivas: una tesis inicial, un concepto de aplicación móvil complementaria y una sala de control empresarial.
Ejemplo de hackathon
Apps
Solara Bay por OpenDesign
Seis paradas con horarios en la ficticia Solara Bay, con un mapa ilustrado, tiempos estimados a pie y avisos útiles sobre la ruta.
LLM Arena · GPT 5.6 Sol
Apps
Abyssal Atlas por OpenDesign
Una colección de especímenes vinculada a una cola de inmersiones: registros bloqueados, dos filas de filtros y recuentos de progreso explican qué descubrir a continuación.
LLM Arena · Grok 4.6
Sitios web
Yàn Huǒ por OpenDesign
Presentación del hot pot con un menú de especialidades y precios, una galería del restaurante y detalles para la visita antes de reservar.
LLM Arena · Qwen 3.8 Max
Sitios web
Second Spring por OpenDesign
Una rama caída interactiva da paso a relatos del bosque, un plan de restauración y formas simuladas de colaborar.
LLM Arena · DeepSeek V4.1 Flash
Sitios web
Second Spring por OpenDesign
Haz crecer una capa de musgo sobre un tronco caído y explora los relatos del suelo del bosque y formas simuladas de ayudar.
LLM Arena · Claude Fable 5.1
Diseños gráficos
iPhone Inside por OpenDesign
Capas separadas de un teléfono conceptual, con ajustes preestablecidos de cámara, un control deslizante y un panel con ocho grupos de ensamblaje.
LLM Arena · GPT Astra
Apps
Harbor Skirmish por OpenDesign
Una llamativa pantalla de título de la isla da paso a una experiencia en primera persona con paneles de estado enmarcados y controles de armas numerados.
LLM Arena · DeepSeek V4.1 Flash
Diseños gráficos
Tom Goodman por OpenDesign
Un currículum ficticio que combina experiencia con gráficos de competencias y trabajos destacados, en un orden de lectura a dos columnas y con una maquetación de impresión independiente.
Ejemplo de hackathon
Diseños gráficos
Maya Rowan por OpenDesign
Un portfolio ficticio que reúne proyectos en tarjetas tipo póster, una práctica en tres etapas, notas de trabajo y contacto.
Ejemplo de hackathon
Sitios web
Narrativa arquitectónica por OpenDesign
Recorre Kage, un templo de montaña imaginario narrado mediante arquitectura a la luz de la luna, serenas notas sobre el jardín y primeros planos de la artesanía en madera.
Proyecto oficial
Sitios web
Landing page editorial con collage de OpenDesign Atelier Zero por OpenDesign
El diseño web para estudios de diseño de IA de OpenDesign convierte el concepto de un estudio local-first en una landing page editorial que facilita consultar habilidades, experimentos y método.
Plantilla oficial
Sitios web
Sitio web de marketing sereno para infraestructura de agentes de IA de Halcyon a través de OpenDesign
Un concepto de landing page de infraestructura de IA de estilo suave, con métricas de ejecución de ejemplo, tarjetas de funciones anidadas, movimiento sutil y una única invitación comercial.
Plantilla oficial
Diseños gráficos
Póster editorial para entusiastas de la IA que presenta seis flujos de trabajo de diseño por OpenDesign
El diseño de póster editorial sobre flujos de trabajo con IA presenta seis afirmaciones sobre los flujos de trabajo, con capítulos numerados, ejemplos concretos de prompts y acentos tipográficos color óxido sobre un fondo crema.
Plantilla oficial
Diseños gráficos
Editorial social de siete tarjetas sobre cómo mejorar los flujos de trabajo de edición con IA a través de OpenDesign
Siete tarjetas verticales utilizan encabezados chinos sobredimensionados, hábitos numerados, campos de color cambiantes y una declaración final para explicar los flujos de trabajo de edición con IA.
Plantilla oficial
Paneles
Wireframe greybox del dashboard de analítica de Acme por OpenDesign
Un dashboard greybox de OpenDesign representa un espacio de trabajo de analítica mediante una barra lateral, cuatro marcadores de posición KPI, un gráfico esquemático, cinco filas de tabla y anotaciones de maquetación en azul.
Plantilla oficial
Motion
Vídeo de motion del logo con historia del arte por OpenDesign
Una película de OpenDesign de 15 segundos en 16:9 mantiene reconocible un único logotipo circular con cursor a través de looks rápidos inspirados en la historia del arte y termina con un logotipo fijo en blanco sobre negro.
Proyecto oficial
Diseños gráficos
Composición Aurora Field WebGL2 animada automáticamente por OpenDesign
Un campo de ruido azul verdoso animado automáticamente aporta atmósfera a un hero WebGL, mientras un titular fijo y una pequeña insignia local de frecuencia de fotogramas anclan la escena.
Plantilla oficial
Diseños gráficos
Aurora Veil interactivo original: composición de shader de OpenDesign por OpenDesign
Aurora Veil es una composición de shader interactiva que convierte la luz en capas, las estrellas y el movimiento del cursor en un hero atmosférico de WebGL.
Plantilla oficial
Diseños gráficos
Documento de especificación de producto de autenticación de dos factores de Northwind por OpenDesign
Una propuesta de autenticación de dos factores de Northwind vincula responsables, alcance, historias de usuario, cuatro objetivos de ejemplo, fases de lanzamiento y decisiones sin resolver.
Plantilla oficial
Presentaciones
Presentación de historia de marca de OpenDesign para socios y prensa por OpenDesign
El diseño de presentación de historia de marca ofrece a socios, prensa y comunidades una narrativa basada en evidencias, desde las convicciones hasta los canales, el calendario y la verificación.
Plantilla oficial
Sitios web
Sitio web de revista editorial brutalista Field Unit 04 a través de OpenDesign
Diseño de sitio web de revista brutalista convierte una edición con forma de publicación impresa en un sistema web de lectura legible, combinando tipografía contundente con una estructura editorial medida.
Plantilla oficial
Diseños gráficos
Caustic Pool interactivo original — composición de shader de OpenDesign por OpenDesign
Un campo de luz WebGL verde azulado combina filamentos de cáustica brillantes con tipografía fija y una ondulación activada al pulsar el puntero que curva brevemente el patrón.
Plantilla oficial
Diseños gráficos
Informe de caso ficticio de medicina de urgencias con constantes vitales, pruebas complementarias y manejo por OpenDesign
El diseño de informe de caso clínico organiza un caso ficticio de urgencias en un recorrido legible desde los síntomas y las observaciones hasta las pruebas complementarias, la valoración y el manejo.
Plantilla oficial
Apps
Bandeja de entrada de solicitudes de revisión y menciones de GitHub por OpenDesign
El diseño de aplicación de bandeja de entrada para revisiones de código reúne solicitudes de revisión, fallos de CI, incidencias asignadas y actividad en un espacio de trabajo fácil de revisar para la priorización diaria.
Plantilla oficial
Motion
Diseño de vídeo animado para un hito de la comunidad por OpenDesign
Un vídeo animado de OpenDesign de 30 segundos pasa de la revelación de las 100K estrellas a un mosaico de colaboradores, un montaje de producto y una invitación final a escribir un prompt.
Proyecto oficial
Paneles
Analítica de contenido social multiplataforma con mapas de calor de interacción y gráficos de ingresos por OpenDesign
Un panel de contenido oscuro conecta instantáneas de plataformas con inspección de gráficos, planificación de borradores y una vista más profunda de las señales de audiencia y conversión.
Plantilla oficial
Diseños gráficos
Correo de resumen diario de Gmail agrupado por prioridad por OpenDesign
El diseño de resumen diario de correo convierte una síntesis de seis mensajes de Gmail en una ruta de lectura ordenada por prioridad para decidir qué gestionar primero.
Plantilla oficial
Apps
App móvil de misiones diarias gamificadas de Level, mostrada en tres pantallas distintas por OpenDesign
El diseño de una app de misiones diarias convierte los objetivos cotidianos en un recorrido móvil de misiones de tres pantallas, con XP de ejemplo, tarjetas de categorías y detalles de tareas.
Plantilla oficial
Sitios web
Documentación para desarrolladores de Filebase y guía de inicio rápido de la CLI por OpenDesign
Una guía de inicio rápido de la CLI de Filebase combina la navegación de la documentación con una secuencia de lectura clara: instalación, autenticación y sincronización de carpetas.
Plantilla oficial
Sitios web
Página de destino editorial de producto de OpenDesign con papel cálido a través de OpenDesign
El diseño editorial de sitio web de producto utiliza papel cálido, tipografía de gran tamaño y una lectura estructurada por capítulos para presentar un estudio que prioriza el funcionamiento local como una publicación con autoría.
Plantilla oficial
Diseños gráficos
Plan de incorporación de nuevos empleados de Northwind con primer día e hitos a 30/60/90 días por OpenDesign
Este diseño de guía de incorporación de empleados convierte el primer día, la primera semana y los hitos a 30/60/90 días de un nuevo empleado en un recorrido práctico con puntos de control visibles.
Plantilla oficial
Sitios web
Artículo de ingeniería de Filebase sobre la reescritura de un motor de sincronización en Rust por OpenDesign
Un artículo de ingeniería combina una columna de lectura estrecha y una entradilla en cursiva con un panel de degradado cálido, una franja de métricas de ejemplo y decisiones técnicas justificadas explícitamente.
Plantilla oficial
Sitios web
Página de destino SaaS de Filebase para la sincronización de archivos con uso eficiente del ancho de banda por OpenDesign
Una página de destino de sincronización de archivos combina un titular centrado en el ancho de banda con tres columnas numeradas de beneficios, nombres de empresas ilustrativos y planes Solo, Team y Enterprise contrastados.
Plantilla oficial
Diseños gráficos
Currículum chino de ingeniero frontend sénior en dos columnas a través de OpenDesign
Este diseño de currículum chino en dos columnas combina una cronología profesional detallada con secciones compactas de habilidades, formación e idiomas.
Plantilla oficial
Presentaciones
Memorando de financiación de serie A de Quartz con tipografía editorial sobria a través de OpenDesign
El memorando de captación de fondos de Quartz, de diez diapositivas, combina una sobria tipografía serif con principios de producto, datos de tracción de ejemplo y una solicitud de financiación para un pequeño grupo de inversores.
Plantilla oficial
Motion
Diseño de vídeo con motion futurista por OpenDesign
Un reel renderizado en azul eléctrico con túnel de palabras, cuenta atrás SET y final cromado FUTURE, rehecho en código sobre una cuadrícula de cortes a 120 BPM. Consulta su ritmo y cómo adaptarlo.
Plantilla oficial
Diseños gráficos
Informe mensual de crecimiento en chino con KPI, tendencias, tabla de datos y conclusiones a través de OpenDesign
Un informe en chino reúne cuatro tarjetas de KPI, gráficos de tendencia pareados, nueve filas mensuales de muestra y tres tarjetas de conclusiones en un documento vertical.
Plantilla oficial
Presentaciones
Presentación para reuniones de métricas de Operaciones y Crecimiento que diagnostica la pérdida de conversión en Safari por OpenDesign
El diseño de presentación para reuniones de métricas de crecimiento convierte un problema de conversión en Safari en una narrativa centrada que concluye con una única decisión y un responsable asignado.
Plantilla oficial
Diseños gráficos
Composición de campo de semitonos WebGL2 que responde al cursor por OpenDesign
Una trama de puntos girada transforma un campo fluido naranja y crema en una textura inspirada en la impresión, con influencia suavizada del puntero y tipografía fija en la esquina inferior izquierda.
Plantilla oficial
Diseños gráficos
Holographic Foil interactivo original — composición de shader de OpenDesign por OpenDesign
Una superficie de lámina procedural multicolor cambia con el tiempo y la posición del puntero bajo un título fijo de dos líneas, pequeñas etiquetas de vista previa y una indicación de inclinación.
Plantilla oficial
Presentaciones
Presentación de decisión sobre la telemetría del incidente y el rediseño del resolutor de Operation Halcyon a través de OpenDesign
Incident Telemetry — Operation Halcyon convierte una interrupción ilustrativa del entorno de ejecución en un informe ordenado para rastrear causas, riesgos y decisiones.
Plantilla oficial
Sitios web
Página de inicio de portafolio interactivo de OpenDesign a pantalla completa con tipografía monoespaciada por OpenDesign
El diseño de sitio web de portafolio interactivo de OpenDesign combina una interfaz monoespaciada, una identidad 3D espacial y una cuadrícula de proyectos para narrar con un enfoque local-first.
Plantilla oficial
Diseños gráficos
Liquid Iridescence interactivo original: composición de shader de OpenDesign por OpenDesign
Un vivo aspecto de aceite sobre agua fluye bajo una tipografía fija, mientras la entrada suavizada del puntero deforma un campo de color procedural sin texturas.
Plantilla oficial
Apps
Resumen de incidencias de Linear con progreso del ciclo y trabajo asignado por OpenDesign
El diseño de app de resumen de incidencias convierte un resumen diario al estilo Linear en un espacio de trabajo de escritorio centrado en el estado del ciclo, los elementos que requieren atención y el historial de incidencias.
Plantilla oficial
Diseños gráficos
Composición de tipografía cinética con globo orbital de Charlotte & Vine por OpenDesign
Un globo terráqueo de líneas en rotación, líneas de órbita anidadas y tipografía serif con acentos naranja óxido forman un estudio de movimiento editorial cálido sobre el alcance internacional.
Plantilla oficial
Diseños gráficos
Documento de resumen matutino al estilo Notion con cambios, menciones y actualizaciones de bases de datos por OpenDesign
Un resumen matutino con fecha, al estilo Notion, separa las ediciones de documentos, las menciones directas y las filas de estado de proyectos en una secuencia compacta para la revisión diaria.
Plantilla oficial
Diseños gráficos
Composición animada automáticamente de un shader de metal líquido (Liquid Metal) por OpenDesign
Un campo con apariencia de cromo que cambia solo combina ruido deformado, color iridiscente y reflejos que barren la superficie, bajo una tipografía fija en la esquina inferior izquierda.
Plantilla oficial
Sitios web
Sitio web de marketing inmobiliario de lujo de Velar por OpenDesign
Velar es un diseño web inmobiliario de lujo que combina imágenes arquitectónicas cinematográficas con tipografía sobria y un recorrido editorial deliberado.
Plantilla oficial
Sitios web
Wireframe de una landing page de marketing de Acme con barra lateral de anotaciones por OpenDesign
Un wireframe de marketing de Acme combina cinco regiones de página numeradas con una barra lateral de especificaciones, y muestra dónde las notas de diseño coinciden con el layout implementado o difieren de él.
Plantilla oficial
Apps
Flujo de compra en un marketplace con cuatro wireframes móviles diferenciados por OpenDesign
Un wireframe móvil de cuatro pantallas organiza la incorporación, la exploración, el detalle del producto y la confirmación en un camino de compra enfocado.
Plantilla oficial
Presentaciones
Presentación para una reunión de laboratorio sobre microbios intestinales y sueño profundo a través de OpenDesign
El ejemplo de investigación de nueve diapositivas del Raman Lab usa separadores azul marino, diapositivas de evidencia en crema y una salvedad causal para dar ritmo a un argumento ilustrativo sobre intestino y sueño.
Plantilla oficial
Apps
Flujo de onboarding de mindfulness de Lull con tres pantallas de teléfono por OpenDesign
El diseño de app de onboarding de mindfulness usa tres pantallas móviles tranquilas para presentar la práctica de Lull, adaptar su promesa y mostrar las opciones de cuenta.
Plantilla oficial
Paneles
Resumen matutino personal de trabajo con notificaciones agrupadas por fuente y prioridades de tareas por OpenDesign
El diseño de panel de resumen matutino convierte una jornada densa en un resumen de escritorio sereno y agrupado por fuente, que combina tareas prioritarias con contexto de proyectos, mensajes y documentos.
Plantilla oficial
Motion
Diseño de showreel de motion designer por OpenDesign
Un showreel de 15 segundos a 128 BPM recreado en código, con cortes de color secos, un HUD en vivo y siete capítulos sincronizados con los compases. Descubre cómo funcionan el ritmo, la tipografía y la paleta.
Plantilla oficial
Diseños gráficos
Tres tarjetas sociales coordinadas sobre seguir adelante y mirar hacia el futuro por OpenDesign
Tres tarjetas cuadradas estáticas combinan frases motivacionales breves con escenas en degradado, siluetas abstractas, etiquetas numeradas y un tratamiento serif compartido.
Plantilla oficial
Diseños gráficos
Composición shader de horizonte synthwave con animación automática por OpenDesign
Un sol retro con bandas ancla un horizonte púrpura mientras una cuadrícula neón se desplaza bajo él, con un titular fijo y escasos detalles procedurales en el cielo.
Plantilla oficial
Presentaciones
Presentación de decisión para el rediseño del modelo operativo de Meridian Freight a través de OpenDesign
Meridian Freight convierte un diagnóstico del modelo operativo en una presentación de decisión enfocada, que vincula la presión de costes, las opciones estratégicas, el valor y una hoja de ruta de 18 meses.
Plantilla oficial
Presentaciones
Revisión operativa de OpenDesign con decisión sobre reducción de burn y BYOK por OpenDesign
El diseño de presentación de revisión operativa convierte una decisión de sostenibilidad en una narrativa de seis diapositivas para el consejo, con una recomendación firme y opciones y contrapartidas explícitas.
Plantilla oficial
Motion
Diseño de animación con recortes de papel por OpenDesign
Un corto de 20 segundos con recortes de papel convierte una pregunta escrita a mano en cinco demostraciones de diseño y las reúne en un libro de posibilidades.
Plantilla oficial
Diseños gráficos
Visualizador de campo de partículas en Canvas 2D con un Web Worker local y etiquetas de ejecución por OpenDesign
Un denso campo de puntos verdes acompaña un titular sobre el cálculo fuera del hilo principal, junto con etiquetas de número de partículas, transporte y renderizado local sobre un lienzo casi negro.
Plantilla oficial
Diseños gráficos
Composición de galaxia WebGL2 de 50000 puntos con animación automática por OpenDesign
Tres tenues brazos en espiral evolucionan sobre un lienzo WebGL2 oscuro, bajo una tipografía fija, con recuentos de puntos y llamadas de dibujo definidos en el código y una lectura local de FPS.
Plantilla oficial
Diseños gráficos
Póster editorial animado sobre el año 1889 con sprites pixelados, inspirado en Nintendo por OpenDesign
Un póster editorial animado en tono crema combina una carta de flor en pixel art con tipografía enorme de 1889, rotulación japonesa animada y una línea de tiempo con desplazamiento.
Plantilla oficial
Sitios web
Landing page de escritorio del producto Pomodoro Tomato por OpenDesign
Una landing page de Tomato centrada plantea ciclos de trabajo de 25 minutos con tipografía sobria, secciones guiadas por beneficios y una llamada a la acción directa de uso individual a equipo.
Plantilla oficial
Diseños gráficos
Diseño de email de lanzamiento de producto por OpenDesign
Un email de lanzamiento de zapatillas combina una ilustración naranja del producto, tipografía de gran tamaño, una sola acción de compra y cuatro especificaciones sobre un lienzo crema estrecho.
Plantilla oficial
Motion
Diseño de vídeo animado para lanzamiento de producto por OpenDesign
Una película de lanzamiento de OpenDesign de 37 segundos avanza desde una apertura pictórica, pasando por densas muestras de diseño y tipografía cinética, hasta un cierre de logotipo sobrio.
Proyecto oficial
Motion
Diseño de motion graphics para promo de producto por OpenDesign
Una promo de 15 segundos pasa de una mascota en semitono y tarjetas de producto a un checkout escenificado, y resuelve su mensaje en el logotipo de Pennyflow.
Plantilla oficial
Sitios web
Página de lista de espera «próximamente» de Meridian con ilustraciones geométricas de espirales y cuadrícula y un ticker animado por OpenDesign
Meridian combina un mensaje de lanzamiento de gran tamaño con un formulario de registro compacto y un ticker en bucle de «Coming Soon» para dar a su página de lista de espera una identidad de lanzamiento propia.
Plantilla oficial
Diseños gráficos
Informe financiero del Q3 de Northwind con evidencia de ingresos, costos y P&L por OpenDesign
El diseño de informe financiero trimestral convierte datos financieros ilustrativos en una narrativa de una sola página que conecta KPI principales, comparativas, cuentas y perspectivas.
Plantilla oficial
Paneles
Dashboard de OKR trimestrales de Northwind con responsables de resultados clave y bloqueos por OpenDesign
Este dashboard de OKR trimestrales agrupa objetivos, responsables, avance de resultados clave y un bloqueo de dotación de personal para leer el estado de entrega junto con una decisión.
Plantilla oficial
Diseños gráficos
Tarjeta tipográfica de cita con identidad de autor para redes sociales a través de OpenDesign
Una cita en chino con nombres tecnológicos en alfabeto latino, énfasis en dorado y crédito de autor visible llena un lienzo editorial oscuro con cuadrícula.
Plantilla oficial
Diseños gráficos
Escultura WebGL2 de campos de distancia con signo, animada automáticamente por OpenDesign
Cinco formas de campo de distancia, fusionadas con suavidad, orbitan sobre un lienzo azul marino, con sombras suaves, bordes brillantes, una órbita lenta y automática de la cámara, y tipografía fija.
Plantilla oficial
Paneles
Dashboard de analítica de relaciones con mutuos y tendencias de tasa de coincidencia por OpenDesign
El diseño del dashboard de analítica de relaciones convierte señales de ejemplo de mutuos, comunidades y tasa de coincidencia en un espacio de trabajo de escritorio fácil de escanear, para comparar el estado actual con las tendencias recientes.
Plantilla oficial
Paneles
Panel de métricas de repositorio de OpenDesign con estrellas, actividad y colaboradores por OpenDesign
El diseño de panel de métricas de repositorio convierte señales de ejemplo de un repositorio en un espacio de trabajo de escritorio fácil de escanear para comparar crecimiento, participación y trabajo reciente.
Plantilla oficial
Sitios web
Página de comparación de precios y decisión de compra SaaS de Filebase por OpenDesign
El diseño web de precios SaaS convierte la elección de plan en un recorrido de compra legible, con opciones de facturación, detalles de planes, filas de comparación y preguntas concretas.
Plantilla oficial
Paneles
Resumen analítico de ingresos SaaS de Pulse por OpenDesign
Este diseño de dashboard de ingresos SaaS reúne métricas de suscripción, un gráfico de ingresos de 30 días, estados de cuentas y eventos recientes en una sola vista general.
Plantilla oficial
Sitios web
Runbook operativo del servicio de identidad de Northwind por OpenDesign
El diseño del runbook de auth-service reúne en una sola referencia operativa fácil de escanear la titularidad del servicio, la respuesta a alertas, los procedimientos de despliegue y los traspasos de incidentes.
Plantilla oficial
Paneles
Dashboard de analítica social de X en OpenDesign con crecimiento de seguidores y geografía de la audiencia por OpenDesign
El diseño de dashboard de audiencia social reúne el crecimiento en X, la geografía de la audiencia, las señales de publicación y los comentarios de la comunidad en un espacio de escritorio fácil de escanear.
Plantilla oficial
Diseños gráficos
Póster bilingüe de lanzamiento de producto de HTML Anything a través de OpenDesign
Un póster vertical de lanzamiento de software combina letras enormes en blanco y dorado con cuatro afirmaciones de funciones, un degradado de cálido a púrpura y detalles técnicos en el pie.
Plantilla oficial
Apps
Tablero de sprint del Northwind Growth Squad con barra lateral de carga de trabajo y Sprint Pulse por OpenDesign
El diseño de app Northwind Sprint Board reúne el estado del sprint, la asignación de tickets, las estimaciones y los bloqueos en un espacio de trabajo de escritorio fácil de revisar de un vistazo.
Plantilla oficial
Paneles
Panel de exámenes para estudiantes de Zentou AI con tratamiento de wireframe dibujado a mano por OpenDesign
Este wireframe organiza puntuaciones de ejemplo, progreso, asignaturas y próximos pasos en una vista general de estudio de escritorio dibujada a boceto.
Plantilla oficial
Diseños gráficos
Factura de cliente de Sable Studio con partidas, totales e instrucciones de pago por OpenDesign
El diseño de factura de estudio organiza el alcance del proyecto, los honorarios desglosados, las condiciones de pago, los ajustes y las notas de pago en un único documento largo para el cliente.
Plantilla oficial
Diseños gráficos
Documento de la reunión semanal del Growth Squad con decisiones y acciones pendientes por OpenDesign
El diseño de notas de reunión de equipo convierte la agenda semanal del Growth Squad en un registro legible de tiempos, decisiones, responsables, preguntas abiertas y próxima reunión.
Plantilla oficial
Paneles
Panel de equipo de FlowAI con tabla de miembros, gráficos de roles y pestañas de actividad por OpenDesign
El diseño del panel de equipo de FlowAI organiza el estado de los miembros, la distribución de roles, las tendencias de actividad y las señales de riesgo en un espacio de trabajo de escritorio centrado.
Plantilla oficial
Paneles
Dashboard de espacio de trabajo en equipo al estilo Notion de Acme, con tareas y resúmenes de proyectos por OpenDesign
Este dashboard de espacio de trabajo en equipo combina estado de tareas, actividad, volumen semanal y señales de revisión en una vista de escritorio fácil de escanear.
Plantilla oficial
Sitios web
Sitio web de marketing del espacio de trabajo de redacción técnica Quartz a través de OpenDesign
Quartz es un diseño de sitio web de redacción técnica que convierte el concepto de un espacio de trabajo editorial en un recorrido enfocado desde el borrador hasta la publicación.
Plantilla oficial
Paneles
Panel simulador de riesgo y ejecución de trading con gráficos explicativos por OpenDesign
El diseño de panel simulador de trading reúne señales, contexto de cadena de opciones, estados de ejecución y gráficos de riesgo en un único espacio de simulación para su revisión.
Plantilla oficial
Motion
Diseño de animación morph de UI por OpenDesign
Una película de 14 segundos hecha solo con código donde una forma se transforma en reproductor, pestañas y paleta de comandos, y cada cambio lo provoca un cursor a 120 BPM.
Plantilla oficial
Motion
Diseño de vídeo animado de reinicio de uso por OpenDesign
Un vídeo animado cuadrado de OpenDesign de seis segundos combina un anillo radial de marcas con dos barras de progreso etiquetadas y termina en un estado completado en verde.
Proyecto oficial
Diseños gráficos
Composición de celdas Voronoi en WebGL2 que responde al cursor por OpenDesign
Celdas de color irregulares se desplazan por un lienzo WebGL2, con bordes pálidos y luminosos, distorsión suavizada por el puntero y tipografía fija de gran tamaño.
Plantilla oficialQuita los filtros para ver todos los proyectos o explora otro tipo de trabajo.
Se usa la paginación en lugar del desplazamiento infinito para que se pueda acceder a todos los proyectos con el teclado y los rastreadores web.
Comunidad
Un hackatón comunitario que acaba de terminar y una serie de evaluaciones en la que diez modelos respondieron a los mismos encargos.
Los diseñadores publicaron en X productos creados con OpenDesign, con una publicación y un enlace a la comunidad por participación. Las participaciones se clasificaron según los «Me gusta».
Seis encargos, cada uno respondido por dos modelos. Cada página indica el modelo y la tarea, para poder comparar las respuestas en paralelo.
Filtra los casos prácticos anteriores por tipo de resultado y abre uno que se parezca a lo que quieres crear. Lee el encargo, el modelo que se usó y las decisiones de diseño que explica; después, anota qué conservarías y qué cambiarías.
Indica el tipo de resultado, las pantallas o secciones, el contenido de ejemplo y la interacción más importante. Especifica qué información es real y cuál es provisional para que el diseño no invente datos.
Crea el diseño de un sitio web para una panadería de barrio ficticia. Incluye una sección principal con los productos horneados de hoy, un menú dividido entre mañana y tarde, el horario de apertura y un formulario para hacer pedidos por adelantado con campos provisionales claramente etiquetados. Mantén la navegación literal, crea todos los encabezados como texto real e incluye un diseño móvil fácil de leer.
Elige el modelo en el que confías para el diseño y los textos. Para ver cómo responden dos modelos al mismo encargo, ejecútalo en LLM Arena primero, como hicieron los casos prácticos de Arena de esta página.
Pide cambios sección por sección: jerarquía, espaciado, estados y textos. Comprueba el diseño en móvil y el estado de movimiento reducido antes de aplicar un efecto a toda la página.
Exporta el diseño terminado como HTML y usa Compartir en OpenDesign para obtener un enlace. Ábrelo en otra ventana del navegador y comprueba que se carguen la versión prevista y sus recursos antes de enviarlo.
Empieza
Gratis, de código abierto y ejecutándose en tu propio equipo con tus propias claves. Prepara un encargo, elige un modelo y publica un sitio web, una app, un panel o una presentación que puedas compartir.
Versiones de escritorio para macOS y Windows. Gratis y de código abierto con licencia Apache-2.0.
