Instituto Tecnológico Superior · 2020-04-21 · de diseño que hagan que el diseño de tu sitio...

12
Instituto Tecnológico Superior Vida Nueva INFORME FINAL DEL PROYECTO DE VINCULACIÓN CON LA SOCIEDAD Y SERVICIO A LA COMUNIDAD CARRERA: TECNOLOGÍA EN INFORMÁTICA PROYECTO: DESARROLLO PÁGINAS WEB DE LA DIRECCIÓN DISTRITAL DE EDUCACIÓN ZONA 9 DE LA ESCUELA DE EDUCACIÓN GENERAL COLEGIO GRAN COLOMBIA COORDINADOR DEL PROYECTO: ING. DARÍO MORALES. FECHA DE ENTREGA: 28/09/2018 2018-2018

Transcript of Instituto Tecnológico Superior · 2020-04-21 · de diseño que hagan que el diseño de tu sitio...

Page 1: Instituto Tecnológico Superior · 2020-04-21 · de diseño que hagan que el diseño de tu sitio funcione de forma efectiva. Por ejemplo, por mucho que guste a todos el color rojo,

Instituto Tecnológico Superior

Vida Nueva

INFORME FINAL DEL PROYECTO DE VINCULACIÓN

CON LA SOCIEDAD Y SERVICIO A LA COMUNIDAD

CARRERA: TECNOLOGÍA EN INFORMÁTICA

PROYECTO: DESARROLLO PÁGINAS WEB DE LA DIRECCIÓN

DISTRITAL DE EDUCACIÓN ZONA 9 DE LA ESCUELA DE

EDUCACIÓN GENERAL COLEGIO GRAN COLOMBIA

COORDINADOR DEL PROYECTO: ING. DARÍO MORALES.

FECHA DE ENTREGA:

28/09/2018

2018-2018

Page 2: Instituto Tecnológico Superior · 2020-04-21 · de diseño que hagan que el diseño de tu sitio funcione de forma efectiva. Por ejemplo, por mucho que guste a todos el color rojo,

Instituto Tecnológico Superior

Vida Nueva

Av. Maldonado y 4ta transversal (Guamaní: Terminal Sur-Ecovía) Teléfono: 3076032 / 3653212 www.istvidanueva.edu.ec Tecnológico Vida Nueva

1. ASIGNATURAS RELACIONADAS A LAS ACCIONES DE VINCULACIÓN CON LA SOCIEDAD

Y SERVICIO A LA COMUNIDAD:

Para el desarrollo del presente proyecto intervendrán conocimientos obtenidos en las

distintas asignaturas como lo son:

- Introducción a base de datos, en la cual se adquieren conocimientos básicos

del manejo de bases de datos relacionales, las cuales con importantes para el

almacenamiento de las configuraciones de las páginas web.

- Base de datos II.se realizan prácticas avanzadas del manejo y administración de

motores de bases de datos, las mismas que son útiles para el desarrollo de páginas

web.

- Utilitarios se adquieren las habilidades básicas del manejo de páginas web por

medio del desarrollo de código, como lo es HTML, CSS y JQUERY.

- Programación web I muestra conceptos complejos de programación web con

php para el desarrollo de páginas web dinámica.

- Programación Web II presenta el desarrollo y administración de páginas web

dinámico mediante gestor de contenido, los mismos que ayudan a desarrollar los

proyectos de una manera más rápida y con menor costo.

En todas las asignaturas antes mencionadas el estudiante obtuvo los conocimientos

necesarios para el desarrollo del proyecto.

2. LÍNEAS DE VINCULACIÓN CON LA SOCIEDAD Y SERVICIO A LA COMUNIDAD

Aplicación de conocimientos prácticos en la solución de hardware y

software.

3. ANTECEDENTES

En cumplimiento con las leyes, normativas y reglamentos a los que se

rige el Instituto Tecnológico Superior Vida Nueva, se crea y desarrolla

proyectos de vinculación con la sociedad y servicio a la comunidad, a la

