TrustPortal transformiert das Kundenerlebnis und senkt gleichzeitig die Betriebskosten um 40-50%

TrustPortal

About this project

TrustPortal wandte sich an Imaginary Cloud, um sowohl die Webanwendung als auch die API-Dienste zu entwickeln.

Ergebnis: Wir haben eine voll funktionsfähige Mobil- und Browseranwendung sowie eine API bereitgestellt, die die Innovationen und Technologien der Dienste und der endpunktverschlüsselten Systeme von TrustPortal nutzt.

our INVOLVEMENT

Entwicklung

Struktur der Daten

Qualitätssicherung

technologies

Angular

Redux Toolkit

NGRX

NodeJS+Typescript

TYPEORM

C#

Blueprism

UIPATH

Automation Anywhere

AWS

Azure

Docker

TrustPortal transformiert digitale Erlebnisse durch Hyperautomatisierung

TrustPortal, ein wegweisendes Hyperautomatisierungsunternehmen mit Sitz in Großbritannien, hat es sich zur Aufgabe gemacht, digitale Erlebnisse für Millionen von Mitarbeitern und Kunden weltweit neu zu definieren. TrustPortal konzentriert sich auf Innovation und Effizienz und nutzt seine hochentwickelte Hyperautomatisierungsplattform für Unternehmen, um Mitarbeiter, Roboter verschiedener Anbieter, digitale Tools und KI in Echtzeit intelligent zu erweitern und zu orchestrieren.

Zu den wichtigsten Funktionen der Plattform gehören:

Intelligente Augmentation - Die Plattform von TrustPortal erweitert auf intelligente Weise die menschlichen Fähigkeiten durch eine nahtlose Integration von Robotern, digitalen Tools und KI.

Orchestrierung in Echtzeit - Die Plattform orchestriert Prozesse in Echtzeit und gewährleistet so einen dynamischen und adaptiven Automatisierungsansatz.

Skalierbarkeit - Die Lösung von TrustPortal wurde für den Betrieb in großem Maßstab entwickelt und eignet sich gut für große Unternehmen mit komplexen betrieblichen Anforderungen.

Sicherheit - TrustPortal legt Wert auf höchste Sicherheitsstandards, schützt sensible Daten und gewährleistet die Einhaltung behördlicher Anforderungen.

Unternehmen, die die Hyperautomatisierungsplattform von TrustPortal einsetzen, haben von erheblichen Verbesserungen der betrieblichen Effizienz, der Kostenreduzierung und des allgemeinen digitalen Erlebnisses berichtet.

Durch die Nutzung dieser innovativen Lösung können Unternehmen ihre Arbeitsabläufe optimieren, die Kundeninteraktionen verbessern und die Mitarbeiter in die Lage versetzen, sich auf wichtige Aufgaben zu konzentrieren.

Trusportal-Projektbildschirm
TrustPortal transformiert das Kundenerlebnis und senkt gleichzeitig die Betriebskosten um 40-50%
Die Rolle und das Engagement von Imaginary Cloud bei TrustPortal

Imaginary Cloud hat eine Anwendung und API-Dienste für TrustPortal entwickelt, die auf qualitativ hochwertigem Code mit niedriger Latenz basieren, um die beste verfügbare Plattform zu nutzen, die viele RPA-Anbieter bedient.

Das Ziel von TrustPortal ist es, eine benutzerfreundliche Oberfläche und Erfahrung für die RPA-Welt bereitzustellen, die es Robotern ermöglicht, effizient mit Menschen zu kommunizieren und eine wichtige Verbindung in jedem automatisierten Prozess herzustellen.

Imaginary Cloud ist dank Containerisierung überall lauffähig und bot hervorragende Architekturberatung für die TrustPortal-Plattform, die heute viele tausend Benutzer und Roboter weltweit bedient.

TrustPortal transformiert das Kundenerlebnis und senkt gleichzeitig die Betriebskosten um 40-50%NEW PROJECT IN MIND? LET'S TALK

during the project

Wir folgten dem Agiler Entwicklungsprozess (ADP) um Flexibilität, Zusammenarbeit und Kundenfeedback zu priorisieren. Dieser Prozess beinhaltete die Aufteilung des Projekts in kleinere, überschaubare Teile, sogenannte Iterationen oder Sprints. Während dieser Zeit arbeitete das Team gemeinsam daran, ein funktionales Teil des Produkts zu entwerfen, zu bauen, zu testen und zu liefern. Der agile Prozess fördert die kontinuierliche Anpassung, wobei das regelmäßige Feedback der Stakeholder die Weiterentwicklung des Produkts vorantreibt.

