Ads GPT: un’estensione Chrome per generare annunci pubblicitari con OpenAI

Omar Diop
5 min readApr 4, 2023

Nel mondo dell’advertising, creare annunci accattivanti e persuasivi è fondamentale per raggiungere il proprio pubblico e ottenere risultati concreti. Tuttavia, non è sempre facile trovare le parole giuste e creare un copy efficace per le proprie creatività.

È per questo che, un po’ per gioco e un po’ per curiosità, ho deciso di creare Ads GPT, un’estensione open source che aiuta i professionisti e gli imprenditori a creare testi per annunci pubblicitari in modo semplice e veloce.

In questo articolo, ti mostrerò come è stata realizzata l’estensione e come utilizzare l’API di Open AI per generare testi persuasivi e mirati.

Partiamo dalle basi …

L’estensione è stata realizzata grazie all’utilizzo dell’API di generazione di testo di OpenAI, una piattaforma che offre una vasta gamma di modelli di intelligenza artificiale avanzati per la creazione di testo, immagini e altro ancora. L’API di generazione di testo di OpenAI consente di produrre testi coerenti e convincenti in diversi stili e toni, a partire da una breve descrizione o da una serie di parole chiave.

Tramite l’API è possibile utilizzare i modelli di deep learning sviluppati dall’azienda per la generazione di testo, tra cui GPT-3, uno dei più avanzati al mondo (per ora). Questi modelli sono addestrati su enormi quantità di dati testuali e utilizzano algoritmi di apprendimento automatico per imparare a generare testo in modo autonomo.

Quando si utilizza l’API di OpenAI, si può scegliere il modello su cui basare la generazione di testo e configurare vari parametri, come il numero di parole o di frasi da generare, il contesto o il tipo di output desiderato. Una volta configurata la richiesta, l’API restituisce il testo generato dal modello. Per sviluppare l’estensione, ho utilizzato il modello “davinci” basato su GPT-3.5.

L’obiettivo è quello di fornire al modello una descrizione del prodotto/servizio ricevendo in output titoli e descrizioni da poter utilizzare come ispirazione per le creatività.

Tutto bello ma… nel concreto?

Vediamo la struttura base dell’estensione.
Prima di tutto, va creata una directory in cui inserire un file “manifest.json” che la descriva.

File manifest.json
manifest.json

Il file contiene le informazioni di base sull’estensione, come il nome, la versione, la descrizione e l’URL dell’icona. Inoltre, vanno definite le autorizzazioni che l’estensione richiederà e le pagine in cui verrà visualizzata.

Una volta creato il file “manifest.json”, è possibile iniziare a definire la struttura. In genere, il codice dell’estensione viene scritto in HTML, CSS e JavaScript, anche se puoi utilizzare altre tecnologie se preferisci. Ci sono molte guide online che spiegano come creare un’estensione Chrome di base, quindi ti consiglio di dare un’occhiata a quelli per iniziare.

Per semplicità l’ho scritta in VanillaJS, HTML e CSS ed ho strutturato le directory come segue:

  • “popup.html”: contiene la UI dell’estensione e tutti i componenti di interazione.
  • “styles/main.css”: contiene tutte le classi CSS dell’applicazione
  • “main.js”: file che contiene tutta la logica di business dell’estensione, al suo interno sono presenti listener sui pulsanti e logiche di visualizzazione dei dati.
  • “assets” : cartella che contiene tutti i contenuti statici dell’app (loghi icone etc…)
  • “api”: al suo interno sono contenute tutte le funzioni che interagiscono con servizi esterni, in questo caso OpenAI
  • “api/openAI.js”: contiene tutte le funzioni di generazione testo e le impostazioni del modello GPT-3

Puoi trovare tutto il codice del progetto su GitHub.

Vediamo nel dettaglio “openAI.js”, il file dove vengono effettuale le chiamate all’API.

openAI.js

Come puoi vedere abbiamo una funzione “generateHeadlines” che… (rullo di tamburi 🥁🥁)… genera le headlines.
All’interno di questa funzione abbiamo due elementi principali, “localizedPrompt” e “postData”:

Il primo oggetto contiene il prompt ovvero la stringa che andremo a dare in input al modello per generare i testi, sia in italiano che in inglese. Ovviamente è possibile cambiarlo e sperimentare varianti in base al risultato che si vuole ottenere. Dopo alcuni test ho trovato i risultati prodotti da questo prompt soddisfacenti. In una versione futura si potrebbero ad esempio aggiungere un tone of voice impostato dall’utente o altri dettagli sul prodotto/servizio.

Post data invece non è altro che una funzione che effettua una chiamata POST verso l’endpoint API dove sono disponibili i modelli. E’ possibile specificare numerosi parametri oltre al prompt:

temperature: Un valore che indica quanto il modello deve essere creativo e generare output imprevedibili. Più il valore è alto, più le risposte saranno creative e imprevedibili. Il valore predefinito è 1.

max_tokens: Il numero massimo di parole che l'API può generare come completamento.

top_p: Il valore p che viene utilizzato per selezionare la distribuzione di probabilità dai token più probabili. Questo parametro è usato per controllare la "diversità" dell'output. Il valore predefinito è 1.0.

frequency_penalty: Un valore che viene utilizzato per ridurre la frequenza di parole già utilizzate nel testo di input. Un valore più alto ridurrà la frequenza di queste parole nei completamenti. Il valore predefinito è 0.

presence_penalty: Un valore che viene utilizzato per ridurre la frequenza di parole che non sono presenti nel testo di input. Un valore più alto ridurrà la frequenza di queste parole nei completamenti. Il valore predefinito è 0.

model: Il nome del modello di OpenAI da utilizzare per la generazione di testo.

Motore, ciak, azione!

Ora che abbiamo visto la struttura base vediamola in azione!

Una volta installata, basta inserire una breve descrizione del prodotto o del servizio che si vuole promuovere e selezionare la lingua dei testi da generare.

Demo dell’estensione
Demo dell’estensione

I testi ottenuti dall’API di Open AI possono dare un’idea dei possibili messaggi che potrebbero funzionare meglio per il proprio prodotto o servizio, non vogliono sostituire in nessun modo il copy ma aiutare a capire meglio l’angolo comunicativo da poter utilizzare.

In futuro, ci sono molte possibilità di sviluppo per questa estensione.
Ad esempio, potrebbe essere ottimizzata per piattaforme di advertising come Google Ads o LinkedIn Ads. Inoltre, potrebbero essere sviluppate nuove funzionalità per migliorare ulteriormente la precisione e la qualità dei testi generati, come l’introduzione di ulteriori criteri di personalizzazione o l’utilizzo di modelli di apprendimento automatico avanzati.

Spero che questo breve articolo ti abbia fornito una buona comprensione di come ho creato Ads GPT e come creare qualsiasi applicativo utilizzando l’API di OpenAI

L’estensione è stata un esperimento per vedere come funzionano le API di OpenAI e come possono essere utilizzate per semplificare il processo di creazione di annunci pubblicitari. Tuttavia, il lavoro su questa estensione non è ancora finito: se sei un developer o un appassionato di AI o perché no, anche un advertiser, ti invito a dare un’occhiata alla mia repo su GitHub, li potrai trovare il codice e contribuire direttamente con idee, modifiche e migliorie!

Se vuoi condividere le tue opinioni o esperienze sull’argomento, lascia un commento qui sotto.

Alla prossima!

--

--

Omar Diop

Passionate Software Engineer with a strong background in technology and a desire to constantly learn, grow and share · Technical Lead @Learnn