Schema Visualizer

We are launching our Technical Preview today for limited number of users available to help us iterate and build the product you always dreamed of to improve the process of data modeling and software development collaboration in general.

We are looking for engineers involved in data modeling in their current roles who are open to provide honest feedback on our initial releases, make suggestions for improvements and guide us to build the right product for you.

Hubql services are available for free during the Technical Preview which will run for a few weeks until our Public launch in Q2 of this year.

The Technical Preview comes with a our initial offering to support the data modeling process by providing you the ability to visualize data models in Hubql.

You will be able to edit a data model in a code editor or sync your source code from GitHub.

Data models are visualized and then can be shared with your colleagues, external parties or as a public link - as easy as using Google Drive.

Here is a quick sneak peak how this looks like from a user perspective where you can collaborate on data models in JSON for example with your team using the workflow below:

1. Upload a file or connect your GitHub repository

You can start by uploading a file to Hubql from your local computer or in case you have a GitHub repository connected to Hubql GitHub app then you can connect one of your repository contents.

Create a file via GitHub repositories or direct upload

Once connected with GitHub you can directly import your latest files to Hubql.

Imported repository with one example JSON file

Any file that has been added to Hubql can then be opened which comes in a split view of a code editor and visualization in one page.

You can then go ahead and edit file directly or explore the visualization to inspect relations.

Once you are ready to share your file with other you can use the "Share" button to invite anyone to your file to view, comment or edit it. Anyone invited via email will be notified and able to open the files after they joined Hubql.

To work together on a file you can use comments to discuss a file or specific fields with your peers to iterate over the data model together. To take the discussion further you can create threads to dive deeper on certain fields or points in your schema.

5. Save & Create a pull request in GitHub

Files can be saved in revisions or directly synced back to GitHub via a pull request using our Hubql integration with GitHub.

Upon saving your file and in case your project is connected to GitHub you are able to provide a commit message and PR title to create a pull request.

After your file changes have been committed in Hubql you will be able to follow along in GitHub to take further action on your pull request.

Updates in your configured branch in GitHub also directly sync back to Hubql e.g. once you merged your pull request changes are immediatly available in Hubql with your latest changes.

In our Technical Preview you will be able to use the full feature set available as described above with just a few limitations.

The Technical Preview Free Tier has the following limits:

We are committed to build the best developer experience for creating and maintaining data models in near future.

The feedback from the Technical Preview will be directly incorporated into further development of Hubql to help you to be more successful crafting data models and to enable more engineers benefit from using our services.

For the next weeks we have further improvements planned to ease first steps with Hubql by providing templates and data model references to get started.

We are also planning to provide more file type support to offer a wide range of data model sources such as Hasura configuration, SQL and other file types that can benefit from visualization or are commonly used.

Hubql wants to address the pain points of today’s software development by providing the tools and a platform for both engineers and non-technical stakeholders to collaborate better by increasing overall development velocity.

Our platform will provide the following core features to help tech teams achieve more:

 for our Technical Preview today and learn more how Hubql can help you to build software together.

Hubql is launching its Technical Preview today with access for limited users to help build the next generation collaboration platform for data modeling to build software together.

Hubql launches Technical Preview Free Tier

This new release introduces our first AI-powered feature generating templates to start with, more file support for GraphQL and Protobuf, color-coded model grouping and change suggestions for a better collaboration in teams.‍

We’re excited to announce several new features coming to version 0.8:

AI-generated data model and API schema templates

We now offer the ability to use OpenAI-powered templates that help you to use AI-generated starting points for your projects.

When creating a new file in Schema Visualizer, you can now select “Ask AI” and describe the app you are building, e.g. “food ordering app” or a reference application such as “Slack”.‍

We currently integrate with OpenAI to help us generate data models. These models generated can be saved and be used in your Schema Visualizer account as starting points for your next projects.

Ask AI for a data model in either JSON, Prisma, GraphQL and Protobuf file type.‍

With the release of version 0.8 we now support GraphQL schema files and its visualization.

We support standard GraphQL schema definition language (SDL) files with definitions for Query and Mutation types.

Visualizing GraphQL schema will help you to collaborate in the case of modifications, for example to discuss breaking changes or conducting an impact analysis when iterating over your GraphQL API schema.‍


‍Future releases will include the support for additional GraphQL features such as Scalars, Directives and Variables in both visualization and no-code suggestions.

