Delivery Optimiser

1. Product Description

1.1. Solution Overview

The AIDEAS Delivery Optimizer (AIDO) is a toolkit for optimizing the entire delivery process. The AIDO uses various AI algorithms to predict:

• Product package.

• Container Loading (layout).

• Delivery Route.

1.2. Features

This AIDEAS Delivery Optimizer consists of three different parts:

• The first step is the product packaging. During this phase, the AIDO uses algorithms to determine the most suitable packaging for each machine part.

• Packaging itself can consist of two parts, one is the internal protective packaging and the other is the outer packaging. The exact material for both kinds of packaging depends on the individual usecase

• The second step is the container loading. Depending upon how many drop-off points, a delivery has, the container needs to be loaded with the products from one or more customers. The AIDO uses metaheuristics to determine the most optimal container layout in order to ensure the package safety during transport, as well as maximize container volume utilization

• AIDO also contains an AR view, in order to view step by step instructions on how to load the container, in augmented reality. The tool uses meta Quest 3 Mixed VR headset to view the solution from the container loading algorithms.

• The final phase of AIDO is the delivery. This is done through route optimization. AIDO uses metaheuristics to determine the most optimzal delivery route. The algorithm is designed for multiple agents (delivery vehicles), delivering to multiple drop-off points.

1.2. Prerequisites

• Technical Specifications

AIDO uses historical parts data to determine the most suitable packaging for each machine part. It also determines whether or not extra protection is required, and in the case that it is required, the algorithm also recommends the most suitable protective material. Both these algorithms are of the categorical classification type and employ ensemble learning techniques. The container loading algorithm is a metaheuristic algorithm, which uses Genetic algorithm to determine the best container loading layout. Genetic algorithms are based on evolutionary theory, where multiple successive generations are used to improve the main objective during optimization. Other concepts such as population, population change and mutation also find their roots from evolutionary theory and are all used by the algorithm to increase the optimization, which in this case is the volume utilization of the container. The route optimization is a special kind of multiple traveling salesman problem where multiple agents (delivery vehicles) each starting the route at the source (home city) and may have to visit multiple delivery points. The backend of the AI-AD is developed using Django. The backend provides the API endpoints with which the frontend can communicate to, send requests, and obtain the results.
The frontend of the solution is developed in REACT.
For deployment, docker is used since it is the most widely used containerization solution. Docker also makes it easy to deploy the packaged application into the runtime environment and is widely supported by deployment tools and technologies.
The visualization of the container loading is done in Augmented reality and a UI has been created for it using the THREE.js library. Additionally, this application has a small Express.js based backend, to provide endpoints to facilitate updating or reading the solution data.

• Technical Development

This AIDEAS Solution has the following development requirements:

• Development Language: Python and Javascript.

• Libraries: Numpy, Pandas, Scikit-Learn, SciPy, Pickle, plotly.js, THREE.js, SocketIO

• Container and Orchestration: Docker, Kubernetes

• User Interface: React, PrimeReact, Redux.

• Application Interfaces: RestAPI.

• Database engine: SQLite.

• Hardware Requirements

• Meta Quest 3: Mixed VR Headset

• Software Requirements

• Docker Desktop (Windows, Mac, or Linux)

• Python

• npm (for frontend deployment)

• External Dependencies

• None

2. Installation

2.1. Environment Preparation

Ensure that all dependencies, including Docker, Python, and npm, are installed. Clone the repository from the official GitLab project and configure the backend and frontend environments as needed, by installing the requirements and package files.

2.2. Step-by-Step Installation Process

• Local Installation: Requires configuring backend and frontend, installing dependencies, and launching services manually.

• Docker Installation: Uses a docker-compose.yml file to deploy the application.

• Kubernetes Installation: This can be done using the helm charts. Helm is a command line tool for Kubernetes which is used to easily install and manage applications within a Kubernetes environment.

3. Initial Configuration

3.1. First Steps

• Login