vez con el espíritu de colaboración y para el desarrollo de las

comunidades e instituciones beneficiarías.

Una plataforma web es el conjunto de tecnologías, estándares y

protocolos que permiten que las páginas web como parte de un sitio web

puedan ser desplegadas en el navegador del usuario para fines que

podrían ir desde simple información hasta el más sofisticado proceso de

automatización remota.

Page 3: Instituto Tecnológico Superior · 2020-04-21 · de diseño que hagan que el diseño de tu sitio funcione de forma efectiva. Por ejemplo, por mucho que guste a todos el color rojo,

Instituto Tecnológico Superior

Vida Nueva

Av. Maldonado y 4ta transversal (Guamaní: Terminal Sur-Ecovía) Teléfono: 3076032 / 3653212 www.istvidanueva.edu.ec Tecnológico Vida Nueva

El proyecto está enfocado en el desarrollo de páginas web para las

instituciones educativas de la dirección distrital de la zona nueve

perteneciente al cantón Quito, esté trabajo permitirá dar realce a las

instituciones educativas, publicar información de eventos, horario de

clases, actividades, etc., misma que servirá de medio para que los

estudiantes y la comunidad en general conozcan las actividades que se

realiza dentro de las diferentes instituciones.

El trabajo con las instituciones se realizara de manera colaborativa, las

instituciones se comprometerán a colaborar en todos los procesos del

desarrollo de la página web, sobre todo en el proceso de entrega de

información y por parte del Instituto Tecnológico Superior Vida Nueva se

compromete a realizar un trabajo de calidad en todas las diferentes

fases del proyecto hasta su entrega y aprobación.

4. OBJETIVOS

1. Objetivo Institucional: Cumplir con las leyes, normativas y reglamentos a los que se

rige el Instituto Tecnológico Superior Vida Nueva y de esta manera colaborar con el

crecimiento de la comunidad.

2. Objetivo del proyecto: Colaborar con el avance y el mejoramiento del estilo de vida

de la comunidad, mediante la ejecución de proyectos en los cuales se pueda brindar

apoyo a la comunidad.

3. Objetivo para el estudiante: Fomentar el espíritu de colaboración en los estudiantes

del Instituto Tecnológico Superior Vida Nueva y de esta manera colaborar con las

necesidades de la comunidad.

5. DESARROLLO

Como en cualquier proyecto técnico, el desarrollo de páginas web no es un camino

sencillo. Son muchos los frentes que debemos tener en cuenta. Y conviene ir paso a

paso para no dejarnos nada fuera en el proceso.

1. Definir los objetivos del sitio web

Aunque parezca muy genérico se hará referencia a que se necesita tener un plan de

negocio. ¿Qué se quiere conseguir con el web? ¿Es un e-commerce? ¿Una página de

Page 4: Instituto Tecnológico Superior · 2020-04-21 · de diseño que hagan que el diseño de tu sitio funcione de forma efectiva. Por ejemplo, por mucho que guste a todos el color rojo,

Instituto Tecnológico Superior

Vida Nueva

Av. Maldonado y 4ta transversal (Guamaní: Terminal Sur-Ecovía) Teléfono: 3076032 / 3653212 www.istvidanueva.edu.ec Tecnológico Vida Nueva

servicios? Hay que marcar unos objetivos te ayudará a definir el contenido web y

saber qué tipo de web se necesita para el negocio.

Por ejemplo, si el objetivo es conseguir más leads, más contactos con clientes

potenciales necesitarás mostrar de forma atractiva lo que se oferta y permitir de

forma sencilla entrar en contacto.

Si por el contrario se quiere aumentar ventas a través de Internet, se tendrá que

centrarte en simplificar el proceso de pago.

En este paso puede que no se necesite a ningún experto en desarrollo de páginas web

o diseño web. No obstante sí que podría resultar interesante contar con un consultor

de negocio para saber cómo enfocar el proyecto si así lo consideras.

2. Definir los contenidos para la página web

Es necesario que tengas muy en cuenta lo que va a decir en las páginas web. Los