two stages

Migration
Development

four stages

Research
Ideation
Execution
Launch & Handover

four stages

Requirements
Back-end integration
Website development
Advanced filtering and search

four stages

Research
Ideation
Execution

four stages

Backlog
Bootstrap
Wave 0
Wave N

four stages

Research
Ideation
Execution
Launch & Handover

two processes

MVP
‍ADP

Four stages

Scope meeting
Code review
Test review
Quality review
Assessment

Four stages

Backlog
Bootstrap
Wave 0
Wave N

during the project

Wir folgten dem Agiler Entwicklungsprozess (ADP) um Flexibilität, Zusammenarbeit und Kundenfeedback zu priorisieren. Dieser Prozess beinhaltete die Aufteilung des Projekts in kleinere, überschaubare Teile, sogenannte Iterationen oder Sprints. Während dieser Zeit arbeitete das Team gemeinsam daran, ein funktionales Teil des Produkts zu entwerfen, zu bauen, zu testen und zu liefern. Der agile Prozess fördert die kontinuierliche Anpassung, wobei das regelmäßige Feedback der Stakeholder die Weiterentwicklung des Produkts vorantreibt.

migration

Imaginary Cloud started by migrating the existing database from Wordpress MySQL to PostgreSQL. A daunting task because of the thousands of items and large size of assets that are normal in a CG marketplace.

After the migration was completed, the team focused on migrating its infrastructure. The site was hosted on Heroku, which had relevant constraints on the ability to scale. Imaginary Cloud was able to migrate it to AWS, completing the first stage in just 2 months.

Continuous Development

After the successful delivery of Stage 1, the client continued to work with Imaginary Cloud on a continuous development basis, adding more features to its product to fuel its growth. The team worked on many different elements, from payment integrations to sales campaign tools to facilitate marketplace promotional campaigns. Imaginary Cloud also helped Flipped Normals improve its Google positioning by implementing an SEO audit, which tweaked the site’s performance and content relevancy.

requirements

The project started off with a team meeting to list all the client requirements. This thorough investigation allows for an easier, quicker, and more cost-efficient delivery. This meeting was led by our Project Manager, which supports the team all through the project, and our Developer, ensuring all technical details are discussed.

Eurofound provided a solid brief that captured the existing infrastructure, their vision for the website, and the technical constraints and requirements. It was a challenging task that needed to be completed in 6 weeks.

back-end integration

Our developer started the development process by creating the back-end integration that would allow the new website to fetch content from the existing database. Using a Django framework, we were able to create an efficient and quick application that retrieved data, generated listings of results and allowed for more advanced options.

Imaginary Cloud and Eurofound met on a weekly basis to ensure everything was being developed as required by the client.

website development

With the main software completed, the next stage was to develop the website to access such tool. For this, our developer followed Eurofound’s style guide to ensure coherence across the client’s digital presence.

Although no designer was allocated to this project, our developer followed UX/UI best practices, since he was able to touch base with several of the designers at Imaginary Cloud.

advanced filtering and search

In order to improve the content navigation, Eurofound wanted to include an advanced filtering and search capability in their database. Having fully mapped the database content in the new software, our developer was able to create a set of category filters that allowed users to select the content of a given topic, and implemented a search element to the page, allowing the user to freely search any document.

research
1. Briefing
2. Benchmark
3. User Research

We identify the main aspects of the business model and user needs.
First, we gather evidence that will support the decisions taken henceforth, ensuring that no decision is made based on vague assumptions.

This stage consists of 3 steps: a briefing with the project's vision and goals and business requirements; user research to guarantee product usefulness and effectiveness from the user's perspective; and a design benchmark to analyze the landscape of similar and complementary products, design patterns and technologies used in the industry.


The Research stage allows us to leverage the knowledge and skills of existing players and ensure features and design differentiation in the market, and ensure costumer fit.

ideation
1. User journey
2. Decision Matrix
3. Wireframes
4. Moodboard

We formulate an approach to the product based on the user's needs and the business model.
This is the core of the creative process and it is where the concept of the product is formulated based on the user's needs and the business model (both identified in the Research phase). Here, the UX designer, the product designer, and the product owner work closely together.