Users must log in using GitLab authentication before accessing secured application features.

• Interface Navigation

The application will open in its home screen. The tabs navigation widget is placed in the left, and the available tabs are:

HOME

• Dashboard → Tab in which an introduction of AIDO is displayed and from which the other cards are displayed each corresponding to one of the functionalities of AIDO, namely Cargo storage, Packaging, and Delivery

  

• Help → Tab with guidelines.

  

Cargo Storage

• Container Selector → Dropdown where user can select the size of the container to be loaded. It contains options based on standard delivery container sizes..

  

• Product Form → Here, you can fill out the information about the consignment, such as box dimensions, and quantity of boxes, along with priority, source, and destination. Most of the fields here are self explanatory, however, others are mentioned here in more detail. Required Base Support defines the amount of contact with the base box. The minimum amount required is 0.55 which means that at least a 55% support from the base is required for the placement of any box. Item Priority defines the priority level of each box. This comes in handy when it is not possible to place all the boxes due to the fact that the consignment is too large for the container. In that case, the boxes with higher priority will be placed first. Customer ID is an integer value. The loading starts with the lowest customer ID, such that if there are 5 customers, ID 1 will be loaded first and ID 5 will be loaded at the end. This is to ensure that the customer to be unloaded first, is loaded last. This also means that the operator must enter the customer data accordingly.Rotation defines whether or not the the box can be rotated. In case of boxes with low to no fragility, they can be easily rotated across all axes. The permitted values here are 0, 1, or 2. Which correspond to x, y, and z. A box roration value of 2 means that the box can be freely rorated across all the axes. Free rotation allows more options for the algorithm, thus allowing the algorithm to finish computing faster and also a better volume utilization. Once the order is submitted, the algorithm can be started using the Run button:

  

• Running the Algorithm → After the order is submitted using the Submit Order button, the Run button becomes available and can be clicked to start the algorithm computation. This is marked by a spinner, The algorithm computation time may depend upon the machine, as well as how many generations are run.

  

• Getting Results → Once the algorithm is finished computing, the Get Result button becomes available. After it is clicked, a table of the solutions is generated. The algorithm provides multiple solutions. For each solution, the number of packed items is displayed inside a table column. In the case where a certain item remains unpacked, this is also shown in the table. This can happen when the number of items is too large for the size of the container. In the last column of the table, user has three options to go into further detail for each solution.

  

• Layout Plot → This shows a 3D plot of the corresponding container loading solution. The plot is generated using the react-plotly library. The plot is also interactive and can be zoomed in and out of, and the axes can be rotated freely. At the top of the plot, there are additional icons which become visoible on mouse hover. Theya re used to control features of the plot, such as zooming, panning, rotation and they also allow the user to download the plot as a png file. Each box in the plot is color coded based on the customer it is to be delivered to. Moreover, the boxes belonging to one customer are all placed together, in order to make it easy to remove them with the least amount of movement possible to the boxes of another customer. The customer to be unloaded first, is placed at the end of the container to make those boxes nearest to the unloading end of the container.

  

• Instructions Report → Generates a report of the generated layout plot and opens it in a new tab, this can then be downloaded as a pdf. The report shows the container metadata, along with the box number of each of the placed boxes, along with their volume, rotation, weight, and stackability.

• AR View → The AR View button links to an external url where the layout solution can be visualized in Augmented reality using AR glasses. Moreover the solution can also be viewed in a web app, which provides additional toggles to view the placement of each box, along with step by step instructions for its placement. Other toggles such as changing the solution number, changing the opacity of the box, and other filters are also available.

  

• AR View Using Headset → The AR view is originally meant to be viewed using Meta Quest 3 Mixed reality headset. The container can be placed using either hand gestures or the provided controller. The size of the container can be adjusted, once done, the container scale can be fixed, before proceeding to the box placement.

  

