Colegio Salesiano Don Bosco

de Guatemala

Proyecto de la Segunda Unidad

“Creación de un Teléfono

Móvil con conexión a

programas funcionales de PHP

con usando HTML5 y CSS3”

Segundo Básico Secciones A,

B, C, y D

Curso: Tecnologías de la

información y comunicación

TICS

Prof. Víctor José Aquino y

Miss Débora Santizo Morales

___________________________

Prof. Víctor José Aquino Urrutia

Colegio Salesiano Don Bosco Tecnologías de la Información y Comunicación

Proyecto de Unidad II UNIDAD: II BÁSICO A,B,C Y D

Marco Teórico:

a) Lenguaje HTML: Es un lenguaje de programación que nos ayuda a la creación de páginas web y el cual se trabaja por medio de etiquetas las cuales poseen una funcionalidad determinada y conexión a otros lenguajes como JavaScript o PHP

b) Lenguaje PHP: Lenguaje de programación el cual por medio de cálculos

determinados, algoritmos y diversas funciones se pueden crear programas, bases de datos entre otros y se puede conectar a MYSQL, HTML, CSS entre otros lenguajes.

c) CSS (Hoja de Estilos de Cascada): Se maneja conjuntamente con html y nos ayuda a definir mediante cierta sintaxis la apariencia y presentación de las páginas web por distintos medios los cuales ayudar a manipular la estética y la apariencia de las páginas web. En nuestro caso lo manejamos por medio de nivel local usando la etiqueta <style type> la cual va dentro de html y se maneja dentro de ella funciones de css que son exclusivamente para la apariencia.

<style type=”text/css”> Body {

Background: #f000; } </style>

d) Elementos que no debe de olvidar: Recuerde que la estructura de html va

relacionada con css. Para trabajar dicho proyecto debe manipular las dos

partes la parte de la página en sí y la parte de la decoración y el adorno. Es

importante saber de que para que usted pueda conectar html con css

debe de tener en cuenta la etiqueta div

PROYECTO:

1. El proyecto consiste en la creación visual por medio de una página web usando HTML5 y CSS3 de la carcasa de un teléfono iPhone OS como el que se ve en la imagen de fondo. DICHO IPHONE POSEE VARIOS ICONOS QUE CON HTML Y CSS SE PUEDEN CREAR HIPERVINCULOS O ENLACES A PAGINAS WEB LOCALES. EN ESTE CASO LO QUE HAY QUE HACER ES QUE AL PRESIONAR CADA ICONO DE CADA APLICACIÓN ME LANZE A UN PROGRAMA DE PHP DEL LIBRO FUNDAMENTOS DE PROGRAMACIÓN DE PHP Y CADA PROGRAMA DEBERÁ CONECTAR Y TENER SU CSS3 (DECORACIÓN)

2. USTED NO TIENE QUE INICIAR DESDE CERO EL CODIGO DE HTML

Y CSS3 DE LA INTERFAZ GRÁFICA DEL IPHONE OS; DICHO DISEÑO

WEB CON CSS3 SERÁ PROPORCIONADO POR SU DOCENTE Y

ADJUNTADO AL PROYECTO LO UNICO QUE TENDRÁ QUE

AGREGAR ES SU PROPIO DISEÑO Y DECORACIÓN AL ARCHIVO

HTML Y CSS QUE CONTIENE EL DISEÑO DE LA INTERFAZ DEL

IPHONE Y LA CONEXIÓN A LOS PROGRAMAS DE PHP CON CSS

POR MEDIO DEL LOCALHOST

3. EL OBJETIVO ES QUE CON EL CODIGO DE HTML Y CSS DEL IPHONE

DADO POR SU DOCENTE USTED LO MODIFIQUE A SU CREATIVIDAD Y QUE AL PRESIONAR CADA ICONO POR MEDIO DE UN HIPERVINCULO ME CONECTE A UN PROGRAMA PHP, SI SON 20 ICONOS SON 20 PROGRAMAS PHP POR EJEMPLO. PERO…. QUE DEBO DE HACER???? QUE PASOS DEBO SEGUIR???

Que debo de hacer?

1. USANDO EL CODIGO DEL IPHONE DADO POR SU MAESTRO DEBERÁ

MODIFICAR SU CSS A MANERA DE QUE SEA CREATIVO, EN CUANTO

A COLOCAR ICONOS QUE POSEE UN TELEFONO, MENSAJERIA,

TELEFONO, APLICACIONES COMO FACEBOOK, INSTAGRAM,

