UNIVERSIDAD CENTRAL
DEL ECUADOR
FACULTAD DE FILOSOFÍA, LETRAS Y CIENCIAS DE
LA EDUCACIÓN
CARRERA DE PEDAGOGÍA DE LAS CIENCIAS
EXPERIMENTALES INFORMÁTICA
KAREN DAYANA TROYA HERRERA
FÍSICA APLICADA
TEMA: CHATBOT
MSC. VICTOR ZAPATA
INFORME: 10
QUITO- ECUADOR
2021-2021
TEMA:
CHATBOT
OBJETIVO:
 Realizar la utilización de operadores lógicos y mejoramiento del uso del lenguaje de programación “PHP”
 Reconocer el uso de variables para el desarrollo del programa en “PHP”.
 - Aprender a utilizar el nuevo lenguaje de programación de “PHP”.
RESULTADOS DE APRENDIZAJE
 La mejor comprensión del uso de lenguaje PHP
 Manipulación del servidor “XAMPP”
 Utilización del programa DIALOGFLOW
 Utilización de CHATBOT
ACTIVIDADES:
- Realizar un chatbot con una tema determinado
DESARROLLO DE CONTENIDOS
 Realizar una página con un chatbot
 Utilizamos varias imágenes para realzar la presentación del programa
 Realizamos varios div para darle un orden a la pagina
 También se hizo del uso del style.css para poner una imagen como fondo de pantalla en nuestro programa
1. Para realizar la calculadora con for utilizamos la siguiente línea de código
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Inicio</title>
<link rel="stylesheet" href="estilos.css">
</head>
<body>
<header>
<div class="wrapp">
<div class="logo">
<a href="#"><img src="https://www.tuenlinea.com/wp-content/uploads/2018/08/%C2%A1Ch
Cosmetics.jpg"width="80" height="50"alt="TOP"></a>
</div>
<nav>
<ul>
<li><a href="">Login</a></li>
<li><a href="">Youtube </a></li>
<li><a href="">Instagram</a></li>
<li><a href="">Facebook </a></li>
</ul>
</nav>
</div>
</header>
<section class="main">
<div class="wrapp">
<div class="mensaje">
<font face="Courier New"> <h1>BIENVENIDO A TU TIENDA EN LINEA DE SEPHORA </h1> </font>
</div>
<MARQUEE WIDTH=100% BGCOLOR=BLACK> <font face= TIMESNEWROMAN color= WHITE size=5>
SEPHORA
</font>
</MARQUEE>
<center>
<div class="gama">
<ul>
<center> <img class="gama" src="https://www.sephora.es/on/demandware.static/Sit
shop.jpg"width="1000" height="1000" /></center>
</ul>
</div>
</center>
<MARQUEE WIDTH=100% BGCOLOR=BLACK> <font face= TIMESNEWROMAN color= WHITE size=5>
SEPHORA
</font>
</MARQUEE>
<center>
<div class="widget2">
<ul>
<h1>COLLECTION BUNDALE</h1>
<img class="widget2" src="https://coty.scene7.com/is/image/cotyemea/KJC_BIRTH21
<aside>
<h4> PRECIO: $213</h4>
</aside>
</ul>
</div>
</center>
<center>
<div class="widget3">
<ul>
<h1>PRESSED POWDER PALETE</h1>
<img class="widget3" src="https://cdn.shopify.com/s/files/1/0066/8719/5183/prod
5b7804d74a9d.jpg?v=1628607972"width="250" height="250" />
<aside>
<h4> PRECIO: $60</h4>
</aside>
</ul>
</div>
</center>
<center>
<div class="widget4">
<ul>
<h1>POLVO TRANSLUCIDO CHANNEL </h1>
<img class="widget4" src="https://www.jessikaarangomakeup.com/wp-content/upload
<aside>
<h4> PRECIO: $55</h4>
</aside>
</ul>
</div>
</center>
<center>
<MARQUEE WIDTH=100% BGCOLOR=BLACK> <font face= TIMESNEWROMAN color= WHITE size=5>
SEPHORA
</font>
</MARQUEE>
<div class="widget04">
<ul>
<h1>CORRECTOR DE OJERAS FENTY BEUTY </h1>
<img class="widget04" src="https://i.pinimg.com/originals/96/4c/9f/964c9f84e279
<aside>
<h4> PRECIO: $35</h4>
</aside>
</ul>
</div>
</center>
<center>
<div class="widget5">
<ul>
<h1>BASE RARE BEUTY</h1>
<img class="widget2" src="https://media.vogue.mx/photos/5f53fd8594d967b5b6cd1c8
Beauty.jpg"width="250" height="250" />
<aside>
<h4> PRECIO: $45</h4>
</aside>
</ul>
</div>
</center>
<center>
<div class="widget6">
<ul>
<h1>PRIMER EYE ANASTASIA</h1>
<img class="widget3" src="https://ss701.liverpool.com.mx/xl/1084434791.jpg"widt
<aside>
<h4> PRECIO: $40</h4>
</aside>
</ul>
</div>
</center>
</div>
</section>
<footer>
<div class="wrapp">
<p> <font face= TIMESNEWROMAN color= BLACK size=7>
<center>COLECCTION ALTA GAMA</center>
<MARQUEE WIDTH=100% BGCOLOR=BLACK> <font face= TIMESNEWROMAN color= WHITE size=5>
SEPHORA
</font>
</MARQUEE>
</font></p>
</div>
</footer>
<div class="body2">
<center>
<div class="widget7">
<ul>
<h1>RUBOR DIOR</h1>
<img class="widget7" src="https://wapa.cronosmedia.glr.pe/original/2021/07/04/6
<div class="precio">
<h4> PRECIO: $70</h4>
</div>
</ul>
</div>
</center>
<center>
<div class="widget8">
<ul>
<h1>DELINEADOR DIOR </h1>
<img class="widget8" src="https://eco-beauty.dior.com/dw/image/v2/BDGF_PRD/on/d
master_dior/default/dwe4ebe299/assets/Y0777250/Y0777250_F077725096_E01_GHC.jpg?sw=715&sh=773&sm=fit
<div class="precio">
<h4> PRECIO: $28</h4>
</div>
</ul>
</div>
</center>
<center>
<div class="widget9">
<ul>
<h1>SET DE BROCHAS MAC</h1>
<img class="widget9" src="https://i.pinimg.com/originals/23/bd/4d/23bd4d255e12c
<div class="precio">
<h4> PRECIO: $95</h4>
</div>
</ul>
</div>
</center>
<center>
<div class="widget10">
<ul>
<h1>CONTOUR KKW BEUTY</h1>
<img class="widget10" src="https://images.ulta.com/is/image/Ulta/2548156?op_sha
<div class="precio">
<h4> PRECIO: $45</h4>
</div>
</ul>
</div>
</center>
<script src="https://www.gstatic.com/dialogflow-console/fast/messenger/bootstrap.js
<df-messenger
intent="WELCOME"
chat-title="FENTY"
agent-id="ff8bfc0d-c81a-4336-bf3e-6e2e7b8cbf23"
language-code="en"
></df-messenger>
<style>
df-messenger {
--df-messenger-bot-message: #878fac;
--df-messenger-button-titlebar-color: #A91E10 ;
--df-messenger-chat-background-color: #37C7D0 ;
--df-messenger-font-color: white;
--df-messenger-send-icon: #878fac;
--df-messenger-user-message: #479b3d;
}
</style>
Ejecución del programa:
En el programa con for podemos observar que el programa ejecuta correctamente con la programación d
U20