Furthermore, we are working on introspection and local development support to visualize your schemas in your familiar environments using a CLI or GraphQL plugin.‍‍‍

sign in to Schema Visualizer

In our latest release we also now offering Protobuf file support. This enables you to turn your Protobuf definitions into a graphical representation.

‍The Protobuf standard, created by Google, has become a popular way to define structured data in a language-agnostic way.

Schema Visualizer will automatically generate a graph from single Protobuf message definitions files.

In upcoming releases, we aim to provide multi-file support that will allow you to group or combine several files into a single visualization.

At this point, we do not yet support imports or custom definitions beyond standard types. However, this feature is on our list of upcoming improvements.‍

You can now use labels to group your entities into groups by attaching a color-coded label to them.

By using this new Feature, you can apply labels to several entities at once, such as grouping your data models and API types by domain, service, or owner.

The labels are color-coded in the visualization helping with more concise and appealing documentation.

We are introducing suggestions to help teams working with both technical and non-technical contributors, as well as external parties requiring permissions to make changes.

With suggestions, you can enable your collaborators to review and suggest changes to your field types, keys or values depending on the file you are working on within Schema Visualizer.

We offer suggestions for all file types available in Schema Visualizer that can also be accepted and directly applied to the source code to keep visualization and code in sync.

Suggestions are available to certain permission levels only, attached to a specific user making a suggestion and can be either accepted or discarded.‍

Thank you for taking the time to read our latest changelog post.

We're excited about the improvements and updates we've made, and we can't wait to hear your thoughts and feedback.

return to front page

If you like our product and want to be part of the discussion, we invite you to join our Discord community. These are the perfect places to connect with fellow users, share your ideas, report any issues you encounter, and stay up-to-date with the latest developments.‍

Click on the link below to join our Discord server and become a part of our community: 

discord link

Additionally, we invite you to connect with us on LinkedIn for more networking and updates.
Follow our LinkedIn page to stay informed about our company's news, job opportunities, and industry insights. 

linkedin link

‍We value your input, and your participation will help us make our product even better.
Let's build software together!

‍
We look forward to seeing you in our app, Discord or LinkedIn.

AI-powered feature generating templates to start with, more file support for GraphQL and Protobuf, color-coded model grouping and change suggestions for a better collaboration in teams.

Beta release version v0.8

This new release introduces several UX improvements, resolution of a few pendings fixes and also some exciting new features.

We’re proud to share several new features with you in version 0.9:

We have added color-coded highlighting for relations for the following file types: GraphQL, Protobuf and Prisma.

You can now automatically highlight relations of nodes by click and select a node title, which will then highlight all relations of the selected note.

This helps your teams to collaborate, discuss or produce documentation or screenshots for your systems.

Color-coding helps also for live-collaboration where each participant has a respective color assigned to highlight each user selection.

We also support highlighting of single relations when clicking and selecting single fields with relations or for example type definitions in GraphQL.

Below and example for a Prisma schema with highlighted relations:

As a next step we plan to provide additional controls on the color coding and toggles to enable/disable certain behaviors for full-control of your workflow.‍

With the introduction of color-coded tagging as a first step towards more beautiful documentation of your data models and APIs we now enable you to create your own layouts by saving the position of your nodes.

In combination with the colored tags you can arrange related or group domain models together in the same area providing a more approachable layout for documentation or meetings discussing your data models or APIs with your team.

We automatically save the position as your dragged the nodes to a new position and will store and load upon page reload again.

The same applies to our new feature documentation notes.

‍In some cases you may to have various layouts or re-arrange the nodes to your requirements.

We are looking for more feedback here to understand how you may want to arrange your nodes or if you need several layout templates available.

We will also continue to improve our initial auto-layout available on first load or when adding new items to your data model.‍

Our highlight in this release is the introduction of documentation notes.

You can now add additional notes to your visualization beyond the converted code.

‍Documentation notes can help you to provide further context to your data models for business users e.g. different to code comments where you may talk about implementation details but share business logic with your stakeholders alongside your documentation.

This will enable all team members beyond engineers to understand your data models and ability to collaborate in one place.

‍Notes can be formatted with headlines, paragraphs, ordered and numbered lists for now and rendered as white on black as default.

Together with our new save position feature - notes are also saved in their previous location on drag stop.

‍Here a small example to add small TODO notes to a data model for quick iteration in a discussion for example:

You may also add your RFC or requirements directly in your data model enabling engineers and product managers to collaborate together in one place with an example below:

‍Documentation notes are a big step forward to our vision of Hubql enabling everyone to collaborate in software development process and helping teams to iterate quickly on ideas together.

There is a long list of improvements we have planned for notes in the future such as supporting more formatting options, adding general documentation and generating a final documentation out of all notes alongside the visualization for your documentation purposes.

‍This feature is experimental for now and we would appreciate your feedback and ideas to bring notes to the next level in Schema Visualizer.‍

We are now gearing up for our launch of our first stable version v1.0.

There is still some pending UX work to ensure we can offer you a smooth sign up and onboarding process including proper documentation.

We also aim to offer additional documentation features, stabilize the GraphQL and Protobuf support and plus support for multiple files in one visualization.

As always, your feedback means a lot to us. Please keep sharing.‍

Stay tuned for our launch we will appreciate your help when we launch.‍

Click on the link below to join our Discord server and become a part of our community:

‍Additionally, we invite you to connect with us on LinkedIn for more networking and updates.
Follow our LinkedIn page to stay informed about our company's news, job opportunities, and industry insights.

Many great UX improvements for teams by highlighting relations, saving of node positions with custom layouts and introduction of documentation notes for various documentation use-case for collaboration.

Beta release version 0.9 | Schema Visualizer

Beta release version 0.9

Data modeling is a crucial aspect of modern software development for software engineers, software architects and data engineers alike.

It involves creating visual representations of data structures, relationships, and attributes, which aid in understanding and modeling data effectively.

Data modeling tools play an important role in this process, simplifying the creation and management of data models. However, despite their benefits, data modeling tools come with their own set of challenges that organizations and data professionals must address to harness the full potential of their data assets.

In this article, we will explore some of the common challenges associated with data modeling visualization tools and discuss ways to overcome them when modelling data today building software applications.

Data modeling tools have evolved to accommodate the diverse needs of different industries and organizations. While this variety is a strength, it can also be a source of complexity. Many data modeling tools are feature-rich, offering a multitude of options and customization possibilities. This complexity can lead to a steep learning curve for new users.

One key challenge software teams face is ensuring that their team members are adequately trained to make the most of these tools.

Data professionals must invest time and resources in learning the ins and outs of the tool they are using. This can be particularly daunting for those who are new to data modeling or come from non-technical backgrounds. Overcoming this challenge requires a commitment to training and providing resources to help users become proficient in the chosen tool.

Furthermore, organizations may face issues with tool interoperability. The diversity of data modeling tools in the market means that professionals may need to work with different tools for specific tasks. Understanding the nuances of multiple tools can be overwhelming. Addressing this challenge involves designing clear workflows and best practices to ensure a smooth transition between tools and data modeling phases.

Collaboration is fundamental to the success of data modeling projects. Multiple team members, often from different departments or even external partners, need to work on the same data model simultaneously. However, data modeling tools can sometimes fall short in enabling seamless collaboration and communication.

Version control is one more significant challenge in collaborative data modeling. When multiple team members make changes to a data model, it can be difficult to track and manage different versions. This can lead to conflicts, errors, and data inconsistencies. Many data modeling tools lack robust version control mechanisms, making it challenging for teams to keep track of changes and manage concurrent updates.

Especially the integration with Git as the de-facto standard for version control is lacking in many tools available where most data models are now defined in the source code repository.

Data modeling tools are often used in conjunction with various data sources and databases. Ensuring that the tool is compatible with the team's existing data infrastructure can be a significant challenge. The data modeling tool should be able to connect to different databases, support multiple data formats, and integrate seamlessly with the existing technology stack.

To overcome compatibility challenges, organizations need to invest in data integration solutions and ensure that their data modeling tools have the necessary connectors and adaptability to handle diverse data sources and formats.

Effective data modeling involves not only creating data models but also documenting them comprehensively. Documentation is essential for understanding the data model's purpose, structure, and relationships, as well as for aiding in data governance and data lineage analysis.

Data modeling tools often provide features for documenting data models, but this can be a challenge if not done consistently and thoroughly. Inadequate documentation can lead to misunderstandings, errors, and inefficiencies when working with data models.

To address documentation challenges, organizations should establish clear guidelines and standards for documenting data models. These guidelines should cover naming conventions, descriptions, and data lineage information. Additionally, they may consider using metadata management tools to centralize and organize metadata for easier access and analysis.

Besides documentation tend to be outdated when lacking version control and integration with the team’s workflow leading to misunderstanding and miscommunication in organizations.

