Un recorrido por la página del proyecto
Cada sitio, app o dashboard que creas en Briks tiene su propia página de proyecto. Ahí hablas con Briks, ves cómo cambia el sitio y accedes a todo lo demás del proyecto. Este recorrido la repasa una vez, para que sepas para qué sirve cada parte antes de necesitarla.
- 1Dónde estás: Projects, después el nombre del proyecto, con su dirección en una pantalla ancha. Debajo, las pestañas del proyecto con nombre: Studio, Analytics, Media, Database (cuando el proyecto tiene una y, antes, para Owners y Admins), Storage, Chatbot y Settings.
- 2La conversación. Pide un cambio o haz una pregunta con palabras sencillas.
- 3La vista previa de tu sitio, actualizada tras cada publicación.
- 4Herramientas de vista previa: el ancho con el que verla, recargar, pantalla completa y abrir en una pestaña nueva.
- 5Publish lleva el sitio a producción cuando estés listo.
Abrir un proyecto
Haz clic en Projects en la barra lateral y luego en el proyecto que quieras. Tus últimos proyectos también aparecen bajo Projects en la propia barra lateral, cada uno con un punto de estado, para que puedas ir directo a uno. Un proyecto siempre se abre en su pestaña Studio: la conversación y la vista previa, una junto a otra.
En un portátil o un ordenador de escritorio, ambos van uno al lado del otro. En una pantalla estrecha, como la de un móvil, primero va la conversación y la vista previa queda debajo.
La barra superior
La barra superior indica dónde estás. En la pestaña Studio muestra Projects y el nombre del proyecto. En cualquier otra pestaña sigue el nombre de la pestaña y, después, cualquier sección o vista que hayas abierto dentro de ella, por ejemplo Projects / Crumb & Co bakery / Settings / Domain. Cada parte anterior a la última es un enlace para volver a ella. En una pantalla ancha, la dirección en vivo del proyecto aparece junto a su nombre y abre el sitio en una pestaña nueva.
Debajo de esa línea hay una fila de pestañas con texto, con la abierta subrayada. En un teléfono la fila se desplaza hacia los lados, y la línea de arriba solo muestra el nombre del proyecto.
| Pestaña | Qué contiene | Leer más |
|---|---|---|
| Studio | La conversación y la vista previa. Aquí van los cambios y las preguntas. | Hacer cambios |
| Visual Editor | Tu propia página junto a un panel: haz clic en cualquier elemento para cambiar sus textos, imágenes y aspecto, y publica sin gastar créditos. Viene con los planes de pago. | Editor visual |
| Analytics | Visitantes, páginas y de dónde llegaron, en una vista Data y una vista Settings. | Analytics |
| Marketing | Publicaciones para las cuentas sociales del sitio. La pestaña aparece cuando la publicación está abierta en Briks. | Marketing y publicaciones en redes sociales |
| Media | Cada imagen y vídeo que muestra el sitio tal como se publicó por última vez, cada uno con Replace. | Biblioteca de medios |
| Database | Lo que almacena el sitio, colección por colección. Aparece cuando el proyecto tiene una base de datos y, antes de eso, solo para Owners y Admins, para que puedan crear una. | Base de datos |
| Almacenamiento | Los archivos que guarda el proyecto, para sus páginas y para ti, en las vistas Files, Usage y Settings. | Storage |
| Chatbot | Un chat para el sitio publicado que responde con sus propias páginas y pasa lo que no sabe responder. | Chatbot |
| Settings | Todo lo demás: el nombre y las marcas del proyecto, su dominio, formularios, chats, correo, versiones, copias de seguridad y herramientas para desarrolladores. | Ver abajo |
En el extremo derecho de la barra, una vez que el sitio se ha publicado por primera vez, verás una etiqueta gris Preview y un botón Publish. Cada versión llega primero a una dirección de vista previa. Se mantiene fuera de los buscadores, y los mensajes enviados desde sus formularios se guardan en el estudio en lugar de enviarse por correo. Publish ejecuta una revisión previa al lanzamiento y, si no hay nada que corregir, lleva el sitio a producción. Después, el botón dice In production, y al hacer clic te ofrece Back to preview.
La conversación
El lado izquierdo es una conversación continua entre tú y Briks. Tus mensajes están a la derecha en burbujas oscuras y las respuestas de Briks a la izquierda. Debajo de cada respuesta hay una línea pequeña con los créditos que costó esa petición y cuánto tardó, más o menos. Encima de la conversación, un indicador de estado muestra en qué punto está el sitio (Draft, Building, Live o Needs attention) y, en cuanto se haya cobrado algo, el total acumulado del proyecto en créditos.
- Ask for a change con palabras sencillas, como
Add our Saturday hours to the footer: 9am to 1pm. Briks lo crea y lo publica. Consulta Hacer cambios. - Ask a question, por ejemplo
¿Cuándo cambió el sitio por última vez?. Briks responde en el hilo sin crear nada. Consulta Hacer preguntas. - Responde las preguntas de Briks antes de una primera construcción, o aprueba sus textos, su aspecto o su hero si esos pasos están activados. Consulta Aprueba mientras se construye.
El cuadro de la parte inferior dice “Change the hero, add a page, adjust the colours…” hasta que escribes. Enter envía, y Shift con Enter inicia una línea nueva. Junto al cuadro hay tres botones: Attach pictures, Add from your media y Speak your request. Debajo hay un interruptor, Check the site after this change, que revisa el sitio publicado en cuatro tamaños de pantalla y repara todo lo que se vea roto. Añade unos minutos, y tu elección se recuerda para ese sitio en tu navegador.
Si tu rol es Viewer, el cuadro se sustituye por una nota: “You can view this project. Changes are made by Editors, Admins and Owners of this workspace.” Sigues viendo toda la conversación y la vista previa.
Mientras algo se está creando
Aparece un panel en la conversación con un temporizador, los pasos por los que pasa el trabajo y una línea debajo que dice qué está haciendo Briks ahora mismo. En un cambio, los pasos son Applying your changes, Verifying build y Publishing, más Checking the published site si activaste la revisión. Junto al temporizador hay un botón Stop. El cuadro sigue abierto y su botón cambia a Queue, así que puedes poner en cola tu siguiente petición mientras termina esta.
La vista previa
El lado derecho es tu sitio real y publicado dentro de un marco. No es una imagen: puedes desplazarte por él, pulsar sus botones y usar su propio menú para moverte entre páginas. La etiqueta de arriba dice Live preview con la hora de la última publicación, y el marco se recarga solo un momento después de cada publicación, así que siempre ves lo que ven los visitantes.
| Control | Qué hace |
|---|---|
| Desktop | Muestra el sitio al ancho completo del marco. |
| Tablet | Lo muestra con 834 píxeles de ancho, enmarcado, como una tableta en vertical. |
| Phone | Lo muestra con 390 píxeles de ancho, como un teléfono típico. |
| La lista de páginas | Aparece cuando el sitio tiene más de una página: elige una página para abrirla en el marco. |
| Flechas de deshacer y rehacer | Vuelve a la versión anterior, o avanza otra vez. Consulta Versions. |
| Versions (el reloj, que muestra el número actual, como v7) | Muestra todas las versiones guardadas, con Make live y Test against live. |
| Reload preview | Vuelve a cargar la página sin esperar a una publicación. |
| Full screen | Da a la vista previa toda la ventana. Pulsa Esc para cerrarla. |
| Open in new tab | Abre el sitio en su propia dirección. |
Antes de la primera publicación aún no hay un sitio que mostrar, así que la vista previa va colocando tu página parte por parte a medida que Briks la planifica y la escribe. Cuando se planifican otras páginas, unas pestañas pequeñas (Home y el nombre de cada página) te permiten ver cada una. Cómo seguir una creación explica esa vista.
La pestaña Settings
Settings reúne todo lo que no tiene su propia pestaña. Se abre en General, con todas las secciones listadas a la izquierda en grupos. En una pantalla estrecha, como un teléfono, la lista se pliega bajo un solo control que dice Settings: y el nombre de la sección abierta. Tócalo para elegir otra.
| Sección | Grupo | Para qué sirve | Leer más |
|---|---|---|---|
| General | Arriba del todo | Nombre, logotipo, favicon, la insignia Built with Briks, Made with Briks, copiar, mover y eliminar. | Ajustes del proyecto |
| Domain | Arriba del todo | La dirección del sitio y tus propios dominios. | Conecta tu dominio |
| Preferences | Arriba del todo | Las reglas que cumple cada creación, de dónde vienen las imágenes, qué hace cada cambio y los sitios web desde los que la página puede cargar contenido. | Ajustes del proyecto |
| Forms | Forms and email | Lo que los visitantes envían a través de los formularios del sitio. | Forms |
| Chats | Forms and email | Todas las conversaciones que los visitantes tuvieron con el chat del sitio en los últimos 90 días, de la más reciente a la más antigua, con Export CSV. | Chatbot |
| Emails | Forms and email | Correo electrónico que el sitio envía a sus visitantes. | Correo del sitio |
| Sign-in y Payments | Accounts and payments | Cómo inician sesión los visitantes de tu sitio y el procesador de pagos con el que cobra el sitio, cada uno con tus propias claves. | Inicio de sesión y pagos |
| Versions | Versions and backups | Todas las versiones que se publicaron, cada una con una forma de restaurarla. | Versiones publicadas |
| Backups | Versions and backups | Todas las versiones del código, listas para restaurar o, con un plan de pago, para descargar. | Backups |
| File Explorer | Developer | El código escrito para el sitio: léelo y edítalo, y descárgalo en un plan de pago. | El código de tu sitio |
| GitHub | Developer | Guarda el código propio del sitio en un repositorio de GitHub, sincronizado en ambos sentidos. | Sincronización con GitHub |
| Secrets | Developer | Claves y contraseñas que lee el propio código del sitio. Una vez guardado, un valor no se puede volver a mostrar. | Secrets |
| Webhooks | Developer | Avisa a otros servicios cuando ocurra algo en el sitio. | Webhooks |
| Deploy hooks | Developer | Direcciones secretas que vuelven a publicar el proyecto cuando algo las llama. | Hooks de despliegue |
| Scheduled tasks | Developer | Llamadas que el proyecto hace según un horario, en tu zona horaria. | Tareas programadas |
| Logs | Developer | Cada construcción, cambio y publicación, y los pasos por los que pasó cada uno. | Logs |
Los enlaces guardados antes de que estas secciones pasaran a Settings, como los de correos antiguos, siguen funcionando: abren aquí la misma sección.
Un primer vistazo, paso a paso
Diez minutos con un proyecto nuevo
Consulta el estado
Dónde: Studio
Mira la etiqueta que hay sobre la conversación. Live significa que la última publicación se completó. Needs attention significa que el último trabajo falló, y la conversación explica el motivo.
Míralo en un móvil
Dónde: Preview toolbar
Haz clic en Phone, recorre toda la página y abre el menú. Casi todo lo que la gente quiere corregir se nota aquí primero.
Recorre las páginas
Dónde: Preview
Usa el menú propio del sitio dentro del marco para visitar cada página, igual que lo haría un visitante.
Abrir las versiones
Dónde: Versions
Haz clic en el icono del reloj con el número de versión. Se enumeran todas las compilaciones y cambios, y la que ven los visitantes está marcada como Live.
Ponle un nombre adecuado
Dónde: Settings, General
Abre la pestaña Settings, que se abre en General. Comprueba el nombre del proyecto, añade tu logo y tu favicon si los tienes, y pulsa Save en Name and marks.
Pide tu primer cambio
Dónde: Studio
De vuelta en Studio, escribe un cambio concreto y pulsa Enter. Observa los pasos y mira la vista previa cuando se recargue.
Publica cuando estés listo
Dónde: Top bar
Pulsa Publish. La revisión de lanzamiento se ejecuta primero y su resultado llega a la conversación.
Qué ve cada rol
| Rol | En la página del proyecto |
|---|---|
| Owner y Admin | Todo, incluido eliminar el proyecto, moverlo a otro espacio de trabajo y cambiar su dirección. |
| Editor | Cambios, preguntas, publicación, versiones, pruebas A/B, el Visual Editor y edición de código. No borrar, mover ni cambiar la dirección. |
| Viewer | La conversación, la vista previa, la lista de versiones y las analíticas, solo de lectura. Sin cuadro de instrucciones, sin registro de Chats, y con el Visual Editor solo para mirar y comentar. |
Los roles pertenecen al espacio de trabajo, no a un proyecto concreto. Miembros y roles incluye la tabla completa.
¿Por qué no hay un botón Publish?
Aparece cuando el sitio se ha publicado por primera vez. Hasta entonces no hay nada que llevar a producción.
¿Por qué no veo la pestaña Database?
Aparece cuando el proyecto tiene una base de datos. Antes, solo la ven los Owners y los Admins, para que puedan crear una. Base de datos explica cómo se crea.
¿Por qué no veo la pestaña Visual Editor?
El editor visual viene con los planes de pago, así que un espacio de trabajo en Free no muestra la pestaña. Un Owner puede cambiar el plan en Billing. Consulta Editor visual.
La vista previa parece desactualizada.
Haz clic en Reload preview. Tras publicar, el marco espera un par de segundos antes de recargar para que la nueva versión esté lista en todas partes.
¿Quién puede detener una compilación?
Editors, Admins y Owners. Detener uno que aún no ha empezado no cuesta nada.