This stage consists of 4 steps: mapping out the user journey, by describing each user's action, with various user scenarios; a decision matrix that helps prioritize the users' and product's goals while considering the product life cycle's current stage; drawing the wireframes, i.e., the pages’ structure and navigation flow to ensure interface usability and reduce design time; and finally, a mood board to ensure that the product's look and feel conveys the desired user experience and is aligned with the user profile and market strategy.

Execution
1.Style guide
2. Graphic user interface
3. prototype

We bring the concept to life and put it into practice.
In this stage, the product designer focuses on creating a physical representation of the concept that has been defined up to this point.

It consists of 3 steps: a style guide, where we define a graphic interface’s style, considering colour palette, fonts, image style, input fields, buttons, and so on, to ensure consistency throughout the application; a graphic user interface design (GUI) which are the end-looking screens by applying the style guide to the wireframes; and a click-through prototype to facilitate the feedback from stakeholders or potential users and investors.

TECHNICAL ASSESSMENT
1. HIGH-LEVEL ARCHITEcTURE
2. PROJECT PLAN

We guarantee that all requirements and ideas generated are realistic to implement.
In this stage, all the work previously done should be achievable considering the available time and budget previously settled.

It consists of 2 steps: a high-level architecture where we detail how the product will be built, identifying baselines for the needed technologies and skills to make it; and a project plan to define the major milestones and provides a general understanding of the project's structure, phases, intersections and interdependencies.

research
1. business case

This initial stage involves gathering crucial information to understand the project's vision, goals, and business requirements. We present the business case, outlining the project timeline, main competitors, complementary products, and high-level exploration of personas. This also involves asking and answering questions to define objectives and explore ideas, ensuring differentiation from existing players in the market.

ideation
1. sITEMAP
2. WIREFRAMES
3. cONTENT

During the ideation phase, we provide the blueprint and structure for the whole website, which defines the relative importance of content as it flows down the page.

The site map establishes the website's structure and content hierarchy for optimal navigation. Wireframing outlines screen structure and navigation flow, prioritizing your digital product’s functionality over aesthetics. Lastly, for the content ideation we help you plan the page content, providing guidelines for audience-adapted material.

Execution
1. pAGE 0
2. GUI DESIGN
3. WEBFLOW DEVELOPMENT

During execution, we deliver the first significant page, typically the home page, ensuring it aligns with your target audience and market strategy. We then apply style to wireframes through GUI design, focusing on visual aesthetics and maintaining consistency across the website. Our Webflow development process follows best practices, incorporating interactions, animations, and responsiveness across devices.

Finally, we present results on a test domain, with client involvement being crucial for a successful outcome.

LAUNCH & HANDOVER
1. TRAINING SESSION
2. PUBLISH WEBSITE

We provide your teams with comprehensive training sessions and Q&A opportunities to empower them to autonomously manage the content. We offer ongoing support, ensuring all necessary information for website updates is readily available, and we configure permissions within Webflow as needed.

Additionally, we seamlessly integrate the website with essential marketing tools such as Google Analytics, configure SEO optimizations, and seamlessly migrate and connect the desired domain. Leveraging Webflow's reliable hosting services, we ensure the website is published with optimal performance and reliability.

research
1. Briefing
2. Benchmark
3. data Research

Our UX designers will target the users profiles and identify their needs when using your product, considering its usefulness and effectiveness from their point of view. Research on design patterns and the industry's most used technologies allows leveraging and understand existing players' knowledge and practice. Plus, it ensures your product/design is specific and different.

ideation
1. Ux assessment
2. executive presentation

We will conduct a UX review to set the product requirements considering the established usability heuristics in the field to deliver a consistent and fluid user experience. All information regarding insights and analytics will be summarised in a visual and compelling audit report that showcases the UX Audit's main findings, quick wins, and recommendations regarding your product's potential improvements.

Execution
1.Style guide
2. Graphic user interface

Together, we will baseline the style guide to ensure that your product's different visual interface elements' are consistent and coherent. Running a UX Audit allows us to solve the main encountered problems with the execution of end-looking screens. Plus, all recommendations that resulted from quick wins acknowledgement will be designed for implementation.

research
1. Briefing
2. Tech Solutions Assessment
3. Solution Architecture Design

Briefing: Our solution architects begin by engaging with stakeholders to deeply understand the business challenges or goals. This involves detailed discussions to identify the specific problem that needs solving and the desired outcomes, ensuring that the solution is perfectly aligned with your strategic objectives.

Tech Solutions Assessment: After grasping the business requirements, our architects translate these into technical specifications. This step involves identifying and shortlisting the most suitable technologies, platforms, and tools that can achieve the desired functionalities effectively and efficiently.

