Tags give the ability to mark specific points in history as being important
  • 1.0   First Release of Mesort
    Release 1.0

    Mesort 1.0

    This is the first release of Mesort, deployed at https://kommunikative-figurationen.de/mesort .

    General workflow

    To access this project you are required to contact one of the project members:

    Technically we need to create a user via command line or the newest admin area, then the invited user has to set a password (min. length 6) to access.


    The main feature of Mesort is to create studies for sorting tasks: this is made from general information, tokens and questions with related answers. Tokens can be chosen from the presets or uploaded from the researcher's device, also:

    • general information is required.
    • a minimum of one token is required.
    • questions are not required.

    There is currently no limit to the number of studies. A study can be deleted before an associated interview is saved; if an interview is already added to the study only an admin can delete that study via command line. When you delete a study, you delete also all the corresponding token files.


    Interviews are done with the given data from the study, the sorting is saved as a high resolution screenshot. Each token saves its x and y position in pixel, percentage position, distance from the center and in which circle it is positioned. The interview structure so far consists of:

    1. Pre-sorting questions.
    2. Sorting.
    3. Discuss Sorting phase.
    4. Post-sorting questions.

    Questions are saved if you go back, if you go forward to discuss the sorting and back to the sorting itself, the tokens are in the starting position. You can end the interview at any time and no data is saved.

    A Researcher can consult each interview data and export the sorting by clicking on the image of the sorting.

    Single interviews cannot be deleted.

    Technical information

    The functionality of the frontend is mostly on Vue components:

    • consultsorting.vue
    • modalnewedituser.vue
    • newinterview.vue
    • newstudy.vue
    • overviewuser.vue - not used, kept just to reuse the table reference in the future
    • sorting.vue
    • userpart.vue

    The backend is built in Laravel in an MVC pattern. Static methods are added to the models to improve readability but the code still needs continuous optimization. An additional paper about how and why I wrote the code in this way is at this day being written.

    Using Php insights, a tool that measures the quality of the written code, Mesort scored this:


    This is the current database structure:


    Additional information

    The website is meant to be used in landscape mode and optimized for the latest tablets, with a minimum width of 1024px. Less than that, we can not assure the whole functionality.

    There is already the predisposition for a multi language platform, but no other languages are yet available.

    An API interface is not deeply implemented since there are no external requests to access the data.

  • 1.1   First big update of Mesort, deployed at https://kommunikative-figurationen.de/mesort .
    621c3a5c · Code Optmization ·
    Release 1.1

    Many of the updates are coming from the "Treffen Paketantrag".

    General workflow

    Now you can register to the portal going to /mesort/register. A password of 6 chars that contains both letters and numbers is required, as well as a confirmation email.

    We have a better admin area that helps us to manage and check the health of the application.

    Files are now saved into the file table, with information also about the size.


    Now you can delete studies anytime, but you need to confirm it, and we save the action in our backend.

    Every user now has a max number of 15 studies, this will be updated as soon as we define more rules on the monetization and profiling of users.


    Interviews accept as many sorting as you want, and you can also create custom tokens for each sorting. Every token created during the interview is marked with the author 0 to be better recognizable.

    Each sorting is now saved, consultable and downloadable as pdf in the interview overview.

    Now the interview list is in a separated page, and you can download the data from each single interview or from all the interviews, as an Excel file.

    Database Schema

    Database Schema

    Quality of code given by PHPInsights

    Code was well optimized.


  • 1.1.1   1.1.1
    19d51ff3 · Bugfix interview show ·
    Release 1.1.1

    This release applies a major code restyling as well as code stabilization.

    The interview is not touched, it will be addressed in the next update.

    Colours used from Tailwind.


    bg-green-600: #38a169 bg-green-900: #22543d (hover)

    bg-green-500: #48bb78 bg-green-800: #276749 (hover)

    bg-red-400: #f6ad55 bg-red-600: #dd6b20 (hover)

    bg-gray-400: #cbd5e0 bg-gray-600: #718096 (hover)

    bg-yellow-400: #f6e05e bg-yellow-600: #d69e2e (hover)


    bg-gray-900: bg-blue-300: #90cdf4 (hover)