PHOTOBOOTH, ETC, MODIFICAR ENTORNOS, COLORES E IMAGEN

DE FONDO, TIPO DE LETRA, ETC ENTORNO DE INFORMACIÓN DEL IPHONE

2. DEBERÁ MODIFICAR SU ENTORNO GRÁFICO ES DECIR SI LE GUSTA MÁS UN COLOR DE FONDO PARA EL CODIGO HTML Y CSS LO PUEDE CAMBIAR, CAMBIAR ICONOS O PUEDE DEJAR LOS MISMOS, DEPENDE DEL GUSTO DEL DISEÑADOR Y PROGRAMADOR (O SEA USTED EL ALUMNO DE SEGUNDO BASICO DEL COLEGIO DON BOSCO DE GUATEMALA) VEA LOS SIGUIENTES ESTILOS CON DIFERENTES COLORES DE CARCASAS DE

IPHONE

LO QUE DEBE DE HACER ES COLOCAR EN EL CSS EL ESTILO QUE MÁS LE GUSTE MODIFICANDO EL CODIGO ORIGINAL QUE SE LE DIO APLICANDO ASI SU CREATIVIDAD, COLOCANDO IMÁGENES DE LOGOTIPOS SUSTITUYENDO ALGUNOS ORIGINALES (SI LE GUSTA ALGUN ICONO ORIGINAL) LO PUEDE DEJAR NO HAY PROBLEMA. 3. UNA VEZ MODIFICADO EL ENTORNO CSS DEBERÁ MODIFICAR LOS HIPERVINCULOS QUE CORRESPONDE A CADA LISTA DEL ICONO DEL TELÉFONO PARA QUE POR MEDIO DE ESE HIPERVINCULO ME ENLACE A UN PROGRAMA PHP. EL CODIGO QUE SE LE DARÁ POSEE EN HTML UNA LISTA CON DIV Y DENTRO DE ESTA VA CON LA ETIQUETA <a href=””> UN HIPERVINCULO HACIA UN PROGRAMA DE PHP. EJEMPLO:

CUANDO YO LE DÉ CLIC A UN ICONO DEL IPHONE, ME DEBE LLEVAR AL

PROBLEMA DE PHP, EN ESTE CASO multiplos3y5.php. ESTO LO HARE

CON <a href=”multiplos3y5.php> Y CUANDO LE PRESIONE ME LLEVE AL

PROGRAMA

TODOS LOS PROGRAMAS QUE SE REALICEN DE PHP Y QUE ESTEN CONECTADOS CON EL INDEX (PAGINA PRINCIPAL DE HTML Y CSS DEL IPHONE) JUNTO CON LAS IMÁGENES (PARA COLOCAR ICONOS) DEBERÁ ESTAR EN UNA SOLA UBICACIÓN ES DECIR EN UNA CARPETA CON SU APELLIDO, AL MOMENTO DE EJECUTARLAS DEBERÁ DE COLOCAR DICHA CARPETA EN LOCALHOST, EJECUTAR EL XAMPP CONTROL PANEL, PARA LUEGO COLOCAR EL APACHE, SI SE LE PIDEN 20 PROGRAMAS, SON 20 ARCHIVOS PHP QUE VAN SER GUARDADOS MAS LA PAGINA DEL IPHONE EN UNA SOLA UBICACIÓN

4. SEGÚN LA INTERFAZ GRÁFICA DEL IPHONE POSEEN MÚLTIPLES ICONOS , PERO SOLAMENTE SE REALIZARÁN 12 PROGRAMAS LOS CUALES ESTARÁN DIVIDIDOS SEGÚN LOS TEMAS DE LA SEGUNDA UNIDAD

