返回 Skill 列表
extension
分类: 内容与媒体无需 API Key

closure

大脑会自动补全不完整的形状。在设计极简图标、标志或暗示多于直接展示的界面时可以使用这一点。

person作者: jakexiaohubgithub

Principio de Cierre

Resumen

El cerebro tiende a completar formas incompletas o fragmentadas, rellenando los vacíos para percibir objetos completos y familiares.

Origen

  • Escuela: Psicología de la Gestalt
  • Año: ~1920s
  • Autores principales: Max Wertheimer, Kurt Koffka, Wolfgang Köhler

Fundamento Psicológico

El sistema visual busca patrones completos y reconocibles. Cuando encuentra elementos incompletos pero sugerentes, automáticamente "cierra" los gaps para formar figuras coherentes. Esto permite diseños más limpios que comunican con menos elementos visuales.

Aplicación en Diseño

Iconografía Minimalista

  • Iconos con formas sugeridas, no cerradas
  • Símbolos que implican acción sin mostrarla completa
  • Logos que usan espacio negativo
  • Indicadores con elementos parciales

Cards y Containers

  • Cards sin bordes completos
  • Secciones delimitadas por elementos parciales
  • Fondos que sugieren límites
  • Shadows que implican separación

Carousels y Listas

  • Items parcialmente visibles sugieren más contenido
  • Peek de siguiente elemento
  • Scroll indicators implícitos
  • "Ver más" sugerido visualmente

Navegación

  • Menús que se "cortan" sugiriendo scroll
  • Tabs que continúan fuera del viewport
  • Breadcrumbs con elementos truncados
  • Indicadores de paginación parciales

Ejemplos

  • IBM Logo: Líneas horizontales que el ojo completa
  • WWF Panda: Figura formada por espacios negativos
  • Carousels: Item parcial visible sugiere más
  • Loading skeletons: Formas sugieren contenido
  • macOS Dock: Reflejo parcial implica profundidad

Anti-patterns

  • ❌ Formas tan incompletas que no se reconocen
  • ❌ Elementos cortados que parecen bugs
  • ❌ Iconos demasiado abstractos para cerrar
  • ❌ Contenido oculto sin indicación de más
  • ❌ Gaps que el usuario no puede completar mentalmente

Métricas

  • Icon Recognition Rate: Usuarios identifican iconos correctamente
  • Content Discovery: % que encuentra contenido parcialmente visible
  • Minimalism Score: Elementos necesarios vs superfluos
  • Visual Completion Test: Formas reconocidas vs no reconocidas

Principios Relacionados

  • [[pragnanz]] - Tendencia a formas simples
  • [[figure-ground]] - Separar figura del fondo
  • [[continuity]] - Completar líneas y curvas

Referencias

  • Wertheimer, M. (1923). "Laws of Organization in Perceptual Forms"
  • Lidwell, W. et al. (2010). "Universal Principles of Design"
  • https://www.nngroup.com/articles/gestalt-closure/