umix

️ Descargo de responsabilidad de seguridad : no utilizar en producción. Este es un software experimental. ¿Aquí hay dragones?

umix.dev

Umix es una extensión de navegador y una herramienta de desarrollo para remezclar sitios web. Hagamos que la web sea divertida.

Si solo está interesado en probarlo, visite nuestro área de juegos Repl.it. O mira nuestro vídeo.

Continúe si desea utilizarlo en sitios web del mundo real.

Umix como extensión del navegador

Nota: Umix está pendiente de aprobación en Chrome Extension Store. Por ahora, puedes integrarlo manualmente a través del Modo Desarrollador. Actualmente solo admitimos los navegadores Chrome y Chromium (Edge, Arc, Brave, Opera, etc.)

1. Haga clic para descargar el proyecto ZIP
2. Descomprima umix-master.zip .
3. Escriba chrome://extensions en la barra de direcciones URL
4. Activar el modo desarrollador

5. Haga clic en Cargar desempaquetado

6. Seleccione la carpeta umix-master
7. Ganancia.

Umix como herramienta de desarrollo

Simplemente coloque una etiqueta <script> al final de su cuerpo... es así de fácil: sin peculiaridades, sin API externa, solo la bondad de la IA al alcance de su mano.

 < script src = "https://umix.dev/lib.js" > < / script > 

Inspiración

La Web es aburrida.

Tableros monótonos. Interfaces idénticas. Todas las aplicaciones tienen el mismo aspecto.

La Web debería ser divertida.

Nuestros primeros recuerdos, amigos e identidades se crearon en la web. Inmersos en los chats de IRC, en el CSS personalizado de MySpace y en documentos aleatorios de Wikipedia, encontramos un hogar, un hogar en una comunidad de personas que también encontraban divertida la Web.

Si bien la Web ha madurado en los últimos dos años, hay un encanto innegable en su pasado más pirateable y divertido.

que hace

Remezcla la web. Umix es una extensión del navegador y una herramienta de desarrollo que permite a los usuarios de Internet remezclar, reimaginar y compartir interfaces web fácilmente.

Imagina poder desplazarte sobre cualquier parte de la página, pedirle a una IA que la cambie según tus deseos y ver tu creación en vivo: eso es Umix.

Cómo lo construimos

En el frontend, creamos una extensión de Chrome que atraviesa el DOM en memoria y actualiza el HTML en función de la respuesta de nuestro backend.

En el backend, tenemos un servidor Node.js que maneja las solicitudes del frontend. Equipamos GPT-4 con un navegador web, para que pueda navegar por sitios web y buscar contenido cuando no está seguro de qué hacer. Esto sucede varias veces, lo que nos permite obtener información en vivo desde la web.

Finalmente, creamos una herramienta para desarrolladores que permite a cualquier desarrollador web integrar Umix como una biblioteca de JavaScript. Esto permite a los desarrolladores habilitar experiencias de remezcla nativas en sus propios sitios web.

Desafíos que encontramos

• La falta de confiabilidad de los LLM (GPT-4 alucinó (inventó cosas) varias veces o no sabía la respuesta a varias preguntas durante las pruebas), no pudimos construir directamente sobre OpenAI y necesitábamos conectar GPT-4 a otras herramientas. Lo conectamos a un navegador web usando langchain.js y le pedimos que buscara información/documentación objetiva para herramientas de sitios web si no estaba seguro de la respuesta.
• La estructura DOM es difícil : tuvimos que lidiar con formas de manejar elementos envolventes, atributos excesivos y clases primordiales.
• Diseñar la interfaz de usuario : crear una interfaz de usuario muy intuitiva, especialmente para uso en remezclas, es extremadamente difícil. Finalmente llegamos a un enfoque muy similar a la herramienta de selección de v0.dev.
• Diversión CSR/CORS + Devtool : crear una herramienta de desarrollo segura y robusta y una extensión de Chrome, al tiempo que se garantiza que se cumplan los requisitos de seguridad, requirió muchas horas arduas de llanto.

¿Qué sigue para Umix?

Hicimos una pequeña publicación de demostración en Twitter (X) hace 12 horas y ha sido vista más de 25.000 veces .

Ya tenemos 80 personas en nuestra lista de espera (a las 4 am)

Es hora de hacer que la Web sea divertida. Juntos podemos remezclar la web.