Gemini 2.0 Flash ya está listo para la producción. Más información

Se usó la API de Cloud Translation para traducir esta página.

Compila un asistente de escritura con IA con Wordcraft

Nos encantan las historias. Contar historias y realizar otras formas de escritura creativa puede ser un desafío y gratificante. Sin embargo, crear tus propias historias desde una página en blanco puede parecer abrumador y, a veces, abrumador. Los modelos generativos de la inteligencia artificial (IA) pueden ser una gran herramienta para ayudarte a superar la página en blanco y crear tu narrativa.

En este instructivo, se muestra cómo extender Wordcraft, una herramienta de escritura de historias potenciada por IA creada por el equipo de investigación de personas y IA de Google. Esta aplicación web usa la API de Gemini para ayudarte a crear historias, poco a poco, a través de la generación de ideas, la escritura de partes de tus historias y la revisión del contenido para agregar más detalles. Puedes modificar Wordcraft para que coincida más con tu propio estilo de escritura y crear nuevos controles de escritura para que se adapten mejor a tu flujo de trabajo.

Si quieres ver un video de resumen del proyecto y cómo ampliarlo, incluidas las estadísticas de las personas que lo crearon, consulta AI Writing Assistant: Build with Google AI. De lo contrario, puedes comenzar a extender el proyecto siguiendo las instrucciones que se indican a continuación.

Configura el proyecto

Estas instrucciones te guiarán para configurar el proyecto de Wordcraft para su desarrollo y pruebas. Debes instalar el software necesario, clonar el proyecto desde el repositorio de código, ejecutar la instalación de configuración y configurar algunas variables de entorno. Para probar tu configuración, ejecuta el proyecto después de completar estos pasos.

Instala los requisitos previos

El proyecto Wordcraft usa Node y npm para administrar paquetes y ejecutar la aplicación. Las siguientes instrucciones de instalación son para una máquina anfitrión de Linux.

Para instalar el software necesario, sigue estos pasos:

Instala node y npm siguiendo las instrucciones de instalación para tu plataforma.

Clona y configura el proyecto

Descarga el código del proyecto y usa el comando de instalación npm para descargar las dependencias necesarias y configurar el proyecto. Necesitas el software de control de código fuente git para recuperar el código fuente del proyecto.
Para descargar y configurar el código del proyecto, haz lo siguiente:

Clona el repositorio de git con el siguiente comando.
```
git clone https://github.com/PAIR-code/wordcraft
```
Navega al directorio raíz del proyecto de Wordcraft.
```
cd wordcraft/
```
Ejecuta el comando install para descargar las dependencias y configurar el proyecto:
```
npm install
```

Configure las variables de entorno

Establece las variables de entorno necesarias para permitir que se ejecute el proyecto de código de Wordcraft, en particular una clave de API de Google Gemini. Las siguientes instrucciones de instalación son para una máquina host de Linux.

Para configurar las variables de entorno, sigue estos pasos:

