Case study

Interactive diagrams for a modern data platform to improve the user experience

With the help of a premium data visualization agency – a leading data discovery and governance solutions provider – it enhanced its data catalog, sped up time to market, and improved the user experience to win over its competitors.

The image shows the user interface of a data management and analysis platform called Zeenea Studio. The interface contains various sections such as dataset overview, user activity, and number of connections, as well as an overview of usage. You can see visual elements such as bar charts, pie charts, and mind diagrams that show the connections between different datasets and data points. The interface also includes options to view details, lineage, data models, and discussions related to datasets. This image is relevant because it demonstrates the platform's capabilities in data management and visualization, which can be useful for data scientists and business intelligence professionals.
Clutch logo in dark mode with a five-star rating and a score of 4.9, indicating high customer satisfaction and excellent reviews.

Reusable components that support building and working on a knowledge graph

Zeenea is the data discovery platform built for everyone to find, trust, and unlock the value of enterprise data.

The company’s built-in scanners and APIs enable organizations to automatically collect, consolidate, and link metadata from their data ecosystem. With a powerful knowledge graph and smart search engine, data teams can activate all enterprise metadata through a single source of truth.

Zeenea helps dozens of organizations worldwide democratize data, including BPCE Group, Club Med, Generali, Kering, Renault, Richemont Solactive and Stellantis. Its SOC 2 Type II and ISO 27001 compliant solutions include a Data Catalog, a Business Glossary, Data Lineage, Data Quality, Data Governance, Data Stewardship, Data Privacy, Regulatory Compliance, Cloud Transformation.

Client
Business need

Metadata management tool with dependency diagrams and knowledge graphs

Scope

Interactive UX mockups, UI implementations, and data lineage diagrams made with GoJS

React Flow
Redux
Styled components
Flowchart
IT
UX&UI design
Challenge

Improving the UX with the use of interactive diagrams for modern data platform

Take advantage of reusable components that accelerate building a knowledge graph and use them to scale your semantic network in the future.

A simplified, single-lined star icon

Conduct UX/UI improvements to enhance the readability and usability of the product.

Zeenea was looking for a tech partner that would implement the “wow” features and exceptional diagrams that resemble the components of their product.

A simplified, single-lined diagram icon

Limited availability of proficient diagramming experts onboard.

The client needed to employ the experienced diagramming experts to develop and implement the solution they needed.

A simplified, single-lined circles icon illustrating target

Outperforming competitors in terms of data visualization features is crucial for our product’s success.



Zeenea’s goal was to outperform the competitors with the refreshed and well-designed features to gain the attention of their target clients.

A simplified, single-lined human icon illustrating account profile

Zeenea faced the challenge to employ the tech experts that would implement the exact solutions concerning the diagrams for their data management tool.

A simplified, single-lined computer screen icon

Explore potential technology partners with a deep understanding and expertise in contemporary front-end technologies.



The client was looking for the agency that is an expert in front-end solutions, focusing on diagrams to visualize the complex processes.

Solutions

The implementation of three types of diagrams

To enhance the client’s product and win over its competitors, the project’s core was to develop and implement the three types of diagrams: Dependency, Inheritance, and Knowledge graphs.

Dependency diagram

A dependency diagram is a graphical representation of data that is distributed across multiple databases and data warehouses. Using artificial intelligence, this data is classified into distinct data sets and displayed visually in separate swimlanes. Each node in the diagram can be expanded or collapsed to reveal additional details in a collapsible property section. To ensure that the diagram remains legible and informative, the mechanism employs a sophisticated detection algorithm that can re-layout the data in real- time to suit any view or display.

Dependency diagram showing data relationships within dataset in a data analysis tool. The central node of the diagram connects to other data entities, visualizing their connections and the data lineage flow within the system.

Inheritance diagram

An inheritance diagram is a visual representation of the hierarchical organization and relationships between data entities in databases and data warehouses. Each parent node in the diagram can have one or more child nodes, and vice versa, forming a complex web of relationships. The diagram employs an advanced layout algorithm based on a custom diagram layout that ensures the optimal arrangement of nodes and edges, making it easier to visualize and understand the data relationships. This diagram is particularly useful for the Zeenea’s users working with object-oriented programming languages and databases that support inheritance relationships.