Solution Architecture Design: We design the overall technical architecture of the solution, considering key factors like scalability, security, performance, and integration with existing systems. This blueprint serves as the foundation for all subsequent development work, ensuring that the solution is both robust and adaptable to future needs.

ideation
1. TECHNOLOGIES & TOOLS SELECTION
2. PROJECT PLAN
3. PROJECT BACKLOG

Technologies & Tools Selection: Based on the architecture design, we recommend and evaluate the technologies and tools that best fit the solution's needs and your organization’s existing infrastructure. This ensures that the technology stack is optimal, cost-effective, and future-proof.

Project Plan: We develop a comprehensive project plan that outlines the major milestones, phases, and interdependencies. This plan provides a clear understanding of the project structure and helps in managing expectations and timelines effectively.

Project Backlog: We identify and prioritize user stories, breaking them down into manageable sub-tasks for both front-end and back-end development. This step ensures that the development process is organized, with clear priorities and a focus on delivering value at each stage.

Execution
1. SOLUTIONS ARCHITECTURE IMPLEMENTATION
2. CONTINUOUS IMPROVEMENT

Solutions Architecture Implementation: Our solution architects work closely with development teams to ensure that the solution is implemented according to the designed architecture. This involves continuous collaboration with developers, system administrators, and other IT professionals to ensure that the architecture is realized effectively.

Continuous Improvement: We believe in continuous improvement. After the solution is deployed, we regularly assess the architecture to identify any areas for improvement. This allows us to make necessary adjustments, ensuring that the solution remains effective, efficient, and aligned with evolving business needs.

BACKLOG
1. PRODUCT BACKLOG
2. sprint backlog
3. sprint Execution

The product backlog is a list of business and project goals and contains what is forecasted to be developed by the development team, and maintained by the Product Owner. It is a living document, updated continuously, prioritized, and ordered by business value. It may also have product improvements, bugs, technical questions, and so on. Its purpose is mainly to have everything that is needed to reach the project’s Product Vision.

In this stage, we also create a sprint backlog, which is a list of tasks that need to be completed during each sprint. We prioritise the user stories for each sprint and ensure that the team knows what they need to work on.

With the sprint backlog in place, the development process finally starts. Working through the sprint backlog, and delivering small usable pieces of software frequently allows for continuous feedback and refinement, ensuring that the product is always on the right track.

BOOSTRAP
1. Ux assessment
2. high-level architecture
3. CI/CD workflow
4. Feature 0

In this stage, we put in place a briefing that includes the information gathered during the workshop with the team and stakeholders. It presents the vision and goals of the project and clarifies all necessary business requirements. This is also where a FAQ session relative to the nature of the project takes place.

The high-level architecture involves the development of the technical design, with the ideal balance between complexity and reach. This is where we identify external dependencies from third-party providers, such as Stripe, Facebook, Amazon, and so on.

We then start the CI/CD workflow which is the setup of the issue management tool, code repositories, continuous integration system, and development & staging environments. It’s followed by the setup of the code repo and automated test framework, the staging environment and production servers, as well as the continuous integration ecosystem (i.e. servers, deploy hooks)/continuous deployment.

Finally, in Feature 0 we deliver the first meaningful feature: a homepage, a login screen, part of the first dashboard. This step ensures that there is something demonstrable with the perception of value at the end of the phase.

WAVE 0
1.data model
2. Poc, mtp or mvp
3. viability assessment

With the Data Model, we provide the first baseline of the product’s evolutive data model. It identifies the main data entities and relationships and baselines the data sources and data stores (i.e. relational databases, document data stores, etc.). This step also consists of iterating the product concept and designing the first version of the data model.

Here’s when we present the Proof Of Concept (PoC), Minimal Testable Product (MTP), or Minimal Viable Product (MVP), and we deliver and deploy the first version of the product - even if that version is the implementation of a concept. This helps mitigate technical risks and test the main business premises for developing a market-ready version of the product through a viability assessment.

WAVE N
1. production increments
2. wave retrospective reviews

On the production increments step, we review technical and business risks and the impact of the PoC, MTP, or MVP on the initial premises or Wave 0. Here, we also identify reusable components from Wave 0 to Wave 1 (i.e. often PoCs are not reusable). This helps gather feedback about the first integrated model and assesses the product's viability before moving to Wave 1.

Finally, the wave retrospective reviews the product state, evaluates wave success against business goals, and identifies improvements. We then design goals for the next wave & prioritise features. Doing this allows the team to analyse the work that has been done in previous sprints and plan consciously what should be the next mountain to climb.

