MATERIAL EDUCATIVO DE LA LOGICA COMPUATCIONAL

UNIVERSIDAD POLITECNICA DE VICTORIA Martin,Aceves . Julian,Velasquez

Logica Computacional

9 de diciembre de 2013

Resumen
En esta seccion se les dara un peque no resumen acerca de como se utizaron las herraminetas Flash cs6 y Dreamweaver para crear una pagina educativa la cual se subira a un servidor local para poder visualizarla en otras maquinas que no sea en donde se hizo para esto es necesario descargar un servidor para montarla en dicho servidor y que los demas puedan disfrutar de esta linda pagina educativa que les ayudara a conocer mas sobre la logica computacional para dicho propocito se tubo que investigar de las tecnologias y de la materia para incertar la informacion.

didactica y diferente a lo normal que es en el salon de clase. Antes de empezar a dise nar la pagina web en el editor con la herramineta Flash CS6 se creo un bosqueto de las partes que integrarian la pagina asi como para desarrollar el simulador se buscaron las sentencias correctas que ocuparia como lo son el If, For y el While que son sentencias de decision que se ocupan en el lemguaje Action Script 3.0 asi como en cualquier lenguaje de programacion despues de implentar la logica que ocuparia para desarrollar el simulador de conectores logicos en la parte de dise no de la pagina se utilizo las herramientas de ash al empezar a desarrollar en el entorno graco se fueron colocando los colores y los botones adecuados a la pagina a si como los textos adecuados en cada seccion.

1.

Introducc on

En esta peque na Introducc on se les dara a conocer como se a desarrollado la pagina con las tecnologias Flash CS6 y Dreamweaver para publicar el archivo HTML y posteriormente montarlo a un servidor para poder compartir dicha pagina con la comunidad estudiantil de la Universidad Politecnica de Victoria.

Para lograr el proposito inicial que era informar correctamente en una pagina web lo visto en clase se inicio el desarrollo de la pagina interactiva para el interes de los alumnos se inicio con la idea de hacerla con un lenguaje de programacion de java para web como lo es jsp pero tras presentar unas cuantas fallas en el IDE NetBeansla cual consistia en que al momento de ejecutar el codigo que se tenia el IDE no abria el navegador para ver los resultados 2. Desarrollo esta falla se trato de reparar sin exito por lo cual se estubo Para empezar con el desarrollo de la pagina se tiene analizando en que otro software para programacion web que instalar la Suite de Adobe Flash CS6 tambien se se podia desarrollar al analizar varias opciones se llego a debe buscar un servidor para poder montar la pagina a una solucion la cual consistia en desarrollar la pagina en dicho servidor , para hacer la pagina se utilizo el lenguaje Flash CS6 y Dreamweaver para generar un archivo HTML no de programacion de Flash como lo es Action Script 3.0 y poder subirlo a un servidor y tambien para que el dise se hiciera aun mejor que en el jsp por detalles de dise n o se para esto se tubo que estudiar dicho lenguaje tambien se llego a la conclucion de que Flash seria la mejor herramienta investigo sobre todas las unidades de la materia de logica comptacional se recopilo la informacion mas clara para los para el desarrollo de la pagina tambien por que la haria estudiantes dicha recopilacion fue agregada a una seccion mas interactiva para los usuarios. que esta dividida por unidad en la cual se encuentra la informacion mas relevante de cada una de ellas para que el El codigo mas relevante de la pagina es el del simulador de alumno pueda entender la logica computacional de manera conectores logicos el cual fue desarrollado por los alumnos 1

