Compartir proyecto

La función Compartir proyecto te permite crear enlaces seguros, protegidos con contraseña, para compartir tu proyecto con clientes, miembros del equipo o interesados. Puedes personalizar qué se incluye en lo compartido (informes, planes de red), establecer fechas de expiración, añadir branding personalizado y hacer seguimiento con estadísticas detalladas sobre cómo se visualizan tus proyectos compartidos. Además, puedes incrustar tus proyectos compartidos en tu propio sitio web usando un archivo HTML sencillo.

Cuándo usar esta función

• Cuando necesitas compartir tu proyecto con clientes para revisión y comentarios
• Al colaborar con miembros del equipo que no tienen acceso a tu cuenta
• Al presentar propuestas y diseños de proyectos a los interesados
• Cuando quieres rastrear cómo se visualizan tus proyectos compartidos
• Cuando necesitas incrustar la vista previa del proyecto en el sitio web de tu empresa
• Cuando quieres controlar el acceso con contraseñas y fechas de expiración
• Cuando necesitas personalizar la apariencia con el branding de tu empresa

Apertura de la ventana modal de compartir

Para acceder a la funcionalidad de compartir:

1. Haz clic en el menú Share en la barra de herramientas izquierda.
2. Se abrirá la ventana modal de compartir mostrando tu lista de enlaces para compartir activos.
3. Haz clic en New Share para crear un nuevo enlace para compartir.

Lista de enlaces para compartir activos

La vista principal muestra una tabla con todos tus enlaces activos para compartir con la siguiente información:

• Link – Botón Copy para copiar rápidamente la URL de compartición al portapapeles
• Created – Fecha y hora en que se creó el enlace
• Valid Until – Fecha de expiración del enlace (los enlaces expirados se marcan con una insignia)
• Views – Número total de veces que se ha visualizado el enlace
• Actions – Botón de estadísticas y botón de eliminar

Acciones rápidas

• Copy Link – Haz clic en el botón de copiar junto a cualquier enlace para copiar su URL al portapapeles
• View Statistics – Haz clic en el icono de estadísticas (gráfico de barras) para ver estadísticas de visualización detalladas
• Delete Share – Haz clic en el icono de papelera para eliminar permanentemente un enlace y todas sus estadísticas

Creación de un nuevo enlace para compartir

Cuando haces clic en New Share, verás un formulario con tres secciones principales para configurar tu enlace.

Incluir en el enlace para compartir

Esta sección controla qué contenido se incluye en el proyecto compartido:

Informe

Elige qué tipo de informe (si corresponde) estará disponible en el enlace:

• None – Sin funcionalidad de informe disponible
• Simple Report – Informe creado con 'Simple Report' habilitado
• Document Creator – Informe creado con 'Document Creator' habilitado

Plan de red

Activa o desactiva esta opción para incluir o excluir el diagrama del plan de red en el proyecto compartido. Cuando está habilitado, los usuarios podrán acceder y ver el diagrama de topología de red.

Seguridad y validez

Esta sección controla la seguridad de acceso y la expiración del enlace:

Contraseña de acceso

• Password – Establece una contraseña (mínimo 4 caracteres) que los usuarios deberán introducir para acceder al proyecto compartido
• El campo de contraseña incluye un conmutador para mostrar/ocultar la contraseña mientras escribes
• La contraseña es obligatoria y debe tener al menos 4 caracteres

Válido durante

• Days – Establece cuántos días permanecerá activo el enlace (1-30 días)
• Después de la fecha de caducidad, el enlace ya no será accesible
• Los enlaces caducados se marcan automáticamente en la lista de enlaces

Branding

Personaliza la apariencia del proyecto compartido con el branding de tu empresa:

Color de acento

• Elige un color de acento personalizado que se usará en toda la interfaz del proyecto compartido
• El selector de color te permite elegir cualquier color para mantener la consistencia de marca

Logotipo

• Upload Logo – Haz clic en el botón de carga para añadir el logotipo de tu empresa
• Logo Preview – Una vez cargado, verás una vista previa de tu logotipo
• Remove Logo – Haz clic en el botón X de la vista previa del logotipo para eliminarlo
• Formatos compatibles: PNG, JPEG (máx. 2 MB)

Los ajustes de branding se aplican automáticamente al proyecto compartido, otorgándole una apariencia profesional y alineada con tu marca para tus clientes.

