{"id":2466,"date":"2021-08-05T13:31:54","date_gmt":"2021-08-05T21:31:54","guid":{"rendered":"https:\/\/live-cometml.pantheonsite.io\/blog\/clipdraw-gallery-ai-art-powered-by-comet-and-gradio\/"},"modified":"2021-08-05T13:31:54","modified_gmt":"2021-08-05T21:31:54","slug":"clipdraw-gallery-ai-art-powered-by-comet-and-gradio","status":"publish","type":"post","link":"https:\/\/www.comet.com\/site\/blog\/clipdraw-gallery-ai-art-powered-by-comet-and-gradio\/","title":{"rendered":"CLIPDraw Gallery: AI Art Powered by Comet and Gradio"},"content":{"rendered":"\n<h2 class=\"wp-block-heading\"><em>Contribute to <a href=\"https:\/\/www.comet.com\/team-comet-ml\/clipdraw\/view\/Y4aT3gy6IrPQKBi5wncFXCYLR?utm_campaign=clipdraw-gradio&amp;utm_source=blog&amp;utm_medium=subtitle\">a growing gallery of AI-generated art<\/a><\/em><\/h2>\n\n\n\n<p>&nbsp;<\/p>\n\n\n\n<blockquote class=\"wp-block-quote is-layout-flow wp-block-quote-is-layout-flow\">\n<p><a href=\"https:\/\/clipdraw.comet.ml\/?utm_campaign=clipdraw-gradio&amp;utm_source=blog&amp;utm_medium=intro\">Jump right in and submit your prompt here<\/a><\/p>\n<\/blockquote>\n\n\n\n<p>A few weeks ago, we announced <a href=\"https:\/\/www.comet.com\/site\/new-integration-comet-gradio\/?utm_campaign=clipdraw-gradio&amp;utm_source=blog&amp;utm_medium=intro\">a really exciting integration between Comet and Gradio<\/a>, which allows data scientists and teams to interactively test and validate their ML models via real-time demos, all while tracking experiment metrics, hyperparameters, source code, and more.<\/p>\n\n\n\n<p>There are any number of possible use cases for this integration, but to demonstrate one particularly valuable (and fun) one, our team has been hard at work creating a public gallery space for AI-generated artwork.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Motivation<\/h2>\n\n\n\n<p>The advent of extremely large pre-trained Transformer models, such as GPT3 and CLIP, has led to the rise of a new phenomenon: <strong>Prompt Engineering<\/strong>.<\/p>\n\n\n\n<p>These large models are capable of producing all sorts of fantastic outputs; however, the key to making them work is using the right set of instructions as an input. ML Twitter is <a href=\"https:\/\/twitter.com\/search?q=%23VQGAN&amp;lang=en\">full of examples<\/a> of people experimenting with different types of prompts and sharing their results. The issue here is since this knowledge is scattered, there is no way for other people to learn and build from past approaches.<\/p>\n\n\n\n<p>We believe that Prompt Engineering will receive a lot of attention in the future as a way to interact with these large generative models. However, if we don&#8217;t keep track of what the community is trying and creating, we won&#8217;t be able to get very far.<\/p>\n\n\n\n<p>To support the efforts of the ML and Generative Art community&#8217;s experimentation, we&#8217;re creating a public Comet Project to track Generative Art created with the CLIPDraw model, along with a <a href=\"http:\/\/gradio.app\">Gradio<\/a> UI to interact with the model on our community server.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">How it Works<\/h2>\n\n\n\n<p>Here&#8217;s how it works, at a high level. Using Gradio, we were able to create a simple, efficient user interface for generating and visualizing individual model predictions in real time.<\/p>\n\n\n\n<p>We paired these powerful capabilities with <a href=\"https:\/\/kvfrans.com\/clipdraw-exploring-text-to-drawing-synthesis\/?utm_camapaign=gradio-comet-clipdraw&amp;utm_source=website&amp;utm_medium=blog\" target=\"_blank\" rel=\"noreferrer noopener\" aria-label=\" (opens in a new tab)\">Kevin Frans&#8217; CLIPDraw model<\/a> implementation to create a UI that accepts a text prompt as the core input (along with a couple of optional parameters like training iterations, etc), and produces AI-generated art as an output.<\/p>\n\n\n\n<p>Then, using the integration between Gradio and Comet, we created a Comet project where we log these text prompts, image creation parameters, and generated images of a given run.<\/p>\n\n\n\n<p>When you submit a prompt, it&#8217;s queued up as an Experiment in the project, and as a job on our community GPU server, which will continuously run image generation jobs as they come in. Jobs are currently capped at a runtime of 10 minutes, but the intermediate images will be logged to your Experiment.<\/p>\n\n\n\n<p>&nbsp;<\/p>\n\n\n\n<blockquote class=\"wp-block-quote is-layout-flow wp-block-quote-is-layout-flow\">\n<p>Don&#8217;t want to wait for the Community Server to finish your job? Try running it yourself in this <a href=\"https:\/\/colab.research.google.com\/drive\/16nR8_Ida5tID1RSzLy1Fv_LLav3MF1Zt?utm_campaign=clipdraw-gradio&amp;utm_source=blog&amp;utm_medium=pull-quote\">Colab Notebook<\/a><\/p>\n<\/blockquote>\n\n\n\n<p>&nbsp;<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img decoding=\"async\" class=\"wp-image-5845\" src=\"https:\/\/wordpress.comet.ml\/app\/uploads\/2021\/08\/team-comet-ml-clipdraw-cover-1024x476.png\" alt=\"\" \/><\/figure>\n\n\n\n<p>The result is <a href=\"https:\/\/www.comet.com\/team-comet-ml\/clipdraw\/view\/Y4aT3gy6IrPQKBi5wncFXCYLR?utm_campaign=clipdraw-gradio&amp;utm_source=blog&amp;utm_medium=summary\">a data-rich public gallery of AI-generated art experiments!<\/a> But any art gallery is only as good as the artists who populate it. Which leads us to&#8230;<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">How to Contribute<\/h2>\n\n\n\n<p>Contributing to this project is simple\u2014<a href=\"https:\/\/clipdraw.comet.ml\/?utm_campaign=clipdraw-gradio&amp;utm_source=blog&amp;utm_medium-contribute\">visit the public Gradio interface<\/a>, enter a text prompt, experiment with the optional parameters (as a general rule, increasing the values will result in a richer image but take more time to process), and then hit submit.<\/p>\n\n\n\n<p>Here&#8217;s what the parameters mean:<\/p>\n\n\n\n<p><strong>Seed:<\/strong> Set the seed used for initialization in order to reproduce your drawing. This can be any positive integer.<\/p>\n\n\n\n<p><strong>Prompt:<\/strong> The text prompt that the model will use to create the drawing. It can be any type of string. The model will try to maximize the similarity between this prompt and the generated image.<\/p>\n\n\n\n<p><strong>Negative Prompt<\/strong>: The model will try to minimize the similarity between the generated drawing and this prompt.<\/p>\n\n\n\n<p><strong>Stroke Count: <\/strong>The number of Stroke Vectors to use for the drawing.<\/p>\n\n\n\n<p><strong>Iterations: <\/strong>The number of optimization steps to take when creating the drawing.<\/p>\n\n\n\n<p><strong>Use Normalized Clip: <\/strong>Controls whether you normalize the image when running the optimization process.<\/p>\n\n\n\n<p><strong>Social: <\/strong>If you&#8217;d like us to tag you on Twitter with your creation, drop your handle in here.<\/p>\n\n\n\n<p>You&#8217;ll then see a Comet URL generated on the right side of your screen\u2014this lets you know that your experiment is in the queue, training is underway, and that you&#8217;ll be able to see the output at that URL when training is complete. Here&#8217;s a GIF showing that process:<\/p>\n\n\n\n<p>&nbsp;<\/p>\n\n\n\n<figure class=\"wp-block-image size-large is-resized\"><img decoding=\"async\" class=\"wp-image-5840\" src=\"https:\/\/wordpress.comet.ml\/app\/uploads\/2021\/08\/gradio-clipdraw-demo.gif\" alt=\"\" width=\"600\" \/><\/figure>\n\n\n\n<h2 class=\"wp-block-heading\">Other cool things!<\/h2>\n\n\n\n<p>With Comet&#8217;s powerful experiment management tools, there are a few additional goodies inside this project that can be fun to play around with.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Visualize training runs across steps<\/h3>\n\n\n\n<p>Inside the experiment run (found via the output URL on the Gradio interface), click on the &#8220;Graphics&#8221; tab, and you&#8217;ll see before your eyes the evolution of your AI-generated art.<\/p>\n\n\n\n<p>You&#8217;ll initially see a gallery of static images, but you can also then view a timelapse of this progression by clicking the &#8220;Play&#8221; button under the &#8220;Filter by Step&#8221; column.<\/p>\n\n\n\n<p>Here&#8217;s a GIF showing this in action:<\/p>\n\n\n\n<p>&nbsp;<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img decoding=\"async\" class=\"wp-image-5841\" src=\"https:\/\/wordpress.comet.ml\/app\/uploads\/2021\/08\/gradio-clipdraw-timelapse.gif\" alt=\"\" \/><\/figure>\n\n\n\n<h3 class=\"wp-block-heading\">Compare and &#8220;diff&#8221; experiment runs<\/h3>\n\n\n\n<p>If you&#8217;d like to compare outputs on the same text prompt with different optional parameters, you can also do that inside of Comet.<\/p>\n\n\n\n<p>Simply visit the main project page, find and select experiment runs you want to compare, click the &#8220;DIFF&#8221; button at the top of the table, and then click the &#8220;Graphics&#8221; tab to see a side-by-side. You can again visualize the progression across model training steps by clicking the play button under the &#8220;Filter by Step&#8221; column. Here&#8217;s a quick look at this in practice:<\/p>\n\n\n\n<p>&nbsp;<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img decoding=\"async\" class=\"wp-image-5842\" src=\"https:\/\/wordpress.comet.ml\/app\/uploads\/2021\/08\/gradio-clip-draw-diff-demo.gif\" alt=\"\" \/><\/figure>\n\n\n\n<h2 class=\"wp-block-heading\">Share your creations with us!<\/h2>\n\n\n\n<p>We&#8217;ll be checking in on the public project page to see what folks are submitting and creating, but if you end up with something you can&#8217;t resist sharing, let us know!<\/p>\n\n\n\n<p>Take a screenshot or capture a GIF and <a href=\"https:\/\/twitter.com\/Cometml\">tag us on Twitter (@Cometml)<\/a> or <a href=\"https:\/\/www.linkedin.com\/company\/comet-ml\">LinkedIn (@comet-ml)<\/a>. We&#8217;re excited to see what you come up with!<\/p>\n\n\n<hr class=\"wp-block-separator\" \/>\n\n\n<h2 class=\"wp-block-heading\">Like what you&#8217;re reading?<\/h2>\n\n\n\n<p><a href=\"https:\/\/info.comet.ml\/newsletter-signup\/\">Subscribe to the Comet Newsletter<\/a> to stay in the loop with what we&#8217;re building and to hear our team&#8217;s takes on the latest industry news, research, perspective, and more.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>How Gradio and Comet work beautifully together<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"customer_name":"","customer_description":"","customer_industry":"","customer_technologies":"","customer_logo":"","footnotes":""},"categories":[8,5],"tags":[],"coauthors":[128],"class_list":["post-2466","post","type-post","status-publish","format-standard","hentry","category-comet-community-hub","category-partners-integrations"],"yoast_head":"<!-- This site is optimized with the Yoast SEO Premium plugin v25.9 (Yoast SEO v25.9) - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>CLIPDraw Gallery: AI Art Powered by Comet and Gradio - Comet<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.comet.com\/site\/blog\/clipdraw-gallery-ai-art-powered-by-comet-and-gradio\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"CLIPDraw Gallery: AI Art Powered by Comet and Gradio\" \/>\n<meta property=\"og:description\" content=\"How Gradio and Comet work beautifully together\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.comet.com\/site\/blog\/clipdraw-gallery-ai-art-powered-by-comet-and-gradio\/\" \/>\n<meta property=\"og:site_name\" content=\"Comet\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/cometdotml\" \/>\n<meta property=\"article:published_time\" content=\"2021-08-05T21:31:54+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/wordpress.comet.ml\/app\/uploads\/2021\/08\/team-comet-ml-clipdraw-cover-1024x476.png\" \/>\n<meta name=\"author\" content=\"Dhruv Nair\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@Cometml\" \/>\n<meta name=\"twitter:site\" content=\"@Cometml\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Dhruv Nair\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"5 minutes\" \/>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"CLIPDraw Gallery: AI Art Powered by Comet and Gradio - Comet","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.comet.com\/site\/blog\/clipdraw-gallery-ai-art-powered-by-comet-and-gradio\/","og_locale":"en_US","og_type":"article","og_title":"CLIPDraw Gallery: AI Art Powered by Comet and Gradio","og_description":"How Gradio and Comet work beautifully together","og_url":"https:\/\/www.comet.com\/site\/blog\/clipdraw-gallery-ai-art-powered-by-comet-and-gradio\/","og_site_name":"Comet","article_publisher":"https:\/\/www.facebook.com\/cometdotml","article_published_time":"2021-08-05T21:31:54+00:00","og_image":[{"url":"https:\/\/wordpress.comet.ml\/app\/uploads\/2021\/08\/team-comet-ml-clipdraw-cover-1024x476.png","type":"","width":"","height":""}],"author":"Dhruv Nair","twitter_card":"summary_large_image","twitter_creator":"@Cometml","twitter_site":"@Cometml","twitter_misc":{"Written by":"Dhruv Nair","Est. reading time":"5 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.comet.com\/site\/blog\/clipdraw-gallery-ai-art-powered-by-comet-and-gradio\/#article","isPartOf":{"@id":"https:\/\/www.comet.com\/site\/blog\/clipdraw-gallery-ai-art-powered-by-comet-and-gradio\/"},"author":{"name":"engineering@atre.net","@id":"https:\/\/www.comet.com\/site\/#\/schema\/person\/550ac35e8e821db8064c5bd1f0a04e6b"},"headline":"CLIPDraw Gallery: AI Art Powered by Comet and Gradio","datePublished":"2021-08-05T21:31:54+00:00","mainEntityOfPage":{"@id":"https:\/\/www.comet.com\/site\/blog\/clipdraw-gallery-ai-art-powered-by-comet-and-gradio\/"},"wordCount":1031,"publisher":{"@id":"https:\/\/www.comet.com\/site\/#organization"},"image":{"@id":"https:\/\/www.comet.com\/site\/blog\/clipdraw-gallery-ai-art-powered-by-comet-and-gradio\/#primaryimage"},"thumbnailUrl":"https:\/\/wordpress.comet.ml\/app\/uploads\/2021\/08\/team-comet-ml-clipdraw-cover-1024x476.png","articleSection":["Comet Community Hub","Partners &amp; Integrations"],"inLanguage":"en-US"},{"@type":"WebPage","@id":"https:\/\/www.comet.com\/site\/blog\/clipdraw-gallery-ai-art-powered-by-comet-and-gradio\/","url":"https:\/\/www.comet.com\/site\/blog\/clipdraw-gallery-ai-art-powered-by-comet-and-gradio\/","name":"CLIPDraw Gallery: AI Art Powered by Comet and Gradio - Comet","isPartOf":{"@id":"https:\/\/www.comet.com\/site\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.comet.com\/site\/blog\/clipdraw-gallery-ai-art-powered-by-comet-and-gradio\/#primaryimage"},"image":{"@id":"https:\/\/www.comet.com\/site\/blog\/clipdraw-gallery-ai-art-powered-by-comet-and-gradio\/#primaryimage"},"thumbnailUrl":"https:\/\/wordpress.comet.ml\/app\/uploads\/2021\/08\/team-comet-ml-clipdraw-cover-1024x476.png","datePublished":"2021-08-05T21:31:54+00:00","breadcrumb":{"@id":"https:\/\/www.comet.com\/site\/blog\/clipdraw-gallery-ai-art-powered-by-comet-and-gradio\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.comet.com\/site\/blog\/clipdraw-gallery-ai-art-powered-by-comet-and-gradio\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.comet.com\/site\/blog\/clipdraw-gallery-ai-art-powered-by-comet-and-gradio\/#primaryimage","url":"https:\/\/wordpress.comet.ml\/app\/uploads\/2021\/08\/team-comet-ml-clipdraw-cover-1024x476.png","contentUrl":"https:\/\/wordpress.comet.ml\/app\/uploads\/2021\/08\/team-comet-ml-clipdraw-cover-1024x476.png"},{"@type":"BreadcrumbList","@id":"https:\/\/www.comet.com\/site\/blog\/clipdraw-gallery-ai-art-powered-by-comet-and-gradio\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.comet.com\/site\/"},{"@type":"ListItem","position":2,"name":"CLIPDraw Gallery: AI Art Powered by Comet and Gradio"}]},{"@type":"WebSite","@id":"https:\/\/www.comet.com\/site\/#website","url":"https:\/\/www.comet.com\/site\/","name":"Comet","description":"Build Better Models Faster","publisher":{"@id":"https:\/\/www.comet.com\/site\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.comet.com\/site\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/www.comet.com\/site\/#organization","name":"Comet ML, Inc.","alternateName":"Comet","url":"https:\/\/www.comet.com\/site\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.comet.com\/site\/#\/schema\/logo\/image\/","url":"https:\/\/www.comet.com\/site\/wp-content\/uploads\/2025\/01\/logo_comet_square.png","contentUrl":"https:\/\/www.comet.com\/site\/wp-content\/uploads\/2025\/01\/logo_comet_square.png","width":310,"height":310,"caption":"Comet ML, Inc."},"image":{"@id":"https:\/\/www.comet.com\/site\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/cometdotml","https:\/\/x.com\/Cometml","https:\/\/www.youtube.com\/channel\/UCmN63HKvfXSCS-UwVwmK8Hw"]},{"@type":"Person","@id":"https:\/\/www.comet.com\/site\/#\/schema\/person\/550ac35e8e821db8064c5bd1f0a04e6b","name":"engineering@atre.net","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.comet.com\/site\/#\/schema\/person\/image\/027c18177377edf459980f0cfb83706c","url":"https:\/\/secure.gravatar.com\/avatar\/d002a459a297e0d1779329318029aee19868c312b3e1f3c9ec9b3e3add2740de?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/d002a459a297e0d1779329318029aee19868c312b3e1f3c9ec9b3e3add2740de?s=96&d=mm&r=g","caption":"engineering@atre.net"},"sameAs":["https:\/\/live-cometml.pantheonsite.io"],"url":"https:\/\/www.comet.com\/site\/blog\/author\/engineeringatre-net\/"}]}},"_links":{"self":[{"href":"https:\/\/www.comet.com\/site\/wp-json\/wp\/v2\/posts\/2466","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.comet.com\/site\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.comet.com\/site\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.comet.com\/site\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.comet.com\/site\/wp-json\/wp\/v2\/comments?post=2466"}],"version-history":[{"count":0,"href":"https:\/\/www.comet.com\/site\/wp-json\/wp\/v2\/posts\/2466\/revisions"}],"wp:attachment":[{"href":"https:\/\/www.comet.com\/site\/wp-json\/wp\/v2\/media?parent=2466"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.comet.com\/site\/wp-json\/wp\/v2\/categories?post=2466"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.comet.com\/site\/wp-json\/wp\/v2\/tags?post=2466"},{"taxonomy":"author","embeddable":true,"href":"https:\/\/www.comet.com\/site\/wp-json\/wp\/v2\/coauthors?post=2466"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}