A process or integration for keeping documentation up-to-date is required.

There are a number of visual data modeling tools available online from drawing and charting tools to more purpose-build tools turning code into ER-diagrams for example. We have picked 3 that can be used to visualize your data model drafts online:

This web-based database diagram designer is mainly for people with technical skills - developers and data analysts using DBML and other languages to define database schema and visualize them.

Its intuitive code-based interface makes it easy for users to draw Entity-Relationship (ER) diagrams as they code.

Draw.io is a versatile online drawing tool tailored for various kinds of modeling and diagrams. It has a wide range of customizable features, it empowers data professionals to effortlessly create intricate data models and collaborative work. It also offers a SQL plugin to turn code into diagrams.

Lucidchart is a powerful online platform that excels in chart visualization including data model drafts. Its robust features can be used to draft data models as a chart and collaborate online.

Miro is one of the most popular whiteboard tools available online to work together in real-time in teams. It can be used to brainstorm and create initial data model drafts together. It focusses more on real-time collaboration and visualization than integration with the actual data model code itself later.

Many teams today rely on whiteboards/offline session which can be fun and interactive but normally lead to a gap of communication, challenges to digitize and recap actual results from the sessions.

How Schema Visualizer solve these challenges

 we have put a lot of thought and our experience into building a platform that can help your team tackle the challenges or data model visualization and collaboration.

Similar to other tools available you can turn data model schemas into diagrams automatically using code. Automatically generated diagrams solve the problem of outdated documentation and ability to embed/export them for further use.

Beyond converting data model code to ER diagrams for example we have combined the visualization with additional features to ease collaboration and integration by providing comments, suggestions, shareable links and Git integration with GitHub.

If you are struggling with your data modeling process or your data modeling tooling today,

 to find out how we or other tools can help you.

Challenges in data model tooling in 2023

The day has come we are introducing Schema Visualizer with our release of our version 1.0.
Our launch version is not only a big milestone for our product but also for us a startup company.

This new release introduces our first stable version with a full feature set for teams to build, collaborate and document on data models and API schemas.

We’re proud to include several new features and UX improvements with you in this version 1.0:

Stability improvements with bug fixes and better UX

To reach our first stable release with version 1.0, we invested a lot of our time resolving left-over bug fixes, performance improvement, and general convenience enhancement.

Here are a few bug and issues we resolved for the release:

We have also added new user experience improvements for a more pleasant user journey, such as:

Image

If you are familiar with Visual Studio Code or other IDEs, they normally come with a set of layout and visibility toggles to give you full flexibility for your layout preferences.

We wanted to give you the same power using Schema Visualizer.

With our stable release, you can use the right-click context menu to toggle the visibility of all modules, whether the code editor, visualization, header or comment sidebar - you have full control.

One of the most requested features was to delete and rename files in your Hubs.

You can now delete and rename files for static Hub that are not connected to a GitHub repository.

The feature is available through a context menu in the Hub detail page where all files in a Hub are listed.

In our previous version, 0.9, we have already introduced documentation notes as experimental features.

With our launch release, we ensured to reach stability for documentation notes where you can now:

Documentation notes are especially useful to add additional context to your data models and API to provide explanations, open discussions, add TODOs or attach requirements to your visualization in one place.

Notes are also fully integrated with our commenting system, meaning a note can be taken further by starting a thread alongside the note to discuss, clarify or get feedback on ideas.

We can’t wait to learn more on how you will or like to use documentation notes.

You can now export the visualization of your data models and API schemas as an PNG image.

We provide this functionality as an experimental feature where you can download the current view of your browser in Schema Visualizer as a file to your machine.

Since this feature is experimental, we are looking for feedback and further ideas for export functionality.

Future work to enhance and stabilize will be to adjust the quality of the image, export in other formats, and export not only the current view but the whole canvas to your machine.

This feature is available for all file types and all users today.

We are not stopping here but have big plans for our future releases starting from stabilizing the export and further visualization features.

One of the bigger features rolling out in the next few weeks will be stabilizing all file support, especially Protobuf (multi files) and GraphQL, as well as introducing SQL support.

At this time, we are also preparing our pricing strategy and still seeking further suggestions and expectations in terms of pricing you would expect for Schema Visualizer. Stay tuned for our pricing and paid plans, with even further functionality to be released soon.

Feel free to suggest new features or reach out to us to discuss your ideas.

Hubql release version 1.0 introduces our first stable version with a full feature set for teams to build, collaborate and document on data models and API schemas.



