Aplicación de escritorio
Diseño de explicación interactiva de producto
Explora las capas separadas de un teléfono conceptual con vistas de cámara predefinidas, un deslizador y un panel de ocho grupos de ensamblaje.
LLM Arena sep. 2026
Notas del caso- Modelo
- Astra
- Tarea de diseño
- Explorador interactivo de la anatomía del iPhone
- Resultado
- Aplicación de escritorio
Diseñado para
- Páginas interactivas de productoExplica un objeto complejo mediante vistas controlables.
- Exploración de componentesConecta los grupos de piezas con su posición en un modelo.
- Estudios conceptuales de hardwarePresenta geometría ilustrativa con límites claros sobre su precisión.
Aspectos destacados
- Tres dispositivos conceptualesUna página de colección ofrece puntos de entrada independientes para cada modelo.
- Dos modos de separaciónEl desmontaje progresivo y la vista explosionada comparten un control de porcentaje.
- Ocho grupos de ensamblajeLos grupos identificados conectan la carcasa estructural con sistemas más pequeños.
- Vistas predefinidas y libresEmpieza desde un ángulo conocido y, después, orbita para inspeccionar la profundidad.
Explora la explicación del producto
1 / 3Una explicación de producto que abre una capa cada vez
iPhone Inside presenta tres conceptos especulativos de dispositivos como puntos de entrada a un estudio interactivo de anatomía. La colección combina cada dispositivo renderizado con una etiqueta de modelo, una etiqueta de tamaño de pantalla y un enlace Explore inside. Un pequeño aviso Independent concept studies establece que se trata de conceptos de diseño, no de especificaciones de productos anunciados.
El espacio de trabajo de detalle responde a una pregunta distinta de la colección: ¿cómo se relacionan las piezas con el conjunto? Un deslizador de separación, los controles de cámara y un panel de ensamblaje opcional ofrecen distintas vías para abordar esa pregunta. La interfaz no exige que alguien reconozca cada pieza antes de empezar a explorar.
Elige el control adecuado para cada tarea de inspección
Una explicación de producto útil no pretende que un solo control lo haga todo. Este espacio de trabajo separa hasta qué punto se abre el modelo, cómo se visualiza y qué ensamblaje quiere comprender el visitante. Esos controles pueden funcionar juntos sin convertirse en una barra de herramientas saturada.
Controla la separación sin perder de vista el conjunto
El deslizador va de Assembled a Every component y muestra un porcentaje. La vista explosionada capturada al 65% sigue percibiéndose como un único teléfono, al tiempo que muestra el espacio entre sus capas principales. Esto hace que la relación entre el exterior y el interior sea más legible que en un conjunto de piezas completamente dispersas.
Ofrece un ángulo inicial conocido
La barra de cámara incluye las vistas predefinidas 3/4, B, F y S. El visitante puede empezar desde una vista frontal, trasera o lateral reconocible y, después, orbitar alrededor del objeto. Las etiquetas cortas ahorran espacio, pero una adaptación también debería mantener sus nombres disponibles para quienes usan el teclado o un lector de pantalla, además de para quienes utilizan un puntero.
Mantén las anotaciones como opción
Las anotaciones se encuentran tras un selector independiente, en lugar de cubrir permanentemente el modelo. Esto permite que el visitante compare primero la geometría y solicite las etiquetas cuando las necesite. Ocultar esas etiquetas de forma predeterminada solo funciona si el selector sigue siendo fácil de encontrar y la pieza seleccionada dispone de otra indicación clara.
Conecta los nombres de los ensamblajes con el espacio de trabajo 3D
Al abrir el panel de anatomía, el modelo completo y la franja inferior de controles permanecen visibles. Los ocho ensamblajes numerados tienen tanto un nombre como un subtítulo en lenguaje sencillo: Display se convierte en Glass, pixels and touch; Logic board se convierte en Compute and connectivity. El subtítulo traduce una categoría técnica a la función que desempeña en el producto.
El pie del panel indica que hay 198 componentes seleccionables. Es una indicación del alcance de este concepto procedimental, no un inventario verificado de un teléfono real. Agrupar esas selecciones en ocho ensamblajes permite gestionar la elección inicial sin sugerir que el objeto subyacente contiene solo ocho piezas.
| Ensamblaje | Subtítulo visible | Pregunta que ayuda a responder |
|---|---|---|
| Enclosure | The structural shell | ¿Qué mantiene unida la forma general? |
| Display | Glass, pixels and touch | ¿Qué capas forman la superficie visual y táctil? |
| Logic Board | Compute and connectivity | ¿Dónde sitúa el concepto sus sistemas informáticos? |
| Fasteners and Flex | Holding everything together | ¿Cómo se agrupan los pequeños elementos de conexión? |
Un estudio ilustrativo de anatomía, no una guía de reparación
La fuente se describe a sí misma como Reference-led exterior. Illustrative internals. Los nombres de los dispositivos, los tamaños, la geometría y las cantidades de componentes pertenecen a un estudio conceptual independiente y no deben considerarse especificaciones verificadas de producto ni instrucciones de reparación. Esta vista previa local muestra los controles visuales; no confirma la precisión de la ubicación de las piezas en el interior de un dispositivo real.
Cómo crear un diseño de explicación interactiva de producto en OpenDesign
Define el objeto y sus grupos de ensamblaje
Empieza con un objeto ficticio o documentado e identifica qué debería aprender el visitante al abrirlo. Este nuevo prompt de diseño toma prestado el patrón de interacción, no las especificaciones no verificadas de un dispositivo.
Prompt sugeridoCrea un diseño de explicación interactiva de producto para un dispositivo portátil ficticio. Empieza con una página de colección que muestre tres variantes y un aviso claro de que se trata de un estudio conceptual. Cada elemento debe abrir un espacio de trabajo claro y despejado, con un objeto 3D completo en el centro. Añade un deslizador de Ensamblado a Separado con un porcentaje visible y diferencia el desmontaje progresivo de una vista de capas explosionada. Mantén el dispositivo reconocible en un ajuste intermedio. Incluye vistas de cámara predefinidas frontal, trasera, lateral y de tres cuartos, además de órbita libre. Un panel contraíble debe enumerar ocho grupos de ensamblaje, cada uno con un nombre y una descripción de su función en lenguaje sencillo. Mantén visibles a la vez el panel, el modelo y los controles inferiores. Coloca las anotaciones tras un selector evidente. Indica que la geometría interna es ilustrativa y proporciona una alternativa estática legible si el renderizado 3D no está disponible.
Compara los estados ensamblado e intermedio
Pide a OpenDesign que conserve la misma orientación e identidad de los componentes mientras cambia la separación. Comprueba una vista intermedia antes de maximizar el efecto: el visitante aún debe entender qué capas van juntas. La opción de restablecer debe devolver la vista a un estado inicial predecible.
Prueba la explicación sin depender del lienzo
Revisa los nombres de los grupos, los subtítulos y las etiquetas de los controles de forma independiente de la vista 3D. Haz que los controles sean accesibles mediante teclado y conserva el aviso sobre la precisión. En pantallas pequeñas, proporciona una forma explícita de abrir el panel sin dejar demasiado poco espacio para reconocer el objeto.
Exportar y obtener un enlace para compartir
Exporta tu diseño terminado y luego usa Compartir en OpenDesign para obtener un enlace. Abre el enlace en una ventana del navegador independiente y comprueba que la versión prevista y sus recursos estén disponibles antes de enviarlo.
Diseño de planificador de excursiones
Planifica seis paradas programadas en la ciudad ficticia de Solara Bay, con un mapa ilustrado, estimaciones de trayectos a pie y advertencias útiles sobre la ruta.
Aplicación de escritorio
Diseño de juego de aventuras isleñas
Explora Harbor Skirmish, una pequeña isla costera con rutas por los tejados, tres ranuras de armas y una interfaz en primera persona de tono desenfadado.
Aplicación de escritorio
Diseño de juego FPS insular
Entra en Harbor Skirmish, donde una llamativa pantalla de título insular conduce a una experiencia en primera persona con paneles de estado enmarcados y controles de armas numerados.
Aplicación de escritorio
Diseño de Panel Personal
Life System coloca una puntuación semanal, métricas de mapa corporal, ritmos diarios y cinco experimentos en un panel de escritorio. Explora el diseño en detalle.
Aplicación de escritorio