https://github.com/marcosd59/chatbot-ui

Este proyecto desarrolla una interfaz de usuario para un chatbot, utilizando HTML, CSS y JavaScript para facilitar su integración en cualquier sitio web.
https://github.com/marcosd59/chatbot-ui

chatbot javascript user-interface-design

Last synced: about 1 month ago
JSON representation

Este proyecto desarrolla una interfaz de usuario para un chatbot, utilizando HTML, CSS y JavaScript para facilitar su integración en cualquier sitio web.

• Host: GitHub
• URL: https://github.com/marcosd59/chatbot-ui
• Owner: marcosd59
• Created: 2024-01-23T19:11:33.000Z (over 2 years ago)
• Default Branch: main
• Last Pushed: 2024-04-18T02:05:00.000Z (about 2 years ago)
• Last Synced: 2025-07-31T15:37:14.170Z (11 months ago)
• Topics: chatbot, javascript, user-interface-design
• Language: CSS
• Homepage:
• Size: 3.29 MB
• Stars: 1
• Watchers: 1
• Forks: 1
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

          
# Chatbot UI

## Descripción

Este proyecto implementa una interfaz de usuario para un chatbot, diseñado para proporcionar asistencia interactiva a los usuarios. El chatbot UI está desarrollado principalmente con HTML, CSS y JavaScript, facilitando la integración en cualquier sitio web.

## Capturas de Pantalla

![CHATBOT-01](./images/Chatbot-UI-01.png)

---

![CHATBOT-02](./images/Chatbot-UI-02.png)

---

![CHATBOT-03](./images/Chatbot-UI-03.png)

---

![CHATBOT-04](./images/Chatbot-UI-04.png)

---

![CHATBOT-05](./images/Chatbot-UI-05.png)

## Características

- Botón interactivo para abrir y cerrar el chatbot.

- Diseño responsivo que funciona en dispositivos móviles y de escritorio.

- Integración con APIs para generar respuestas dinámicas.

## Tecnologías Utilizadas

- HTML

- CSS

- JavaScript

## Instalación

Para poner en marcha el proyecto localmente, sigue estos pasos:

1. Clona el repositorio:

   ```bash

   git clone https://github.com/marcosd59/chatbot-ui.git

   ```

2. Navega al directorio del proyecto:

   ```bash

   cd chatbot-ui

   ```

3. Abre el archivo `index.html` en tu navegador para ver el chatbot en acción.

## Configuración

Para interactuar con el chatbot y asegurarte de que pueda responder correctamente, debes configurar tu API key:

1. Abre el archivo `script.js`.

2. Encuentra la línea que contiene `const OPENAI_API_KEY = "";`.

3. Coloca tu API Key aquí: `const OPENAI_API_KEY = "your-api-key-here";`.

## Uso

Para interactuar con el chatbot:

1. Haz clic en el botón del chatbot en la esquina de la página.

2. Utiliza el campo de texto para enviar tus preguntas.

3. El chatbot responderá automáticamente.

## Contribuir

Si estás interesado en contribuir al proyecto, sigue estos pasos:

1. Forkea el repositorio.

2. Crea una nueva rama (`git checkout -b feature/nueva-feature`).

3. Realiza tus cambios y haz commit de los mismos (`git commit -am 'Añadir nueva feature'`).

4. Push a la rama (`git push origin feature/nueva-feature`).

5. Crea una nueva Pull Request.