AgentSkillsCN

closure

大脑天生擅长填补残缺的形态。在设计极简图标、品牌标志,或那些看似“言有尽而意无穷”的界面时,这一原则能够帮助设计师以更少的视觉元素,传达更丰富的信息与情感。

SKILL.md
--- frontmatter
name: closure
description:
  El cerebro completa formas incompletas. Use cuando diseñe iconos minimalistas,
  logos, o interfaces que sugieren más de lo que muestran explícitamente.
metadata:
  author: ux-ui-skills
  version: "1.0"
  category: gestalt

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