Crea un assistente di scrittura basato sull'IA con Wordcraft

Amiamo le storie. Raccontare storie e sviluppare altre forme di scrittura creativa può essere impegnativo e gratificante. Tuttavia, creare le tue storie da una pagina vuota può sembrare un'impresa ardua, a volte. I modelli di intelligenza artificiale (IA) generativa possono essere un ottimo strumento per aiutarti a superare la pagina vuota e a costruire la tua narrazione.

Questo tutorial ti mostra come estendere Wordcraft, uno strumento di scrittura di storie basato sull'IA e creato dal team People and AI Research di Google. Questa applicazione web utilizza l'API Gemini per aiutarti a creare storie, a poco a poco generando idee, scrivendo parti delle racconti e rivedendo contenuti per aggiungere maggiori dettagli. Puoi modificare Wordcraft per adattarlo meglio al tuo stile di scrittura e creare nuovi controlli di scrittura per supportare meglio il tuo flusso di lavoro.

Per una panoramica video del progetto e di come estenderlo, inclusi approfondimenti dalle persone che lo hanno creato, dai un'occhiata ad Assistente alla scrittura con l'IA - Crea con l'IA di Google. Altrimenti, puoi iniziare a estendere il progetto seguendo le istruzioni riportate di seguito.

Configurazione del progetto

Queste istruzioni illustrano come configurare il progetto Wordcraft per lo sviluppo e i test. Devi installare il software prerequisito, clonare il progetto dal repository di codice, eseguire l'installazione della configurazione e impostare alcune variabili di ambiente. Puoi testare la configurazione eseguendo il progetto dopo aver completato questi passaggi.

Installa i prerequisiti

Il progetto Wordcraft utilizza Node e npm per gestire i pacchetti ed eseguire l'applicazione. Le seguenti istruzioni di installazione si riferiscono a una macchina host Linux.

Per installare il software richiesto:

Clona e configura il progetto

Scarica il codice del progetto e utilizza il comando di installazione npm per scaricare le dipendenze richieste e configurare il progetto. Per recuperare il codice sorgente del progetto, è necessario un software per il controllo del codice sorgente git.
Per scaricare e configurare il codice del progetto:

  1. Clona il repository git utilizzando il comando seguente.
    git clone https://github.com/PAIR-code/wordcraft
    
  2. Vai alla directory root del progetto Wordcraft.
    cd wordcraft/
    
  3. Esegui il comando di installazione per scaricare le dipendenze e configurare il progetto:
    npm install
    

Imposta le variabili di ambiente

Imposta le variabili di ambiente necessarie per consentire l'esecuzione del progetto di codice Wordcraft, in particolare una chiave API Google Gemini. Le seguenti istruzioni di installazione si riferiscono a una macchina host Linux.