SCOPE REVIEW MEETING

We start with a Scope Review Meeting where we identify the main project goals, the domains to review, and which metrics we will assess, capturing info about Maintainability, Cyclomatic, Inheritance, Class, and others.

code review

We proceed to execute the Code Review by looking at Architecture to understand how the product is built, its principles, and its patterns.

TEST REVIEW

Now it's time for a Test Review, where we assess unit tests, code coverage, and test quality.

CODE QUALITY REVIEW

We follow up with a Code Quality Review, where we list all the issues and describe them to the fullest, identifying the critical ones and categorising them.

ASSESSMENT

We close the process with an Assessment stage where we list all recommended fixes and provide an estimate of the resources needed to implement them.

TECHNOLOGIES used

Angular
Angular
Redux Toolkit
Redux Toolkit
NGRX
NGRX
NodeJS+Typescript
NodeJS+Typescript
TYPEORM
TYPEORM
C#
C#
Docker
Docker
Azure + AWS
Azure + AWS
UIPATH + Automation Anywhere + Blueprism
UIPATH + Automation Anywhere + Blueprism

Web-Applikation

Googles Open-Source-Designsystem für Angular.

Ngrx Store bietet reaktives Zustandsmanagement für Angular-Apps, die von Redux inspiriert sind.

API-Dienst

TypeORM ist ein ORM, das als NodeJS-Paket ausgeführt wird

Minibots

Containerisierung

Wird für Infrastrukturzwecke verwendet.

Wird für die RPA-Prozesse verwendet.

Working Model screen
working model and team

Da TrustPortal nach hohem technischem Fachwissen für die Entwicklung ihrer App suchte, folgten wir den Verwaltetes Projekt Arbeitsmodell, das unseren produktorientierten Projektmanager, Frontend- und Backend-Entwickler umfasste.

Frontend-Entwickler: Verantwortlich dafür, dass die Benutzer der Plattform problemlos damit interagieren können. Sie tun dies, indem sie Design, Technologie und Programmierung des Erscheinungsbilds der Plattform kombinieren und sich um das Debuggen kümmern.

Backend-Entwickler: Verantwortlich für die Serverseite von Webanwendungen. Sie arbeiten am Server, an den Datenbanken und an der Anwendungslogik und stellen sicher, dass das Frontend (mit dem Benutzer interagieren) reibungslos funktioniert.

Spezialisten für Qualitätssicherung: Gewährleistete eine beispiellose Softwarequalität durch automatisierte und manuelle Testtechniken zur frühzeitigen Erkennung und Behebung von Problemen und garantierte, dass das Endprodukt zuverlässig und leistungsstark ist.

key results

This project delivered an in-depth understanding of the customer persona and their interaction with the service.

100%

Eine voll funktionsfähige Mobil- und Browseranwendung und API, die die Innovationen und Technologien der Dienste und Endpunktverschlüsselungssysteme von TrustPortal nutzt.

RPA

Hat TrustPortal zu einer allgegenwärtigen Plattform für RPA und Hyperautomatisierung gemacht, was viele Möglichkeiten in der Banken-, Telekommunikations- und Versicherungsbranche eröffnet hat, um nur einige zu nennen.

UI

Das in das Produkt integrierte Anpassungsfähigkeits-IC ermöglicht ein hohes Maß an Anpassungsfähigkeit, das unsere Kunden lieben, da TrustPortal sich so wie eine eigene Anwendung anfühlt.

UX

Aufgrund der Effizienz, Leistung und Qualität des Codes im Produkt spielt TrustPortal aufgrund seines sicheren Designs mit niedriger Latenz, das IC problemlos implementieren konnte, eine zentrale Rolle in einem der größten IT-Projekte der Welt.

GLOBUS

Eine Anwendung, die für viele Sprachen entwickelt wurde, wodurch sich das Produkt von Trustportal international verkauft und einige der bekanntesten Unternehmen der Branche anzieht.

Clutch logo

5.0

5/5 stars rating
trusportal-logo
Quoting
Indem wir alles vom Projektmanagement bis zur Bereitstellung von Architektur und Software unter Verwendung moderner Arbeitspraktiken anbieten. Imaginary Cloud hat hervorragende Leistungen bei der Lösung sehr technischer und schwieriger Probleme erbracht.
David Linten | CTO bei TrustPortal
Dropdown caret icon
Erkläre dein Projekt und buchen Sie noch heute ein Treffen.