Inheritance diagram visualizing the data model structure of dataset in a data management platform. The hierarchical diagram displays entities and their relationships, showing how data tables are interconnected within the system.

Knowledge graph

A knowledge graph is an infinitely expandable diagram constructed using GraphQL API that represents complex relationships between various entities. With virtualization technology, the graph can efficiently handle several thousand nodes, allowing for faster rendering and navigation. The diagram is designed to be scalable, allowing for the addition of new nodes and edges without compromising the performance or structure of the graph. To aid navigation, the diagram also includes an applied minimap that provides an overview of the entire graph and enables users to quickly jump to different sections. Zeenea’s users find the knowledge graph particularly useful in domains such as natural language processing, semantic web, and machine learning, where the relationships between entities are complex and require advanced visualization techniques.

Knowledge graph visualizing its connections with various business domains and data sources. The radial diagram illustrates how the dataset is linked to multiple departments and use cases, enabling a holistic understanding of data relationships.

Interactive dashboard design

The interactive dashboard serves the role of the tool, gathering all crucial information about data for Data Managers, Data Stewards, and Data Catalog. To visualize the data, the team provided a fully interactive solution that is useful for the users and helps to understand their needs better.

An interactive dashboard is a tool designed for data management users, such as data managers, stewards, and catalog support. It allows users to monitor and control the entire process of implementing directories, analyze data usability, and build data catalogs.

Through selected diagrams and charts, users can quickly access all necessary information about the data, and examine properties and data quality.

The dashboard also features an interactive reporting feature for data stewards to communicate with data managers and view information on recent operations, logins, work progress, comments, and more. 

Dashboard interface with various diagrams visualizing data usage metrics and complexity levels. The screen displays a heatmap diagram, bar charts, and circular diagrams showing data stream proportions and dataset coverage in a data cataloging tool.

We perceive Synergy Codes as a great technological partner whose way of work fits us well. While looking for a proficient service in creating graphical components, we wanted to work with experts that would advance our tool with exceptional UX and UI, which enabled us to win new deals with significant clients.

Portrait of Aurelien Masse wearing a dark blue shirt and looking at the camera.
Aurelien Masse
VP Engineering at Zeenea
Benefits

A partnership that resulted in exceptional cooperation

The proposed solutions aim to show the benefits of building and using diagrams in metadata management tools. The appropriate solutions were provided by a mix of Developers and Designers working together on a multi-level project.

The image shows a purple circle with a white icon inside. The icon consists of the silhouette of a person with a mark next to it. This picture likely represents the user's profile or account verification symbol.

By implementing new features in the tool, our client successfully acquired a significant new customer, showcasing the value of the changes we made.

The image shows a purple circle with three horizontal lines and two vertical lines inside, resembling a settings or adjustment icon. This icon is often used in user interfaces to represent options for customizing settings or preferences.

The product improvements we implemented were fundamental to the client’s core offerings, enabling their team to concentrate on back-end features while Synergy Codes handled niche front-end technologies.

Within a couple of months of the engagement, the client experienced remarkable product progress, showcasing the efficiency of our development process.

The image shows a purple round icon with a white stopwatch symbol inside. The stopwatch symbol consists of a circle with a small rectangular shape on top that represents the stopwatch button. This type of icon is typically used to represent time-related features, such as timers or stopwatches, and is useful in contexts where tracking or timing is important.

Our partnership approach enabled us to provide faster time-to-market, leveraging our expertise to reduce the time and costs associated with bringing the product to market.

Lower entry-treshold icon.

Our client viewed us as a partner, rather than just a vendor. Our ability to work together to discuss ideas and solve challenges was critical to our success, and we recommended the best approach to ensure that our client’s needs were met.

Better user experience with the use of interactive diagrams for modern data platforms

Contact details

By sending a message you allow Synergia Pro Sp. z o.o., with its registered office in Poland, Wroclaw (51-607) Czackiego Street 71, to process your personal data provided by you in the contact form for the purpose of contacting you and providing you with the information you requested. You can withdraw your consent at any time. For more information on data processing and the data controller please refer to our Privacy policy.

*Required
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.