Obtén una clave de API de Google Gemini y copia la cadena de clave.
Navega al directorio raíz del proyecto de Wordcraft.`
```
cd wordcraft/
```
Establece la clave de API como una variable de entorno. En hosts de Linux, usa los siguientes comandos.
```
touch .env
echo "API_KEY="<YOUR_API_KEY>"" > .env
```

Pruebe su configuración

Ahora deberías poder probar la configuración de tu proyecto ejecutando Wordcraft en tu dispositivo. Este paso es opcional, pero se recomienda hacerlo.

Pantalla de inicio de Wordcraft

Para probar la instalación y la configuración, haz lo siguiente:

Navega al directorio raíz del proyecto de Wordcraft.
```
cd wordcraft/
```
Ejecutar el proyecto en modo de desarrollo:
```
npm run dev
```
En tu navegador web, navega a la interfaz de usuario de Wordcraft. La dirección específica se muestra en el resultado del comando anterior, por ejemplo:
```
http://localhost:3000/
```

Modifica el texto de ejemplo de la instrucción

Interfaz de usuario de los comandos de Wordcraft Wordcraft crea instrucciones para el modelo generativo de IA con un conjunto de ejemplos para cada operación de asistencia de escritura, como los comandos start new story y generate text. Los ejemplos guían al modelo generativo para generar texto para tu historia y, si modificas los ejemplos de una operación, puedes cambiar el resultado para que siga un patrón o estilo de escritura diferente. Este enfoque es una manera sencilla de hacer que Wordcraft escriba como quieras.

En el siguiente ejemplo, se muestra una modificación de los ejemplos de new_story en Wordcraft. El objetivo de esta modificación es dirigir al modelo generativo de IA para que escriba introducciones de historias con un enfoque de monólogo interno y use un estilo más apropiado para una novela de misterio. Si escribes algunos ejemplos de este tipo de introducción de historias, puedes hacer que el modelo generativo siga el patrón general, pero genere una introducción para un tema diferente.

Para modificar los ejemplos de historias nuevas en Wordcraft, sigue estos pasos:

Abre el archivo wordcraft/app/context/json/new_story.json.

Modifica los ejemplos y mantén la estructura general del archivo JSON. Este es un ejemplo de modificación para la introducción de una historia de misterio con un estilo de monólogo 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."
  }
]

Guarda los cambios en el archivo "new_story.json".

Para probar la operación de historia nueva modificada, sigue estos pasos:

Navega al directorio raíz del proyecto de Wordcraft.
```
cd wordcraft/
```
Ejecuta el proyecto en modo de desarrollo. Si ya está en ejecución, es posible que debas detener la app y reiniciarla.
```
npm run dev
```
En tu navegador web, navega a la interfaz de usuario de Wordcraft. La dirección específica se muestra en el resultado del comando anterior, por ejemplo:
```
http://localhost:3000/
```
Navega al menú principal de Wordcraft y selecciona Iniciar una historia nueva.
Actualiza la propuesta de historia nueva o cámbiala por la que quieras y, luego, selecciona Iniciar historia nueva.

Puedes modificar todos los controles de escritura de historias existentes en Wordcraft con esta técnica. Intenta cambiar otros controles de la historia actualizando los ejemplos del directorio wordcraft/app/context/json/.

Crea un nuevo control de escritura

Wordcraft presenta la interfaz de usuario de los personajes La app de Wordcraft está diseñada para que puedas agregar nuevos controles de escritura que te ayuden, similares a los botones Generate text o Rewrite sentence en la pestaña Controls, en el lado derecho de la app. Hacer estas modificaciones requiere un poco más de esfuerzo, pero te permite moldear las funciones de Wordcraft para que se adapten a tu flujo de trabajo y tus objetivos.

En el siguiente ejemplo de modificación, se crea un control de caracteres nuevo para Wordcraft. Puedes usarlo para presentar un personaje nuevo en una historia con una descripción de sus atributos. La base de este control es la misma que la de otros controles de Wordcraft, como el control start new story que se analizó antes. Creas un archivo JSON con algunos ejemplos de cómo quieres que se presenten los caracteres. El resto de los cambios agregan la interfaz de usuario y las funciones de administración de instrucciones de IA.

Crear ejemplos

Escribe algunos ejemplos de cómo quieres que el modelo generativo introduzca a los personajes. Por ejemplo, ¿quieres describirlo como un narrador o presentarlo a través de la experiencia de tu personaje principal? En los siguientes ejemplos, se usa el último enfoque, en el que se presentan personajes nuevos desde el punto de vista del personaje principal. Agrega estos ejemplos con un nuevo archivo JSON:

Para agregar ejemplos del control nuevo, sigue estos pasos:

Crea un archivo wordcraft/app/context/json/new_character.json.

Crea los ejemplos en el archivo JSON. En este ejemplo, cada ejemplo tiene un campo de descripción character, que representa el texto de la instrucción, y un campo target, que muestra el resultado esperado.

[
  {
    "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."
  }
]

Guarda los cambios en el archivo new_character.json.

Después de crear tus ejemplos, modifica los archivos app/context/schema.ts y index.ts para que reflejen el contenido de la instrucción de este nuevo control de caracteres.

Para agregar los ejemplos al archivo schema.ts, haz lo siguiente:

Modifica el archivo wordcraft/app/context/schema.ts para incluir la nueva estructura de datos del ejemplo de carácter.

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(),
});

Define un tipo de operación que esté asociado con estos ejemplos nuevos. Este nuevo tipo ayuda a conectar los ejemplos de instrucciones a la interfaz de usuario y al código de compilación de instrucciones, que modificarás en pasos posteriores.

Para crear un nuevo tipo de operación, sigue estos pasos:

Modifica el archivo wordcraft/app/core/shared/types.ts para agregar el nuevo tipo de operación de carácter.

export const enum OperationType {
  ...
  NEW_CHARACTER = 'NEW_CHARACTER', // add to list of types
  ...
}

Para registrar los ejemplos en el archivo index.ts, haz lo siguiente:

En el archivo wordcraft/app/context/index.ts, importa el esquema nuevo.

import {
  continueSchema,
  ...
  newCharacterSchema // add new schema
} from './schema';

Importa el nuevo archivo JSON como newCharacterJson.

import newCharacterJson from './json/new_character.json';

Registra el contenido de ejemplo del nuevo personaje en el contexto de la aplicación.

export class WordcraftContext {
  constructor() {
  ...
    this.registerExamples(
      OperationType.NEW_CHARACTER,
      newCharacterSchema,
      newCharacterJson
    );
  ...
}

Exporta un tipo NewCharacterExample.

export type NewCharacterExample = z.infer<typeof newCharacterSchema>;

Cómo compilar la interfaz de usuario

Una vez que hayas creado y registrado los ejemplos de generación de contenido, puedes crear la interfaz de usuario para el nuevo control. La mayor parte del trabajo de esta fase es crear una nueva clase de operación y, luego, registrarla con el código principal de la aplicación de Wordcraft.

Para crear una operación nueva, sigue estos pasos:

En el directorio wordcraft/app/core/operations/, crea una clase de operación nueva con una de las clases de operaciones existentes como plantilla. Para el nuevo control de caracteres, puedes hacer una copia de la clase new_story_operation.ts y cambiarle el nombre a new_character_operation.ts.

Asigna un nombre nuevo a la clase y especifica cuándo aparece el control en la interfaz de usuario. Para ello, define al menos un valor OperationSite.

export class NewCharacterOperation extends ChoiceOperation {
  static override isAvailable(operationSite: OperationSite) {
    return (
      operationSite === OperationSite.END_OF_SECTION ||
      operationSite === OperationSite.EMPTY_SECTION
    );
  }

Establece el id para la operación.

  static override id = OperationType.NEW_CHARACTER;

Actualiza las funciones get y run para que reflejen los valores de los parámetros del esquema. Este código controla la obtención del texto de la instrucción de la interfaz de usuario para usarla en la instrucción de 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);
  }

Actualiza el texto y las descripciones de la interfaz de usuario.

  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.',
    }),
  };

Para registrar la operación nueva en la aplicación de Wordcraft, sigue estos pasos:

En el archivo wordcraft/app/core/operations/index.ts, agrega una importación para la operación nueva.
```
import {NewCharacterOperation} from './new_character_operation';
```
En el mismo archivo index.ts, agrega una exportación para la clase NewCharacterOperation.
```
export {
  ...
  NewCharacterOperation, // add this class
  ...
};
```

En el archivo wordcraft/app/main.ts, registra la operación nueva.

const operationsService = wordcraftCore.getService(OperationsService);
operationsService.registerOperations(
  ...
  Operations.NewCharacterOperation, // add new operation
  ...
);

Cómo crear el control de instrucciones

Como fase final de la creación del control nuevo, creas el código que controla la generación de instrucciones para el modelo generativo de IA y controla la respuesta. La parte principal del trabajo es compilar un controlador de instrucciones en el directorio wordcraft/app/models/gemini/prompts/ que tome entradas de la interfaz de usuario y ensamble una instrucción para pasarla al modelo generativo.

Para definir una interfaz para los parámetros de instrucción, haz lo siguiente:

En el archivo wordcraft/app/core/shared/interfaces.ts, agrega una interfaz para los parámetros de solicitud de operaciones nuevas.
```
export interface NewCharacterPromptParams {
  character: string;
}
```

Para definir un controlador de instrucciones para la operación nueva, haz lo siguiente:

En el directorio wordcraft/app/models/gemini/prompts/, crea una nueva clase de controlador de instrucciones con una de las clases de operaciones existentes como plantilla. Para el nuevo control de caracteres, puedes hacer una copia de la clase new_story.ts y cambiarle el nombre a new_character.ts como punto de partida.

Define una función de controlador de instrucciones y, luego, importa la clase 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) {
  ...
}

Compila una función generatePrompt() para obtener la entrada de la interfaz de usuario para la instrucción del modelo de 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}`;
    }
  }