de la clase de multimedia el cuatrimestre pasado el cual se and2.text=; res1.text=; mostrara en los siguientes renglones: Acontinuacion se les mostrara el dise no de el simulador calcular1.addEventListener(MouseEvent.CLICK, And); de conectores logicos ya en la pagina: function And (event:MouseEvent):void if (Number(and1.text==F)(Number(and2.text==F) res1.text=F; if (Number(and1.text==F)(Number(and2.text==V) res1.text=F; if (Number(and1.text==V)(Number(and2.text==F) res1.text=F; if (Number(and1.text==V)(Number(and2.text==V) res1.text=V; En cada boton que se tiene en el simulador se tubo que poner este codigo con las diferentes combinaciones para obtener el resultado de cada conector logico La Negacion La negacion de la formula P es la formula P.S ?mboloutilizado : Correspondenciaconelespan ol : N o, noesciertoque, esf alsoque, etc.

Despues de aver visto el codigo mas relevante se les mostrara el procedimiento para hacer o crear una pagina web como la que se desarrollo en este proyecto lo primero La Disyuncion seria la intalacion del software necesario para el desarrollo el cual seria la suite de Adobe Flash CS6 ya despues de haber La disyuncion de las formulas P, Q es la formula P ? Q . instalado la suite se abrira el Flash CS6 para el desarrollo de Las formulas P, Q se llaman disyuntos. Simbolo utilizado: ? la pagina se utlizaron las herramientas que tiene ash para Correspondencia con el espa nol: o. el dise no como lo es degrada dos , alpha , clips de pelicula y muchas otra mas que te ayudan a ser mejor tu animacion La Conjuncion o pagina para poder usar esta herramienta se investigo en la web el lenguaje de progracion para poder dominarlo para La conjuncion de las formulas P, Q es la formula P Q. llevar acabo con facilidad para hacer la logica de la pagina Las formulas P, Q se llaman conyuntos. asi como lo son los botones , los diferentes links para ver paginas que le pueden interesar a los usuarios asi como La Implicacion donde se pueden comunicar con el desarrollador de la pagina. La implicacion o condicional de las formulas P, Q es la formula P -Q. Las formulas P es el antecedente y la formula Q es consecuente de la implicacion. Simbolo utilizado: - Adobe Flash es una de las herramientas m as utilizadas para realizar animaciones y v deos, por lo que resulta de suma importancia tener conocimientos sobre ella, pero es a un m as importante tener habilidades en su lenguaje de programaci on, ya que con ello podemos realizar lo que Correspondencia con el espa nol: P -Q signica: si P nuestra mente desee. Pensado en esto el centro Belatrix entonces Q; Q, si P; P es condicion su?ciente para Q; Q es ofrece su curso de ActionScript 3 con Flash CS6. condicion necesaria para P, etc. ActionScript es un lenguaje de programaci on para la Para el boton de borrar se compuso de el siguiente codigo: tecnolog a Flash de Adobe con el que el programador o dise nador puede desarrollar aplicaciones orientadas a aginas web din amicas, progral1.addEventListener(MouseEvent.CLICK, limpiand) fun- objetos, con las que crear p mas de simulaci on y educativos, o cualquier proyecto que ction limpiand (event:MouseEvent):void requiera interactuar con gr acos y sonidos. Se trata de una and1.text=; 2

herramienta imprescindible para todos aquellos interesados en convertirse en profesionales del mundo del dise no web y gr aco, sector que goza en la actualidad de amplias salidas profesionales.

se ha mejorado la compatibildad con PhoneGap desde Dreamweaver . Funciones exclusivas para Creative Cloud. Creative Cloud es la nueva forma de adquirir productos Adobe, como Dreamweaver, mediante suscripci on mensual o anual, de esta forma se tiene acceso m as rapido a las acLa herramienta de la suite de adobe Dreamweaver se uti- tualizaciones y se puede disponer de los archivos de trabajo on con acceso a internet. Adem as hay lizo para algunos ajustes de dise no web ya en el navegador en cualquier ubicaci olo estan disponibles para los suscriptores con el archivo HTML previamnte publicado con Flash para funciones que s on de etiquetas HTML 5 desde el poder manipular el archivo con Dreamweaver es necesario de Cloud, como la inserci saber un poco de codigo HTML ya que este software solo panel Insertar, la compatibilidad con Edge Animate o la usqueda din amica en Mac. usa ese tipo de lenguaje para poder correqir los errore de b dise no ya en la web se tubo qie impliementar dicho lenguaje para centrar la pagina y aderirle una barra de scroll o de Cualquier editor de texto permite crear p aginas web. movimiento. Para ello s olo es necesario crear los documentos con la extensi on HTML o HTM, e incluir como contenido del documento el c odigo HTML deseado. Puede utilizarse Dreamweaver CS6 es un software f acil de usar que incluso el Bloc de notas incluido en Windows para hacerlo. permite crear p aginas web profesionales. Las funciones de edici on visual de Dreamweaver CS6 permiten agregar r apidamente dise no y funcionalidad a las p aginas, sin la Pero crear p aginas web mediante el c odigo HTML es m as necesidad de programar manualmente el c odigo HTML. laborioso que hacerlo utilizando un editor gr aco. Al no Se puede crear tablas, editar marcos, trabajar con capas, utilizar un editor gr aco cuesta mucho m as insertar cada insertar comportamientos JavaScript, etc.., de una forma uno de los elementos de la p agina, al mismo tiempo que es muy sencilla y visual. m as complicado crear una apariencia profesional para la p agina, sobre todo si no estamos demasiado familiarizados en es cierto que escribir Adem as incluye un software de cliente FTP completo, con el HTML. Aunque tambi odigo nos da m as control sobre el, y sobre todo al permitiendo entre otras cosas trabajar con mapas visuales el c a a entender lo que estamos haciendo de los sitios web, actualizando el sitio web en el servidor sin principio, nos ayudar apidamente. Hoy en d a salir del programa. Plantillas dise no uido. El acceso a la y podremos aprender HTML r aginas web. Uno de web a trav es de todo tipo de dispositivos est a experimen- existe una amplia gama de editores de p as utilizados, y que destaca por su sencillez y por las tando un aumento importante. Ahora es habitual acceder a los m internet desde el tel efono m ovil y desde las tabletas. Esto numerosas funciones que incluye, es Adobe Dreamweaver as de Dreamweaver, existen otra serie de buenos complica el dise no de los sitios web porque los dispositivos Adem aginas web, como pueden ser Microsoft Exson de diferentes dimensiones. Una forma de afrontar editores de p este problema es utilizando el dise no uido, este tipo de presion Web, Amaya, Bluesh, NVU, KompoZer o Quanta dise no hace que la p agina se adapte autom aticamente a Plus. Algunos de los cuales tienen la ventaja de ser gratuitos. las dimensiones del dispositivo. Este tipo de dise no utiliza HTML 5 por los que los navegadores antiguos no son Para poder poner una p agina web en Internet, es nececapaces de representarlo correctamente. Sin embargo, exis- sario contratar a alguna empresa con servidores que pueda ten librerias de Javascript que solucionan este inconveniente. alojarla y hacerla accesible desde Internet las 24 horas del d a. El precio por disponer de espacio propio en el servidor a de la empresa, del espacio en disco, volumen Transiciones. Las transiciones permiten pasar propieda- depender des CSS de un estado inicial a otro estado nal de forma de transferencia y otras opciones que podamos contratar. continua. Con transiciones se pueden lograr vistosos efectos Hay empresas que ofrecen este servicio gratuitamente, pero con ciertas limitaciones: poco espacio de disco, lentitud y de animaciones. nombre de nuestra p agina precedido por el de la suya. Hay en en cuenta que estas empresas deben Fuentes Web. Existen sitios web con multitud de nuevas que tener tambi fuentes que pueden dar un aire distinto a nuestros dise nos generar ingresos de alguna forma, por lo que se dedican a aginas, de p aginas web En esta versi on, Dreamweaver permite vender espacios publicitarios dentro de nuestras p incorporar los archivos de nuevas fuentes de forma sencilla. publicidad que no podremos negarnos a incluir en ellas. Intergraci on con PhoneGap mejorada. PhoneGap es un servicio para generar aplicaciones para tel efonos m oviles en Por estos motivos, no se recomienda utilizar hospedaje las plataformas m as utilizadas (Android, Apple, ...) ahora gratuito para la p agina de una empresa, aunque s es 3

aceptable para una p agina personal, sobre todo al comienzo. Por otro lado, hay grandes empresas de Internet que ofrecen otras alternativas para publicar en Intenet de forma gratuita en forma de blog. Como por ejemplo, Blogger de Google o MySpace de Microsoft. Un blog tiene una estructura denida y no ofrece tanta libertad como una p agina web a la hora del dise no. Tambi en tenemos Google Sites que permite modicar directamente el c odigo HTML. En el resto del curso nos referiremos preferentemente a p aginas web creadas desde cero por el usuario, sin restircciones de dise no. Cuando se va a contratar un servicio de hospedaje es necesario contratar tambi en un dominio, tarea de la que se suele encargar la propia empresa de hospedaje. Registrar un dominio consiste en registrar un nombre para nuestra p agina. Este nombre no puede estar repetido en Internet, ha de ser u nico, al igual que ocurre con los nombres de las empresas. Es posible registrar un mismo nombre con distintas terminaciones, como por ejemplo, .net, .org, .es o .com. La terminaci on hace referencia al pais (.es para Espa na, .com.mx para M exico, .pe para Per u, ...) o al tipo de p agina (.com para comerciales, .org para organizaciones, .mobi para tel efonos m oviles o celulares, ...) En el caso de los hospedajes gratuitos no es necesario registrar ning un dominio, ya que nuestra p agina no ser a m as que un archivo dentro de la de la empresa contratada. Puede escucharse muy dicil pero realmente no lo es ya que en interbet hay maucha ayuda sobre como hacer ajustes en tu archivo HTML con Dreamweaver es muy sencillo solo se tiene que acoplar un poco a la inteerfaz de dicho software para manejarlo a su antojo y manipular cualquier archivo HTML publicados en ash o solo programados en ash. El reto de este proyecto fue el tener que subir la pagina a un servidor para que todos puedan visitar este sitio en la internet ya que no se sabia nada sobre este tema. El dise no de la pagina fue dado previamente por una suegerencia del maestro la cual fue donde poner lo logos , que logos poner , colores que se usarian en el fondo , el tipo de letra y color etc. todo esto fue para determinar un estadar de dise no aunque esto puede variar dependiendo de los desarrolladores ya que la sugerencia de el maestro era solo seguir ese estandar o cambiarlo al gusto de los desarrolladores pero que mantubiera los colores de la institucion y los demas aspectos serian modicados a cosideracion de el o los desarrolladores a conveniencia de estos. Ya en la invetigacion se aclararon muchas cosas de como subir los archivos a cualquier servidor para esto se investigo en internet, youtube y consultando a algunos maestros 4

de la institucion.Dicha invetigacion fue de mucha ayuda para poder llegar a los resultados obtenidos los cuales se demostraran en la proxima seccion de este aticulo pero antes se les expliacara un poco de el como subir la pagina a internet con los siguientes pasos: Lo primero que debes hacer es buscar un sitio para registrar tu dominio, puedes elegir el que te convenga, cuando lo hayas elegido entra y registra tu sitio, anota todos los datos de este sitio por que m as adelante los volveras a utilizar. Pero si quieres un servidor gratutito solo vamos directamente a la p agina de alojamiento: http://www.000webhost.com/92816.html Ya teniendo su dominio registrado, o simplemente quiere un dominio gratis del tipo www.tudominio.servidor.net, accede al hospedaje Web: http://www.000webhost.com/92816.html Y dentro del sitio selecciona la opci on SIGN UP o entre los botones de arriba selecciona ORDER NOW, no hay por donde perderse. Ahora te aparecer a un formulario donde lo primero que ver as ser a dos campos de dominio: uno que dice: I want to host my own domain (domain must be registered already) y otro que dice: or, I will choose your free subdomain (recommended), el primero es por si tu ya tienes registrado un dominio en otro sitio y el segundo es para subir tu pagina gratis como he explicado anteriormente. Entonces seg un sea tu elecci on ingresa el nombre de dominio(o sea de tu pagina Web) en cualquiera de los dos (te aconsejo que si no sabes nada de dominio elijas el segundo) y mas abajo ingresa datos relacionados con tu cuenta como: tu nombre, tu correo, el password con el cual entrar as a el hospedaje Web cuando quieras controlar tu sitio y al nal haz clic en el bot on Create my account. Si lo hiciste bien entrar as a otra pantalla con datos de tu cuenta y un mensaje de bienvenida, haz clic en enter control panel para continuar. Si no has llegado a esta pantalla revisa los datos del formulario anterior para buscar cualquier error que te este afectando. Ahora depende de ti, si lo que quieres es subir tu pagina ya hecha solo selecciona la opci on File manager y este te llevar a a una pantalla donde deber as hacer login, para este ve a tu correo (el que ingresaste en el formulario) y revisa un mail que te mando el sitio 000webhost ah estar an tus datos, copia el username y p egalo en el login e ingresa tu contrase na para entrar a una pantalla donde podr as subir tus archivos es f acil de usar y puedes ponerlo en espa nol, o si lo preeres puedes crear tu

pagina selecciona la opci on Website Builder y tambi en usar una plantilla seleccionando Website templates. Ahora si anteriormente registraste en otro sitio tu dominio, accede a View account details y veras una tablas con datos asi: ns01.000webhost.com 66.197.153.229 ns02.000webhost.com 64.235.48.196, copia los nombres y ve al sitio donde registraste tu dominio y busca una opci on que diga cambiar nombre de servidores o cambiar DNS, y cambia los nombres preestablecidos por los que copiaste anteriormente. Esto es muy importante.

se obtuvieron de el desarrollo.

Para iniciar con los resultados se puede decir que en el proyecto desarrollado se obervo la dicultad que tiene el desarrollar una pagina en ash lo primero que se tiene que hacer es abrir un archivo los primeros resultados fueron los de la barra de menu principal que ensegida se les mostrara:

El siguiente resultado es el de el cuerpo de la pagina en el que respectivamente seria el mismo para todas las unidades de la materia : Sitio web que se indica en los pasos anteriores. Los pasos anteriores fueron los que se siguieron para subir la pagina a un servidor que en este caso fue un servidor gratuito por medio de un subdominio el cual es otorgado despues de haber cumplido con una serie de requisitos que pide la pagina donde se registro despues de un tiempo se debe liberar el subdominio para poder usarlo como se requiera en este caso solo fue para subir una pagina ya hecha previamente. Al terminar todos estos pasos que se indicaron ya podra teber su sitio web en la internet y todas las personas podran visitarlo en cualquier computadora con conexion a ineternet y claro con la dirreccion de su sitio para poder visitarlo de lo contrario no se puede entrar al sitio bueno solo se podria mediante dirrecion ip que se le asigna al momento de subir su pagina.

3.

Resultados

En esta seccion se dara a conocer todos los resultados de cada una de las invetigaciones y de todos los archivos que 5

Acontinuacion se les muentra el resultado nal de la pagina web:

4.

Concluciones

En conclucion para hacer una pagina web distinta de las demas se debe tener mucho tiempo para hacer un buen dise no y pensar bien en a que usuarios se va a hacer llegar para de acuerdo a eso empezar a desarrollar la pagina despues de hacer todo el desarrollo se vera reejado en el archivo HTML para poder pasar a subirla a la internet. Despues de todo esto e llegado a la conclucion de que es necesario tener conocimientos basicos de programacion y dise no web ademas de tiempo necesario para terminar su cometido, en cuanto a la logica computacional es muy compleja y muy util para la programacion entre otras cosas para entender mejor la electronica tablas de verdad etc.

5.

Referencias

1. Enrique Paniagua Ar s; Juan Luis S anchez Gonz alez; Fernando Mart n Rubio. (2003) Logica Computacional. Ediciones Paraninfo. S.A. 2. Mar a Teresa Hortal a Gonz alez, Javier Leach Albert, Mario Rodr guez Artalejo (2001) Matematica Discreta y Logica Computacional. Editorial Complutense. 3. Oscar Trelles Montero, Di ogenes Rosales Papa (2000) Introduccion a la Logica Computacional. Fondo Editorial PUCP.