contenidos son los que van a posicionar en los buscadores, si quieres apostar por el

SEO. Pero también son los que van a convencer al usuario que visite el sitio web.

Es esencial que en una primera fase definas muy bien qué quieres decir, qué

terminologías y que vocabulario quieres utilizar. Pero será clave que cuentes con un

experto para retocar el resultado final. Contar con un buen redactor SEO y

comunicador será clave para tener un resultado convincente.

3. Prepara un mockup y wireframe

El mockup no es más que un ‘skech’, un esbozo o un borrador muy básico de las

páginas y la estructura general de la web.

Puedes definir tus páginas principales y cómo se navega entre ellas. Pero sin entrar en

detalles de textos. Solo a nivel de idea y concepto, ¿vale? El siguiente paso tendrá que

darlo un diseñador. O si se tiene conocimientos de herramientas de wireframe se

puede hacerlo por cuenta propia. En realidad no es más que llevar tu mockup inicial a

un modelo digital con capacidad de interacción.

4. Ahora se necesita un diseño web

Una vez se tenga claro cómo se quiere que sea la interacción, toca establecer a de

manera muy detallada un buen diseño web. En muchas ocasiones se quiere participar

activamente. Y eso está bien, pero también se debe dejar trabajar al diseñador.

Page 5: Instituto Tecnológico Superior · 2020-04-21 · de diseño que hagan que el diseño de tu sitio funcione de forma efectiva. Por ejemplo, por mucho que guste a todos el color rojo,

Instituto Tecnológico Superior

Vida Nueva

Av. Maldonado y 4ta transversal (Guamaní: Terminal Sur-Ecovía) Teléfono: 3076032 / 3653212 www.istvidanueva.edu.ec Tecnológico Vida Nueva

Cualquier página web debe atender a la cuestión de la usabilidad y unas proporciones

de diseño que hagan que el diseño de tu sitio funcione de forma efectiva.

Por ejemplo, por mucho que guste a todos el color rojo, no se puede abusar de él en

un diseño web. Se deberá atender a los consejos de nuestro diseñador y encontrar un

equilibrio de los colores y los que son cómodos para el usuario.

A veces se pide ayuda a algún amigo programador para que nos eche un cable. Pero,

¡atención! Un programador no es un diseñador. Encontrar a un profesional del diseño

que haga lo que realmente nos conviene para alcanzar nuestros objetivos es clave.

Puede que en una situación así sea útil subcontratar el diseño de tu página web.

5. Desarrollo de páginas web: Es hora de escribir código

¿Preparado para lo más complejo? Es la hora de desarrollar el proyecto que se ha

planteado. Dependiendo de la complejidad de tu proyecto se necesitaras un

desarrollador, dos de ellos, o hasta un equipo completo de desarrollo de páginas web.

También influye mucho la celeridad con la que se quiera terminar el trabajo. Cuanta

más urgencia más equipo y horas de desarrollo necesitaremos invertir.

Recuerda que cuánto más tengas adelantado y definido antes de empezar con el

desarrollo más sencillo será. Es recomendable que tengas todo el tema de contenidos

y de diseño preparado para cuándo busques a un desarrollador.

6. No te olvides de ser… ‘Mobile friendly’

Aunque incluya este apartado separado de los anteriores está muy relacionado con el

diseño web y el desarrollo de páginas web. Tiene su propio apartado porque cada vez

es más importante atraer a los usuarios móviles. Pero también para posicionar en los

buscadores.

Cualquier experto en SEO te dirá que es recomendable empezar por diseñar para móvil

y después pasar a web. Es lo que denominan diseño ‘mobile first’. Aún así, no es

obligatorio por el momento. Lo que sí debes contemplar es tener un sitio web

completamente ‘responsive’ o adaptable a cualquier dispositivo móvil.

7. Testea, testea y testea

No solamente cuando esté acabado el desarrollo de páginas web, sino cada vez que

termines una fase. El testeo es esencial, especialmente si lo realizan personas que no

