Ernesto Riestra https://sg.com.mx/ en Desarrollo de Chatbots para Facebook Messenger https://sg.com.mx/revista/53/desarrollo-chatbots-para-facebook-messenger <span class="field field--name-title field--type-string field--label-hidden">Desarrollo de Chatbots para Facebook Messenger</span> <div class="images-container clearfix"> <div class="image-preview clearfix"> <div class="image-wrapper clearfix"> <div class="field field--name-field-image field--type-image field--label-hidden field__item"> <img src="/sites/default/files/images/text-980031_1280.jpg" width="1280" height="1280" alt="" loading="lazy" typeof="foaf:Image" /> </div> </div> </div> </div> <span class="field field--name-uid field--type-entity-reference field--label-hidden"><a title="View user profile." href="/user/47654" lang="" about="/user/47654" typeof="schema:Person" property="schema:name" datatype="" class="username">ana2lp</a></span> <span class="field field--name-created field--type-created field--label-hidden">Mon, 12/12/2016 - 16:34</span> <div class="field field--name-field-numrevista field--type-entity-reference field--label-inline field--entity-reference-target-type-taxonomy-term clearfix"> <h3 class="field__label inline">Publicado en</h3> <ul class='links field__items'> <li><a href="/revista/53" hreflang="und">SG #53</a></li> </ul> </div> <div class="field field--name-field-autor field--type-entity-reference field--label-inline field--entity-reference-target-type-taxonomy-term clearfix"> <h3 class="field__label inline">Autor</h3> <ul class='links field__items'> <li><a href="/buzz/autores/ernesto-riestra" hreflang="und">Ernesto Riestra</a></li> </ul> </div> <div class="text-formatted field field--name-body field--type-text-with-summary field--label-hidden field__item"><p dir="ltr">El chat es uno de los primeros medios que surgieron en los inicios del internet para la comunicación. En la actualidad, un gran porcentaje de nuestras pláticas se da a través de esta herramienta conversacional; además la creciente tendencia a usar el celular ha generado innovaciones y mejoras en la misma.</p> <p dir="ltr">Por su naturaleza, la conversación es altamente adaptable a las herramientas digitales y su aplicación para el aprendizaje. Los chats proveen de una comunicación escrita inmediata, ideal para resolver dudas o indagar en un tema específico. La ventaja de una conversación en un chat, en comparación con la experiencia cotidiana que tenemos de navegar el internet, es que ésta mantiene una secuencia que es más fácil de comprender.</p> <p dir="ltr">Es muy distinto entrar a un sitio de comercio electrónico o un sistema de cursos en línea y tener que buscar entre muchas categorías lo que deseamos, a preguntarle a una persona y entablar una conversación para ubicar lo que más nos interesa o necesitamos con mayor agilidad.</p> <h3 dir="ltr">¿Qué es un chatbot?</h3> <p dir="ltr">Las herramientas de inteligencia artificial han permitido la automatización de las conversaciones a través de lo que se conoce como chatbot. Un chatbot es simplemente un agente con cierto grado de inteligencia o adaptación que puede mantener una conversación con una persona dentro de un contexto delimitado.</p> <p dir="ltr">Los chatbots han tenido históricamente un desarrollo, por un lado, desde los laboratorios de inteligencia artificial de reconocidas universidades. Por ejemplo Alicebot, un modelo de inteligencia artificial que construye herramientas de procesamiento lenguaje natural con base en un lenguaje de markup (AIML).Y en tiempos más recientes, en las redes sociales y sistemas de comunicación masiva como Messenger de Facebook, una de las principales plataformas de comunicación vía chat, que recientemente ha incorporado módulos para desarrolladores para integrar rápidamente chatbots.</p> <p dir="ltr">En lo subsecuente nos enfocaremos en el desarrollo de chatbots con Facebook Messenger pues la ventaja de tener acceso a millones de potenciales usuarios permite desarrollar una diversidad de casos de aplicación a través de esta herramienta.</p> <p dir="ltr">Los elementos clave que constituyen un chatbot son:</p> <ol><li dir="ltr"> <p dir="ltr">Un canal digital o chat.</p> </li> <li dir="ltr"> <p dir="ltr">Algún esquema basado en reglas, detección y construcción de patrones para poder determinar el flujo de la conversación.</p> </li> <li dir="ltr"> <p dir="ltr">La existencia de algún mecanismo de comprensión del lenguaje que facilite la comunicación.</p> </li> </ol><p dir="ltr"><img alt="Figura 1" data-entity-type="file" data-entity-uuid="41b4d7b0-af00-4a6c-8895-45953375e888" src="/sites/default/files/inline-images/messenger-fig1.jpg" width="700" height="504" loading="lazy" /></p> <p dir="ltr">Figura 1. Componentes clave de un bot</p> <h3 dir="ltr">Conversaciones significativas: frecuencia vs. involucramiento</h3> <p dir="ltr">Antes de entrar de lleno a la parte más técnica del desarrollo de chatbots, es importante también acotar dos dimensiones importantes en el diseño de una conversación: la frecuencia y el nivel de involucramiento.</p> <p dir="ltr">Lo primero se refiere a definir la frecuencia con la que se espera que un usuario consulte al chatbot o interactúe con él. Por ejemplo, en los chatbots que distribuyen noticias todos los días, se da en una u otra medida interacción con sus usuarios, mientras que en un chatbot para un juego o un cuento, una vez concluida la historia principal no es muy frecuente que los usuarios regresen.</p> <p dir="ltr">En cuanto al nivel de involucramiento del usuario, regresando al caso del sitio de noticias el involucramiento no es muy alto, pues la interacción puede limitarse a recibir un resumen noticioso, mientras que en un juego de roles, es posible que el usuario tenga una conversación con más involucramiento.</p> <p dir="ltr">Un ejemplo de chatbot con baja frecuencia e involucramiento es un chatbot para un sitio de comercio electrónico: sus usuarios no suelen conversar a gran profundidad con dicho bot, y por otro lado una vez adquirido un producto no es muy probable que regresen a la misma conversación (aunque sí al sitio).</p> <p dir="ltr">Todavía no existen muchos casos de alta frecuencia e involucramiento. Estas características suelen reservarse a las relaciones interpersonales, aunque el desarrollo de la inteligencia artificial puede dar lugar a chatbots con los que no sólo tengamos conversaciones regulares, sino un alto nivel de relacionamiento. Esta es la idea principal de asistentes de conversación como Cortana o Siri, proyectos en los que se hace una enorme inversión por parte de los corporativos detrás de su desarrollo.</p> <h3 dir="ltr">Desarrollando un chatbot en Facebook Messenger</h3> <p dir="ltr">A continuación vamos a mostrar un breve tutorial para construir nuestro primer bot en Facebook. La referencia de este tutorial es el “Quick Start Guide” [1] en el sitio de desarrolladores de Facebook, pero aquí lo pondremos en español y con explicaciones en los puntos donde podrías tener problemas.</p> <p dir="ltr">Este tutorial también está disponible por medio de un chatbot en Facebook messenger llamado YeiraBot. Así que si lo prefieres, puedes seguir este tutorial interactuando con un chatbot que te irá indicando el siguiente paso. La noción de un chatbot que nos explique cómo crear un chatbot tiene un buen grado de recursividad, que suele ser interesante en sí misma, y conduce a la reflexión. En metagraphos nos resultó interesante dejar a un lado las páginas convencionales y los sitios web de tutoriales, para crear este agente que lleve de la mano a los usuarios para crear su propio bot conversacional. Para acceder el tutorial de esta forma, ingresa a <a href="https://www.messenger.com/t/Yeirabot">https://www.messenger.com/t/Yeirabot</a></p> <p dir="ltr">La siguiente guía está basada en el funcionamiento de Yeirabot, un bot asociado a una plataforma educativa llamada Yeira. Fue desarrollado para ejemplificar cómo es posible que un chatbot sea una fuente para compartir conocimiento de una forma eficiente y novedosa. Su objetivo es explicar cómo construir un chatbot con Messenger de Facebook.</p> <h3 dir="ltr">Elementos</h3> <p dir="ltr">Un chatbot en Facebook messenger consta de 3 grandes elementos:</p> <ul><li dir="ltr"> <p dir="ltr">Página de Facebook. El bot utiliza una página de Facebook como su identidad. Esta típicamente es la página de una empresa, comunidad o causa. Cuando la gente chatea con tu bot, verán el nombre de la página y la imagen de su perfil. Puedes utilizar una página existente o crear una nueva.</p> </li> <li dir="ltr"> <p dir="ltr">Aplicación con lógica del chatbot. Debes crear una aplicación server-side que implemente la lógica de tu chatbot. Dicha aplicación debe exponer un punto de acceso (webhook) a través del cual recibe y envía los mensajes.</p> </li> <li dir="ltr"> <p dir="ltr">Aplicación de Facebook. Debes registrar una aplicación en Facebook (Facebook app) que contenga la configuración y permisos de tu bot, y sirve como enlace entre tu página de Facebook y la aplicación en tu servidor que implementa al bot.</p> </li> </ul><h3 dir="ltr">Configurar servidor</h3> <p dir="ltr">Un punto importante es que la aplicación server-side con la lógica del chatbot debe estar accesible en internet por medio del protocolo https. Así que antes de continuar, configura un servidor y dominio con su certificado para https. Si no sabes como hacer esto, en la versión de este tutorial via chatbot se explica cómo configurar una instancia de Amazon EC2 que nos sirva para este propósito.</p> <p dir="ltr">Una vez que tengamos listo nuestro servidor para la aplicación, procedamos a dar de alta nuestra aplicación de Facebook.</p> <h3 dir="ltr">Crear aplicación de Facebook</h3> <p dir="ltr">Para registrar la aplicación de Facebook visita <a href="https://developers.facebook.com/apps">https://developers.facebook.com/apps</a> y da click en “Agregar una nueva aplicación”. En la categoría indica que es una aplicación para Messenger (ver figura 2).</p> <p dir="ltr"><img alt="fig2" data-entity-type="file" data-entity-uuid="9212a484-4de2-4248-b063-9ef2c38b5e03" src="/sites/default/files/inline-images/messenger-fig2.jpg" width="700" height="363" loading="lazy" /></p> <p dir="ltr">Figura 2. Registrar la App de Facebook.</p> <p dir="ltr">La siguiente página nos preguntará detalles para configurar nuestro bot. En la sección de “Generación de Token” (ver figura 3) selecciona la página de Facebook que será la identidad de tu chatbot (necesitas tener permisos de administrador para dicha página). Al hacer esto, te aparecerá un token de acceso a la página. Cópialo.</p> <div dir="ltr"> </div> <p dir="ltr"><img alt="fig3" data-entity-type="file" data-entity-uuid="372fab4b-7472-469a-8f65-a7f3a4e6bd82" src="/sites/default/files/inline-images/messenger-fig3.jpg" width="700" height="394" loading="lazy" /></p> <p dir="ltr">Figura 3. Token de acceso a la página.</p> <p dir="ltr">Ahora regresemos a la sección de configuración para obtener la clave secreta de nuestra aplicación. Tenemos que dar click en el botón “Mostrar” y copiar la cadena que se despliegue (ver figura 4).</p> <p dir="ltr"><img alt="fig4" data-entity-type="file" data-entity-uuid="5bbe1e51-8415-4558-954f-fc69d6365bd3" src="/sites/default/files/inline-images/messenger-fig4.jpg" width="700" height="303" loading="lazy" /></p> <p dir="ltr">Figura 4. Configuración de la aplicación de Facebook</p> <p dir="ltr">Con estos datos, estamos listos para configurar la aplicación server-side de nuestro chatbot.</p> <h3 dir="ltr">Implementar la lógica</h3> <p dir="ltr">Para este tutorial vamos a utilizar una aplicación prehecha cuya funcionalidad simplemente consiste en recibir mensajes analizar su contenido, y enviar distintas respuestas dependiendo del contenido del mensaje recibido.</p> <p dir="ltr">Descárgala en <a href="https://github.com/fbsamples/messenger-platform-samples">https://github.com/fbsamples/messenger-platform-samples</a></p> <p dir="ltr">Dentro de la carpeta node encontrarás una aplicación en Node.js que implementa el chatbot. La aplicación es muy sencilla y toda la lógica es implementada en el programa app.js.</p> <p dir="ltr">Para que nuestra aplicación funcione, debemos tener disponible un ambiente de Node.js. Si no lo tienes, instálalo.</p> <p dir="ltr">Ya que tengas tu ambiente de Node.js, ejecuta el comando “npm install” para que se instalen los módulos que requiere nuestra aplicación.</p> <p dir="ltr">Para que nuestra aplicación funcione, necesitamos modificar el archivo de configuración en config/default.json . Estos son los datos que debemos poner (ver figura 5):</p> <ul><li dir="ltr"> <p dir="ltr">appSecret -&gt; La clave secreta de nuestra aplicación de Facebook (la cadena de caracteres que aparece al dar click en el botón de “Mostrar”, ver figura 4).</p> </li> <li dir="ltr"> <p dir="ltr">pageAccessToken -&gt; El token de acceso a la página que generamos cuando seleccionamos la página (ver figura 3)</p> </li> <li dir="ltr"> <p dir="ltr">validationToken -&gt; Esta es una contraseña que comparte la aplicación de Facebook con la aplicación en servidor. Usa cualquier cadena de texto que quieras.</p> </li> <li dir="ltr"> <p dir="ltr">serverURL -&gt; El url donde está disponible nuestra aplicación de servidor (ej: <a href="https://miserver.com/chatbot">https://miserver.com/chatbot</a>).</p> </li> </ul><div dir="ltr"> </div> <p dir="ltr"><img alt="fig5" data-entity-type="file" data-entity-uuid="879184a0-2f85-495c-b9ce-015e760be1f6" src="/sites/default/files/inline-images/messenger-fig5.jpg" width="700" height="329" loading="lazy" /></p> <p dir="ltr">Figura 5. Configuración en la aplicación Node.js</p> <p dir="ltr">A estas alturas, ya podríamos arrancar nuestra aplicación ejecutando el comando “npm start”. Sin embargo, el dilema es que por default la aplicación de Node.js escucha en el puerto 5000, pero la aplicación de Facebook le va a enviar peticiones al puerto 443 de https. Ante esto, tenemos dos opciones: la primer opción y que es lo que normalmente se hace en ambientes de producción es configurar un reverse proxy en nuestro servidor web para que las peticiones recibidas en alguna dirección o carpeta sean redirigidas a nuestra aplicación de Node.js. La segunda opción sería que nuestra aplicación de Node.js escuche directamente en el puerto 443; para ello debemos editar el código de app.js para modificar el puerto donde se escucha y también para cargar el certificado SSL (ver figura 6 y 7).</p> <p dir="ltr"><img alt="fig6" data-entity-type="file" data-entity-uuid="3a00ab79-7fde-4424-b323-e8061213e456" src="/sites/default/files/inline-images/messenger-fig6.jpg" width="700" height="311" loading="lazy" /></p> <p dir="ltr">Figura 6. Cambiar puerto y requerir módulo fs.</p> <p dir="ltr"><img alt="fig7" data-entity-type="file" data-entity-uuid="b5cef56a-24e3-4d05-965d-51a07d48e37a" src="/sites/default/files/inline-images/messenger-fig7.jpg" width="700" height="358" loading="lazy" /></p> <p dir="ltr">Figura 7. Cargar archivos de certificado y arrancar servidor.</p> <p dir="ltr">Una vez que hayamos hecho el ajuste para escuchar en el puerto 443, podemos arrancar nuestra aplicación con “npm start” (o el manejador de aplicaciones de Node.js de tu preferencia) y podemos verificar que funcione bien ingresando a nuestro servidor (ver figura 8).</p> <p dir="ltr"><img alt="fig8" data-entity-type="file" data-entity-uuid="435295c1-ceea-457e-8c27-42c8301f6efd" src="/sites/default/files/inline-images/messenger-fig8.jpg" width="700" height="342" loading="lazy" /></p> <p dir="ltr">Figura 8. Página de inicio de la aplicación de servidor</p> <p dir="ltr">Una vez que el servidor está arriba y activo, es posible activar el webhook en la página de Facebook developer. Ve a la configuración de tu aplicación, y en la sección donde se configuras las opciones de Messenger da click en el botón de “Configurar Webhooks”. Esto abrirá una ventana de diálogo (ver figura 9). Indica el url del webhook de tu aplicación (ej. <a href="https://server/aplicacion/webhook">https://server/aplicacion/webhook</a>). Indica también la contraseña de validación (validationToken) que pusiste en tu aplicación en default.json, este es el texto arbitrario que escojiste. Activa las casillas messages y messaging_postbacks.</p> <p dir="ltr"><img alt="fig9" data-entity-type="file" data-entity-uuid="f876fd45-fc1f-4bbc-ae8b-112f1e17dd67" src="/sites/default/files/inline-images/messenger-fig9.jpg" width="700" height="362" loading="lazy" /></p> <p dir="ltr">Figura 9. Configurar Webhook</p> <p dir="ltr">Una vez que tu webhook es validado, puedes suscribir el webhook a los eventos generados en tu página de Facebook, selecciona la página en la lista de selección (ver figura 10). Esto hará que cada que tu página reciba un mensaje, se invocará el webhook.</p> <p dir="ltr">Todo listo, ahora podrás conectarte con tu bot en la página de Messenger respectiva. En este caso: <a href="http://m.me/Yeirabot">http://m.me/Yeirabot</a></p> <p dir="ltr">      <img alt="fig10" data-entity-type="file" data-entity-uuid="449312fb-897a-4832-ab13-1cc18a5ff10c" src="/sites/default/files/inline-images/messenger-fig10.jpg" width="700" height="415" loading="lazy" /></p> <p dir="ltr">Figura 10. Chatbot en acción</p> <p dir="ltr">La aplicación escucha mensajes y te contesta con el mismo mensaje que recibió. Hay algunas excepciones para ejemplificar tipos de contenido especial. Por ejemplo, si escribes “image” la aplicación te responde con una imagen; si escribes “video”, te responde con un video.</p> <h3 dir="ltr">Conclusión</h3> <p dir="ltr">En este artículo conocimos los pasos básicos para construir un chatbot para Facebook Messenger a partir de una aplicación prehecha. El siguiente paso para cualquiera que le interese continuar este camino es revisar la guía de desarrollador en Facebook [3] y el código fuente de la aplicación ejemplo para entender cómo es que recibe, interpreta y contesta los mensajes.</p> <p dir="ltr">Referencias</p> <ol><li dir="ltr"> <p dir="ltr">Facebook Messenger Platform Quickstart Guide. <a href="http://swgu.ru/s9">http://swgu.ru/s9</a></p> </li> <li dir="ltr"> <p dir="ltr">¿Qué es Yeirabot? <a href="http://swgu.ru/sa">http://swgu.ru/sa</a></p> </li> </ol><p> </p> </div> <div class="text-formatted field field--name-field-autor-bio field--type-text-long field--label-above"> <div class="field__label">Bio</div> <div class="field__item"><p><span>Ernesto Riestra es cofundador y líder de investigación y desarrollo en Metagraphos, firma dedicada a la creación de experiencias digitales para transformar la productividad y el conocimiento de personas y organizaciones. Es Ingeniero Mecánico Electricista egresado de la UNAM y tiene una Maestría en Mecatrónica por la Universidad Técnica de Hamburgo.</span></p> </div> </div> <section class="field field--name-comment field--type-comment field--label-above comment-wrapper"> </section> <div class="field field--name-field-tags field--type-entity-reference field--label-above field--entity-reference-target-type-taxonomy-term clearfix"> <h3 class="field__label">Tags</h3> <ul class='links field__items'> <li><a href="/buzz/tags/chatbots" hreflang="und">chatbots</a></li> </ul> </div> Mon, 12 Dec 2016 22:34:45 +0000 ana2lp 6922 at https://sg.com.mx https://sg.com.mx/revista/53/desarrollo-chatbots-para-facebook-messenger#comments Guía de Arranque para VR con Oculus y Leap Motion Orion https://sg.com.mx/revista/52/gu-arranque-para-vr-oculus-y-leap-motion-orion <span class="field field--name-title field--type-string field--label-hidden">Guía de Arranque para VR con Oculus y Leap Motion Orion</span> <div class="images-container clearfix"> <div class="image-preview clearfix"> <div class="image-wrapper clearfix"> <div class="field field--name-field-image field--type-image field--label-hidden field__item"> <img src="/sites/default/files/images/leaphands-demo.png" width="1920" height="1200" alt="" loading="lazy" typeof="foaf:Image" /> </div> </div> </div> </div> <span class="field field--name-uid field--type-entity-reference field--label-hidden"><a title="View user profile." href="/user/1" lang="" about="/user/1" typeof="schema:Person" property="schema:name" datatype="" class="username">sg</a></span> <span class="field field--name-created field--type-created field--label-hidden">Wed, 10/12/2016 - 01:30</span> <div class="field field--name-field-numrevista field--type-entity-reference field--label-inline field--entity-reference-target-type-taxonomy-term clearfix"> <h3 class="field__label inline">Publicado en</h3> <ul class='links field__items'> <li><a href="/revista/52" hreflang="und">SG #52</a></li> </ul> </div> <div class="field field--name-field-seccion field--type-entity-reference field--label-hidden field--entity-reference-target-type-taxonomy-term clearfix"> <ul class='links field__items'> <li><a href="/revista/secciones/novedades" hreflang="und">Novedades</a></li> </ul> </div> <div class="field field--name-field-autor field--type-entity-reference field--label-inline field--entity-reference-target-type-taxonomy-term clearfix"> <h3 class="field__label inline">Autor</h3> <ul class='links field__items'> <li><a href="/buzz/autores/ernesto-riestra" hreflang="und">Ernesto Riestra</a></li> </ul> </div> <div class="text-formatted field field--name-body field--type-text-with-summary field--label-hidden field__item"><p>Desde sus inicios, la realidad virtual ha sido una gran promesa de interacción con los sistemas digitales. Actualmente esta promesa ya es una realidad gracias a plataformas y dispositivos como Oculus Rift y Leap Motion.</p><p>Para poder lograr una sensación de inmersión completa, la realidad virtual incorpora dos elementos clave en su parte visual: primeramente la estereoscopía, que significa proyectar dos imágenes diferentes para cada ojo, de manera que logremos la sensación de profundidad, el tracking de la posición y orientación de la cabeza.</p><p>El segundo elemento es la interacción. La reacción inmediata al entrar a un entorno de VR, es extender las manos y tratar de tocar o alcanzar las cosas que están en el mismo. Aunque existe la posibilidad de usar controladores físicos, como gamepads, joysticks y sistemas de tracking de posición 3D, no hay nada como la idea de usar las propias extremidades para interactuar. Justamente esta es la idea detrás de innovaciones como Kinect de Microsoft o Leap Motion, un sensor que detecta movimientos y gestos hechos con las manos, lo cual permite interacciones más libres e intuitivas.</p><p>En este recorrido vamos a explorar todos los pasos necesarios para desarrollar un entorno de VR basado en Oculus y Unity, soluciones disponibles y accesibles en México. También revisaremos algunos ejemplos con Orion, la versión más reciente de software para Leap Motion.</p><h3>Prerrequisitos e instalación básica</h3><p>Para poder realizar este tutorial se necesita lo siguiente:</p><ul><li>Computadora con requerimientos mínimos para Oculus y sistema operativo Windows</li><li>Unity 5.3.5</li><li>Oculus Runtime 1.3</li><li>Leap Motion Orion Software</li></ul><p>En este tutorial utilizamos una computadora Alienware X51 R2, con tarjeta gráfica AMD Radeon R9 370 de 4GB y sistema operativo Windows 10 Home.</p><p>Aunque Oculus nos señalaba que nuestro equipo era una computadora no soportada, no experimentamos ningún problema de rendimiento con la versión Developer Kit 2 (DK2). Lamentablemente Oculus dejó de soportar hardware de Apple, por lo que no es posible reproducir este tipo de experiencias en sus equipos, al menos con el soporte y versiones más recientes al momento de escribir el presente artículo.</p><p>Nota: Para configurar el hardware hay que seguir las guías de producto de Oculus y de Leap Motion respectivamente. La instalación de Unity puede ser la versión Personal Edition sin costo.</p><p>Esta ya contiene las librerías básicas de compatibilidad, así que es necesario descargar de la página de Oculus los drivers más recientes para evitar inconvenientes.</p><h3>Leap Motion Orion en Unity</h3><p>Una vez instalado todo el hardware necesario, es momento de configurar Unity para desarrollo con Leap Motion Orion. Aunque se trata de una versión Beta, tiene enormes mejoras en la reducción de ruido y detección de gestos con las manos.</p><p>1. Para configurarlo dirígete a la página de desarrollo de Leap Motion Orion. Visita la sección de Unity: https://developer.leapmotion.com/unity, y da click en Download Core Assets. Además podrás descargar todos los add-on modules; funciones que no son parte de los core assets, pero que contienen metáforas de interacción interesantes y son soluciones a la medida de frecuente uso. Todos estos elementos se presentan como .unitypackage, formato comprimido de Unity para almacenar activos que puedes integrar en un proyecto.</p><p>2. El segundo paso es abrir Unity y crear un proyecto nuevo (o usar un proyecto previo si se cuenta con él). Ya dentro del proyecto dirígete a la ruta: Asset/Import Package/Custom Package… para instalar los paquetes.</p><p>3. Ahora selecciona cada paquete; automáticamente se almacenarán assets, scripts, scenes y otros elementos en la librería (ver figura 1).</p><p><img src="/sites/default/files/images/stories/sg52/novedades-6.jpg" width="250" /></p><p>Figura 1. Árbol de carpetas.</p><p>Las escenas de ejemplo están disponibles en las carpetas LeapMotion y LeapMotionModules; puedes probar algunas de las más interesantes. Describo algunos a continuación:</p><p>Leap_Hands_Demo_VR. Encontrarás este demo bajo LeapMotion/Scenes. La escena muestra un entorno VR básico en el que se utiliza Oculus y Leap Motion para mostrar las manos del usuario. La sensación de inmersión, aun con un fondo en gris, es increíble. Además se puede constatar la precisión de seguimiento y registro, es decir, la coincidencia entre la imagen virtual y nuestra sensación de dónde están nuestras manos (ver figura 2).</p><p><img src="/sites/default/files/images/stories/sg52/leaphands-demo.png" width="800" /></p><p>Figura 2. Demo de registro de manos.</p><p>ExampleUIScene. Esta escena se encuentra dentro de la carpeta LeapMotionModules/UIInput/Scenes y contiene ejemplos de interfaces de usuario 2D insertadas en un entorno de VR. La interacción es realmente fluida y los botones de ejemplo (tipo click, toggle y slider) reaccionan muy bien.</p><p><img src="/sites/default/files/images/stories/sg52/novedades-3.png" width="600" /></p><p>Figura 3. Interacción con componentes 2D.</p><p>PinchDrawDemo. Es otro ejemplo muy interesante. Con un poco de práctica es posible escribir y dibujar en un espacio 3D (ver figura 4). La encontrarás en LeapMotionModules/DetectionExamples/Scenes.</p><p><img src="/sites/default/files/images/stories/sg52/novedades-4.png" width="600" /></p><p>Figura 4. PinchDrawDemo.</p><h3>Integrando Leap Motion a tu escena</h3><p>Para integrar Leap Motion a una escena hay que crear algunos objetos desde la carpeta de prefabs de Leap Motion. Estos objetos contienen una cámara configurada para ser el punto de vista en VR y que el visor de Oculus lo pueda controlar, también están disponibles los objetos que representan las manos derecha e izquierda.</p><p>La escena utilizada para este tutorial es muy básica, un par de cubos animados que se desplazan relativamente (ver figura 5).</p><p><img src="/sites/default/files/images/stories/sg52/novedades-5.png" width="600" /></p><p>Figura 5. Escena básica</p><p><img src="/sites/default/files/images/stories/sg52/novedades-6.jpg" width="250" /></p><p>Figura 6. Configuración de Hand Pool</p><p>Para realizar dicho recorrido:</p><ol><li>Ir a LeapMotion/Prefabs en la ventana de assets y arrastrar el prefab LMHeadMountedRig a la escena.</li><li>En la jerarquía de LMHeadMountedRig, hay un objeto llamado LeapHandController.</li><li>Desde el folder LeapMotion/Prefabs/HandModelsNonhuman, arrastrar los prefabs CapsuleHand_L y CapsuleHand_R a la ventana de la jerarquía y meter bajo LeapHandController.</li><li>Desde el folder LeapMotion/Prefabs/HandModelsPhysical, arrastrar el prefab RigidRoundHand_L y RigidRoundHand_R a la ventana de la jerarquía y meterlos igualmente bajo LeapHandController.</li><li>En la ventana del inspector, ubicar el objeto HandPool que está dentro de LeapHandController.</li><li>Debes crear un array en Model Pool; para hacerlo, escribe en Size el valor 2.</li><li>Arrastrar cuatro objetos en la escena (manos derecha e izquierda respectivamente), para que el controlador los pueda referir. Como se muestra a continuación, esto corresponde a dos manos gráficas y dos manos físicas.</li><li>Una vez creado este array de dos elementos, marcar los checkboxes IsEnabled y CanDuplicate de cada set de manos.</li><li>Hay que asegurarse de que esté habilitado el soporte a VR; ubicar el checkbox en Edit/Project Settings/PlayerSettings/OtherSettings/Virtual Reality Supported.</li><li>Para la interacción con objetos es importante que se trate de objetos rígidos (agregando un componente rigidBody a los mismos).</li></ol><p><img src="/sites/default/files/images/stories/sg52/novedades-7.png" width="600" /></p><p>Figura 7. Interacción con objetos rígidos.</p><h3>Conclusiones</h3><p>Con estos sencillos pasos, puedes crear tu propio entorno en VR. Además tienes la oportunidad de verificar el gran avance que hay en cuanto a estas dos tecnologías; combinadas permiten realizar grandes cosas como escenas VR con interacción a través de las manos y no de dispositivos de apoyo.</p><p>Lo mejor es que cualquiera puede revisar y analizar estas herramientas y escenas demo, para integrarlas en sus propios desarrollos. Espero que este tutorial haya sido de tu interés, y que te anime a desarrollar tus propias ideas en un entorno de realidad virtual</p></div> <div class="text-formatted field field--name-field-autor-bio field--type-text-long field--label-above"> <div class="field__label">Bio</div> <div class="field__item"><p>Ernesto Riestra es cofundador y líder de investigación y desarrollo en Metagraphos, firma dedicada a la creación de experiencias digitales para transformar la productividad y el conocimiento de personas y organizaciones. Es Ingeniero Mecánico Electricista egresado de la UNAM y tiene una Maestría en Mecatrónica por la Universidad Técnica de Hamburgo.</p></div> </div> <section class="field field--name-comment field--type-comment field--label-above comment-wrapper"> </section> Wed, 12 Oct 2016 06:30:46 +0000 sg 6820 at https://sg.com.mx Introducción al desarrollo de chatbots https://sg.com.mx/buzz/ponencias/sg-next-2016/introduccion-al-desarrollo-de-chatbots <span class="field field--name-title field--type-string field--label-hidden">Introducción al desarrollo de chatbots</span> <div class="field field--name-field-evento field--type-entity-reference field--label-inline field--entity-reference-target-type-taxonomy-term clearfix"> <h3 class="field__label inline">Evento</h3> <ul class='links field__items'> <li><a href="/buzz/evento-sg/sg-next-2016" hreflang="und">SG Next 2016</a></li> </ul> </div> <span class="field field--name-uid field--type-entity-reference field--label-hidden"><a title="View user profile." href="/user/1" lang="" about="/user/1" typeof="schema:Person" property="schema:name" datatype="" class="username">sg</a></span> <span class="field field--name-created field--type-created field--label-hidden">Wed, 08/31/2016 - 12:20</span> <div class="field field--name-field-autor field--type-entity-reference field--label-inline field--entity-reference-target-type-taxonomy-term clearfix"> <h3 class="field__label inline">Conferencista(s)</h3> <ul class='links field__items'> <li><a href="/buzz/autores/ernesto-riestra" hreflang="und">Ernesto Riestra</a></li> </ul> </div> <div class="text-formatted field field--name-field-embedded-multimedia field--type-text-long field--label-hidden field__item"><p><iframe allowfullscreen="" frameborder="0" height="485" marginheight="0" marginwidth="0" scrolling="no" src="//www.slideshare.net/slideshow/embed_code/key/BYLqp1QIEtLutN" style="border:1px solid #CCC; border-width:1px; margin-bottom:5px; max-width: 100%;" width="595"></iframe></p> <div style="margin-bottom:5px"><strong><a href="//www.slideshare.net/RevistaSG/solid-day-handson-lab-desarrollo-de-chatbots" target="_blank" title="Solid Day - Hands-on lab: Desarrollo de chatbots">Solid Day - Hands-on lab: Desarrollo de chatbots</a> </strong> from <strong><a href="https://www.slideshare.net/RevistaSG" target="_blank">Software Guru</a></strong></div> </div> <div class="text-formatted field field--name-body field--type-text-with-summary field--label-hidden field__item"><p>Esta será una plática técnica en la que se enseñará cómo se programa un chatbot para una aplicación de mensajería y cuales son los principales aspectos a considerar en desarrollos de este tipo.</p> <h3>Requisitos de hardware y software</h3> <p>Para poder realizar los ejercicios debes llevar una computadora personal con el siguiente hardware/software:</p> <ul> <li>Sistema operativo Windows, MacOS o Linux</li> <li>Al menos 4 GB de RAM.</li> </ul> </div> <div class="text-formatted field field--name-field-autor-bio field--type-text-long field--label-above"> <div class="field__label">Acerca del conferencista</div> <div class="field__item"><p>Ernesto Riestra es CIO y fundador de metagraphos, firma dedicada a la creación de experiencias digitales para transformar la productividad y el conocimiento de personas y organizaciones.&nbsp;Además también es el encargado del área de Investigación y Desarrollo&nbsp;de metagraphos. Es Ingeniero Mecánico Electricista, egresado de la UNAM; tiene una maestría en mecatrónica por la Universidad Técnica de Hamburgo. Cuenta con una amplia experiencia técnica en varios campos de la ingeniería, así como de gestión y alta gerencia. Es visionario e innovador; siempre tiene una solución tecnológica revolucionaria para los proyectos de las organizaciones. Dentro de&nbsp;sus áreas de interés&nbsp;se encuentran las tecnologías de&nbsp;realidad virtual, los sistemas de medición, la administración de tecnología&nbsp; y temas como la propiedad industrial y la valuación de tecnología.</p> </div> </div> Wed, 31 Aug 2016 17:20:24 +0000 sg 6595 at https://sg.com.mx Chatbots: escalando la consultoría https://sg.com.mx/buzz/ponencias/sg-next-2016/chatbots-escalando-la-consultoria <span class="field field--name-title field--type-string field--label-hidden">Chatbots: escalando la consultoría</span> <div class="field field--name-field-evento field--type-entity-reference field--label-inline field--entity-reference-target-type-taxonomy-term clearfix"> <h3 class="field__label inline">Evento</h3> <ul class='links field__items'> <li><a href="/buzz/evento-sg/sg-next-2016" hreflang="und">SG Next 2016</a></li> </ul> </div> <span class="field field--name-uid field--type-entity-reference field--label-hidden"><a title="View user profile." href="/user/1" lang="" about="/user/1" typeof="schema:Person" property="schema:name" datatype="" class="username">sg</a></span> <span class="field field--name-created field--type-created field--label-hidden">Tue, 08/30/2016 - 01:16</span> <div class="field field--name-field-autor field--type-entity-reference field--label-inline field--entity-reference-target-type-taxonomy-term clearfix"> <h3 class="field__label inline">Conferencista(s)</h3> <ul class='links field__items'> <li><a href="/buzz/autores/ernesto-riestra" hreflang="und">Ernesto Riestra</a></li> </ul> </div> <div class="text-formatted field field--name-field-embedded-multimedia field--type-text-long field--label-hidden field__item"><p><iframe allowfullscreen="" frameborder="0" height="485" marginheight="0" marginwidth="0" scrolling="no" src="//www.slideshare.net/slideshow/embed_code/key/L3qbxrun1q2nDK" style="border:1px solid #CCC; border-width:1px; margin-bottom:5px; max-width: 100%;" width="595"></iframe></p> <div style="margin-bottom:5px"><strong><a href="//www.slideshare.net/RevistaSG/solid-day-chatbots-escalando-la-consultora" target="_blank" title="Solid Day - Chatbots: Escalando la consultoría">Solid Day - Chatbots: Escalando la consultoría</a> </strong> de <strong><a href="https://www.slideshare.net/RevistaSG" target="_blank">Software Guru</a></strong></div> </div> <div class="text-formatted field field--name-body field--type-text-with-summary field--label-hidden field__item"><p>El uso de tecnologías de información es clave para la revolución de industrias completas, y no es distinto en el sector de la consultoría. Ésta profesión se ha considerado como difícil de escalar; por un lado las grandes empresas de consultoría dependen de atraer talento calificado, y por otro los pequeños despachos o los consultores independientes, no se dan abasto para crecer y tienen cada vez menos tiempo disponible.</p> <p>La evolución de la inteligencia artificial ha dado lugar al surgimiento de asistentes personales y chatbots, que son una parte de las soluciones tecnológicas que transformarán las actividades de consultoría de una manera radical en un futuro. De acuerdo a Narrative Science, el 44% de los directivos cree el mayor beneficio de la IA es la información que puede proveer la comunicación automatizada para tomar decisiones.</p> <p>En esta plática hablaremos de qué aspectos de la consultoría de negocios pueden apoyarse en chatbots, y como estos puede brindar a los consultores independientes o empresas pequeñas, una ruta hacia el crecimiento. También abordaremos los retos a los que deberán enfrentarse y cómo los expertos podrán volcar su experiencia y conocimiento en algoritmos, reglas y otros procesos de inteligencia artificial para ampliar su alcance. Con el apoyo de los chatbots, ahora existirá la oportunidad de formar consultores aumentados</p> </div> <div class="text-formatted field field--name-field-autor-bio field--type-text-long field--label-above"> <div class="field__label">Acerca del conferencista</div> <div class="field__item"><p>Ernesto Riestra es CIO y fundador de metagraphos, firma dedicada a la creación de experiencias digitales para transformar la productividad y el conocimiento de personas y organizaciones.&nbsp;Además también es el encargado del área de Investigación y Desarrollo&nbsp;de metagraphos. Es Ingeniero Mecánico Electricista, egresado de la UNAM; tiene una maestría en mecatrónica por la Universidad Técnica de Hamburgo. Cuenta con una amplia experiencia técnica en varios campos de la ingeniería, así como de gestión y alta gerencia. Es visionario e innovador; siempre tiene una solución tecnológica revolucionaria para los proyectos de las organizaciones. Dentro de&nbsp;sus áreas de interés&nbsp;se encuentran las tecnologías de&nbsp;realidad virtual, los sistemas de medición, la administración de tecnología&nbsp; y temas como la propiedad industrial y la valuación de tecnología.</p> </div> </div> Tue, 30 Aug 2016 06:16:23 +0000 sg 6591 at https://sg.com.mx