• AR Box Placement → After the placement and scale adjustment of the container, a similar layout as the one in the web app can be seen in AR, which can be used tovisualize and place the boxes. The UI starts with one box placed. From here individual instructions are provided for each following box placement. The most recently placed box is always flashing. In the placement layout, hovering the mouse on top of a box, displays its ID, box dimensions, and also the customer ID. In the left control pane, two sliders are available, One for the opacity of boxes. Lower opacity can be used to see previously places boxes which are hidden by newer boxes. The second slider is to go back and forward in the box placement instructions. The user can use this slider or also the << and >> buttons at the bottom to go back and forward by one step. With each step, the camera position is also adjusted in order to easily view each box placement. There is also a Reset camera position button to adjust the camera position at any point. Below this, is the button to view a different solution. This can be done by changing to a different solution ID. Under the two sliders, are three additional toggles, each allows the user to filter the results by customer (eg. showing only boxes of a certain customer), by ID, or by stackability. There is also a toggle to rescale the AR view in order to increase or decrease the size of the container and the boxes. There is also the option to Randomize colors in order to change box colors, in order to ensure proper contrast with the background and surroundings.

  

---

Warehouse Storage

The Warehouse Storage Optimizer is a tool that helps you design and improve warehouse storage Layout. With just a few steps, you can create a layout, adjust it for your needs, and see how much storage space and picking efficiency you gain.

Opening the Warehouse Storage Optimizer

1. Go to the Main Page of DO.

2. Click on Warehouse Storage.

3. The Optimizer home screen will open.
   

When selected Warehouse Storage Optimization from the main page, the system opens the Welcome screen. On this screen you have two options:

1. Create New Warehouse Blueprint → start a brand-new warehouse optimization by filling in dimensions and other details.

2. View Saved Warehouse Blueprints → open and review previously saved layouts(More on option 2 will be presented after explaining option 1).
   

Starting a New Optimization

When you click “Create New Warehouse Blueprint”, the system opens the Warehouse Setup Page. This page has two parts:

1. Warehouse Setup Notes Panel: → This panel is just for reference; it helps user understand how inputs affect the optimization. This panel explains important rules and calculations the system uses:

• Grid Unit → each cell in the blueprint = 1 m² of floor space.

• Warehouse Height → total usable vertical space, in meters (e.g., 10m).

• SKU Height (m) → height of a single stock keeping unit, including pallet and goods.

• Rack Height → automatically calculated from SKU stacking (SKU + pallet height × stacked pallets).

• Safety Buffer → minimum 1.5 m clearance above the top rack, required for ventilation and safe handling.

• Rack Fit (Per Column) → The system calculates how many racks fit in the total height using the formula shown.

2. Warehouse Setup Form: → Here user enter warehouse details:

• Warehouse Name → type a name for your layout (e.g., “Main Depot”).

• Depth (X-axis, meters) → length of the warehouse (e.g., 40 m).

• Width (Y-axis, meters) → width of the warehouse (e.g., 20 m).

• Height (Z-axis, meters) → total vertical height available (e.g., 10m).

• Aisle Width (Clearance, meters) → how wide each aisle will be (e.g., 3 m).

• Pallet Type → choose the pallet specification your warehouse uses.

• Stacked Pallets (Qty) → how many pallets can be stacked on top of each other (e.g., 6).

• SKU Height (m) → the vertical size of one SKU including pallet (e.g., 1 m).

• Rack Height (m) → calculated field, based on SKU height and stacking.

When all fields are filled, click Next to continue.

Editing a Layout

After filling in the Warehouse Setup form and clicking Next, the Grid Editing Page opens.

Here you mark special zones, walls, doors, or restricted spaces on the warehouse blueprint. This page has two parts which are explained below:

1. Grid Editing Instructions: → The instruction panel explains how to use the grid:

• Click any cell → apply or remove the selected constraint (e.g. wall, door, reserved area).

• Shift + click two cells → fill a rectangular area.

• Ctrl + click two cells → clear all constraints in that area.

