Gradio Spaces

Gradio fournit une interface simple et intuitive pour exécuter un modèle à partir d'une liste d'entrées et afficher les sorties sous forme d'images, d'audio, d'objets 3D, etc. Gradio dispose désormais même d'un composant de sortie de graphique pour créer des visualisations de données avec Matplotlib, Bokeh et Plotly ! Pour plus de détails, consultez le guide Prise en main de l'équipe Gradio.

Sélectionner Gradio comme SDK lors de la création d’un nouvel espace initialise votre espace avec la dernière version de Gradio en définissant la propriété sdk sur gradio dans le bloc YAML de votre fichier README.md. Si vous souhaitez changer la version de Gradio, vous pouvez modifier la propriété sdk_version.

Consultez la documentation de Gradio pour en découvrir toutes les fonctionnalités et parcourez les Guides Gradio pour des tutoriels pratiques qui vous aideront à démarrer !

Votre premier Space Gradio : classifieur de hot-dogs

Dans les sections suivantes, vous apprendrez les bases de la création d’un Space, de sa configuration et du déploiement de votre code dessus. Nous allons créer un Space Hot Dog Classifier avec Gradio qui servira à démontrer le modèle julien-c/hotdog-not-hotdog, capable de détecter si une image donnée contient un hot dog 🌭

Vous pouvez trouver une version complétée de ce projet hébergée sur NimaBoscarino/hotdog-gradio.

Créer un nouvel espace Gradio

Nous commencerons par créer un nouvel espace et en choisissant Gradio comme SDK. Les espaces Hugging Face sont des dépôts Git, ce qui signifie que vous pouvez travailler sur votre espace de manière incrémentale (et collaborative) en poussant des commits. Consultez le guide Getting Started with Repositories pour apprendre à créer et modifier des fichiers avant de continuer.

Ajouter les dépendances

Pour le Hot Dog Classifier, nous utiliserons un 🤗 Transformers pipeline pour exploiter le modèle, il nous faut donc commencer par installer quelques dépendances. Cela peut se faire en créant un fichier requirements.txt dans notre dépôt et en y ajoutant les dépendances suivantes :

transformers
torch

Le runtime Spaces s’occupera d’installer les dépendances !

Créer l'interface Gradio

Pour créer l'application Gradio, créez un nouveau fichier dans le dépôt nommé app.py, et ajoutez le code suivant :

import gradio as gr
from transformers import pipeline

pipeline = pipeline(task="image-classification", model="julien-c/hotdog-not-hotdog")

def predict(input_img):
    predictions = pipeline(input_img)
    return input_img, {p["label"]: p["score"] for p in predictions} 

gradio_app = gr.Interface(
    predict,
    inputs=gr.Image(label="Select hot dog candidate", sources=['upload', 'webcam'], type="pil"),
    outputs=[gr.Image(label="Processed Image"), gr.Label(label="Result", num_top_classes=2)],
    title="Hot Dog? Or Not?",
)

if __name__ == "__main__":
    gradio_app.launch()

Ce script Python utilise un 🤗 Transformers pipeline pour charger le modèle julien-c/hotdog-not-hotdog, utilisé par l’interface Gradio. L’application Gradio s’attend à ce que vous téléversiez une image, qu’elle classera ensuite en hot dog ou not hot dog. Une fois que vous avez enregistré le code dans le fichier app.py, rendez-vous dans l’onglet App pour voir votre application en action !

Intégrer des Gradio Spaces sur d'autres pages web

Vous pouvez intégrer un Space Gradio sur d'autres pages web en utilisant soit des Web Components, soit la balise HTML <iframe>. Consultez notre documentation ou la documentation de Gradio pour plus de détails.