6. Implementación
En la implementación del proyecto, se han tenido en cuenta los requerimientos principales, las interacciones que deben realizarse con el sistema y las necesidades de la tienda en referencia al diseño. Al haber utilizado un gestor de contenidos como Prestashop, la creación de la tienda electrónica se ha llevado a cabo sin necesidad de empezar de cero y tener que programar cada apartado. Esto es, para la creación de una página nueva no hace falta escribir la base de HTML y añadirle funcionalidad mediante PHP puesto que ésto es facilitado por el CMS, al igual que la hoja de estilos se adapta a los componentes existentes en cada una de las vistas.
El desarrollo del proyecto, por tanto, se ha implementado a través de Prestashop utilizando diversas herramientas para la personalización, adaptación y configuración de sus contenidos. La manera de llevarlo a cabo será descrito a continuación, igual que detallaremos las herramientas de las que se ha precisado.
Para la instalación de este CMS se ha precisado de XAMPP para la creación de un servidor localhost en el que alojar la web hasta la adquisición de un dominio y un hosting que se ofreciesen las funcionalidades necesarias para alojar una tienda electrónica como la presentada en el proyecto. Una vez creado el servidor se utilizó MySQL para la creación de la base de datos en la que se almacena toda la información creada en la página. Una vez se hubo contratado los servicios necesarios, se migró la web al alojamiento proporcionado por el hosting y se accedió mediante el cPanel proporcionado por la empresa a las secciones para las que antes se precisaba XAMPP.
Mediante el panel de administración se han generado los distintos contenidos mostrados como es el catálogo compuesto por las categorías y productos. Para ello se han rellenado los distintos formularios que ofrece el CMS para la introducción de información en los diferentes apartados.
A continuación se listarán aquellas herramientas que han sido necesarias para llevar a cabo la implementación de esta tienda electrónica. Se comentará una explicación sobre qué son, en caso de no haberse hecho antes y se indicará para qué han sido utilizadas.
CMS para comercio electrónico desarrollado en PHP, montado sobre un servidor apache que utiliza MySQL para la gestión de la base de datos. Ha sido utilizado para la creación del proyecto bajo la versión 1.6, la versión más actualizada en el momento de comenzar el proyecto.
Posee una instalación fácil e intuitiva tanto para realizarla en un servidor local como para instalarla en el hosting contratado, como se puede ver en el anexo de instalación al final del documento.
La creación de una tienda que no precisa de gran personalización general si no de un proceso de adaptación a las necesidades básicas de la empresa, un diseño adaptable y funcionalidades comunes, como pueden ser la integración de redes sociales o un carrito de compra que precise de cuenta para llevar a cabo el pago, puede ser llevada a cabo sin mayor problema mediante Prestashop. Este CMS facilita diseños que pueden ser personalizados respecto a las necesidades de la tienda, presenta una distribución por módulos que pueden encontrarse en su tienda, gratis o no, o ser creados o adaptados teniendo conocimientos de programación y una interfaz intuitiva para la generación de los distintos contenidos necesarios en cualquier página web. Además, tras acceder al panel de administración, se encuentran una serie de estadísticas que gracias a distintos módulos instalados pueden ser personalizadas según la información que se quiera recoger y visualizar sobre la tienda y sus visitantes.
Gracias a este gestor de contenidos se han creado, modificado y personalizado las distintas páginas visualizadas en la tienda como pueden ser la página de inicio, tienda, blog y contacto.
Este programa gestiona distintos servicios y facilita la activación de éstos. Se ha utilizado para la creación de un servidor localhost mediante Apache en el que alojar la web previamente a la migración al alojamiento proporcionado por el hosting. Se ha utilizado también para la gestión de base de datos mediante el servicio MySQL, previamente también a la migración de la tienda.
Esta herramienta es proporcionada por el hosting contratado, no todos proporcionan el mismo o llegan a presentar alguna herramienta para la administración del sitio.
Dispone de una interfaz simple distribuida por secciones que nos facilita localizar aquello que necesitamos. En este proyecto el cPanel se ha utilizado para la creación de copias de seguridad y la gestión de la base de datos mediante PhpMyAdmin.
Herramienta escrita en PHP y utilizada para el manejo y administración de MySQL a través de páginas web. Tiene la misma utilidad que el MySQL utilizado en localhost, servicio proporcionado por la herramienta XAMPP.
Esta herramienta de diseño gráfico desarrollada por Adobe, ofrece un amplio abanico de posibilidades a la hora de retocar y crear fotografías.
Con este programa se han tratado todas las imágenes de la web. Se han tratado todas las imágenes de los productos por igual para evitar una descoordinación visual al encontrar todos los productos juntos. Si cada imagen tuviera un color o iluminación diferentes, a simple vista se vería que falla algo. Se le ha añadido a cada fotografía de producto una marca de agua para una mayor personalización y como manera de evitar que las imágenes sean utilizadas sin hacer referencia al sitio de donde han sido sacadas.
Se ha creado el logo de la tienda vectorizándolo sobre un boceto previo, pintándolo y personalizándolo para que fuese un formato png y se fundiese bien con el entorno.
Todas las páginas utilizan un favicon, esto es, el icono que las identifica en la barra de navegación y lo único que se ve cuando un usuario tiene dispuestas múltiples pestañas al mismo tiempo independientemente del navegador. Así pues se obtuvo la parte más características del logo y se personalizó el formato del icono para ser reconocido por la plantilla.
Editor de textos y código fuente que facilita la modificación de los archivos que contengan programación gracias al coloreado y la envoltura de sintaxis que facilita la lectura y localización de las partes distinguidas del código.
Se ha utilizado este editor para la modificación de los diferentes archivos que han precisado de algún cambio a lo largo de todo el proyecto.
En Prestashop se precisa de la utilización de módulos para la distribución de la información y la configuración de las distintas funcionalidades que se quieran llevar a cabo en la tienda. Éstos pueden ser instalados y configurados para personalizarlos, en caso de encontrar uno que se ajuste a nuestras necesidades, o creados de cero para proporcionar las funcionalidades que nosotros queramos.
Entre los módulos que se han instalado para la tienda, encontramos los siguientes:
Este módulo, insertado en el footer 15de la página, permite agregar información acerca de las redes sociales e insertar los botones correspondientes en la página. Se buscaba algo simple, como puede verse en la ilustración. Este diseño hace que no se recargue la página con widgets en los que se muestre la actividad, ya que suele distraer la atención de los usuarios.
Comentario sobre el producto
En las tiendas online, los usuarios no pueden disponer del producto antes de realizar su compra, por tanto buscan fotografías del mismo, reseñas de otros clientes y cualquier cosa que les pueda indicar cómo es ese producto y si deben fiarse a la hora de comprarlo.
Por ello, se ha decidido instalar este módulo que permite a los usuarios escribir un comentario sobre los productos para, de esta manera, proporcionar a los clientes otras opiniones acerca de aquello que quieren comprar. Este módulo se encuentra situado al lado y debajo del producto. Bajo su descripción corta, junto a los botones de compartir en redes sociales, encontramos el botón de escribir la opinión, tal cual se puede observar en la ilustración 21. Más abajo, antes de la descripción completa del producto, encontraremos las reseñas realizadas sobre este producto. En caso de que no exista ninguna, se mostrará un mensaje como se ve en la ilustración 22.
Con el uso de cookies en las páginas web, se ha de informar al usuario sobre ellas y su política utilizada. Este módulo, como puede verse en la ilustración 23, añade una caja en la parte inferior de la vista del navegador diciéndole al usuario que si continúa navegando por el sitio aceptará el uso de las cookies.
Una vez se ha visualizado la tienda con contenido por defecto, es bueno eliminarlo todo para pasar a realizar una personalización del sitio. Eliminar cada apartado del contenido de muestra a mano sería un trabajo tedioso, además de que puede resultar en algún error a la hora de dejarse algo sin borrar. Para ello existe este módulo que además de borrar todos los datos del registro por defecto comprueba las restricciones de integridad.
Este módulo da la posibilidad de mostrar unos botones en la posición de la página que se quiera, estos botones facilitan la navegación del sitio y muestran las distintas secciones que pueden ser visitadas.
En el caso de este proyecto, se ha posicionado este módulo en la cabecera de la página para darle al cliente una primera visión de qué puede visitar dentro de la tienda y no dejarle perdido tras un primer contacto con la interfaz. Se puede ver cuál es este módulo en la ilustración 17 situada en el capítulo 5.
Tras la integración del blog WordPress con la tienda, se observa que las metaetiquetas de la cabecera de la página en la que se encuentra el blog no se visualizan en el código, esto es causado porque llama al head de Prestashop en lugar de llamar al de WordPress.
Para solucionarlo tan solo hay que crear un módulo que haga esta llamada correctamente cada vez que accedamos a la pestaña blog.