han desarrollado o diseñado el producto. Nos hará entender qué debemos mejorar a

nivel de diseño y usabilidad.

Page 6: Instituto Tecnológico Superior · 2020-04-21 · de diseño que hagan que el diseño de tu sitio funcione de forma efectiva. Por ejemplo, por mucho que guste a todos el color rojo,

Instituto Tecnológico Superior

Vida Nueva

Av. Maldonado y 4ta transversal (Guamaní: Terminal Sur-Ecovía) Teléfono: 3076032 / 3653212 www.istvidanueva.edu.ec Tecnológico Vida Nueva

Pero también nos permitirá detectar posibles fallos y ver qué cosas debemos corregir

antes del lanzamiento de nuestra página web.

8. Lanzamiento de tu página

Una vez hayas revisado todos los aspectos anteriores debemos prepararnos para el

gran lanzamiento. Eso sí, antes de hacerlo deberás preparar un par de cosillas para que

sea un lanzamiento espectacular.

Prepara nota de prensa. Explicando quién eres y por qué eres una novedad.

Ten a mano información relevante e imágenes de tu marca. Prepara imágenes, logos,

fotos de equipo, etc.

Genera contactos para promocionar tu sitio. Es recomendable que trabajes en esto

antes del lanzamiento y programes acciones con colaboradores o influencers de tu

sector.

9. Estrategia de marketing

Este apartado va más allá del desarrollo de páginas web para entrar en el del

marketing online. Pero si quieres que tu desarrollo web tenga éxito debes prestar

atención a tu estrategia. Si has seguido la recomendación de optimizar los contenidos

para SEO, puedes retomar el marketing digital desde este punto. Apuesta por una

estrategia de posicionamiento web y empieza a crecer en los primeros meses.

10. Análisis y mejora de tus resultados

¿Cómo saber si has alcanzado tus objetivos iniciales? Seguro que recuerdas el primer

punto de esta lista: Definir objetivos. La analítica nos ayudará a definir si has

conseguido los objetivos y metas marcadas en un inicio. Si los has conseguido, genial,

marquemos nuevos retos.

Si no los has alcanzado deberás identificar porqué, dónde fallas y marcar nuevas

modificaciones para lograrlos. ¿Estás preparado?

Este es un proceso continuo para cualquier negocio o empresa que se lance al mundo

online. Es muchas ocasiones encontrar a los profesionales adecuados para cada etapa

es complicado. Por eso en el instituto tecnológico Superior Vida Nueva ayudamos a

desarrollar este tipo de trabajos a las instituciones de educación pública con las cuales

se tiene convenios de colaboración interinstitucionales.

En el caso concreto del colegio Gran Colombia se ha seguido todos los pasos antes

mencionados para el desarrollo, publicación y además se realizó la compra de dominio

y alquiler de servidor web, siempre apuntando al desarrollo tecnológico de esta

Page 7: Instituto Tecnológico Superior · 2020-04-21 · de diseño que hagan que el diseño de tu sitio funcione de forma efectiva. Por ejemplo, por mucho que guste a todos el color rojo,

Instituto Tecnológico Superior

Vida Nueva

Av. Maldonado y 4ta transversal (Guamaní: Terminal Sur-Ecovía) Teléfono: 3076032 / 3653212 www.istvidanueva.edu.ec Tecnológico Vida Nueva

institución y gracias a los servicios entregados la misma dispone de un portal

informativo en los cuales podrá publicitar información que resulte relevante para la

comunidad educativa, como lo es:

- Historia de la institución.

- Misión

- Visión

- Autoridades

- Oferta Académica

- Conctactos.

- Etc.

El alquiler del servidor y nombre de dominio, está contratado por un periodo de un

año desde julio del 2018 hasta julio del 2019, los gatos generados por esté servicio los

asume el Instituto Tecnológico Superior Vida nueva. Una vez finalizado el tiempo

establecido la institución beneficiaria se hará cargo de los gastos que está genere

mantener el servicio por auto gestión.

