nw  

Spring-React Application for ECOLOC Diagrams

Summary

In this bachelor thesis project a new web application was developed. With this web application, the non-profit organization ecoloc can model local economies with its own ecoloc method.

Key words

SpringMVC, React, Java, MySQL, Bootstrap, JPA

Goal

The goal of our project was to develop a new web application for modelling local economies. The aim of our customer is to identify and connect local socio-economic potentials, and to raise awareness for the concept and power of the local economy. Ecoloc develops methods, processes and tools to assist in the quest to efficiently and effectively strengthen local economies. A specific focus is placed on the visualization and modelling of local resources and potentials within a community (the picture below shows the result of such a visualization).


The focus in our development of the web application was to have an interactive way to visualize and model the current state of localization in a specific community or region. The application will be used in workshops of Ecoloc.

Initial state

Ecoloc is a non-profit organization which concerns itself with the local economy of villages in Switzerland and abroad (e.g. Sudan). Ecoloc tries to help the villages to grow their local economy, so that they can become more independent from the outside economy. Ecoloc performs workshops with their customers to learn, to get information and to create room for improvements for their local economy. Currently, Ecoloc does those workshops with a deck of cards. Those cards represent socio-economic factors. At the end of a workshop, Ecoloc and their participants got information about the current state of a local economy and improvement opportunities of their village.

Solution
diagram

With help of the web application, the user can visualize the current state of the local economy of a village in form of a diagram. The user can either create a diagram or select previous created diagram to edit it. A diagram consists of edges and nodes. To create a node, the user must assign a label, a description, a category and activity fields to the new node.


The diagram provides two different mode. The "standard" mode is the mode where the user can add and edit several nodes, edges and criteria on the diagram. The "interaction" mode allows the user to move nodes on the diagram to see potential localization improvements for the related nodes (connected over an edge). To visualize those localization improvements for the related nodes, the user has to add two influence values to an edge in the "standard" mode. One value for each direction of a connection. Then the user can change to the "interaction" mode and change the localization degree of a node. Now all dependent nodes change their localization degree as well, according to the captured influence values from the edge. This influence value is a number between ten and minus ten. This impact is called dynamic dependency. To calculate the new y-axis position of a node on the diagram a formula was invented. With the calculation formula the new y-axis coordinates from connected elements are calculated.

Dates

project duration: 7 months (19.02.2018 - 17.08.2018)

effort per person: 2x 360h

number of team members: 2

Bachelor Thesis

Customer

Stephan Dilschneider

ECOLOC GmbH

Steinenring 40

4051 Basel

>> Ecoloc

Project team

Rubil Muriyamadom

Gysin Simon

Contact

Dominik Gruntz, dominik.gruntz@fhnw.ch, IMVS, 5.2B04

<< zurück