Usamos los términos principal, secundario y hermano para describir las relaciones entre objetos en Figma.

Estos términos se usan comúnmente para explicar relaciones similares en el desarrollo web o la programación.

En este artículo, aclararemos a qué nos referimos cuando usamos estos términos.

Instancias principales, secundarias y hermanas

Usamos estos términos para explicar cómo los objetos se relacionan con otros objetos en el lienzo.

Las instancias principales son objetos, es decir, marcos, componentes y grupos, que contienen otros objetos.

Las instancias secundarias son objetos que están contenidos dentro de una instancia principal.

Las instancias hermanas son objetos que están contenidos dentro de la misma instancia principal. 

• En el caso de un marco que contiene objetos, el marco es la instancia principal y los objetos que contiene son instancias secundarias.
• Un marco por sí solo no es una instancia principal por sí mismo, únicamente se convierte en instancia principal si contiene otros objetos.
• Si una instancia principal contiene más de un objeto, los objetos secundarios son instancias hermanas.
• Los objetos, como marcos, grupos y componentes, pueden ser tanto instancias principales como secundarias.

Interacciones entre instancias principales y secundarias

Si bien estos términos no se usan explícitamente en el producto, son importantes para comprender cómo los objetos se comportan y se relacionan entre sí en Figma.

Funcionan como contenedores (instancias principales) y contenidos (instancias secundarias) que se influyen mutuamente, sin relaciones hereditarias explícitas.

Propiedades

Hay relaciones entre instancias principales y secundarias que implican influencia. En muchas circunstancias, la instancia principal será un marco.

Puedes agregar las siguientes propiedades a un marco que influyan en todos sus objetos secundarios:

• Cuadrículas de disposición: crea una estructura visual para tus diseños
• Disposición automática: crea marcos dinámicos que respondan a su contenido
• Recortar contenido: oculta cualquier objeto dentro del marco que se extienda más allá de los límites del marco

También puedes agregar propiedades a un objeto secundario:

• Limitaciones: define cómo responderán los objetos secundarios al cambiar el tamaño del marco principal

Comportamiento de los objetos secundarios

Cuando mueves un objeto en el lienzo a una nueva ubicación, Figma decidirá si reorganizar o no la relación jerárquica con el elemento primario del objeto.

Reorganizar la relación jerárquica significa extraer el objeto de su instancia principal actual y anidarlo dentro de otro objeto principal. Por ejemplo, puedes sacar un objeto de un marco principal y moverlo a otro marco.

Figma usa la misma lógica de jerarquía cuando añades nuevos objetos a un marco.

El comportamiento predeterminado es el siguiente:

• Si un objeto es más pequeño que un marco, lo convertiremos en instancia secundaria del marco
• Si un objeto es más grande que un marco, no lo convertiremos en instancia secundaria del marco

Evitar el comportamiento predeterminado

Puedes optar por evitar el comportamiento predeterminado:

• Al añadir objetos, mantén pulsada la barra espaciadora para evitar que Figma reorganice la jerarquía de un objeto
• Al mover un objeto fuera de los límites de un marco, mantén pulsada la barra espaciadora para mantener un objeto dentro del elemento principal actual