base on A realtime sketch to image demo using LCM and the gradio library. # flowty-realtime-lcm-canvas  ### About --- This is a real-time sketch to image demo using LCM and the [gradio library](https://github.com/gradio-app/gradio). If you're not familiar with LCM, read about it here - [article on Hugging Face](https://huggingface.co/blog/lcm_lora). Thanks to LCM LoRA, you can also use different models by altering the model id in the ui. The desired effect was for you to be able to draw on one side and see the changes at close to real-time on the other side. Needless to say, this will perform worse on some GPUs, and better on some GPUs. 4090s usually perform best in the realtime scenario. Share your results! This was tested on a macbook pro with M2 Max, 30 GPU - 32GB combo, python 3.10. Inference times were tolerable, about 1.2s per render. If you're getting good performance on your machine, feel free to tweak the parameters in order to get better results. You can also change the canvas size to 768 / 1024 in ui.py, depending on your model. ### Setup --- * Setup a venv if you'd like to isolate your project environment: ```python -m venv env``` * activate on MacOS: ```source ./env/bin/activate``` * activate on Windows: ```env\Scripts\activate``` * Nvidia users should install PyTorch using this command: ```pip install torch --extra-index-url https://download.pytorch.org/whl/cu121``` * Install the requirements: ```pip install -r requirements.txt``` * Run ui.py: ```python ui.py``` After you run ui.py, models should be downloaded automatically to the models directory. It might take a few minutes depending on your network. Once the models are downloaded, gradio will print to the console the url where you can access the ui. ### Use Google Colab --- Google Colab users can also enjoy it by executing the following command and accessing the generated Gradio Public URL. (I think this is currently only available in the Colab Pro.) ``` !git clone https://github.com/flowtyone/flowty-realtime-lcm-canvas.git %cd flowty-realtime-lcm-canvas !pip install -r requirements.txt !python ui.py --share ``` This is a community project from [flowt.ai](https://flowt.ai). If you like it, check us out! <picture> <source media="(prefers-color-scheme: dark)" srcset="logo-dark.svg" height="50"> <source media="(prefers-color-scheme: light)" srcset="logo.svg" height="50"> <img alt="flowt.ai logo" src="flowt.png" height="50"> </picture>", Assign "at most 3 tags" to the expected json: {"id":"5170","tags":[]} "only from the tags list I provide: [{"id":77,"name":"3d"},{"id":89,"name":"agent"},{"id":17,"name":"ai"},{"id":54,"name":"algorithm"},{"id":24,"name":"api"},{"id":44,"name":"authentication"},{"id":3,"name":"aws"},{"id":27,"name":"backend"},{"id":60,"name":"benchmark"},{"id":72,"name":"best-practices"},{"id":39,"name":"bitcoin"},{"id":37,"name":"blockchain"},{"id":1,"name":"blog"},{"id":45,"name":"bundler"},{"id":58,"name":"cache"},{"id":21,"name":"chat"},{"id":49,"name":"cicd"},{"id":4,"name":"cli"},{"id":64,"name":"cloud-native"},{"id":48,"name":"cms"},{"id":61,"name":"compiler"},{"id":68,"name":"containerization"},{"id":92,"name":"crm"},{"id":34,"name":"data"},{"id":47,"name":"database"},{"id":8,"name":"declarative-gui "},{"id":9,"name":"deploy-tool"},{"id":53,"name":"desktop-app"},{"id":6,"name":"dev-exp-lib"},{"id":59,"name":"dev-tool"},{"id":13,"name":"ecommerce"},{"id":26,"name":"editor"},{"id":66,"name":"emulator"},{"id":62,"name":"filesystem"},{"id":80,"name":"finance"},{"id":15,"name":"firmware"},{"id":73,"name":"for-fun"},{"id":2,"name":"framework"},{"id":11,"name":"frontend"},{"id":22,"name":"game"},{"id":81,"name":"game-engine "},{"id":23,"name":"graphql"},{"id":84,"name":"gui"},{"id":91,"name":"http"},{"id":5,"name":"http-client"},{"id":51,"name":"iac"},{"id":30,"name":"ide"},{"id":78,"name":"iot"},{"id":40,"name":"json"},{"id":83,"name":"julian"},{"id":38,"name":"k8s"},{"id":31,"name":"language"},{"id":10,"name":"learning-resource"},{"id":33,"name":"lib"},{"id":41,"name":"linter"},{"id":28,"name":"lms"},{"id":16,"name":"logging"},{"id":76,"name":"low-code"},{"id":90,"name":"message-queue"},{"id":42,"name":"mobile-app"},{"id":18,"name":"monitoring"},{"id":36,"name":"networking"},{"id":7,"name":"node-version"},{"id":55,"name":"nosql"},{"id":57,"name":"observability"},{"id":46,"name":"orm"},{"id":52,"name":"os"},{"id":14,"name":"parser"},{"id":74,"name":"react"},{"id":82,"name":"real-time"},{"id":56,"name":"robot"},{"id":65,"name":"runtime"},{"id":32,"name":"sdk"},{"id":71,"name":"search"},{"id":63,"name":"secrets"},{"id":25,"name":"security"},{"id":85,"name":"server"},{"id":86,"name":"serverless"},{"id":70,"name":"storage"},{"id":75,"name":"system-design"},{"id":79,"name":"terminal"},{"id":29,"name":"testing"},{"id":12,"name":"ui"},{"id":50,"name":"ux"},{"id":88,"name":"video"},{"id":20,"name":"web-app"},{"id":35,"name":"web-server"},{"id":43,"name":"webassembly"},{"id":69,"name":"workflow"},{"id":87,"name":"yaml"}]" returns me the "expected json"