Reengineering of a merchandising web application

Abstract

This project was developed in the scope of a double-degree program between Brazil and France, during an internship in the R&D team of KLEE Group, the leading company in merchandising in France. In the context of their applications for the management of shelves and plans of stores, KLEE wanted to optimize the ergonomy of their modules and work towards a portable version for mobile platforms. The objective of this project was the reengineering of the merchandising module, including its study, definition and implementation, taking advantage of good programming practices and modern Web technologies like HTML5, CSS 3 and JavaScript. A big effort was done in refactoring and optimizing their existing solutions, and new ones were also developed in the process. This document starts by presenting the context of the work, such as its motivations and an overview of the overlying system, as well as an overview of the technologies and techniques involved in this project. Then we take a deep look at the main subject, which is the development of a new planogram viewer module. Before concluding, we present some interesting technical details about additional contributions done to the system. Finally, we conclude by discussing technical, personal and professional lessons learned during this work, an overview of the contributions of this work and possibilities of further work.

Este projeto foi desenvolvido no âmbito de um programa de dupla-diplomação entre Brasil e França, durante um estágio no grupo de P&D da KLEE Group, empresa líder em merchandising na França. No contexto de suas aplicações para gerência de prateleiras e mapas para lojas e supermercados, KLEE queria otimizar a ergonomia de seus módulos e trabalhar em direção a uma versão para plataformas móveis. O objetivo deste projeto foi então a reengenharia do módulo de merchandising, incluindo o estudo, definição e implementação deste, servindo-se de boas práticas de programação e tecnologias Web modernas como HTML5, CSS3 e JavaScript. Um grande esforço foi feito no processo de refatoração, otimização e documentação das soluções existentes, assim como no desenvolvimento de novas soluções. Este documento começa apresentando o contexto do trabalho, suas motivações e um resumo do sistema web existente, alem de um resumo das tecnologias e técnicas envolvidas no projeto. Após, discutimos em detalhes o ponto principal do trabalho, i.e. o desenvolvimento de um novo módulo de visualização de planogramas. Antes de concluirmos, apresentamos detalhes técnicos de outras contribuições feitas ao sistema. Finalmente, concluímos discutindo os aprendizados de uma ótica técnica, pessoal e profissional, e apresentamos um resumo das contribuições deste trabalho e possibilidades de trabalhos futuros.