Transcription
Escola Tècnica Superior d’Enginyeria InformàticaUniversitat Politècnica de ValènciaDESARROLLO DE UNA TIENDAELECTRÓNICA PARAMANUALIDADESTrabajo Fin de GradoGrado en Ingeniería InformáticaAutor: Laura Olivares HerruzoTutor: Félix Buendía García2014/2015
DESARROLLO DE UNA TIENDA ELECTRÓNICA PARA MANUALIDADES2
ResumenEn el presente trabajo fin de grado se mostrará el diseño e implementación de una tienda onlineutilizando la herramienta Prestashop 1.6. El trabajo será una tienda online dedicada a la venta demanualidades a través de Internet sin posesión de tienda física. Esta tienda online tendrá diversosapartados dedicados a la tienda, el creador de las manualidades y un blog dedicado a presentarinformación y novedades a cerca de la tienda, integrado con la misma web.La finalidad de la web es tanto dar a conocer este tipo de manualidades como la realización deventas a nivel nacional, dado que en el momento previo a la creación del eCommerce la venta essolo de carácter local.Palabras clave: Prestashop, tienda online, manualidades, página web.AbstractIn this Final Proyect it will be shown the design and implementation of an online shop workingwith the Prestashop 1.6 tool. This proyect will be an online shop dedicated to the sell of crafts onthe Internet without having a physical store. This online shop will have different sectionsdedicated to the store, to the creator of the crafts and a dedicated blog to show information andnews about the shop, the blog will be integrated with the web page.The purpose of the website is both to present this kind of crafts such as making sales nationwide,since before developing the eCommerce the sales are just local.Keywords: Prestashop, online store, crafts, web page.3
DESARROLLO DE UNA TIENDA ELECTRÓNICA PARA MANUALIDADESTabla de contenidosIntroducción . 81.1Motivación. 81.2Objetivos. 81.3Contexto . 91.4Estructura. 11Especificación de requisitos .132.1Introducción .132.1.1Propósito .132.1.2Ámbito .132.1.3Definiciones, acrónimos y abreviaturas .132.1.4Visión general .152.2Descripción general.152.2.1Perspectiva del producto . 162.2.2Funciones del producto . 162.2.3Características del usuario . 172.2.4Restricciones generales . 172.2.5Supuestos y dependencias . 182.3Requisitos específicos . 182.3.1Requisitos funcionales . 182.3.2Requisitos de interfaces externos . 242.3.3Restricciones de eficiencia. 252.3.4Atributos . 252.3.5Otros requisitos . 25Estudios previos . 263.1Introducción . 263.2¿Qué es un CMS?. 263.3Estudio sobre los CMS Magento y Prestashop . 263.3.1Magento . 273.3.2Prestashop . 283.4Elección de Prestashop frente a Magento. 28Análisis . 324.14Casos de uso . 32
4.1.1Diagrama de contexto . 324.1.2Modelo inicial . 324.2Diagrama de clases . 34Diseño . 355.1Introducción . 355.2Diseño MVC en Prestashop. 355.2.1Nivel de modelo . 355.2.2Nivel de vista . 355.2.3Nivel de controlador . 355.3Tema seleccionado . 365.3.1Modificación del tema . 365.4Modificación de estructura . 375.5Integración de blog de WordPress a la tienda. . 39Implementación . 416.1Implementación en Prestashop . 416.2Herramientas utilizadas . 416.2.1Prestashop . 416.2.2XAMPP. 426.2.3Cpanel . 426.2.4PhpMyAdmin . 426.2.5Photoshop . 426.2.6Sublimetext . 436.3Componentes de la aplicación . 436.3.1Módulos instalados . 436.3.2Módulo creado . 45Posicionamiento web. 467.1Selección de palabras clave . 467.2Optimización de las imágenes de la web . 477.3Generar sitemap.xml . 487.4Crear Google Analytics . 487.5Crear Google Webmaster . 497.5.1Dar de alta sitemap . 49Evaluación .518.1Comprobación de enlaces rotos .518.2Comprobación de resolución . 528.3Compatibilidad con los principales navegadores . 525
DESARROLLO DE UNA TIENDA ELECTRÓNICA PARA MANUALIDADESConclusiones . 549.1Trabajo realizado. 549.2Valoración personal . 54Bibliografía. 55Anexos . 57611.1Anexo de instalación de XAMPP . 5711.2Anexo de instalación de Prestashop . 5811.2.1Instalación online . 5911.2.2Instalación en localhost . 63
Índice de ilustracionesIlustración 1. Ejemplo de tienda en Magento. . 10Ilustración 2. Ejemplo de tienda en Prestashop. . 10Ilustración 3. Ejemplo de tienda en OpenCart. . 11Ilustración 4. Logo Magento. . 27Ilustración 5. Logo Prestashop. . 28Ilustración 6. Interfaz tras la instalación de Prestashop. 29Ilustración 7. Interfaz tras la instalación de Magento. 30Ilustración 8. Interfaz tras la instalación de Magento con simpledata. . 30Ilustración 9. Diagrama de contexto. . 32Ilustración 10. Modelo inicial. . 32Ilustración 11. Modelo inicial administrador. . 33Ilustración 12. Modelo inicial usuario registrado. . 33Ilustración 13. Modelo inicial visitante. . 34Ilustración 14. Diagrama clases. . 34Ilustración 15. Modelo vista controlador. 35Ilustración 16. Previsualización tema. . 36Ilustración 17. Slider principal. 37Ilustración 18. Menú navegación. 37Ilustración 19. Columna información lateral. . 38Ilustración 20. Productos nuevos y populares. . 38Ilustración 21. Módulo bloque social. . 43Ilustración 22. Módulo comentario sobre el producto. . 44Ilustración 23. Módulo comentario sobre producto, con reseña. . 44Ilustración 24. Módulo European Union Cookies Law. . 44Ilustración 25. Palabras clave. . 47Ilustración 26. Optimización imágenes. . 47Ilustración 27. Módulo Google Sitemap. . 48Ilustración 28. Ejemplo estadísticas Google Analytics. . 49Ilustración 29. Mensaje Google Webmaster. .
DESARROLLO DE UNA TIENDA ELECTRÓNICA PARA MANUALIDADES 8 Introducción Hoy en día existe una necesidad fundamental para cualquier empresa o negocio de
