File size: 7,337 Bytes
9a30751
 
 
 
 
 
 
 
 
f982578
 
 
 
 
 
 
 
bcdcff4
 
 
 
 
 
 
 
 
 
f982578
 
 
 
 
 
 
 
 
65cba5b
f982578
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
---
title: README
emoji: 
colorFrom: pink
colorTo: gray
sdk: static
pinned: false
---

<div class="grid lg:grid-cols-2 gap-x-4">
  <h1 class="lg:col-span-2">This organization invites participants to showoff conference papers on Hugging Face as a Gradio Web Demo (Note: This is not a official NAACL sponsored event)</h1>
   <h3 class="my-8 lg:col-span-2" style="font-size:20px; font-weight:bold">Join organization by clicking <a href="https://huggingface.co/organizations/ECCV2022/share/kZuMIwRJKOTteDgoueNuPAMUGSnfDjWAGq" style="text-decoration: underline" target="_blank">here</a></h3>
<h4 class="my-8 lg:col-span-2" style="font-size:20px; font-weight:bold">Hugging Face Gradio NAACL 2022 event
</h4>
<p class="lg:col-span-2">
NAACL organization is accepting Gradio demo submissions for NAACL 2022 papers from anyone for a chance to win prizes from Hugging Face, see prizes section and the leaderboard below. The deadline to submit demos is <b>July 31st, 2022 (AOE Time Zone)</b>. <b>For all participants, feel free to submit Gradio demos for any NAACL paper for a chance to win prizes, you can submit demos for multiple papers</b>. Find tutorial on getting started with Gradio on Hugging Face <a href="https://huggingface.co/course/chapter9/1?fw=pt" style="text-decoration: underline" target="_blank">here</a> and to get started with the new Gradio Blocks API <a href="https://gradio.app/introduction_to_blocks/" style="text-decoration: underline" target="_blank">here</a></p>

<h4 class="my-8 lg:col-span-2" style="font-size:20px; font-weight:bold">Hugging Face Models NAACL 2022 event
</h4>
<p class="lg:col-span-2">
NAACL organization is accepting models submissions for NAACL 2022 papers from anyone for a chance to win prizes from Hugging Face, see prizes section and the leaderboard below. The deadline to submit demos is <b>July 31st, 2022 (AOE Time Zone)</b>. <b>For all partipants, feel free to submit models for any NAACL paper for a chance to win prizes, you can submit models for multiple papers</b>. Find tutorial on getting started with repos on Hugging Face <a href="https://huggingface.co/docs/hub/repositories-getting-started#getting-started-with-repositories" style="text-decoration: underline" target="_blank">here</a> and to get started with adding models <a href="https://huggingface.co/docs/hub/models-uploading" style="text-decoration: underline" target="_blank">here</a></p>

<h4 class="my-8 lg:col-span-2" style="font-size:20px; font-weight:bold">Hugging Face Datasets NAACL 2022 event
</h4>
<p class="lg:col-span-2">
NAACL organization is accepting dataset submissions for NAACL 2022 papers from anyone for a chance to win prizes from Hugging Face, see prizes section and the leaderboard below. The deadline to submit demos is <b>July 31st, 2022 (AOE Time Zone)</b>. <b>For all partipants, feel free to submit datasets for any NAACL paper for a chance to win prizes, you can submit datasets for multiple papers</b>. Find tutorial on getting started with repos on Hugging Face <a href="https://huggingface.co/docs/hub/repositories-getting-started#getting-started-with-repositories" style="text-decoration: underline" target="_blank">here</a> and to get started with adding datasets <a href="https://huggingface.co/docs/datasets/upload_dataset" style="text-decoration: underline" target="_blank">here</a></p>

<h4 class="my-8 lg:col-span-2" style="font-size:20px; font-weight:bold" id="Prizes">Hugging Face Prizes</h4>
<ul class="lg:col-span-2" style="list-style: circle inside">
   <li class="my-4">Top 5 spaces based on likes<ul class="lg:col-span-2" style="list-style: circle inside;padding-left: 40px;">
   <li class="my-4">Swag from <a href="https://huggingface.myshopify.com/">Hugging Face merch shop</a>: t-shirt, hoodie, or mug of your choice</li>
   </ul>
   </li>