Changelog Version 1.0

Introducing Hubql - Release version 1.0

After our big release in November, we are not standing still and happy to introduce our latest release version 1.1, which introduces several new features for you:

JumpTarget

We are introducing a new file type support for XML to visualize XML schemas and files.

XML is a widespread file format still today heavily used for APIs or data structure or schema definitions, for example in SOAP APIs.

Schema Visualizer's support for XML will look familiar to you if you have tried our JSON visualization before. The XML visualization uses the same graph view for XML files.‍

Our XML support is still experimental, and we would appreciate your feedback and ideas to improve the XML support in Schema Visualizer.

Here is an example of a simple XML schema that has been visualized in Schema Visualizer:

Beyond the current support for XML files, we are also looking into supporting XML schemas in the future to visualize files based on a schema definition together with our upcoming multi-file support.

In version 1.0, we introduced documentation notes, but they lacked context, so today, we are introducing field-related notes.

With field-related notes you are able to add additinal information to specific fields in your data model. This helps you to add further explenation and to go beyond the limited comments in your code. We think that this will provide you and your team with greater collaborative capabilities.

Field-related notes are also saved in their previous location on drag stop.

Here a small example to add small TODO notes to a data model for quick iteration in a discussion for example:

Today, we also launch the ability to show/hide children in the JSON visualization view.

You can click a link icon to toggle the visibility of the children of a node in the JSON or XML graph.

This helps to consume large JSON files and focus on the relevant parts of the JSON file.

See below example how looks like for a complex JSON file:

We have more improvements planned for the JSON visualization view in the future to make it even easier to browse and consume large JSON and XML files.

We did not just add new features in this release, but continue to invest in a better user experience for you using Schema Visualizer.

For the upcoming releases, we are currently investing more time in improving the editor experience. This includes Prisma language support, introducing of SQL file support and further export enhancements, such as API based access or the publishing to GitHub comments.

Stay tuned as we close this year with another release in December still.

Our latest release version 1.1 introduces XML file support, field-related notes and many UX improvements to Schema Visualizer collaboration platform.



Release version 1.1 | Schema Visualizer

Release version 1.1

Navigating the complex landscape of IT services and applications can be overwhelming for early-stage SaaS startups. Maintaining clarity of the used tools is significant for efficiency and effective decision-making. At Schema Visualizer, we’ve faced these challenges and developed a Tech Stack to provide insight into the usage of IT services and applications across various units and processes.

This article delves into the construction of our Tech Stack, revealing the tools and collaborations that shape our operations, and offers guidance on building a customized Tech Stack for your startup.

Tech Stacks typically comprise frontend and backend components, each further categorized to streamline operations. However, this approach can be customized to suit individual needs.

At Schema Visualizer, our Tech Stack is organized into:

These categories provide a structured foundation, enabling us to manage and coordinate tasks within our team efficiently. Identifying and defining the different units and processes is essential for a well-organized Tech Stack, setting the stage for integrating IT services and applications.

Defining business processes provides an initial overview of the tools in use. Encourage team members to share the tools they use daily, creating a comprehensive and standardized view of your Tech Stack. This collaborative approach ensures that the selected tools align with practical needs and enhance overall productivity.

We recommend choosing a user-friendly drawing tool like Excalidraw or Miro to craft your Tech Stack. The key is to include every tool, unit, and process relevant to your operations. The beauty of it lies in the flexibility to shape your design, define categories, and choose forms that align with your organizational preferences.

After diving deep into the process, our Tech Stack came out as a true team effort. It's the blend of everyone's insights and efforts - crafted, refined, and optimized to fit our unique needs. This dynamic toolkit is more than just a set of tools; it reflects our journey, showcasing the collaborative spirit that fuels our SaaS startup.

Discover the intricate world of SaaS startup technology stacks with Schema Visualizer's insightful journey into constructing a robust tech infrastructure. Uncover our categorized approach to development, product management, and collaboration, providing a structured foundation for efficient operations. Learn how we navigate tool selection, emphasizing alignment with business requirements and seamless integration. Dive into the collaborative creation of our own Tech Stack, offering a standardized view of tools that enhance practical needs and productivity. Download our Tech Stack presentation and empower your startup with strategic insights. Challenges are opportunities for growth – let's innovate together!

Blog

Best tools for GraphQL visualization in 2024

Release version 1.3

Release version 1.2

The modern SaaS-Startup Tech Stack