Estadísticas

Para cada enlace, puedes ver estadísticas detalladas sobre cómo se está visualizando:

Visualización de estadísticas

Haz clic en el icono de estadísticas (gráfico de barras) junto a cualquier enlace para abrir la ventana modal de estadísticas. La tabla de estadísticas muestra:

• Date – Cuándo comenzó cada sesión de visualización
• Source – Si el usuario accedió desde un dispositivo móvil o de escritorio
• Time Spent – Tiempo total dedicado a ver el proyecto en esa sesión
• Views – Número de veces que se vio el proyecto en esa sesión
• Report Views – Número de veces que se abrió el informe
• Network Plan Views – Número de veces que se visualizó el plan de red

Las estadísticas se rastrean por sesión, por lo que puedes ver información detallada sobre cada persona que visualiza tu proyecto compartido.

Incrustar en tu sitio web

Puedes incrustar tus proyectos compartidos directamente en tu propio sitio web, permitiendo que los clientes vean los proyectos sin salir de tu sitio. Esto crea una experiencia fluida y con tu marca.

Uso de preview.html

Se proporciona un archivo HTML mínimo (preview.html) que puedes subir a tu sitio web. Este archivo crea un iframe que muestra tu proyecto compartido.

Instrucciones de configuración

1. Descarga o copia el archivo preview.html
2. Súbelo al directorio público de tu sitio web
3. Enlázalo utilizando el ID de tu enlace para compartir como parámetro

Código

Aquí está el archivo preview.html completo:

<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Project Preview</title>
    <style>
      * {
        margin: 0;
        padding: 0;
        box-sizing: border-box;
      }
      html,
      body {
        width: 100%;
        height: 100%;
        overflow: hidden;
      }
      iframe {
        width: 100%;
        height: 100vh;
        border: none;
        display: block;
      }
    </style>
  </head>
  <body>
    <iframe id="frame" src="" allow="fullscreen" allowfullscreen></iframe>
    <script>
      const p = new URLSearchParams(window.location.search).get("p");
      if (p)
        document.getElementById("frame").src =
          "https://app.cctvdesigntool.com/share/" + p;
    </script>
  </body>
</html>

Uso

Una vez cargado en tu sitio web, utilízalo así:

https://yourwebsite.com/preview.html?p=<share_id>

Sustituye <share_id> por el ID real de tu enlace para compartir. Por ejemplo, si tu enlace es:

https://app.cctvdesigntool.com/share/123e4567-e89b-12d3-a456-426614174000

Entonces tu URL de incrustación sería:

https://yourwebsite.com/preview.html?p=123e4567-e89b-12d3-a456-426614174000

Beneficios

• Integración perfecta – Los proyectos aparecen directamente en tu sitio web
• Experiencia de marca – Mantiene el dominio y el branding de tu sitio web
• Sin redirecciones – Los usuarios permanecen en tu sitio
• Funcionalidad completa – Todas las funciones del enlace funcionan dentro del iframe
• Adaptable – Funciona en todos los dispositivos y tamaños de pantalla

El iframe cargará automáticamente el proyecto compartido y lo mostrará a pantalla completa, ofreciendo a tus clientes una experiencia de visualización profesional e integrada.

Consejos

• Utiliza contraseñas fuertes y únicas para cada enlace para mantener la seguridad
• Establece fechas de expiración apropiadas según los plazos del proyecto
• Habilita informes y planes de red solo cuando sea necesario para mantener el enfoque
• Revisa regularmente las estadísticas para ver cómo se visualizan tus proyectos compartidos
• Usa el branding para mantener una apariencia profesional y coherencia de marca
• Incrusta los enlaces en tu sitio web para una experiencia fluida para el cliente
• Elimina los enlaces caducados o no usados para mantener organizada tu lista
• Copia los enlaces para compartir inmediatamente después de crearlos para guardarlos para uso posterior
• La configuración de idioma se guarda automáticamente con cada enlace, de modo que los usuarios verán el proyecto en el idioma que estabas usando al crear el enlace
• Las estadísticas registran cada sesión de visualización por separado, para que puedas ver patrones de interacción individuales

Temas relacionados

• Exportar a PDF/JPG
• Plan de red
• Versiones Free / Premium / Enterprise