• Mode buttons → select what you want to place: Wall, Door, Pillar, Restricted Area, Reserved Area.

• Reserved Area (orange) → zones for loading/unloading, picking stations, inspection, or admin/technical areas.

• Active Mode → highlighted in color, showing what you’re editing.

• Scrollbars → move across the grid if it’s larger than the screen.

• Edit Form → re-open the Warehouse Setup form if you want to change dimensions.

• Edit Grid → use the current blueprint as a base for a new one.

2. Constraint Editing Tools: → The grid itself is a map of your warehouse (rows and columns). Each cell represents 1 m² of floor space.

Use the toolbar buttons to select what to place on the grid:

• Wall (W)

• Door (D)

• Pillar (P)

• Restricted Area (R)

• Reserved Area (RA)

• Click on the grid to apply your choice. Each cell updates with the correct label and color.

At the bottom of the screen, user can:

• Finalize & Save → save the warehouse blueprint.

• Delete Blueprint → remove the current layout.

• Run Warehouse Blueprint Optimization → start the optimizer with defined constraints.

Getting Results

After clicking Run Warehouse Blueprint Optimization, the system begins optimizing layout.

Progress Panel

• Status → whether the optimizer is still running or finished.

• Details → number of tasks completed and the average time per task.

• Initialization Bar → setup progress (usually quick, shown as 100%).

• Running Optimization Bar → percentage of optimization completed.

When Optimization Finishes

Once the bar reaches 100%, two options become available:

• Get Warehouse Blueprints → download and review the optimized warehouse layouts directly in the tool.

• AR View of Blueprints (3D View in Browser) → Open the results or layout in a new browser tab to access the 3D view. For the Augmented Reality (AR) view, a Meta headset must be configured. Once the headset is set up, user can open the same URL from its built-in browser to see the warehouse in AR. From there, user can also switch between different layouts by selecting points on the Pareto plot.

Viewing and Interpreting Results

After the optimization finishes, user clicks Get Warehouse Blueprints button, a Pareto Plot appears.

This plot shows the trade-off between Locked Storage (Y-axis) and Pick-Face Accessibility (X-axis). Locked Storage refers to the part of a rack that is filled but not directly accessible for picking—for example, in a rack like SSSSSP, the SSSSS are locked storage. Pick-faces are the openings (like the P) where items can be retrieved. In practice, maximizing locked storage increases total capacity but reduces accessibility, while increasing pick-faces improves accessibility but lowers the amount of locked storage. The optimizer maps these trade-offs so user can choose the right balance for his/her warehouse.

Symbols on the Plot

• Green Circles (Pareto Front) → layouts that are non-dominated, meaning they offer the best trade-off between storage and pick-faces.

• Red Diamonds → layouts with both horizontal and vertical storage blocks orientations equally balanced.

• Orange Triangles → layouts dominated by vertical storage blocks.

• Blue Circles → layouts dominated by horizontal storage blocks.

• Red Star → The layout selected (which is shown below). Note that pick-faces were intentionally not assigned to storage cells adjacent to door connections. This choice is left to the user, so you can decide how to utilize those cells.

How to Use the Plot?

• Move along the Pareto front (green circles) to explore layouts that balance space and accessibility differently.

• Click on a point to view the layout’s details.

• Choose the one that best fits user’s warehouse needs:

More Storage Capacity

• If goal maximize locked storage, the system packs shelves and racks as tightly as possible.

• This gives you more pallets per square meter.

• But the trade-off:

  • Aisles are fewer or narrower.

  • Pick-faces (the sides of racks where workers or robots can grab items) are reduced.

  • Dense storage blocks make retrieval slower because you might need to walk further or move other items first.

In plain words: user can store more, but picking stuff out becomes harder and slower.

More Pick-Faces

• If you maximize pick-faces, the system adds more aisles and keeps racks accessible from many sides.

• This makes retrieval and order-picking fast, since most items are directly reachable.