Per impostare le variabili di ambiente:

  1. Ottieni una chiave API di Google Gemini e copia la stringa della chiave.
  2. Vai alla directory principale del progetto Wordcraft.`
    cd wordcraft/
    
  3. Imposta la chiave API come variabile di ambiente. Sugli host Linux, utilizza i comandi seguenti.
    touch .env
    echo "API_KEY="<YOUR_API_KEY>"" > .env
    

Verificare la configurazione

Ora dovresti essere in grado di testare la configurazione del tuo progetto eseguendo Wordcraft sul tuo dispositivo. Questo passaggio è facoltativo, ma consigliato.

Schermata di avvio di Wordcraft

Per testare l'installazione e la configurazione:

  1. Vai alla directory root del progetto Wordcraft.
    cd wordcraft/
    
  2. Esecuzione del progetto in modalità di sviluppo:
    npm run dev
    
  3. Nel browser web, vai all'interfaccia utente di Wordcraft. L'indirizzo specifico viene mostrato nell'output del comando precedente, ad esempio:
    http://localhost:3000/
    

Modifica il testo di esempio del prompt

Interfaccia utente dei comandi di Wordcraft Wordcraft crea prompt per il modello generativo dell'IA utilizzando un insieme di esempi per ogni operazione di assistenza alla scrittura, come i comandi start new story e generate text. Gli esempi guidano il modello generativo nella generazione del testo per la storia e, modificando gli esempi per un'operazione, puoi cambiare l'output in modo che segua uno schema o uno stile di scrittura diverso. Questo è un modo semplice per far scrivere Wordcraft nel modo che preferisci.

L'esempio seguente mostra una modifica degli esempi new_story in Wordcraft. L'obiettivo di questa modifica è indirizzare il modello generativo di IA a scrivere le introduzioni della storia utilizzando un approccio di monologo interno e a utilizzare uno stile più appropriato per un romanzo giallo. Se scrivi alcuni esempi di questo tipo di introduzione alla storia, puoi far sì che il modello generativo segua lo schema generale, ma generi un'introduzione per un tema diverso.

Per modificare i nuovi esempi di storie in Wordcraft:

  1. Apri il file wordcraft/app/context/json/new_story.json.
  2. Modifica gli esempi mantenendo la struttura complessiva del file JSON. Ecco una modifica di esempio per l'introduzione di una storia misteriosa utilizzando uno stile monologo interno.
    [
      {
        "topic": "scientist disappears and their research into a new technology is gone",
        "target": "I got the call from the chief early Tuesday morning, before I'd even had a second sip of coffee. Terrible timing. Something about a researcher disappearing from the local university. Unusual for the research lab to ask for assistance, so I headed over to main lab building."
      },
      {
        "topic": "a young woman wakes up with no memory",
        "target": "An unfamiliar ceiling with harsh, white lights greeted my eyes as I opened them. I looked around. White walls, medical equipment, a hospital? Wait. Where am I? How did I get here?!"
      },
      {
        "topic": "old man tries to recall an important task as his memories gradually fade away",
        "target": "What was I supposed to do today? Feels like it was important. I stared into the kitchen cabinet full of mismatched mugs, mirroring my own confusion. What was it? Like someone is...in danger? A chill shot down my spine, but the details skittered off and hid in some dark corner of my head."
      },
      {
        "topic": "billionaire is found dead in a hotel room",
        "target": "People meet their end every day, some naturally, some unnaturally. After 17 years of working as a homicide detective in Seattle, I'd seen a lot more of the unnatural variety than most. Comes with the job, along with a hard-learned sense of what side of the line any given incident sat on. This...was murder."
      },
      {
        "topic": "retired covert operative gets dragged back into an old mission",
        "target": "Steam rose gently off the cup of Earl Grey sitting in front of me as I sat at the cafe, pedestrians and light traffic rolling by. The city was slowly waking up around me and my perfect Paris morning routine was shaping up nicely. Then I noticed that old familiar and unwelcome tingling on the back of my neck. I was being watched."
      }
    ]
  3. Salva le modifiche apportate al file "new_story.json".

Per testare l'operazione della nuova storia modificata:

  1. Vai alla directory root del progetto Wordcraft.
    cd wordcraft/
    
  2. Eseguire il progetto in modalità di sviluppo. Se è già in esecuzione, potresti dover fermare l'app e riavviarla.
    npm run dev
    
  3. Nel browser web, vai all'interfaccia utente di Wordcraft. L'indirizzo specifico viene mostrato nell'output del comando precedente, ad esempio:
    http://localhost:3000/
    
  4. Vai al menu principale di Wordcraft e seleziona Inizia una nuova storia.
  5. Aggiorna il nuovo prompt della storia o modificalo in base alle tue esigenze, quindi seleziona Inizia una nuova storia.

Puoi modificare tutti i controlli di scrittura delle storie esistenti in Wordcraft utilizzando questa tecnica. Prova a modificare altri controlli della storia aggiornando gli esempi nella directory wordcraft/app/context/json/.

Crea un nuovo controllo di scrittura

Interfaccia utente del personaggio di introduzione di Wordcraft L'app Wordcraft è stata progettata per essere ampliata in modo da poter aggiungere nuovi controlli di scrittura per aiutarti, come i pulsanti Genera testo o Riscrivi frase nella scheda Controlli sul lato destro dell'app. Apportare queste modifiche sono un po' più complesse, ma ti consentono di adattare le funzionalità di Wordcraft al tuo flusso di lavoro e ai tuoi obiettivi.

La modifica dell'esempio seguente crea un nuovo controllo dei caratteri per WordPress. Puoi usarla per introdurre un nuovo personaggio in una storia con una descrizione delle caratteristiche del personaggio. La base di questo controllo è la stessa di altri controlli di Wordcraft come il controllo Inizia una nuova storia discusso in precedenza. Crei un file JSON con alcuni esempi di come vuoi introdurre i personaggi. Le altre modifiche aggiungono l'interfaccia utente e le funzioni di gestione dei prompt IA.

Creazione esempi

Scrivi alcuni esempi di come il modello generativo deve introdurre i personaggi. Ad esempio, vuoi descriverlo come un narratore o vuoi presentarlo prendendo come riferimento l'esperienza del tuo personaggio principale? I seguenti esempi utilizzano quest'ultimo approccio, che introduce nuovi personaggi dal punto di vista del personaggio principale. Aggiungi questi esempi con un nuovo file JSON:

Per aggiungere esempi per il nuovo controllo:

  1. Crea un file wordcraft/app/context/json/new_character.json.
  2. Crea gli esempi nel file JSON. Per questo esempio, ogni esempio ha un campo descrizione character, che rappresenta il testo del prompt, e un campo target, che mostra l'output previsto.
    [
      {
        "character": "A character who is helpful and modest.",
        "target": "\"You lost, buddy?\" came a voice from behind me. Turning, I discovered a man dressed in a simple but presentable outfit. Small signs of age and loose threads hinted that these clothes, and the man himself, had seen better days."
      },
      {
        "character": "A character who is attractive and devious.",
        "target": "Stepping out of the alley a little too quickly, I collided with something solidly muscular and surprisingly delicately scented. \"Sorry.\" I managed, regaining my balance. \"Easy there, buddy, you're gonna hurt yourself,\" came the reply from a man with an almost feline grace, further reinforced by a stare that reminded me of a hunting cat assessing its potential prey."
      },
      {
        "character": "A character who is old and hesitant.",
        "target": "\"Excuse me. Do you know the way to the train station from here?\" I looked up from my phone to see a elderly woman in a threadbare coat, purse clutched with two hands in front of her. \"I-I'm supposed to meet my nephew there. Do... do you think you can help me?\""
      },
      {
        "character": "A character who is intelligent and aloof.",
        "target": "Bookish. That was my immediate reaction to this person I now saw in front of me. \"You're finally here. Did you read the notes I sent you?\" The voice sat squarely in between feminine and masculine intonation. \"No, of course you didn't.\" Dismissing my answer before I'd even formulated one. Annoyance immediately flushed through me."
      },
      {
        "character": "A character who is clumsy and energetic.",
        "target": "\"Whoa!\" was the only warning I had before someone slammed into my back, almost knocking me off my feet. \"I'm so sorry! WOOO! These skates are a RUSH!\" The apology came from a rather loud redhead wearing rollerblades, dark glasses and a very beefy-looking pair of headphones. That explained the volume of the apology."
      }
    ]
  3. Salva le modifiche apportate al file new_character.json.

Dopo aver creato gli esempi, modifica i file app/context/schema.ts e index.ts per riflettere i contenuti dei prompt di questo nuovo controllo dei caratteri.

Per aggiungere gli esempi al file schema.ts:

  • Modifica il file wordcraft/app/context/schema.ts in modo da includere la nuova struttura di dati di esempio di caratteri.
    export const newStorySchema = z.object({
      topic: z.string(),
      target: z.string(),
    });
    
    // add the following:
    export const newCharacterSchema = z.object({
      character: z.string(),
      target: z.string(),
    });

Definisci un tipo di operazione associato a questi nuovi esempi. Questo nuovo tipo consente di collegare gli esempi di prompt all'interfaccia utente e al codice di creazione dei prompt, che potrai modificare nei passaggi successivi.

Per creare un nuovo tipo di operazione

  • Modifica il file wordcraft/app/core/shared/types.ts per aggiungere il nuovo tipo di operazione relativa ai caratteri.
    export const enum OperationType {
      ...
      NEW_CHARACTER = 'NEW_CHARACTER', // add to list of types
      ...
    }

Per registrare gli esempi nel file index.ts:

  1. Nel file wordcraft/app/context/index.ts, importa il nuovo schema.
    import {
      continueSchema,
      ...
      newCharacterSchema // add new schema
    } from './schema';
    
  2. Importa il nuovo file JSON come newCharacterJson.
    import newCharacterJson from './json/new_character.json';
    
  3. Registra il nuovo contenuto di esempio di caratteri nel contesto dell'applicazione.
    export class WordcraftContext {
      constructor() {
      ...
        this.registerExamples(
          OperationType.NEW_CHARACTER,
          newCharacterSchema,
          newCharacterJson
        );
      ...
    }
  4. Esporta un tipo di elemento NewCharacterExample.
    export type NewCharacterExample = z.infer<typeof newCharacterSchema>;
    

Crea l'interfaccia utente

Dopo aver creato e registrato gli esempi di generazione di contenuti, puoi creare l'interfaccia utente per il nuovo controllo. La maggior parte del lavoro per questa fase è creare una nuova classe di operazioni e quindi registrarla con il codice principale dell'applicazione Wordcraft.

Per creare una nuova operazione:

  1. Nella directory wordcraft/app/core/operations/, crea una nuova classe di operazioni utilizzando una delle classi operative esistenti come modello. Per il nuovo controllo dei caratteri, puoi creare una copia della classe new_story_operation.ts e rinominarla in new_character_operation.ts.
  2. Assegna un nuovo nome alla classe e specifica quando viene visualizzato il controllo nell'interfaccia utente definendo almeno un valore OperationSite.
    export class NewCharacterOperation extends ChoiceOperation {
      static override isAvailable(operationSite: OperationSite) {
        return (
          operationSite === OperationSite.END_OF_SECTION ||
          operationSite === OperationSite.EMPTY_SECTION
        );
      }
    
  3. Imposta il id per l'operazione.
      static override id = OperationType.NEW_CHARACTER;
    
  4. Aggiorna le funzioni get e run in modo che riflettano i valori dei parametri dello schema. Questo codice gestisce il recupero del testo del prompt dall'interfaccia utente per utilizzarlo nel prompt dell'IA.
      private get character(): string {
        return NewCharacterOperation.controls.character.value;
      }
    
      async run() {
        const params = { character: this.character };
        const choices = await this.getModel().newCharacter(params);
    
        this.setChoices(choices);
      }
    
  5. Aggiorna il testo e le descrizioni dell'interfaccia utente.
      static override getButtonLabel() {
        return 'introduce character';
      }
    
      static override getDescription() {
        return 'Introduce a new character at the cursor.';
      }
    
      static override controls = {
        character: new TextareaControl({
          prefix: 'prompt',
          description: 'A prompt to introduce a new character.',
          value: 'A new character.',
        }),
      };
    

Per registrare la nuova operazione nell'applicazione Wordcraft:

  1. Nel file wordcraft/app/core/operations/index.ts, aggiungi un'importazione per la nuova operazione.
    import {NewCharacterOperation} from './new_character_operation';
    
  2. Nello stesso file index.ts, aggiungi un'esportazione per la classe NewCharacterOperation.
    export {
      ...
      NewCharacterOperation, // add this class
      ...
    };
  3. Nel file wordcraft/app/main.ts, registra la nuova operazione.
    const operationsService = wordcraftCore.getService(OperationsService);
    operationsService.registerOperations(
      ...
      Operations.NewCharacterOperation, // add new operation
      ...
    );
    

Crea gestione dei prompt

La fase finale della creazione del nuovo controllo consiste nel creare il codice che gestisce la generazione di prompt per il modello generativo di IA e la risposta. La parte principale del lavoro consiste nel creare un gestore di prompt nella directory wordcraft/app/models/gemini/prompts/ che prende l'input dall'interfaccia utente e assembla un prompt da passare al modello generativo.

Per definire un'interfaccia per i parametri del prompt:

  • Nel file wordcraft/app/core/shared/interfaces.ts, aggiungi un'interfaccia per i nuovi parametri dei prompt delle operazioni.
    export interface NewCharacterPromptParams {
      character: string;
    }
    

Per definire un gestore dei prompt per la nuova operazione:

  1. Nella directory wordcraft/app/models/gemini/prompts/, crea una nuova classe di gestore dei prompt utilizzando una delle classi operative esistenti come modello. Per il nuovo controllo dei caratteri, puoi creare una copia della classe new_story.ts e rinominarla in new_character.ts come punto di partenza.
  2. Definisci una funzione di gestore di prompt e importa la classe NewCharacterExample.
    import { NewCharacterPromptParams } from '@core/shared/interfaces';
    import { NewCharacterExample, WordcraftContext } from '../../../context';
    import { OperationType } from '@core/shared/types';
    import { GeminiModel } from '..';
    
    export function makePromptHandler(model: GeminiModel, context: WordcraftContext) {
      ...
    }
    
  3. Crea una funzione generatePrompt() per ottenere l'input dell'interfaccia utente per il prompt del modello di IA.
      function generatePrompt(character: string) {
        const prefix = "Here's a character description: ";
        const suffix = "Introduce this character in the story.";
    
        if (character.trim() === '') {
          return 'Introduce a new character to the story.';
        } else {
          return `${prefix}${model.wrap(character)}\n${suffix}`;
        }
      }
  4. Crea una funzione getPromptContext() per assemblare l'input dell'interfaccia utente con le risposte di esempio e generare il prompt completo.
      function getPromptContext() {
        const examples = context.getExampleData(
          OperationType.NEW_CHARACTER
        );
        let promptContext = model.getPromptPreamble();
        examples.forEach((example) => {
          const { character, target } = example;
          const prompt = generatePrompt(character);
          promptContext += `${prompt} ${model.wrap(target)}\n\n`;
        });
        return promptContext;
      }

Per integrare il nuovo gestore della richiesta di caratteri:

  1. Nel file wordcraft/app/models/gemini/index.ts, importa il gestore dei prompt per la nuova operazione relativa ai caratteri.
    import {makePromptHandler as newCharacter} from './prompts/new_character';
  2. Aggiungi una definizione di override per il gestore dei prompt newCharacter.
      override newCharacter = this.makePromptHandler(newCharacter);

Per registrare i parametri del prompt con la definizione del modello:

  1. Nel file wordcraft/app/models/model.ts, aggiungi un'importazione per la nuova interfaccia di NewCharacterPromptParams.
    import {
      ...
      NewCharacterPromptParams,
      ...
    } from '@core/shared/interfaces';
  2. Aggiungi newCharacter parametri del prompt alla classe del modello.
      async newCharacter(params: NewCharacterPromptParams): Promise<ModelResults> {
        throw new Error('Not yet implemented');
      }

Prova il nuovo controllo di scrittura

Il nuovo controllo dovrebbe essere pronto per essere testato nell'interfaccia di Wordcraft. Assicurati di controllare il codice per verificare la presenza di errori di compilazione prima di procedere.

Per provare il nuovo controllo dei caratteri:

  1. Vai alla directory principale del progetto Wordcraft.`
    cd wordcraft/
    
  2. Esegui il progetto in modalità di sviluppo:`
    npm run dev
    
  3. Nel browser web, vai all'interfaccia utente di Wordcraft. L'indirizzo specifico viene mostrato nell'output del comando precedente, ad esempio:
    http://localhost:3000/
    
  4. Nell'applicazione Wordcraft, crea una nuova storia o aprine una esistente.
  5. Nell'area di modifica della storia, sposta il cursore alla fine della storia. Nella scheda Controlli a destra dovrebbe essere visualizzato il controllo Carattere di introduzione.
  6. Nel campo introduce character, digita una breve descrizione del nuovo personaggio e seleziona il pulsante introduce character.

Altre risorse

Per ulteriori informazioni sul progetto Wordcraft, consulta il repository del codice. Puoi visualizzare le modifiche descritte in questo tutorial in questa richiesta di pull.

Applicazioni di produzione

Se prevedi di eseguire il deployment di una versione personalizzata di Wordcraft per un vasto pubblico, tieni presente che l'utilizzo dell'API Google Gemini potrebbe essere soggetto a limitazioni di frequenza e ad altre limitazioni di utilizzo. Se stai considerando la creazione di un'applicazione di produzione con l'API Gemini come l'agente di Documenti, dai un'occhiata ai servizi Vertex AI di Google Cloud per aumentare la scalabilità e l'affidabilità della tua app.