{"id":32482,"date":"2023-03-08T15:12:49","date_gmt":"2023-03-08T14:12:49","guid":{"rendered":"https:\/\/mimolive.com\/?post_type=user-manual&#038;p=32482"},"modified":"2025-06-16T19:00:05","modified_gmt":"2025-06-16T17:00:05","slug":"capas-personalizadas","status":"publish","type":"user-manual","link":"https:\/\/mimolive.com\/es\/user-manual\/custom-layers\/","title":{"rendered":"Capas personalizadas"},"content":{"rendered":"<p>mimoLive puede personalizarse a\u00f1adiendo nuevas capas. El verdadero poder de las capas reside en el hecho de que est\u00e1n hechas con una tecnolog\u00eda de MacOS X llamada Quartz Composer. Casi todo es posible con Quartz Compositions. Puedes crear programas de TV interactivos en los que tu audiencia puede enviar <span class=\"caps\">SMS<\/span> o mensajes de twitter que se muestran en pantalla. Crear gr\u00e1ficos burs\u00e1tiles a partir de datos en l\u00ednea. Llevar la puntuaci\u00f3n de un partido deportivo. Juega en pantalla. Puedes encontrar inspiraci\u00f3n en algunas de las capas incluidas con mimoLive. Para trabajar con mimoLive, las Composiciones de cuarzo deben contener ciertos elementos para que mimoLive y la capa puedan hablar entre s\u00ed y para que la capa pueda mostrar los archivos multimedia que mimoLive le env\u00eda. En teor\u00eda, cualquiera puede crear sus propias capas. Esta p\u00e1gina describe a nivel t\u00e9cnico c\u00f3mo crear capas utilizando Quartz Composer.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"purchasing-a-custom-layer\">Comprar una capa personalizada<\/h3>\n\n\n\n<p>Si no desea profundizar en Quartz Composer por s\u00ed mismo, d\u00e9jenos hacerlo por usted. Tenemos una amplia experiencia en la creaci\u00f3n de capas para mimoLive, incluida la visualizaci\u00f3n de datos como gr\u00e1ficos de acciones, que puede aprovechar para crear la capa adecuada para usted. Por favor, <a href=\"https:\/\/boinx.com\/contact\/\" target=\"_blank\" rel=\"noreferrer noopener\">p\u00f3ngase en contacto con el departamento comercial<\/a> para m\u00e1s detalles.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"creating-a-custom-layer---getting-started\">Creaci\u00f3n de una capa personalizada - Primeros pasos<\/h3>\n\n\n\n<p><a href=\"https:\/\/www.youtube.com\/watch?v=JudWtmnDTbE\" target=\"_blank\" rel=\"noreferrer noopener\">Masterclass Capas de codificaci\u00f3n para mimoLive<\/a><\/p>\n\n\n\n<h4 class=\"wp-block-heading\" id=\"pre-requisitions\">Pre-Requisiciones<\/h4>\n\n\n\n<p>Hay algunos requisitos previos antes de que puedas empezar a desarrollar capas para mimoLive:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Necesitas tener una licencia v\u00e1lida de mimoLive para probar y ejecutar tus capas en mimoLive.<\/li>\n\n\n\n<li>Necesitas tener instalada la aplicaci\u00f3n Quartz Composer de Apple. Es una herramienta de desarrollo gratuita que puedes descargar en la web de desarrolladores de Apple. Sin embargo, primero tendr\u00e1s que registrarte como desarrollador Mac (http:\/\/developer.apple.com). Aqu\u00ed puedes encontrar <a href=\"https:\/\/developer.apple.com\/library\/mac\/#documentation\/graphicsimaging\/conceptual\/QuartzComposerUserGuide\/qc_intro\/qc_intro.html\" target=\"_blank\" rel=\"noreferrer noopener\">Gu\u00eda del usuario de Quartz Composer<\/a> por Apple.<\/li>\n\n\n\n<li><a href=\"https:\/\/github.com\/boinx\/QCLua\" target=\"_blank\" rel=\"noreferrer noopener\">Parche Lua<\/a> - Necesitar\u00e1 el parche Lua para abrir capas mimoLive en Quartz Composer a partir de mimoLive 1.9. Es de c\u00f3digo abierto y est\u00e1 disponible en GitHub. Utilizamos este parche como sustituto del parche JavaScript de QuartzComposer porque no funciona de forma estable en mimoLive. (Descargue el parche desde aqu\u00ed:<a href=\"https:\/\/github.com\/boinx\/QCLua\/releases\" target=\"_blank\" rel=\"noreferrer noopener\">[https:\/\/github.com\/boinx\/QCLua\/releases<\/a> )<\/li>\n\n\n\n<li><a href=\"https:\/\/github.com\/boinx\/QCJSON\" target=\"_blank\" rel=\"noreferrer noopener\"><span class=\"caps\">JSON<\/span> Parche<\/a> y <a href=\"https:\/\/github.com\/boinx\/QCOAuth\" target=\"_blank\" rel=\"noreferrer noopener\">Parche OAuth<\/a> - Hay dos parches personalizados m\u00e1s que actualmente s\u00f3lo se utilizan en la capa de Twitter. Al personalizar la capa de Twitter, deber\u00e1 descargar e instalar los parches antes de empezar a editar.<\/li>\n<\/ul>\n\n\n\n<h4 class=\"wp-block-heading\" id=\"blank-layer-template\">Plantilla de capas en blanco<br>Puede utilizar nuestro archivo gratuito Quartz Composition como punto de partida para sus capas personalizadas. Contiene un conjunto b\u00e1sico de entradas y salidas y las propiedades necesarias que debe cambiar en el cuadro de di\u00e1logo \"Editar informaci\u00f3n\" de Quartz Composer.<\/h4>\n\n\n\n<p><a href=\"http:\/\/boinx.com\/software\/mimolive\/layers\/layer_template.zip\" target=\"_blank\" rel=\"noreferrer noopener\">Descargar Plantilla de capas v1.0<\/a><\/p>\n\n\n\n<h4 class=\"wp-block-heading\" id=\"the-hello-world-example\">El ejemplo de Hola-Mundo<\/h4>\n\n\n\n<p>Como primer y sencillo ejemplo vamos a crear una Composici\u00f3n de Cuarzo b\u00e1sica y utilizarla como capa en mimoLive.<\/p>\n\n\n\n<ol class=\"wp-block-list\">\n<li>Iniciar la aplicaci\u00f3n Quartz Composer<\/li>\n\n\n\n<li>Elija <b>Archivo \u21e2 Nuevo espacio en blanco<\/b> en la barra de men\u00fa. Obtendr\u00e1 un nuevo documento vac\u00edo de Quartz Composer.<\/li>\n\n\n\n<li>Abra la Biblioteca de Parches con el bot\u00f3n de la esquina superior izquierda. Aparecer\u00e1 una peque\u00f1a ventana con una lista de todos los patches de Quartz Composer.<\/li>\n\n\n\n<li>En la Biblioteca de Parches, busque el parche llamado Cartelera. Puede hacerlo r\u00e1pidamente tecleando algunas letras iniciales del nombre del patch en el campo de b\u00fasqueda de la parte inferior de la ventana de la Biblioteca de Patches. Este es un parche de renderizado. Dibuja una imagen plana en la pantalla de salida.<\/li>\n\n\n\n<li>Arrastra el parche desde la biblioteca a la ventana en blanco de tu editor. El patch se pegar\u00e1 all\u00ed donde lo dejes. Puedes moverlo haciendo clic y arrastr\u00e1ndolo. Nota: El patch tiene varias entradas que est\u00e1n marcadas con un punto de conexi\u00f3n a la izquierda de cada valor.<\/li>\n\n\n\n<li>Ahora busque el parche Imagen con cadena en la biblioteca de parches y arr\u00e1strelo a la ventana del editor. Col\u00f3calo a la derecha del parche Billboard. El parche Imagen con Cadena es un parche Generador que generar\u00e1 una imagen que contiene un texto que puedes especificar con el valor de entrada Cadena.<\/li>\n\n\n\n<li>Conecte la salida Imagen del parche Imagen con cadena con la entrada Imagen del parche Cartelera.<\/li>\n\n\n\n<li>Si el Visor de Quartz Composer no est\u00e1 visible en este momento, haga clic en el bot\u00f3n Visor en la esquina superior derecha. Deber\u00eda ver una ventana con un tablero de ajedrez en el fondo y \"\u00a1Hola Mundo!\" en letras blancas encima.<\/li>\n\n\n\n<li>Vuelva a la ventana del Editor y haga clic con el bot\u00f3n derecho del rat\u00f3n en el parche Imagen con cadena para que aparezca un men\u00fa contextual.<\/li>\n\n\n\n<li>Seleccione <b>Insertar divisor de entrada \u21e2 Cadena<\/b> de ese men\u00fa contextual. Aparecer\u00e1 en el documento un nuevo parche de tipo Splitter de entrada que est\u00e1 conectado por su salida a la Cadena de entrada del parche Imagen con cadena.<\/li>\n\n\n\n<li>De nuevo, haz clic con el bot\u00f3n derecho del rat\u00f3n en este divisor de entrada reci\u00e9n creado y selecciona <b>Publicar entradas \u21e2 Entrada<\/b>. Aparecer\u00e1 un cuadro de texto preguntando por el nombre de esta entrada publicada. C\u00e1mbielo a Mi texto. Tenga en cuenta que esta entrada publicada es visible para mimoLive y se presentar\u00e1 en la vista de par\u00e1metros de la izquierda cuando se seleccione la capa en mimoLive.<\/li>\n\n\n\n<li>Abra la hoja de informaci\u00f3n sobre la composici\u00f3n seleccionando <b>Editor \u21e2 Editar informaci\u00f3n...<\/b>. Obtendr\u00e1 una hoja con una lista de pares clave-valor.<\/li>\n\n\n\n<li>A\u00f1ada una nueva clave haciendo clic en el bot\u00f3n + de la parte inferior izquierda. Aparecer\u00e1 una nueva l\u00ednea en la lista solicitando un nombre para la clave.<\/li>\n\n\n\n<li>Introduzca tv_LayerProtocolVersion como valor <b>Propiedad<\/b>cambie el <b>Clase<\/b> de ''Cadena'' a ''N\u00famero'' y poner un ''1'' en la opci\u00f3n <b>Valor<\/b> columna.<\/li>\n\n\n\n<li>Haga clic en el bot\u00f3n <b>Hecho<\/b> en la esquina inferior izquierda para cerrar la hoja.<\/li>\n\n\n\n<li>Guarde esta composici\u00f3n en su Escritorio con el nombre Hola Mundo.qtz<\/li>\n\n\n\n<li>Inicia mimoLive, a\u00fan no crees ning\u00fan documento.<\/li>\n\n\n\n<li>Seleccione <b>Archivo \u21e2 Importar composiciones de capas...<\/b> de la barra de men\u00fas. Aparecer\u00e1 un cuadro de di\u00e1logo de selecci\u00f3n de archivos. Seleccione el archivo Hello World.qtz previamente guardado en el Escritorio.<\/li>\n\n\n\n<li>Ahora cree un nuevo documento mimoLive con <b>Archivo \u21e2 Nuevo...<\/b>. Aparecer\u00e1 el selector de plantillas de mimoLive.<\/li>\n\n\n\n<li>Selecciona la plantilla Blank y pulsa el bot\u00f3n Choose en la esquina inferior derecha. Aparecer\u00e1 una nueva ventana de Documento mimoLive que contendr\u00e1 una \u00fanica capa Placer que te representar\u00e1 sentado delante de tu ordenador.<\/li>\n\n\n\n<li>Abra el Dep\u00f3sito de capas haciendo clic en el bot\u00f3n \"+\" situado en la esquina superior derecha de la columna Capas.<\/li>\n\n\n\n<li>Busque la capa Hola Mundo que acaba de importar y arrastre una instancia a la parte superior de la pila de capas en el centro del documento.<\/li>\n\n\n\n<li>Encuentre su entrada autodefinida llamada Mi Texto y cambie el texto del campo de entrada.<\/li>\n\n\n\n<li>Tras hacer clic en el bot\u00f3n Live de esa capa, tu texto aparecer\u00e1 sobre el v\u00eddeo.<\/li>\n<\/ol>\n\n\n\n<p>\u00a1Enhorabuena! \u00a1Acabas de crear una nueva capa mimoLive! En las siguientes secciones entraremos en los detalles necesarios para ser un buen ciudadano de mimoLive.<\/p>\n\n\n\n<p>Por favor, tenga en cuenta que no podemos explicar c\u00f3mo utilizar Quartz Composer Editor con todo detalle en esta documentaci\u00f3n. Si desea obtener m\u00e1s informaci\u00f3n sobre Quartz Composer, lea la Gu\u00eda del usuario de Quartz Composer en el sitio web para desarrolladores de Apple.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Manejo de capas en mimoLive<\/h3>\n\n\n\n<h4 class=\"wp-block-heading\" id=\"exporting-a-layer-from-mimolive\">Exportar una capa desde mimoLive<\/h4>\n\n\n\n<p>Si quieres cambiar una capa incorporada en mimoLive, puedes exportar esa capa en mimoLive siguiendo los siguientes pasos:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Abra el repositorio de capas con el bot\u00f3n \"+\" situado en la esquina superior derecha de la columna Capas.<\/li>\n\n\n\n<li>Busque y seleccione la capa que desea utilizar como base para su nueva capa.<\/li>\n\n\n\n<li>Abra el men\u00fa contextual haciendo clic con el bot\u00f3n derecho en esa capa.<\/li>\n\n\n\n<li>Seleccione <b>Exportar composici\u00f3n de capas...<\/b> en ese men\u00fa contextual.<\/li>\n\n\n\n<li>Se le pedir\u00e1 que introduzca un nombre de archivo y que establezca una ubicaci\u00f3n donde guardar la capa.<\/li>\n<\/ul>\n\n\n\n<h4 class=\"wp-block-heading\" id=\"importing-a-layer-in-mimolive\">Importar una capa en mimoLive<\/h4>\n\n\n\n<p>Una vez que haya terminado de editar o crear su capa personalizada, tiene que importar su capa a mimoLive. Hay varias formas de importar una capa a mimoLive:<\/p>\n\n\n\n<h5 class=\"wp-block-heading\">Importar una capa con el men\u00fa Archivo<\/h5>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Seleccione Archivo \u21e2 Importar composiciones de capas....<\/li>\n\n\n\n<li>Aparecer\u00e1 un cuadro de di\u00e1logo de selecci\u00f3n de archivos.<\/li>\n\n\n\n<li>Seleccione su archivo QuartzComposition y pulse \"Importar\".<\/li>\n<\/ul>\n\n\n\n<h5 class=\"wp-block-heading\">Importar una capa utilizando la extensi\u00f3n de nombre de archivo \".tvlayer\"<\/h5>\n\n\n\n<p>Esta t\u00e9cnica es \u00fatil cuando se env\u00edan capas personalizadas a otros usuarios de mimoLive (por ejemplo, sus clientes) que no est\u00e1n familiarizados con la importaci\u00f3n manual de capas personalizadas. Sin embargo, no es muy \u00fatil durante el desarrollo, porque QuartzComposer no abrir\u00e1 el archivo al cambiar la extensi\u00f3n del mismo.<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Busca tu composici\u00f3n en Finder.<\/li>\n\n\n\n<li>Pulse una vez sobre el nombre del archivo para cambiarlo. Un recuadro alrededor del nombre del fichero indica que est\u00e1 a punto de cambiarlo.<\/li>\n\n\n\n<li>A\u00f1ade la extensi\u00f3n .tvlayer al final y pulsa Retorno. El Finder te preguntar\u00e1 si realmente quieres cambiar la extensi\u00f3n. Acepte.<\/li>\n\n\n\n<li>Haga doble clic en el archivo de composici\u00f3n. Ahora mimoLive abrir\u00e1 e importar\u00e1 el archivo como nueva capa autom\u00e1ticamente. Se le notificar\u00e1 con una alerta en caso de \u00e9xito.<\/li>\n<\/ul>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"custom-layer-api\">Capa personalizada <span class=\"caps\">API<\/span><\/h3>\n\n\n\n<p>mimoLive esperan que las Composiciones de cuarzo adopten el <a href=\"https:\/\/mimolive.com\/es\/manual-del-usuario\/custom-layer-api\/\">Capa personalizada <span class=\"caps\">API<\/span><\/a>. En esta secci\u00f3n aprender\u00e1s la implementaci\u00f3n m\u00ednima.<\/p>\n\n\n\n<h4 class=\"wp-block-heading\" id=\"minimal-implementation\">Aplicaci\u00f3n m\u00ednima<\/h4>\n\n\n\n<p>La implementaci\u00f3n m\u00ednima del protocolo de capas implica \u00fanicamente las propiedades de composici\u00f3n de Quartz, que pueden editarse en el editor de Quartz Composer seleccionando <b>Editor \u21e2 Editar informaci\u00f3n (\u2325\u2318I)<\/b>.<\/p>\n\n\n\n<figure class=\"wp-block-table\"><table><tbody><tr><th>Nombre<\/th><th>Tipo<\/th><th>Valor de la muestra<\/th><\/tr><tr><td>tv_LayerProtocolVersion<\/td><td>N\u00famero (real)<\/td><td>1.2<\/td><\/tr><tr><td>tv_LayerIdentifier<\/td><td>Cadena<\/td><td>com.example.layer.mylayer<\/td><\/tr><tr><td>tv_LayerVersion<\/td><td>N\u00famero (real)<\/td><td>1.01<\/td><\/tr><\/tbody><\/table><\/figure>\n\n\n\n<p>Es importante saber c\u00f3mo utiliza mimoLive esos valores para que mimoLive pueda gestionar los conflictos de versi\u00f3n de capa.<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>tv_LayerProtocolVersion: Cada vez que cambiemos el protocolo de capa vamos a aumentar la versi\u00f3n del protocolo de capa. Con esto las versiones antiguas de mimoLive son capaces de decirle al usuario si se utiliza una capa (por ejemplo, almacenada en un documento mimoLive) que tiene una versi\u00f3n de protocolo m\u00e1s reciente y por lo tanto puede no ser tratada correctamente por mimoLive.<\/li>\n\n\n\n<li>tv_LayerIdentifier: Este valor debe ser un valor \u00fanico para cada una de tus capas. Nuestras capas tienen el prefijo com.boinx.layer.*. Por favor, utilice su propio esquema para tener identificadores \u00fanicos en todo el mundo. Tenga en cuenta que mimoLive no utiliza el nombre de archivo para comparar capas.<\/li>\n\n\n\n<li>tv_LayerVersion: Si mimoLive encuentra la versi\u00f3n de capa diferente para una capa que est\u00e1 almacenada en un documento a la capa que est\u00e1 instalada en el repositorio de capas utiliza las siguientes reglas para decidir qu\u00e9 hacer:<br>- Si la versi\u00f3n de la capa del documento es superior a la del repositorio: mantenga la versi\u00f3n del documento<br>- Si la versi\u00f3n de la capa de documentos es menor que la del repositorio, pero con el mismo n\u00famero mayor (por ejemplo, 2.4 frente a 2.6), sustituya la capa de documentos por la nueva.<br>Si el n\u00famero mayor de la versi\u00f3n de la capa es diferente, mimoLive tratar\u00e1 la capa como un reemplazo incompatible y no actualizar\u00e1 la capa del documento.<\/li>\n<\/ul>\n\n\n\n<p>Ampliaciones de los bienes comunes<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>derechos de autor:<\/li>\n\n\n\n<li>descripci\u00f3n:<\/li>\n\n\n\n<li>nombre:<\/li>\n\n\n\n<li>tv_Tagline:<\/li>\n<\/ul>","protected":false},"excerpt":{"rendered":"<p>mimoLive can be customized by adding new layers. The real power of layers lies in the fact that they are actually made with a MacOS X technology called Quartz Composer. Almost anything is possible with Quartz Compositions. You can create interactive TV shows where your audience can send in SMS or twitter messages which are [&hellip;]<\/p>","protected":false},"author":3,"featured_media":0,"parent":0,"menu_order":8,"template":"","meta":{"_acf_changed":false,"_angie_page":false,"_lmt_disableupdate":"no","_lmt_disable":"","footnotes":""},"categories":[258],"tags":[],"class_list":["post-32482","user-manual","type-user-manual","status-publish","hentry","category-manual"],"acf":[],"_links":{"self":[{"href":"https:\/\/mimolive.com\/es\/wp-json\/wp\/v2\/user-manual\/32482","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/mimolive.com\/es\/wp-json\/wp\/v2\/user-manual"}],"about":[{"href":"https:\/\/mimolive.com\/es\/wp-json\/wp\/v2\/types\/user-manual"}],"author":[{"embeddable":true,"href":"https:\/\/mimolive.com\/es\/wp-json\/wp\/v2\/users\/3"}],"version-history":[{"count":1,"href":"https:\/\/mimolive.com\/es\/wp-json\/wp\/v2\/user-manual\/32482\/revisions"}],"predecessor-version":[{"id":40923,"href":"https:\/\/mimolive.com\/es\/wp-json\/wp\/v2\/user-manual\/32482\/revisions\/40923"}],"wp:attachment":[{"href":"https:\/\/mimolive.com\/es\/wp-json\/wp\/v2\/media?parent=32482"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/mimolive.com\/es\/wp-json\/wp\/v2\/categories?post=32482"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/mimolive.com\/es\/wp-json\/wp\/v2\/tags?post=32482"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}