</ul>

<h3 class="my-8 lg:col-span-2" style="font-size:20px; font-weight:bold">LeaderBoard for Most Popular NAACL Spaces</h3>
  <p class="lg:col-span-2">See the <a href="https://huggingface.co/spaces/NAACL2022/Leaderboard" target="_blank" style="text-decoration:underline; font-weight:bold">NAACL Leaderboard</a></p>
    <h4 class="my-8 lg:col-span-2" style="font-size:20px; font-weight:bold">Hugging Face Spaces & Gradio for Showcasing your NAACL ‘22 Demo 
</h4>
   <p class="lg:col-span-2">
   In this tutorial, we will demonstrate how to showcase your demo with an easy to use web interface using the Gradio Python library and host it on Hugging Face Spaces so that conference attendees can easily find and try out your demos. Also, see <a href="https://gradio.app/introduction_to_blocks/" style="text-decoration: underline" target="_blank">https://gradio.app/introduction_to_blocks/</a>, for a more flexible way to build Gradio Demos
   </p>
 <h3 class="my-8 lg:col-span-2" style="font-size:20px; font-weight:bold">🚀 Create a Gradio Demo from your Model
</h3>
<p class="lg:col-span-2">
The first step is to create a web demo from your model. As an example, we will be creating a demo from an image classification model (called model) which we will be uploading to Spaces. The full code for steps 1-4 can be found in this <a href="https://colab.research.google.com/drive/1S6seNoJuU7_-hBX5KbXQV4Fb_bbqdPBk?usp=sharing" style="text-decoration: underline" target="_blank">colab notebook</a>.
</p><br />

<h3 class="my-8 lg:col-span-2" style="font-size:20px; font-weight:bold">1. Install the gradio library
</h3>
<p class="lg:col-span-2">
All you need to do is to run this in the terminal: <code>pip install gradio</code>
</p>
<br />
<h3 class="my-8 lg:col-span-2" style="font-size:20px; font-weight:bold">2. Define a function in your Python code that performs inference with your model on a data point and returns the prediction
</h3>
<p class="lg:col-span-2">
Here’s we define our image classification model prediction function in PyTorch (any framework, like TensorFlow, scikit-learn, JAX, or a plain Python will work as well):
<pre>
<code>
def predict(inp):
  inp = Image.fromarray(inp.astype('uint8'), 'RGB')
  
  inp = transforms.ToTensor()(inp).unsqueeze(0)
  
  with torch.no_grad():
  
    prediction = torch.nn.functional.softmax(model(inp)[0], dim=0)
  
  return {labels[i]: float(prediction[i]) for i in range(1000)}
</code>
</pre>
</p>

<h3 class="my-8 lg:col-span-2" style="font-size:20px; font-weight:bold">3. Then create a Gradio Interface using the function and the appropriate input and output types
</h3>
<p class="lg:col-span-2">
For the image classification model from Step 2, it would like like this:
</p>
<pre>
<code>
inputs = gr.inputs.Image()

outputs = gr.outputs.Label(num_top_classes=3)

io = gr.Interface(fn=predict, inputs=inputs, outputs=outputs)
</code>
</pre>
<p class="lg:col-span-2">
If you need help creating a Gradio Interface for your model, check out the Gradio Getting Started guide.
</p>

<h3 class="my-8 lg:col-span-2" style="font-size:20px; font-weight:bold">4. Then launch() you Interface to confirm that it runs correctly locally (or wherever you are running Python)
</h3>
<pre>
<code>
io.launch() 
</code>
</pre>
<p class="lg:col-span-2">
You should see a web interface like the following where you can drag and drop your data points and see the predictions:
</p>
<img class="lg:col-span-2" src="https://i.imgur.com/1hsIgJJ.png" alt="Gradio Interface" style="margin:10px">
</div>