• But the trade-off:

  • More aisles = less space for storage racks.

  • Total locked storage capacity goes down.

In plain words: you can reach items faster, but you lose space for storing as much inventory.

Summary Table

The bottom half of screen shows the summary table containing necessary information, see figure below.

Using Archived Layouts

When users click View Saved Warehouse Blueprints, you will see a list of all saved layouts. The list is paginated, so you can scroll through multiple pages of layouts.

Layout Status

Each saved layout shows key details such as aisle width, pallet type, rack height, and total optimization time. Layouts can have two statuses:

• Optimized and processed → layouts that have already been run through the optimizer.

• Not Optimized → raw layouts that were saved but not yet processed, or layouts that may need constraint editing before optimization.

Available Actions

For each layout, user can choose:

• Load to Grid → reload the layout into the Grid Editor.

  • Useful for adjusting constraints such as reserved or restricted areas.

  • Often used for dedicated storage zones, where it makes sense to tweak special areas without changing the overall warehouse structure.

  • Saves time → you don’t have to refill the setup form again.

  • You can also adjust aisle width before re-optimizing.

  • When user click Save, the system creates a new layout without altering the original base layout. The newly saved layout keeps all unchanged fields from the base version and also includes any new features or modifications you added.

1. Get Blueprints – retrieve the results of a completed optimization.

2. View Blueprints – inspect the optimized layouts in detail.

3. AR View of Blueprints (3D View in Browser) – visualize the layout in Augmented Reality with head set (works on the web as 3D View if a headset is not connected). For example a layout is shown below:

The figure illustrates an I-shaped warehouse layout with doors on both sides (magenta). The central space is divided into locked storage blocks (dark green), which represent racks that hold goods but are not directly accessible. Along the edges of these blocks are the pick-faces (light green) — these cells are still storage, but they act as openings where items can be retrieved. Pillars (red) mark the structural supports inside the hall, and restricted cells (grey) indicate floor areas that cannot be used for storage or movement.

Re-Optimization

If user load an already optimized layout into the Grid Editor and run optimization again:

• The results may or may not change, depending on whether you update constraints or aisle width.

• This feature is designed to refine layouts, not to rebuild the main warehouse from scratch.

What the Warehouse Storage Optimizer Does (Summary)?

The optimizer doesn’t force to pick one extreme—it shows user layouts along the Pareto front:

• One end = densely filled warehouse (great storage, poor accessibility).

• Other end = warehouse full of aisles (easy picking, less storage).

• Middle = a balance between the two.

The Pareto plot is basically a menu of trade-offs, so you can choose the warehouse design that matches your operational priorities.

Packaging

• Package Form → Information about the product can be entered here in order for the algorithm to decide the most suitable packaging options. Once the data is entered, user can click on Recommend Packaging

  

• Packaging Results → Shows the most suitable packaging, along with the most suitable protective material, if required. It also shows an estimate of the package emissions severity on a scale of 1 to 100.

  

Delivery

• Delivery Form → In the main delivery page, user can select the number of vehicles, along with the delivery points. The first point selected automatically becomes the origin point. The successive points enetered are the delivery points. Delivery points can be one or multiple. Similarly, there can also be multiple vehicles. The location points can either be entered as the name, using the Search bar as well as manually entering the longitudinal and latitudinal coordinates of the location. Delivery points

  

  

• Delivery Results → Shows the delivery results on a map, along with detailed navigation instructions for each vehicle, such that each vehicle starts at the origin and visits every destination point. Both the land and sea routes are shown. On the map, the origin point and delivery points can be altered simply by dragging and dropping the truck icon.

  

Installation Instructions

The frontend, backend and the AR frontend must all be run simultaneously. This can be done by simply using the docker-compose.yaml file found in the orchestration folder. This file will pull all the necessary images from the image repository on git and will automatically run the containers and expose the necessary ports. In order for the images to be pulled, the user must have docker desktop running in the background and be logged in to the gilab repository of the AIDEAS project.