Crea una función getPromptContext() para ensamblar la entrada de la interfaz de usuario con las respuestas de ejemplo y compilar la instrucción completa.

  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;
  }

Para integrar el nuevo controlador de instrucciones de caracteres, sigue estos pasos:

En el archivo wordcraft/app/models/gemini/index.ts, importa el controlador de instrucciones para la nueva operación de caracteres.
```
import {makePromptHandler as newCharacter} from './prompts/new_character';
```
Agrega una definición de anulación para el controlador de instrucciones newCharacter.
```
  override newCharacter = this.makePromptHandler(newCharacter);
```

Para registrar los parámetros de la instrucción con la definición del modelo, haz lo siguiente:

En el archivo wordcraft/app/models/model.ts, agrega una importación para la nueva interfaz NewCharacterPromptParams.
```
import {
  ...
  NewCharacterPromptParams,
  ...
} from '@core/shared/interfaces';
```

Agrega parámetros de instrucción newCharacter a la clase de modelos.

  async newCharacter(params: NewCharacterPromptParams): Promise<ModelResults> {
    throw new Error('Not yet implemented');
  }

Prueba el nuevo control de escritura

Tu nuevo control debería estar listo para probarse en la interfaz de Wordcraft. Asegúrate de verificar si hay errores de compilación en tu código antes de continuar.