A) CAPITULO 3: ESTRUCTURA SELECTIVA SIMPLE Y DOBLE (IF, ELSE) B) CAPITULO 4: ESTRUCTURA SELECTIVA MULTIPLE (IF ELSE IF Y

FUNCION SWITCH AND CASE) C) CAPITULO 5: ESTRUCTURA REPETITIVA MIENTRAS (WHILE,

CONTADOR, BUCLE POR CADA TEMA DE LA UNIDAD SE HARÁN 4 PROBLEMAS PARA UN TOTAL DE DOCE PROBLEMAS DE PHP (4 PROBLEMAS DE PHP POR CADA TEMA, 4 DE ESTRUCTURA SIMPLE Y DOBLE, ESTRUCTURA MULTIPLE Y 4 DE WHILE). LOS PROBLEMAS LOS SACARÁ INTEGROS DEL LIBRO EN DONDE ESTA EL CODIGO DEL MISMO, PERO DEBERÁ POR CADA PROBLEMA COLOCAR EL RESPECTIVO CSS PARA CADA PROBLEMA, VEA COMO DEBE QUEDAR LA DECORACIÓN EJEMPLO:

ES OBLIGATORIO COLOCAR CSS PARA CADA PROBLEMA, PERO DEBE DE TENER DISTINTO DISEÑO CADA PROBLEMA, EL CODIGO CSS SE LE PROPORCIONARA CON LA BASE DEL IPHONE, SOLO DEBE DE MODIFICARLO Y SU GUSTO Y CRITERIO. 5. PROBLEMAS A REALIZAR (CON CSS OBLIGATORIO PARA CADA UNO) RECUERDE QUE YA TIENE LA SOLUCIÓN SOLO ES DE COLOCARLO EN EL PROYECTO YA QUE CADA PROBLEMA TIENE SU CODIGO CAPITULO 3 DEL LIBRO

PROBLEMA 14 PAG 68 A LA 70

PROBLEMA 16 PAG 73 A LA 75

PROBLEMA 19 PAG 82 A LA 84

PROBLEMA 22 PAG 91 A LA 94

CAPITULO 4 DEL LIBRO

PROBLEMA 26 PAG 108 A LA 111

PROBLEMA 27 PAG 111 A LA 114

PROBLEMA 30 PAG 120 A LA 123

PROBLEMA 33 PAG 129 A LA 132 CAPITULO 5 DEL LIBRO

PROBLEMA 41 PAG 164 A 165

PROBLEMA 42 PAG 166 A 167

PROBLEMA 47 PAG 176 A 177

PROBLEMA 49 PAG 181 A 183

6. LES RECORDAMOS DE QUE SE LE PROPORCIONARÁ EL CODIGO BASE DE HTML Y CSS PARA EL IPHONE, SIN EMBARGO USTED DEBE DE APLICAR TOTAL CREATIVIDAD, CONECTA CONEXIÓN PARA ELLO Y DEBERÁ GUARDARLO DE MANERA DE QUE TODO QUEDE EN UNA SOLA CARPETA, AL MOMENTO DE REALIZARLO YA QUE EN ESA CARPETA GUARDARÁ SUS 12 PROGRAMAS DE PHP DECORADOS, ASI COMO LA PAGINA PRINCIPAL DEL IPHONE DECORADO (PROPORCIONADO POR SU DOCENTE) 7. UNA BASE DE CSS SE LE PROPORCIONARÁ ASI COMO UN MANUAL PARA REFRESCAR EL CONOCIMIENTO. SIGA LEYENDO LO SIGUIENTE….

METODO DE ENTREGA, FECHAS E INFORMACIÓN NO NEGOCIABLE IMPORTANTE

PARTE TEÓRICA: SE DEBERÁ ENTREGAR MANUAL DE USUARIO Y MANUAL DE PROGRAMADOR EN LA MISMA FECHA DE ENTREGA DEL PROYECTO. EN CLASE SE DARÁ MÁS DETALLE AL RESPECTO. NO SE ACEPTARÁ PROYECTO SIN DICHOS MANUALES

PARTE PRÁCTICA (REVISIÓN Y PROCESO DE VERIFICACIÓN DEL PROYECTO) SEMANA DEL 1 AL 5 DE MAYO DEL 2017 EN PERÍODO ORDINARIO DE CLASES, SE REVISARÁ EL PROYECTO PARA VER CÓMO VA, RESOLVER DUDAS, ETC. EN CADA CLASE DE LA UNIDAD, SE DARÁ UN TEMA DEL PROYECTO!! FECHA DE ENTREGA: SEMANA DEL 12 AL 21 DE MAYO DEL 2017 SEMANA PREVIA A LAS FIESTAS CONMEMORATIVAS DE MARÍA AUXILIADORA, POR MEDIO DE LA PLATAFORMA, POR FAVOR LEER EL MÉTODO DE ENTREGA MÉTODO DE ENTREGA:

LA ÚNICA FORMA AUTORIZADA PARA ENTREGAR SU PROYECTO DIGITAL SERÁ POR MEDIO DE LA PLATAFORMA DE EDUCATICS CUYA PÁGINA, USUARIO Y CONTRASEÑA YA FUE ENTREGADA CON LISTADO EN CLASE. EN CLASE SE EXPLICARÁ COMO SUBIR SU ARCHIVO. SE SUBIRÁN ARCHIVOS DE HTML Y CSS COMO APOYO PARA HACER SU PÁGINA, OJO NO DEBE DE SER SU PROYECTO IGUAL A ESOS ARCHIVOS SOLO ES UNA GUIA

HABRÁ UNA FECHA HABILITADA PARA SUBIR SU PROYECTO EN DICHA FECHA SE HABILITARÁ LA PLATAFORMA PARA QUE SUBA SU CARPETA COMPRIMIDA CON SU PROYECTO, DICHA FECHA ES INAMOVIBLE

FECHA DE INICIO: VIERNES 12 DE MAYO HASTA

EL DOMINGO 21 HASTA LAS 12:00 DE LA NOCHE, SI LO ENTREGA DESPUÉS DE ESA FECHA Y HORA NO PODRÁ YA QUE LA PLATAFORMA QUEDARÁ AUTOMÁTICAMENTE CERRADA

UNA VEZ ENVIADO NO PODRÁ VOLVERLO A ENVIAR YA QUE SE REGISTRA LA HORA Y FECHA DE ENTREGA POR FAVOR VERIFICAR QUE TODO VAYA CORRECTAMENTE HABILITADO

COMO ES UNA PAGINA WEB LLEVA HTML, CSS, ICONOS DE DECORACIÓN, ASI COMO SUS 12 PROGRAMAS DE PHP POR LO QUE DEBERÁ ENTREGARLO EN UNA CARPETA COMPRIMIDA EN ZIP Y TENER SU PROGRAMA WINRAR. SI NO SABE COMPRIMIR

UNA CARPETA ACERQUESE A CUALQUIER DOCENTE DEL AREA DE TICS QUE CON GUSTO SE LE AYUDARÁ

SI NO TIENE EL PROGRAMA PARA COMPRIMIR CARPETAS DESCARGUELO GRATUITAMENTE DE LA SIGUIENTE PAGINA

https://www.winrar.es/descargas

EN SU MANUAL DE USUARIO DEBERÁ TENER IMPRESA LUEGO DE LA CARÁTULA O PORTADA LA RÚBRICA DE CALIFICACIÓN LA CUAL SE ADJUNTA EN ESTE MISMO DOCUMENTO. ESTO SERVIRÁ PARA CALIFICAR DICHO PROYECTO SINO NO SE LE CALICARÁ RÚBRICA DE CALIFICACIÓN (OBLIGATORIA IMPRESA)

“Tienes la capacidad de dar mucho y más

en tu trabajo” (Prof. Victor)

Criterios de Evaluación

Excelente Bueno Debe mejorar

Se denota creatividad en el código del iphone, evidencia conexión correcta de hipervínculos con los iconos hacia los programas de php con la debida conexión con xampp control panel y la funcion de localhost y apache 5pts

Se denota que no realizó trabajo alguno para ser creativo en el código proporcionado, asi como hay múltiples errores de hipervínculos y en la conexión a php 3pts

No hay conexión de los hipervínculos de la etiqueta <a> con los programas de php que se le indicaron 2pt

Colocó los 12 programas debidamente decorados con el código de CSS que se le proporcionó con la debida creatividad en cada uno de estos programas de php 4pts

De los 12 programas o no los realizó todos o los dejo a medias y se evidencia la poca ejecución de CSS que se le dio por la poca creatividad en estos 3pts

No compilo casi nada solo código fuente con muchos errores y ejecución errónea en el localhost 2pts

Los 12 programas ejecutaron correctamente tal y como lo especifica el código del libro con su decoración respectiva 4pts

Algunos programas de los 12 que son ejecutaron correctamente de los que especifica el libro 2pts

Guardo sus archivos correctamente 2pts

Parte Teórica (Fase 1) Creatividad en la realización 2 punto Del manual de usuario Explicación correcta de las etiquetas y funciones 2 punto en css principales en el manual de programador Caratula 1 punto Total 5 puntos

Lista de cotejo: (deberá estar impresa y pegada en la tapa del cd para que se le califique)

Parte Práctica (Fase 2) Uso correcto de CSS 2 punto Uso correcto de la base HTML (hipervínculos, 2 puntos imágenes, tablas, texto) Aplico Creatividad en el proyecto 7 puntos Código sin errores 2 puntos Orden y funcionalidad correcta 2 puntos

15 puntos