El martes 25 de septiembre a las 10 de la mañana se realizó una reunión la Lic. Lorena

Oña encargada del área de sistemas del Colegio Gran Colombia, también se contó la

compañía de la Lic. Valeria del Hierro directora distrital, conjuntamente con el grupo

de estudiantes responsables del desarrollo del portal web y en compañía del Ing. Diego

Camacho director de vinculación. Se procedió a realizar la socialización a las

autoridades, alumnos y colaboradores del Colegio Gran Colombia, se explicó de

manera general el funcionamiento, ventajas y funcionalidades que tiene el desarrollo

de este tipo de proyectos.

Después de la socialización con los estudiantes y autoridades, se precedió a a realizar

la capacitación a la Lic. Lorena Oña persona que administrara el sitio, misma que es

parte del área de informática de esa institución, se le facilito los accesos, manuales de

usuario y contraseñas. También se le dio una pequeña guía de la administración del

sitio, mostrándole las principales actividades que se pueden realizar como

administradores y con esto se dio por finalizado la entrega de la página web a la

institución beneficiada.

6. RESULTADOS.

1. Cumplimiento de las leyes, normativas y reglamentos a los que se rige el Instituto

Tecnológico Superior Vida Nueva y de esta manera colaborar con el crecimiento de

la comunidad.

2. Colaboración con la comunidad en el avance y mejoramiento del estilo de vida,

con la ejecución de proyectos de servicio a la comunidad.

3. Se fomentó el espíritu de colaboración en los estudiantes del Instituto Tecnológico

superior vida nueva y se colaboró con las necesidades de la comunidad.

Page 8: Instituto Tecnológico Superior · 2020-04-21 · de diseño que hagan que el diseño de tu sitio funcione de forma efectiva. Por ejemplo, por mucho que guste a todos el color rojo,

Instituto Tecnológico Superior

Vida Nueva

Av. Maldonado y 4ta transversal (Guamaní: Terminal Sur-Ecovía) Teléfono: 3076032 / 3653212 www.istvidanueva.edu.ec Tecnológico Vida Nueva

4. Desarrollo, diseño y publicación del sitio web, para que de esta manera la

comunidad educativa pueda mantenerse informada de las actividades que se

realizan en la institución.

7. CONCLUSIONES

1. Es importante el crecimiento de la comunidad, en colaboración y coordinación de

los estudiantes de Instituto Tecnológico Superior Vida Nueva, para el desarrollo de

conocimiento y potencialidades informáticas actuales.

2. Con el desarrollo de proyectos los estudiantes aplican sus habilidades y

conocimientos para su desenvolvimiento y objetivo profesional.

3. Al fomentar el espíritu de colaboración de los estudiantes con la comunidad, los

mismos desarrollan valores morales como el respeto, la responsabilidad y la pro

actividad entre otros.

8. BIBLIOGRAFÍA

FÍSICO

Eric, T. (2014). JOOMLA! 3. España:Anaya Multimedia Editorial

TOM, C. (2012) Wordpress, Joomla!, Drupal, Plone Seguridad en los Sistemas de Gestión de

Contenidos. España: Anaya Multimedia Editorial

Miguel, P.(2014).Creación Y Diseño Web Edición 2014 España: Anaya Multimedia Editorial

Mark, D.(2012).Libro Oficial Joomla //Programación//.España: Anaya Multimedia Editorial

Stephen, B. (2012). Joomla Guía Completa España: Anaya Multimedia Editorial.

DIGITAL

Calvopiña Morillo, J. C., & Velasco Pacha, V. P. (18 de 05 de 2012). ESPE. Obtenido de ESPE: http://repositorio.espe.edu.ec/xmlui/handle/21000/5361 Carlos, C. M. (18 de 05 de 2012). espe. Obtenido de espe: http://repositorio.espe.edu.ec/xmlui/bitstream/handle/21000/5361/T-ESPE-0333304.pdf Orozco Lara, F. (17 de 07 de 2015). UPSE. Obtenido de UPSE: http://repositorio.upse.edu.ec/handle/46000/2392 Silva Castillo, J. (01 de 06 de 2016). unach. Obtenido de unach:

http://dspace.unach.edu.ec/handle/51000/1820

Page 9: Instituto Tecnológico Superior · 2020-04-21 · de diseño que hagan que el diseño de tu sitio funcione de forma efectiva. Por ejemplo, por mucho que guste a todos el color rojo,

Instituto Tecnológico Superior

Vida Nueva

Av. Maldonado y 4ta transversal (Guamaní: Terminal Sur-Ecovía) Teléfono: 3076032 / 3653212 www.istvidanueva.edu.ec Tecnológico Vida Nueva

9. ANEXOS

9.1 REGISTRO DE ASISTENCIAS

Registro de Participantes

PROYECTO O ACTIVIDAD : DESARROLLO PÁGINAS WEB DE LA DIRECCIÓN DISTRITAL DE

EDUCACIÓN ZONA 9 DE LA ESCUELA DE EDUCACIÓN GENERAL COLEGIO GRAN COLOMBIA.

ASIGNATURAS RELACIONADAS A LAS ACCIONES DE VINCULACIÓN CON LA SOCIEDAD Y

SERVICIO A LA COMUNIDAD:

- Introducción a base de datos.

- Base de datos II.

- Utilitarios.

- Programación web I

- Programación Web II

RESPONSABLES :

- Ing. Darwin Arias.

- Ing. Diego Camacho.

- Ing. Darío Morales.

CARRERA : Informática

NIVEL : Sexto

JORNADA : Presencial

PERIODO ACADÉMICO : ABRIL 2018 – SEPTIEMBRE 2018

FECHA EJECUCIÓN : 26/04/2018 – 25/09/2018

INSTITUCIÓN BENEFICIARIA: Colegio GRAN COLOMBIA

No. APELLIDOS Y NOMBRES MAIL C.C. NRO. DE

TELÉFONO

1 CEFLA VALDIVIEZO JORDY ALEXANDER [email protected] 1719527945 967565140

2 CHAUCA VIVAS KEVIN ALEXANDER [email protected] 1725300410 999040681

3 CHICAIZA ÑACATO BRYAN ANIBAL [email protected] 1723591465 998284142

4 MOROCHO MICHAY KEVIN DAVID [email protected] 1754423265 984411238

Docente/s responsable/s del Proyecto:

Ing. Darío Morales. Coord. De Vinculación carrera de Informática

Ing. Darwin Arias. Coord. Carrera de Informática

Ing. Diego Camacho. Docente ITSVN

Page 10: Instituto Tecnológico Superior · 2020-04-21 · de diseño que hagan que el diseño de tu sitio funcione de forma efectiva. Por ejemplo, por mucho que guste a todos el color rojo,

Instituto Tecnológico Superior

Vida Nueva

Av. Maldonado y 4ta transversal (Guamaní: Terminal Sur-Ecovía) Teléfono: 3076032 / 3653212 www.istvidanueva.edu.ec Tecnológico Vida Nueva

9.2 Fotos y Videos

Page 11: Instituto Tecnológico Superior · 2020-04-21 · de diseño que hagan que el diseño de tu sitio funcione de forma efectiva. Por ejemplo, por mucho que guste a todos el color rojo,

Instituto Tecnológico Superior

Vida Nueva

Av. Maldonado y 4ta transversal (Guamaní: Terminal Sur-Ecovía) Teléfono: 3076032 / 3653212 www.istvidanueva.edu.ec Tecnológico Vida Nueva

Page 12: Instituto Tecnológico Superior · 2020-04-21 · de diseño que hagan que el diseño de tu sitio funcione de forma efectiva. Por ejemplo, por mucho que guste a todos el color rojo,

Instituto Tecnológico Superior

Vida Nueva

Av. Maldonado y 4ta transversal (Guamaní: Terminal Sur-Ecovía) Teléfono: 3076032 / 3653212 www.istvidanueva.edu.ec Tecnológico Vida Nueva