Para probar el nuevo control de caracteres, sigue estos pasos:

Navega al directorio raíz del proyecto de Wordcraft.`
```
cd wordcraft/
```
Ejecuta el proyecto en modo de desarrollo:
```
npm run dev
```
En tu navegador web, navega a la interfaz de usuario de Wordcraft. La dirección específica se muestra en el resultado del comando anterior, por ejemplo:
```
http://localhost:3000/
```
En la aplicación de Wordcraft, crea una historia nueva o abre una existente.
En el área de edición de la historia, mueve el cursor hasta el final de la historia. En la pestaña Controles, a la derecha, debería aparecer el control Introducir personaje.
En el campo introduce character, escribe una breve descripción del personaje nuevo y, luego, selecciona el botón introduce character.

Recursos adicionales

Para obtener más información sobre el proyecto Wordcraft, consulta el repositorio de código. Puedes ver los cambios que se describen en este instructivo en esta solicitud de extracción.

Aplicaciones de producción

Si planeas implementar una versión personalizada de Wordcraft para un público amplio, ten en cuenta que el uso de la API de Google Gemini puede estar sujeto al límite de frecuencia y a otras restricciones de uso. Si estás considerando compilar una aplicación de producción con la API de Gemini, como el agente de Documentos, consulta los servicios de Vertex AI de Google Cloud para aumentar la escalabilidad y la confiabilidad de tu app.