From Needs to Solutions: Co-Designing the KEYSTONE Web App Through Collaborative Workshops
Screenshots of the collaborative activities during the KEYSTONE workshop
KEYSTONE is an EU-funded project, which started in June 2023 and continues until May 2026. It aims to simplify cross-border logistics compliance and develop a sustainable, efficient and safe transport system by facilitating data exchange between enforcement authorities and logistics operators.
After a year of analysing the current landscape and identifying sectoral needs, requirements, and gaps, the KEYSTONE consortium has highlighted the necessity of integrated platforms and data-sharing frameworks. The findings from this initial phase have been published on the project’s website and in the following article.
These insights have informed the development of the KEYSTONE web app solution, which has been designed to address the identified challenges and requirements.
The KEYSTONE web app will be evaluated through two pilot tests targeting different scenarios:
Road Transport Scenario: that will take place in Northern Italy, from the Port of La Spezia, by Gruber Logistics, a KEYSTONE project partner.
Intermodal Transport Scenario: that will cover the transport route from Rotterdam to Novara, conducted by freight terminal operator CIM - Interporto di Novara, also a KEYSTONE project partner.
Co-Design Workshop: Defining User Requirements
To elicit the requirements of the KEYSTONE web app, a co-design workshop has been organised with KEYSTONE partners and stakeholders. The workshop was organised and moderated by Cefriel, the partner responsible for the KEYSTONE app user interface. The main goal was to identify user needs, key features, APIs, and shape the overall user experience of the app.
The six-hour workshop took place on 29 October 2024, using Miro software, an online collaborative tool, enabling participants to work at the same time and share their ideas. The workshop gave the opportunity to all participants to share insights that could benefit future users and contribute to the wider industry.
Partners from Work Package 3 (WP) and WP4 participated, including: Aethon Engineering, ICOOR, Coventry University, Etelätär Innovation, T-Bridge, Smart Transportation Alliance, RINA, and the Port of La Spezia, an important member of the KEYSTONE stakeholder community.
Following the introduction of the use-cases, key challenges and objectives, participants were divided into two groups:
Group 1: focused on the intermodal scenario from the perspective of a “road police officer” persona
Group 2: which addressed the road transport scenario, considering the perspectives of a “port authority operator” and a “truck driver.”
Overview of key features and functionalities of the web app during the workshop.
Each group engaged in two key activities: a) Collection of user needs and requirements, where they identified core needs and the necessary data and actions to address them, and b) Turning needs into ideas, where they designed web app features to support those needs and, optionally, sketched key functionalities.
In the Final Sharing Session, both groups presented their outcomes and ideas, followed by an open discussion among participants.
After the workshop the collected needs were analysed and categorised, marking the start of the User Experience (UX) phase. This stage focused on defining application flows and optimising the layout to ensure an intuitive and accessible user journey.
Based on the UX, the User Interface (UI) phase followed, aimed at creating a pixel perfect design, aligned with the KEYSTONE branding guidelines. By using Figma software, a collaborative web application, an interactive mock-up was developed to visualise the user flow, and the app’s wireframes were created to establish a structured framework.
The initial designs were tested during the mid-term review, with refinements made based on stakeholder feedback.
Testing & Validation Before Deployment
The final step of the co-created UI/UX design methodology involved the testing and validation of the web-app before the deployment.
Two testing session were organised to test and validate the app at two different phases of the webapp design: a mid-term review and a final user testing.
Mid-term Review: A preliminary usability test with KEYSTONE partners to assess the performance and usability, in order to improve the app user experience. The collected feedback was taken into consideration and added into the final mock-up version.
Final User Testing: The second testing phase includes the testing of the final mock-up with real end users (e.g. representatives of road police agents, port authority officers and truck drivers) to evaluate the usability of the app,acceptance and usefulness.
KEYSTONE partners are highlighting the importance of integrating user feedback at every stage of the project, as the KEYSTONE web app is designed to meet the real needs of both enforcement authorities and logistics operators. The KEYSTONE web app aims to simplify compliance processes and support a more digitalised transport & logistics sector.
Author: Cefriel