diff --git a/packages/docs/src/assets/images/eyes.png b/packages/docs/src/assets/images/eyes.png
new file mode 100644
index 0000000..7d57178
Binary files /dev/null and b/packages/docs/src/assets/images/eyes.png differ
diff --git a/packages/docs/src/assets/styles/global.css b/packages/docs/src/assets/styles/global.css
index 1ca6d42..6962279 100644
--- a/packages/docs/src/assets/styles/global.css
+++ b/packages/docs/src/assets/styles/global.css
@@ -25,15 +25,15 @@
     }
 
     .slot h1 {
-        @apply my-2 font-semibold text-2xl;
+        @apply my-2 font-semibold text-3xl;
     }
 
     .slot h2 {
-        @apply my-2 font-semibold text-lg;
+        @apply my-2 font-semibold text-xl;
     }
 
     .slot h3 {
-        @apply my-2 font-semibold text-base;
+        @apply my-2 font-semibold text-lg;
     }
 
     .slot code {
diff --git a/packages/docs/src/components/widgets/Features.tsx b/packages/docs/src/components/widgets/Features.tsx
index 87cd099..451211c 100644
--- a/packages/docs/src/components/widgets/Features.tsx
+++ b/packages/docs/src/components/widgets/Features.tsx
@@ -1,6 +1,5 @@
 import { component$ } from '@builder.io/qwik'
 import { IconStar } from '~/components/icons/IconStar'
-import { IconDiscord } from '../icons/IconDiscord'
 
 export default component$(() => {
     const items = [
diff --git a/packages/docs/src/routes/docs/buttons_lists/index.mdx b/packages/docs/src/routes/docs/buttons_lists/index.mdx
deleted file mode 100644
index 915b67e..0000000
--- a/packages/docs/src/routes/docs/buttons_lists/index.mdx
+++ /dev/null
@@ -1,10 +0,0 @@
----
-title: Overview
-contributors:
-    - adamdbradley
-    - steve8708
-    - manucorporat
-    - gabrielgrant
----
-
-# Botones y listas
diff --git a/packages/docs/src/routes/docs/index.mdx b/packages/docs/src/routes/docs/index.mdx
index c6d4b13..e55c23e 100644
--- a/packages/docs/src/routes/docs/index.mdx
+++ b/packages/docs/src/routes/docs/index.mdx
@@ -1,6 +1,6 @@
 import Collaborators from '../../components/widgets/Collaborators'
 
-# Primeros Pasos
+# Vista rápida
 
 Los chatbots son una herramienta poderosa para que las empresas y
 organizaciones comuniquen de forma personalizada y automatizada con sus clientes.
@@ -8,7 +8,7 @@ organizaciones comuniquen de forma personalizada y automatizada con sus clientes
 Está documentación te ayudará a instalar tu bot de whatsapp en simples pasos con el proposito de
 que tengas un chatbot funcional en solo minutos.
 
-### Ejecutar
+## Ejecutar
 
 Es muy sencillo solo deberas ejecutar el siguiente comando 🚀
 
@@ -16,12 +16,21 @@ Es muy sencillo solo deberas ejecutar el siguiente comando 🚀
 npm create bot-whatsapp@latest
 ```
 
-<div class="my-4 w-full">
-    <img
-        class="w-full"
-        src="https://camo.githubusercontent.com/97cd563fb448c72cc50dd60d71e85d269e5b1c738473d56fee6e023e1e0723bb/68747470733a2f2f692e67697068792e636f6d2f6d656469612f6e744d74365476616c70737454497837416b2f67697068792e77656270"
-        alt=""
-    />
+<div class="my-4 w-full ">
+    <video
+        class="rounded drop-shadow-xl rounded  "
+        width="100%"
+        height="100%"
+        autoplay
+        loop
+        muted
+        playsinline
+    >
+        <source
+            src="https://leifer-landing-page.s3.us-east-2.amazonaws.com/console.webm"
+            type="video/webm"
+        />
+    </video>
 </div>
 
-<Collaborators />
+Recuerda que debes de cumplir con los [requisitos minimos](/docs/install) del sistema
diff --git a/packages/docs/src/routes/docs/layout!.tsx b/packages/docs/src/routes/docs/layout!.tsx
index 23dcea5..b3b789c 100644
--- a/packages/docs/src/routes/docs/layout!.tsx
+++ b/packages/docs/src/routes/docs/layout!.tsx
@@ -1,5 +1,6 @@
 import { component$, Slot, useStore } from '@builder.io/qwik'
 import type { DocumentHead } from '@builder.io/qwik-city'
+import Collaborators from '~/components/widgets/Collaborators'
 import Footer from '~/components/widgets/Footer'
 import Header from '~/components/widgets/Header'
 import NavBar from '~/components/widgets/NavBar'
@@ -13,13 +14,29 @@ export default component$(() => {
                 list: [
                     { name: 'Vista rápida', link: '/docs' },
                     { name: 'Instalación', link: '/docs/install' },
-                    { name: 'Configuración', link: '/docs/settings' },
-                    { name: 'Migración', link: '/docs/migration' },
-                    { name: 'Botones y Listas', link: '/docs/buttons_lists' },
-                    { name: 'Avanzado', link: '/docs/advanced' },
-                    { name: 'Contribuidores', link: '/docs/contribuiting' },
+                    { name: 'Configuración', link: '/docs/install' },
+                    { name: 'Ejemplos', link: '/docs/install' },
                 ],
             },
+            {
+                title: 'Conceptos',
+                list: [
+                    { name: 'Flows', link: '/docs' },
+                    { name: 'Proveedores', link: '/docs/install' },
+                    { name: 'Base de datos', link: '/docss' },
+                ],
+            },
+            {
+                title: 'Avanzado',
+                list: [
+                    { name: 'Migración', link: '/docs/migration' },
+                    { name: 'Extender', link: '/docs/migration' },
+                ],
+            },
+            {
+                title: 'Comunidad',
+                list: [{ name: 'Migración', link: '/docs/migration' }],
+            },
         ],
     })
 
@@ -28,11 +45,13 @@ export default component$(() => {
             <Header />
             <main class="container mx-auto px-12 ">
                 <div class={'grid grid-cols-5 gap-1 min-h-min'}>
-                    <div class={'px-3 col-span-1  '}>
+                    <div class={'col-span-1'}>
                         <NavBar options={store.options} />
                     </div>
-                    <div class={'col-span-3 slot pb-5'}>
+                    <div class={'px-3  col-span-3 slot pb-5'}>
                         <Slot />
+
+                        <Collaborators />
                     </div>
                     <div class={'px-3 col-span-1  '}>
                         <NavBar options={store.options} />