U20

  • 1.
    UNIVERSIDAD CENTRAL DEL ECUADOR FACULTADDE FILOSOFÍA, LETRAS Y CIENCIAS DE LA EDUCACIÓN CARRERA DE PEDAGOGÍA DE LAS CIENCIAS EXPERIMENTALES INFORMÁTICA KAREN DAYANA TROYA HERRERA FÍSICA APLICADA TEMA: CHATBOT MSC. VICTOR ZAPATA INFORME: 10 QUITO- ECUADOR 2021-2021
  • 2.
    TEMA: CHATBOT OBJETIVO:  Realizar lautilización de operadores lógicos y mejoramiento del uso del lenguaje de programación “PHP”  Reconocer el uso de variables para el desarrollo del programa en “PHP”.  - Aprender a utilizar el nuevo lenguaje de programación de “PHP”. RESULTADOS DE APRENDIZAJE  La mejor comprensión del uso de lenguaje PHP  Manipulación del servidor “XAMPP”  Utilización del programa DIALOGFLOW  Utilización de CHATBOT ACTIVIDADES: - Realizar un chatbot con una tema determinado DESARROLLO DE CONTENIDOS  Realizar una página con un chatbot  Utilizamos varias imágenes para realzar la presentación del programa  Realizamos varios div para darle un orden a la pagina  También se hizo del uso del style.css para poner una imagen como fondo de pantalla en nuestro programa 1. Para realizar la calculadora con for utilizamos la siguiente línea de código <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Inicio</title> <link rel="stylesheet" href="estilos.css"> </head> <body> <header> <div class="wrapp"> <div class="logo">
  • 3.
    <a href="#"><img src="https://www.tuenlinea.com/wp-content/uploads/2018/08/%C2%A1Ch Cosmetics.jpg"width="80"height="50"alt="TOP"></a> </div> <nav> <ul> <li><a href="">Login</a></li> <li><a href="">Youtube </a></li> <li><a href="">Instagram</a></li> <li><a href="">Facebook </a></li> </ul> </nav> </div> </header> <section class="main"> <div class="wrapp"> <div class="mensaje"> <font face="Courier New"> <h1>BIENVENIDO A TU TIENDA EN LINEA DE SEPHORA </h1> </font> </div> <MARQUEE WIDTH=100% BGCOLOR=BLACK> <font face= TIMESNEWROMAN color= WHITE size=5>
  • 4.
    SEPHORA </font> </MARQUEE> <center> <div class="gama"> <ul> <center> <imgclass="gama" src="https://www.sephora.es/on/demandware.static/Sit shop.jpg"width="1000" height="1000" /></center> </ul> </div> </center> <MARQUEE WIDTH=100% BGCOLOR=BLACK> <font face= TIMESNEWROMAN color= WHITE size=5> SEPHORA </font> </MARQUEE> <center> <div class="widget2"> <ul> <h1>COLLECTION BUNDALE</h1> <img class="widget2" src="https://coty.scene7.com/is/image/cotyemea/KJC_BIRTH21 <aside> <h4> PRECIO: $213</h4> </aside>
  • 5.
    </ul> </div> </center> <center> <div class="widget3"> <ul> <h1>PRESSED POWDERPALETE</h1> <img class="widget3" src="https://cdn.shopify.com/s/files/1/0066/8719/5183/prod 5b7804d74a9d.jpg?v=1628607972"width="250" height="250" /> <aside> <h4> PRECIO: $60</h4> </aside> </ul> </div> </center> <center> <div class="widget4"> <ul> <h1>POLVO TRANSLUCIDO CHANNEL </h1> <img class="widget4" src="https://www.jessikaarangomakeup.com/wp-content/upload <aside> <h4> PRECIO: $55</h4> </aside> </ul> </div> </center> <center> <MARQUEE WIDTH=100% BGCOLOR=BLACK> <font face= TIMESNEWROMAN color= WHITE size=5> SEPHORA </font> </MARQUEE> <div class="widget04"> <ul> <h1>CORRECTOR DE OJERAS FENTY BEUTY </h1>
  • 6.
    <img class="widget04" src="https://i.pinimg.com/originals/96/4c/9f/964c9f84e279 <aside> <h4>PRECIO: $35</h4> </aside> </ul> </div> </center> <center> <div class="widget5"> <ul> <h1>BASE RARE BEUTY</h1> <img class="widget2" src="https://media.vogue.mx/photos/5f53fd8594d967b5b6cd1c8 Beauty.jpg"width="250" height="250" /> <aside> <h4> PRECIO: $45</h4> </aside> </ul> </div> </center> <center> <div class="widget6"> <ul> <h1>PRIMER EYE ANASTASIA</h1> <img class="widget3" src="https://ss701.liverpool.com.mx/xl/1084434791.jpg"widt <aside> <h4> PRECIO: $40</h4> </aside> </ul> </div> </center> </div> </section> <footer> <div class="wrapp"> <p> <font face= TIMESNEWROMAN color= BLACK size=7> <center>COLECCTION ALTA GAMA</center>
  • 7.
    <MARQUEE WIDTH=100% BGCOLOR=BLACK><font face= TIMESNEWROMAN color= WHITE size=5> SEPHORA </font> </MARQUEE> </font></p> </div> </footer> <div class="body2"> <center> <div class="widget7"> <ul> <h1>RUBOR DIOR</h1> <img class="widget7" src="https://wapa.cronosmedia.glr.pe/original/2021/07/04/6 <div class="precio"> <h4> PRECIO: $70</h4> </div> </ul> </div> </center> <center> <div class="widget8"> <ul> <h1>DELINEADOR DIOR </h1> <img class="widget8" src="https://eco-beauty.dior.com/dw/image/v2/BDGF_PRD/on/d master_dior/default/dwe4ebe299/assets/Y0777250/Y0777250_F077725096_E01_GHC.jpg?sw=715&sh=773&sm=fit <div class="precio"> <h4> PRECIO: $28</h4> </div> </ul> </div> </center> <center> <div class="widget9">
  • 8.
    <ul> <h1>SET DE BROCHASMAC</h1> <img class="widget9" src="https://i.pinimg.com/originals/23/bd/4d/23bd4d255e12c <div class="precio"> <h4> PRECIO: $95</h4> </div> </ul> </div> </center> <center> <div class="widget10"> <ul> <h1>CONTOUR KKW BEUTY</h1> <img class="widget10" src="https://images.ulta.com/is/image/Ulta/2548156?op_sha <div class="precio"> <h4> PRECIO: $45</h4> </div> </ul> </div> </center> <script src="https://www.gstatic.com/dialogflow-console/fast/messenger/bootstrap.js <df-messenger intent="WELCOME" chat-title="FENTY" agent-id="ff8bfc0d-c81a-4336-bf3e-6e2e7b8cbf23" language-code="en" ></df-messenger> <style> df-messenger { --df-messenger-bot-message: #878fac; --df-messenger-button-titlebar-color: #A91E10 ; --df-messenger-chat-background-color: #37C7D0 ; --df-messenger-font-color: white; --df-messenger-send-icon: #878fac; --df-messenger-user-message: #479b3d; } </style>
  • 9.
    Ejecución del programa: Enel programa con for podemos observar que el programa ejecuta correctamente con la programación d