diff --git a/src/collections/blog/2024/11-05-what-is-the-kanvas-catalog/catalog.gif b/src/collections/blog/2024/11-05-what-is-the-kanvas-catalog/catalog.gif new file mode 100644 index 000000000000..9bd102a8ffe0 Binary files /dev/null and b/src/collections/blog/2024/11-05-what-is-the-kanvas-catalog/catalog.gif differ diff --git a/src/collections/blog/2024/11-05-what-is-the-kanvas-catalog/design-tab-icon.png b/src/collections/blog/2024/11-05-what-is-the-kanvas-catalog/design-tab-icon.png new file mode 100644 index 000000000000..b49adf24f6a9 Binary files /dev/null and b/src/collections/blog/2024/11-05-what-is-the-kanvas-catalog/design-tab-icon.png differ diff --git a/src/collections/blog/2024/11-05-what-is-the-kanvas-catalog/designer-dock.png b/src/collections/blog/2024/11-05-what-is-the-kanvas-catalog/designer-dock.png new file mode 100644 index 000000000000..da057d876b44 Binary files /dev/null and b/src/collections/blog/2024/11-05-what-is-the-kanvas-catalog/designer-dock.png differ diff --git a/src/collections/blog/2024/11-05-what-is-the-kanvas-catalog/designs-panel-opener.png b/src/collections/blog/2024/11-05-what-is-the-kanvas-catalog/designs-panel-opener.png new file mode 100644 index 000000000000..42b5fa893c86 Binary files /dev/null and b/src/collections/blog/2024/11-05-what-is-the-kanvas-catalog/designs-panel-opener.png differ diff --git a/src/collections/blog/2024/11-05-what-is-the-kanvas-catalog/import-button.png b/src/collections/blog/2024/11-05-what-is-the-kanvas-catalog/import-button.png new file mode 100644 index 000000000000..1a3ef118b38f Binary files /dev/null and b/src/collections/blog/2024/11-05-what-is-the-kanvas-catalog/import-button.png differ diff --git a/src/collections/blog/2024/11-05-what-is-the-kanvas-catalog/import-design-gif.gif b/src/collections/blog/2024/11-05-what-is-the-kanvas-catalog/import-design-gif.gif new file mode 100644 index 000000000000..5fd825f48840 Binary files /dev/null and b/src/collections/blog/2024/11-05-what-is-the-kanvas-catalog/import-design-gif.gif differ diff --git a/src/collections/blog/2024/11-05-what-is-the-kanvas-catalog/import-designs-panel.png b/src/collections/blog/2024/11-05-what-is-the-kanvas-catalog/import-designs-panel.png new file mode 100644 index 000000000000..7457795bdcfc Binary files /dev/null and b/src/collections/blog/2024/11-05-what-is-the-kanvas-catalog/import-designs-panel.png differ diff --git a/src/collections/blog/2024/11-05-what-is-the-kanvas-catalog/post.mdx b/src/collections/blog/2024/11-05-what-is-the-kanvas-catalog/post.mdx index 3264a6af7d6f..5e00fa714b57 100644 --- a/src/collections/blog/2024/11-05-what-is-the-kanvas-catalog/post.mdx +++ b/src/collections/blog/2024/11-05-what-is-the-kanvas-catalog/post.mdx @@ -18,13 +18,24 @@ resource: true import { BlogWrapper } from "../../Blog.style.js"; import { Link } from "gatsby"; +import quickActionsPNG from "./quick-actions-designs.png"; +import importDesignButtonPNG from "./import-button.png"; +import importDesignPanelPNG from "./import-designs-panel.png"; +import renderedDesignPNG from "./rendered-design.png"; +import designPannelOpener from "./designs-panel-opener.png"; +import designerDockPNG from "./designer-dock.png"; +import catalogGIF from "./catalog.gif"; +import publishToCatalogGIF from "./publish-to-catalog.gif"; +import importGIF from "./import-design-gif.gif"; +import getStartedWithDesignerGIF from "./start-from-scratch.gif"; + ### What is the Kanvas Catalog? Kanvas Catalog is a hub for sharing and discovering best practices, reusable templates, and operational patterns for Kubernetes and cloud-native infrastructure. It's like a marketplace where you can find and contribute pre-built infrastructure configurations and operational views. The Catalog is a part of the Kanvas platform, which is a comprehensive suite of tools for managing cloud-native infrastructure. -
Explore the catalog
+
Explore the catalog
### What can you find in the Catalog? @@ -41,8 +52,42 @@ import { Link } from "gatsby"; - Collaboration: Share your own designs and contribute to the growing collection of patterns. ### How can you contribute to the Catalog? - + +You can contribute to the Catalog by creating high-quality starter templates and publishing designs for the community to use in various ways. You can also climb the leaderboard by having your designs cloned, downloaded, or viewed the most. Follow the instructions below to get started with your designs. + +#### Create or Import a Design +Begin by creating a new design from scratch, using existing design patterns and templates from catalog: + +**From Scratch**: + +- Open the Designs panel, Select and arrange components from the Designer Dock on the Kanvas, and customize with connections, labels, and properties. + + +**From a Template**: + +- Start from a pre-built template or clone an existing design from the Catalog. This allows you to build on established designs for a quicker start. + + +**Import a Design**: +- Access the Kanvas Designer and select the "Import" button in the left Designs panel. Import your own designs from local filesystem or from a remote URL directly into the Catalog. Upload a file or provide a URL for Docker Compose, Helm Charts, Meshery Designs or Kubernetes Manifests. Choose to either import as new or merge into current design that you have open in Kanvas. + + +Kanvas will convert these into a usable design based on their configurations. + + + + +#### Publish a Design +Make your designs accessible to others by publishing them in the Catalog: + +- In the designs panel, locate your design and hover over it to access quick actions. Select the info button (marked with an "i") and add any necessary details for the review process, such as relevant technologies, descriptions, and considerations and click Publish button. Once approved by the Maintainers, your design becomes available to the broader community in Kanvas catalog. + + + +#### Share your designs +Share your designs with your team members and effortlessly collaborate on designing and operating multi-cloud and Kubernetes native infrastrcutre with a seamless, built-in review mechanism. + diff --git a/src/collections/blog/2024/11-05-what-is-the-kanvas-catalog/publish-to-catalog.gif b/src/collections/blog/2024/11-05-what-is-the-kanvas-catalog/publish-to-catalog.gif new file mode 100644 index 000000000000..97e6e1dd5799 Binary files /dev/null and b/src/collections/blog/2024/11-05-what-is-the-kanvas-catalog/publish-to-catalog.gif differ diff --git a/src/collections/blog/2024/11-05-what-is-the-kanvas-catalog/quick-actions-designs.png b/src/collections/blog/2024/11-05-what-is-the-kanvas-catalog/quick-actions-designs.png new file mode 100644 index 000000000000..a0a7bf81adc9 Binary files /dev/null and b/src/collections/blog/2024/11-05-what-is-the-kanvas-catalog/quick-actions-designs.png differ diff --git a/src/collections/blog/2024/11-05-what-is-the-kanvas-catalog/rendered-design.png b/src/collections/blog/2024/11-05-what-is-the-kanvas-catalog/rendered-design.png new file mode 100644 index 000000000000..0d0fe39a9c4d Binary files /dev/null and b/src/collections/blog/2024/11-05-what-is-the-kanvas-catalog/rendered-design.png differ diff --git a/src/collections/blog/2024/11-05-what-is-the-kanvas-catalog/start-from-scratch.gif b/src/collections/blog/2024/11-05-what-is-the-kanvas-catalog/start-from-scratch.gif new file mode 100644 index 000000000000..752d826d45b1 Binary files /dev/null and b/src/collections/blog/2024/11-05-what-is-the-kanvas-catalog/start-from-scratch.gif differ