DISEÑO E IMPLEMENTACION DE UN PORTAL WEB
SOLUCIONES INTEGRALES CON TECNOLOGIA APLICADA
Reporte de Estadía para obtener el Título de Técnico Superior Universitario en Tecnologías de la Información y Comunicación
ANABEL CHAPARRO ORTIZ
Santiago de Querétaro, Qro. Julio, 2010.
UNIVERSIDAD TECNOLÓGICA DE QUERÉTARO Voluntad. Conocimiento. Servicio.
Tecnológica de
Querétaro
cn=Universidad Tecnológica de Querétaro, o=Universidad Tecnológica de Querétaro, ou, [email protected], c=MX Fecha: 2010.08.23 09:33:29 -05'00'
DISEÑO E IMPLEMENTACION DE UN PORTAL WEB
SOLUCIONES INTEGRALES CON TECNOLOGIA APLICADA S.A. DE C.V.
Reporte de Estadía para obtener el Título de Técnico Superior Universitario en Tecnologías de la Información y Comunicación
Asesor de empresa
M. EN C. ADRIANA ROJAS MOLINA Asesor de universidad
M. EN C. JORGE LUIS MORALES MONTES Alumno
ANABEL CHAPARRO ORTIZ
Santiago de Querétaro, Qro. Julio, 2010.
UNIVERSIDAD TECNOLÓGICA DE QUERÉTARO Voluntad. Conocimiento. Servicio.
ÍNDICE
INTRODUCCIÓN
CAPÍTULO I SOINTA (SOLUCIONES INTEGRALES CON TECNOLÓGIA APLICADA) 1.1 SOINTA 1.1.1 Giro de la empresa 8 1.1.2 Enfoque organizacional 10 1.1.3 Misión 10 1.1.4 Visión 10 1.2 Organigrama de SOINTA 11
CAPÍTULO II DISEÑO E IMPLEMENTACION DE UN PORTAL WEB
2.1 Análisis de necesidades 13
2.1.1 Definición del proyecto 13
2.1.2 Objetivos 13
2.2 Plan de trabajo 14
2.2.1 Diagrama de Gantt 14
2.2.2 Especificaciones 15
CAPÍTULO III DESARROLLO DEL PROYECTO
3.1 Diseño 18
3.2 Desarrollo 21
3.3 Instalación 24
CAPÍTULO IV CONCLUSIONES
4.1 Dificultades 28
4.2 Logros obtenidos 29
4.3 Recomendaciones 29
INTRODUCCIÓN
Los servicios a través de internet se han incrementado a lo largo de varios años, tenemos una evolución desde el web 1.0 hasta lo que actualmente se está definiendo como web 3.0. Inicialmente SOINTA, se había propuesto utilizar internet como un medio para expresar sus capacidades técnicas y de ventas a sus clientes, sin ofrecer con ello un medio de retroalimentación o de servicios extras a través de Internet, ni de control interno. Sin embargo, con las posibilidades que nos da la tecnología en la actualidad y el buen asesoramiento, pasamos de la idea inicial de tener una página web de sointa a un proyecto integral que nos permita establecer más servicios útiles al interior de la empresa, pero sobre todo para mejorar el punto de contacto con el cliente.
Aunado a la propuesta inicial, se pensó en enriquecerla y hacer un trabajo integral, ya no solo tener una página web de contacto unidireccional con nuestros clientes a un contacto completo, que nos permita tener una retroalimentación y sobre todo un mejor control del conocimiento de la organización al interior. Los servicios que se pretenden alcanzar incluyen en esta primera fase del proyecto. La creación de una página web que deje a disposición toda la información de servicios, productos y consultoría que brinda la empresa, además de esto, tener la posibilidad de interactuar dinámicamente con los contenidos, mejorarlos, ampliarlos y sobre todo mantener una imagen de cambio continuo hacia nuestros clientes y prestadores de servicios. La sistematización de la página web también permitirá, entre otras consideraciones, agregar una plataforma educativa con la finalidad de
mejorar la capacitación interna y externa. Agregar el servicio de web mail, para tener opción de entrar a los correos desde el exterior.
En el presente documentó se exhiben de manera general los aspectos necesarios para la creación de un sitio web, iniciando con la idea, hasta llegar a un punto de entrega. El primer capítulo hace referencia a los datos de la empresa en la cual se desarrollo el proyecto, y para la cual se elaboró el portal web.
El segundo capítulo menciona los objetivos que se pretendieron alcanzar, y se argumenta la necesidad de elaborar un proyecto, con un plan de trabajo descrito.
El tercer capítulo define las etapas de desarrollo del proyecto, detalladamente conforme el proceso.
El cuarto capítulo describe las dificultades obtenidas y superadas durante el desarrollo de cada etapa para la satisfactoria elaboración del proyecto.
CAPÍTULO I
SOINTA
(SOLUCIONES
INTEGRALES CON
TECNOLOGIA
APLICADA S.A. DE C.V.)
1.1 Soluciones Integrales con Tecnología Aplicada 1.1.1.1 Giro de la empresa
SOLUCIONES INTEGRALES CON TECNOLOGÍA APLICADA dedicada al mantenimiento preventivo y correctivo de software y hardware de TI, desarrollo de software y hardware adecuado a las necesidades de cada empresa. Así como la venta de equipos computacionales, software comercial y capacitación en el uso y aplicación de Tecnologías de la Información.
SOINTA está conformada por un equipo multidisciplinario de profesionales con amplia experiencia en el desarrollo de software y hardware. Ofrecemos diferentes tipos de soluciones a la medida de cada empresa, usando nuevas metodologías en el procesamiento de información y tecnologías de vanguardia, aplicando criterios de calidad para la satisfacción total del cliente. Las áreas tecnológicas en las que ofrecemos nuestros servicios son:
• Servicios de Mantenimiento preventivo y Correctivo de Infraestructura Informática.
• Desarrollo de Sistemas Informáticos • Desarrollo de Aplicaciones Web • Soluciones y Desarrollo Tecnológico
• Desarrollos Multimedia, Internet y Soluciones de Marketing Digital.
• Capacitación.
• Desarrollo de software y hardware para sistemas empotrados.
• Consultoría en compra de equipo, software comercial y servicios tecnológicos.
• Capacitación, formación y adiestramiento en el uso de herramientas informáticas.
1.1.2 Enfoque organizacional
Dentro de nuestra cultura organizacional es claro que lo más valorado es el departamento de consultoría en software y hardware, debido a que el personal tiene contacto directo con el cliente. Es quien asesora las decisiones que mejor satisfagan las necesidades de una manera confiable.
1.1.3 Misión
Ofrecer soluciones confiables en Tecnologías de información, aplicando políticas, procedimientos y estándares de calidad, que optimicen el tiempo y recursos de nuestros productos y servicios; y que genere una ventaja competitiva para nuestros clientes.
1.1.4 Visión
Consolidarnos como una empresa exitosa y reconocida en el desarrollo de soluciones de TI, que coadyuve al fortalecimiento de las cadenas de valor existentes en la región y a la generación de nuevas cadenas de valor. Posicionarnos como empresa Líder en el mercado a través de la mejora continua de nuestros procesos y servicios.
1.2 Organigrama de SOINTA
Área Responsabilidad Rol
Administración y Operaciones (Soporte administrativo) Responsable de seguimiento de cobro y presupuesto de proyectos Gestor de Recursos Líder de proyecto (Supervisión) Lleva a cabo la administración y seguimiento de proyectos Gestor de Procesos Director General (Dirección)
Lleva a cabo la gestión con clientes. Da seguimiento a proyectos. Responsable de proyectos, Responsable de recursos humanos Líder de proyecto (Soporte administrativo) Da seguimiento técnico a proyectos y supervisa a los programadores Gestor de desarrollo y mantenimiento de software Analista de proyectos (Control de calidad) Evalúa la viabilidad de proyectos y realiza la administración de proyectos Gestor de Negocios, Gestor de administración de proyectos específicos.
Programador (Ventas) Realiza tareas de
programación de proyectos, además de
proporcionar soporte técnico cuando se realiza
venta de equipos Responsable de Conocimiento de Organización Dirección l
Líder de proyecto Administración
y Operaciones Líder de proyecto 2 Analista de proyectos Programador
Fig. 1.1 Organigrama empresa Soluciones Integrales con Tecnología Aplicada
CAPÍTULO II
DISEÑO E
IMPLEMENTACION DE UN
PORTAL WEB
2.1 Análisis de necesidades
2.1.1 Definición del proyecto
Dentro del área de ventas la comunicación es muy importante para la transmisión de información dirigida al cliente sobre los servicios que se ofrecen, y la manera de contactar a la empresa. En este momento la pagina web, se encuentra en construcción y solo muestra un mensaje. Por lo tanto el proyecto a desarrollar es un portal web para la empresa (SOINTA), que permita, vender productos, presentar los servicios, e interactuar con los clientes de la manera más accesible.
2.1.2 Objetivos
Integrar un sistema de información WEB para la empresa SOINTA, la cual brinde los servicios de información necesarios de una forma estable y eficiente.
1.- Incrementar ventas
2.- Informar a la comunidad de los avances tecnológicos y el uso estratégico de los mismos.
3.- Desarrollo de herramientas para el auto aprendizaje y capacitación en tecnologías de la información aplicadas a la educación.
14
2.2 Plan de trabajo
A continuación se presenta el diagrama de Gantt y sus especificaciones. 2.2.1 Diagrama de Gantt id No mb re de tar ea Du rac ion 10 de ma yo ‐ 24 de ma yo 21 de julio ‐ 22 de jul io 26 de julio ‐ 9 de ag os to 1D es arr oll o de por tal we b 3 me se s 2d ias 2D ise ño 2 se ma na s 3D es arr oll o 2 me se s 4I ns tal aci ón 2 dia s 5P rue ba s y pu es ta a punt o 2 se ma na s 25 de ma yo ‐ 19 de julio Fig. 2.1 Diag rama de Ga ntt
2.2.2 Especificaciones 1. Diseño
En ésta etapa se realizará el diseño del mapa del sitio web completo con una ubicación de los módulos de forma general, se revisarán los colores y los logotipos en la búsqueda de una solución adecuada y atractiva para los usuarios. En esta etapa también se buscará y se rentará un web hosting apropiado.
Se llevaran a cabo reuniones con el asesor de estadía dentro de la empresa para validar el diseño del sitio web. Se realizará un prototipo de imagen, y se presentará a los empresarios para su evaluación y autorización.
2. Desarrollo
Durante el desarrollo se mostrará la evolución del proyecto, en esta etapa se recopilará la información que será vaciada al portal web.
Se adquirirán nuevos conocimientos en la herramienta Jommla y Moodle para su aplicación dentro del desarrollo del portal. Después del uso de estas herramientas se realizarán implementaciones, modificaciones y ajustes al portal y se generará la documentación entregable.
3. Instalación
Durante el proceso de instalación se cargarán los archivos al web-hosting.
4. Pruebas y puesta a punto
En esta etapa se realizarán pruebas de cada uno de los servicios que ofrecerá el portal para controlar su funcionamiento y evitar problemas.
CAPÍTULO III
DESARROLLO DEL
PROYECTO
3.1 Etapas del proyecto 3.1.1 Diseño
En esta etapa, la empresa SOINTA, tomó la decisión de la renta del web-hosting y compro el dominio http://www.sointa.com/. En esta dirección se instaló un prototipo, en la fig. 3.1 se muestra la primera pantalla prototipo en el sitio web de la empresa.
Fig. 3.1 Previo instalado en la página web de la empresa
Para comenzar a trabajar, se creó una nueva carpeta con la siguiente dirección: http://www.sointa.com/servicio/, donde se llevó a cabo la Instalación de Jommla, que después se ligó a la página principal.
Durante la etapa del diseño, se hicieron varias propuestas de imagen para adaptarse.
En la figura 3.2, se muestran las áreas importantes (banner, menú y área de información), en la figura 3.3, se muestra el estilo que se deseaba obtener para la presentación de la página.
Fig. 3.2 División de áreas Fig. 3.3 Estilo en diseño
En la fig. 3.4 se muestra una propuesta de imagen
Fig.3.4
Esta página, mostrada en la imagen 3.5, fue creada a partir de código HTML, desde el editor DreamWeaver, usando tablas, hojas de estilo y java script, además Photoshop donde fueron editadas las imágenes.
Se hizo un bosquejo de la página web, mostrando aéreas y contenidos para su próxima realización.
Fig. 3.5 Bosquejo inicial
3.1.2 Desarrollo
Teniendo el diseño en el cual estuvo basado el proyecto, la empresa SOINTA proporcionó la información necesaria, tal como misión, visión y contacto.
Se aprendió del uso de la herramienta Jommla, los conocimientos fueron aplicados al desarrollo del portal.
Jommla es un sistema administrador de contenidos, con un diseño amigable que permite a los usuarios publicar artículos en la web, es tan sencillo de usar como escribir un correo electrónico. El sistema Jommla está escrito en un lenguaje PHP y desarrollado por un gran equipo. Con un mapa del sitio, que fue hecho para llevar una guía del proyecto y saber los contenidos necesarios, fueron modificadas plantillas y secciones de Jommla para el diseño e imagen del portal.
Se realizó un prototipo de imagen, que fue presentado a los empresarios para su evaluación y autorización, ubicada en la página principal de la siguiente dirección: http://www.sointa.com/servicio/ y se hizo un redireccionamiento desde http://www.sointa.com.
En la fig. 3.7 se muestra la página principal del portal utilizando Jommla por primera vez.
Fig. 3.7 Pagina de prueba del portal usando Jommla
Se fueron editando módulos, categorías, secciones, artículos, y dentro de los artículos, imágenes y texto, dando una mejor vista al portal web.
Fig. 3.8 Pagina principal del portal
Para una parte importante del portal, que es la capacitación, se estudio la herramienta Moodle, se creó una nueva carpeta dentro del dominio SOINTA, donde se instaló Moodle para su administración, y que posteriormente se ligó a la portada del sitio para su uso, esta se accede desde el menú principal.
La herramienta Moodle es un sistema de gestión de cursos. Pensada en educadores para crear un ambiente educativo virtual, que permite crear comunidades de aprendizaje en línea, apoyo, para generar clases y cursos. Teniendo dentro del portal una guía confiable de ayuda a temas variados.
La página principal de Moodle se modificó editando imágenes y personalizando la interfaz de acuerdo a los requerimientos de la empresa.
Fig. 3.9 Pagina principal del Moodle
Se convocó a los empresarios para una presentación del uso de las herramientas Moodle y Jommla, se dio una introducción, y un avance de proyecto y de acuerdo a las especificaciones se realizaron las implementaciones, modificaciones y ajustes al portal.
3.1.3 Instalación
En la instalación se cargaron los archivos al web-hosting. Para las herramientas usadas como Jommla, y Moodle fue necesario cargar el paquete comprimido desde un protocolo de transferencia de archivos (FTP), y descomprimirlo dentro del web-hosting para su manipulación
Desde la red. Fue necesario ligar cada una de las subcarpetas creadas a la página principal, así como redireccionar la página principal a la de Jommla.
Ya con todos los componentes y herramientas instaladas se realizaron modificaciones tales como: cargar, descargar, remplazar y eliminar archivos desde el web hosting. Para finalizar se hicieron pruebas de funcionamiento. En la fig. 3.10 se muestra la pantalla del Cpanel del web-hosting, esta imagen se muestra para dar a conocer el entorno web en el cual se estuvo trabajando.
3.1.4 Pruebas y puesta a punto
Se realizó una revisión minuciosa de cada herramienta, sección y servicios que ofrece el portal.
Se hicieron pruebas y demostraciones de cada página que esta publicada, así se asegura el correcto funcionamiento del portal y se evita tener problemas de ejecución durante su uso.
Fig. 3.11 Pantallas del sitio web
CAPÍTULO IV
CONCLUSIONES
4.1 Dificultades
Una de las dificultades que se presentó fue el desconocimiento de las herramientas Jommla y Moodle, ya que no se había interactuado antes con estas plataformas, pero se resolvió utilizado información recolectada en diferentes fuentes de información en Internet y con la asesoría de mi tutor dentro de la empresa.
La falta de tiempo, se volvió una dificultad, debido a que, se realizaron mas actividades dentro y fuera de la empresa, ( curso de beca, venta de páginas web, venta de equipo de computo, registro RENIECYT a la empresa, etc. ) incluyendo el proyecto, que de alguna manera demandaban tiempo.
Otra dificultad se dio al momento de usar PhotoShop, esta es una aplicación para la creación, edición y retoque de imágenes; ya que está herramienta fue utilizada también por primera vez durante la estadía. Para solucionarlo se recolectaron videos y tutoriales de uso de la herramienta y siempre se contó con la asesoría del tutor de la empresa.
4.2 Logros obtenidos
Como empresa se logró tener una página web que brinda información de manera eficiente, por lo que las ventas incrementaron, además con la instalación del módulo de capacitación se puede informar a la comunidad de los avances tecnológicos, y su uso estratégico mediante tutoriales y cursos fomentan el auto aprendizaje, desarrollando así la capacitación en tecnologías de la información aplicadas a la educación.
Otro logro obtenido como empresa, es la integración de ésta al Registro Nacional de Instituciones y Empresas Científicas y Tecnológicas (RENIECYT). Este es un instrumento de apoyo a la investigación científica, el desarrollo tecnológico y la innovación del país a cargo del CONACYT a través de cual identifica las empresas del sector público, social y privado que llevan a cabo actividades relacionadas con la investigación y desarrollo de la ciencia y la Tecnología en México.
4.3 Recomendaciones
Para una mejor administración de la página se recomienda asignar cuentas limitadas con tareas específicas, tales como la publicación de actualizaciones, o noticias de último momento dentro de la página principal, para mantener al día el portal.
En el apartado de virtual de cursos, se recomienda subir temas con seriedad y crear foros de información para atraer la atención al sitio.
MATERIAL DE
herramienta Jommla, junio 2010,
http://www.joomlaspanish.org/,
Julio 2010.
MOODLE MEXICO, Link de descarga gratuita de la herramienta Moodle, cursos y capacitación, junio 2010,
http://www.moodlemexico.com/,
Julio 2010.
CURSO PHOTOSHOP BASICO EN LINEA, curso gratis con ejercicios y video tutoriales, junio 2010,
http://www.aulaclic.es/photoshop/,