IAs utilizadas
Para realizar este proyecto aunque probamos varias herramientas de inteligencia artificial, de este modo podiamos decirdirnos cual seria mejor para generar el elemento deseado, solo nos centramos en tres. A lo largo de este documento web las explicaremos con brevedad.
GPT-4-OpenAI
- Tipo de acceso: de pago.
- Elementos generados en la plataforma.
- Página home: Promt utilizado: "creame el codigo html para una pagina web con un menu con un menu sticky header con un menu sticky header". Posteriormente se realizaron varios ajustes pues al comienzo se inció con un boceto determinado y se ha ido variando. Esta página tenía varias tarjetas que déspues se eliminaron por que añadían mucha información visual.
- Página mi perfil profesional:Promt utilizado:
"Sobre mí: página en la que se expondrá vuestro perfil profesional incluyendo:
Puesto de trabajo al que aspiro.
Resumen (Lo que se os da bien y lo que creéis que tenéis o podéis desarrollar que la empresa necesita).
Información de contacto y/o redes sociales de uso profesional o académico (esto obviamente puede ser totalmente falso).
Estudios realizados (con o sin certificados). Experiencia profesional (pagada o no).
Habilidades técnicas (SO, IDEs, Lenguajes conocidos, etc.).Habilidades blandas ".
Ajustes: Las imágenes de la página necesitaron redimensionarse varias veces. Se añadieron secciones para dar un poco más de claridad. - Página mi trabajo soñado:Promt utilizado:
"crea con html una pagina web con estos requerimientos cuyo nombre es Trabajo soñado
en la que se describe mi puesto de trabajo deseado incluyendo:
3.1) Empresa.
3.2) Departamento.
3.3) Características de vuestro supervisor.
3.4) Beneficios.
3.5) Salario neto mensual.
3.6) Plan de carrera.
3.7) Tareas a realizar.
3.8) Plan de formación.
3.9) Modalidad (telemática/presencial/híbrida). ".
Ajustes: Las imágenes de la página necesitaron redimensionarse varias veces. Las bullets points de las etiquetas li no aparecían, por lo que se realizaon numerosas pruebas hasta lograr los resultados deseados. La ayuda de la profesora fue necesaria. - Página hobbies:Promt utilizado: "Crea con html una pagina web con estos requerimientos cuyo nombre Juegos y Hobbies página en la que hablare de 3 actividades que os guste realizar en vuestro tiempo libre incluyendo: 4.1) Descripción de la actividad. 4.2) Cuanto tiempo hace que tenéis ese hobby. 4.3) Razón por la que invertís vuestro tiempo en ello. 4.4) Razón por la que todo el mundo debería invertir su tiempo en ello.". Ajustes: Las imágenes de la página necesitaron redimensionarse varias veces.
- Pagina Home-->Elemento generado, footer. Promt utilizado:"quiero insertar un footer en una pagina web, con iconos y enlaces puedes ayudarme" Ajustes: AL comienzo el footer no aparecía, fue necesario corregir el código y agregar un link a una stylesheet de cloudflare.com en el head para que apareciera.
- Menú de navegación superior, que aparece en todas las páginas del proyecto Promt utilizado:"how to make a line centered after the nav list" Ajustes: Esté fue uno de los elementos que más necesito trabajo porque quería que estuviera centrada y el resultado incial no fue el deseado. Se agregó hoover a los elementos y una línea debajo.
- Página Home-->Elemento generado, Texto con animación. Promts utilizados:"hola quiero poner un
texto con animacion en una pagina web. si te mando el html y el css, de la pagina donde quiero ponerlo me ayudas"
"Vale el texto se ve pero el color es muy ligero. Quisiera hacer las letras del texto mas oscuro. Ademas que El texto aparezca palabra a palabra. Como si se estuviera escribiendo poco a poco. terminar con la frase completa. Puede hacerse esto?"
Ajustes: Después de modificado el color del texto, se añadió una imagen a la animación, se centró el texto .
Se generaron las estructuras iniciales (html+css) de las páginas que se encuentran en este proyecto.
Los prompts utilizados para ello fueron:
Creador de imágenes de Microsoft Bing
- Tipo de acceso: usuario registrado a tráves del email de google.
- Elementos generados en la plataforma. Se generaron todas las imágenes que se encuentran en este proyecto.
Los prompts utilizados para ello fueron:
- página home. Imagen del oso panda. Prompt:"oso panda con herramientas de construcción". Ajustes: Se redimensionó la imagen
- página Trabajo soñado. Imagen de la PC en mesa de trabajo . Prompt:"ordenador en una mesa y persona trabajando". Ajustes: Se redimensionó la imagen.
- página Hobbies.
- Imagen de persona corriendo. Prompt:"Hombre corriendo en la noche". Ajustes: Se redimensionó la imagen.
- Imagen de libros. Prompt:"libros + mesa+ color azul". Ajustes: Se redimensionó la imagen.
- Imagen de ejedrez. Prompt:"ajedrez + color tenues". Ajustes: Se redimensionó la imagen.
- Imagen de domino. Prompt:"domino + colores tenues". Ajustes: Se redimensionó la imagen.
- página Sobre Mi.
- Imagen de PC en una montaña. Prompt:"PC+ Pico turquino". Ajustes: Se redimensionó la imagen.
- Capitolio. Prompt:"Capitolio Cubano". Ajustes: Se redimensionó la imagen.
- Imagen sección Estudios Realizados. Prompt:"C++ con color azul, opción sorpréndeme". Ajustes: Se redimensionó la imagen.
Looka-Artificial Intelligence Design
- Tipo de acceso: usuario registrado a tráves del email de google.
- Elementos generados en la plataforma. Esta IA nos permite generar diseños del logo y favicon, sin embargo es de pago. No existe descarga de diseños generados sin pago. Por este motivo se realizaon muchos ajustes. Los prompts utilizados para ello fueron:
- Logo del proyecto.Prompt:"Ko2+ always there". Ajustes: Se hicieron muchas capturas, se probaron muchas sugerencias que la IA nos proporciona, como por ejemplo modern, bold, clasic. Al final después de realizar muchos prints screens, seleccioné la captura más adecuada. También se recortó la imagen en círculo
- Favicon.Prompt:"Prompt:"Ko2+ always there". Ajustes: utilizamos una de las tantas capturas utilizadas, recortamos una parte de ella.La idea era mantener los colores que teníamos en el logo y con ello uniformidad en el proyecto