使用 Wordcraft 建構 AI 書寫助理

我們喜歡故事。說故事和做其他形式的創意寫作 可能充滿挑戰和獎勵想在空白頁面建構個人故事嗎？ 然而，有時看起來卻很艱鉅，甚至令人頭痛人造花 智慧型 (AI) 生成式模型非常適合用來 然後建構你的銷售提案

本教學課程說明如何擴充 Wordcraft、 這是一項採用 AI 技術的故事撰寫工具，採用 Google 個人與 AI 研究成果 團隊。這個網頁應用程式使用 Gemini API 可協助您輕鬆構思故事 並修訂內容以增添更多細節你可以修改 Wordcraft 打造更加貼近個人寫作風格 為工作流程提供更完善的支援

觀看專案簡介影片、專案應用方式和深入分析資訊 製作團隊的意見 AI 書寫助理 - 運用 Google AI 建構內容。 或者，您也可以按照操作說明開始擴充專案 。

專案設定

以下操作說明會引導您設定 Wordcraft 專案 您需要安裝必要的軟體，並複製 從程式碼存放區 執行設定安裝 設定幾個環境變數您可以執行專案來測試設定 完成上述步驟後

安裝必備條件

Wordcraft 專案使用 Node 和 npm 進行管理 並執行應用程式以下是安裝操作說明 Linux 主體

如何安裝必要的軟體：

複製並設定專案

下載專案程式碼，並使用 npm 安裝指令來下載 必要的依附元件並設定專案您需要具備 git 來源控制軟體以擷取專案 Cloud Build 觸發條件 會在您變更原始碼時自動啟動建構作業
如要下載並設定專案程式碼：

  1. 使用下列指令複製 git 存放區。 
    git clone https://github.com/PAIR-code/wordcraft
  2. 前往 Wordcraft 專案根目錄。 
    cd wordcraft/
  3. 執行安裝指令，下載依附元件並設定專案： 
    npm install

設定環境變數

設定允許 Wordcraft 程式碼所需的環境變數 特別是 Google Gemini API 金鑰。 以下安裝操作說明適用於 Linux 主機。

如要設定環境變數，請按照下列步驟操作：

  1. 取得 Google Gemini API 金鑰並複製金鑰字串。
  2. 前往 Wordcraft 專案根目錄。 
    cd wordcraft/
  3. 將 API 金鑰設為環境變數。在 Linux 主機上，請使用 以下指令。
    touch .env
echo "API_KEY="<YOUR_API_KEY>"" > .env
，瞭解如何調查及移除這項存取權。

測試設定

現在，您應該可以在 裝置。雖然此步驟非必要，但建議您執行。

Wordcraft 開啟畫面

如何測試安裝和設定：

  1. 前往 Wordcraft 專案根目錄。 
    cd wordcraft/
  2. 以開發模式執行專案： 
    npm run dev
  3. 在網路瀏覽器中，前往 Wordcraft 使用者介面。 特定位址會顯示在上個指令的輸出內容中，例如：
    http://localhost:3000/

修改提示範例文字

Wordcraft 指令使用者介面 Wordcraft 運用一組範例，為 AI 生成式模型建立提示 每次撰寫輔助作業，例如建立新故事並生成 文字指令。這些範例可引導生成式模型產生 擷取特定樣本，修改特定運算的樣本後，您可以變更 來遵循不同的寫作模式或風格。這種做法 讓 Wordcraft 按照您的方式寫出

以下範例為修改後的 new_story 範例 。這項修改的目的是引導 AI 生成式模型 以內心法撰寫故事簡介，並採用風格 比較適合懸疑小說然後撰寫一些範例 您就可以根據生成式模型 而是生成不同主題的簡介

如要在 Wordcraft 中修改新的故事範例，請按照下列步驟操作：

  1. 開啟 wordcraft/app/context/json/new_story.json 檔案。
  2. 修改範例，同時維持 JSON 的整體結構 檔案。以下是使用懸疑故事開場的修改範例 內部的單調風格 
    [
  {
    "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. 將變更儲存至「new_story.json」檔案。

如何測試修改後的新故事作業：

  1. 前往 Wordcraft 專案根目錄。 
    cd wordcraft/
  2. 在開發模式下執行專案。如果已在執行中，您可能會 但應用程式必須停止並重新啟動 
    npm run dev
  3. 在網路瀏覽器中，前往 Wordcraft 使用者介面。 特定位址會顯示在上個指令的輸出內容中，例如：
    http://localhost:3000/
  4. 前往 Wordcraft 的主選單，然後選取「Start a New Story」。
  5. 更新新的故事提示或視需要變更，然後選取 建立新故事。

你可以運用這項功能，修改 Wordcraft 中現有的故事撰寫控制項。 這是標準文字處理技術嘗試變更 wordcraft/app/context/json/ 目錄內。

建立新的書寫控制項

Wordcraft 導入字元使用者介面 Wordcraft 應用程式經過精心設計，可供擴充，方便你增添新寫作 輔助控制項，例如生成文字或重新撰寫句子 按鈕。將這些元素設為 而這類修改可能有些費力，但可以讓您可以塑造 根據工作流程和目標的需求選擇文字。

以下修改範例會建立新的字元控制項， 。您可以用這個提示向新的人物介紹 該字元的屬性說明這個控制項的基本概念 與開始新故事控制項等其他 Wordcraft 控制項相同 您可以建立 JSON 檔案，並舉出幾個相關範例。 字元。其餘變更則加入使用者介面 AI 提示管理功能

可建立樣本

寫下幾個例子，說明您希望生成式模型如何導入 字元。例如，您要像講述者一樣描述服務內容。 還是要透過主要角色的體驗來介紹？ 以下範例採用第二種方法 從這個角度觀察主角的視野。請使用新的 JSON 來新增這些範例 檔案：

如何新增新控制項的範例：

  1. 建立 wordcraft/app/context/json/new_character.json 檔案。
  2. 在 JSON 檔案中建立範例。這個範例中的每一個範例 character 說明欄位，代表提示 文字和 target 欄位：顯示預期的輸出內容 
    [
  {
    "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. 儲存 new_character.json 檔案的變更。

建立範例後，請修改 app/context/schema.ts 和 index.ts 檔案來反映這個新字元控制項的提示內容。

如要在 schema.ts 檔案中新增範例，請按照下列指示操作：

  • 修改 wordcraft/app/context/schema.ts 檔案，加入新的 字元資料結構範例 
    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(),
});

定義與這些新範例相關聯的作業類型。這項新功能 類型有助於將提示範例連結至使用者介面 建構程式碼，您將在後續步驟中修改。

建立新的作業類型

  • 修改 wordcraft/app/core/shared/types.ts 檔案，加入新的 字元作業類型 
    export const enum OperationType {
  ...
  NEW_CHARACTER = 'NEW_CHARACTER', // add to list of types
  ...
}

如要在 index.ts 檔案中註冊範例：

  1. 在 wordcraft/app/context/index.ts 檔案中匯入新的結構定義。 
    import {
  continueSchema,
  ...
  newCharacterSchema // add new schema
} from './schema';
  2. 將新的 JSON 檔案匯入為 newCharacterJson。 
    import newCharacterJson from './json/new_character.json';
  3. 在應用程式結構定義中註冊新字元的範例內容。 
    export class WordcraftContext {
  constructor() {
  ...
    this.registerExamples(
      OperationType.NEW_CHARACTER,
      newCharacterSchema,
      newCharacterJson
    );
  ...
}
  4. 匯出 NewCharacterExample 類型。 
    export type NewCharacterExample = z.infer<typeof newCharacterSchema>;

建立使用者介面

建立並註冊內容生成範例後 為新控制項建立使用者介面大部分工作 請先建立新的作業類別，再透過 輸入的主要程式碼

如要建立新作業，請按照下列步驟操作：

  1. 在 wordcraft/app/core/operations/ 目錄中建立 新的作業類別使用其中一個現有的作業類別，做為 範本。如要取得新字元控制項，您可以複製 new_story_operation.ts 類別並重新命名為 new_character_operation.ts。
  2. 為類別命名，並指定控制項出現在 使用者介面，只要定義至少一個 OperationSite 值即可。 
    export class NewCharacterOperation extends ChoiceOperation {
  static override isAvailable(operationSite: OperationSite) {
    return (
      operationSite === OperationSite.END_OF_SECTION ||
      operationSite === OperationSite.EMPTY_SECTION
    );
  }
  3. 設定該作業的 id。 
      static override id = OperationType.NEW_CHARACTER;
  4. 更新 get 和 run 函式以反映 結構定義參數的值這個程式碼可處理提示文字的取得作業 然後在 AI 提示中使用 
      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. 更新使用者介面的文字和說明。 
      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.',
    }),
  };

如要在 Wordcraft 應用程式中註冊新作業：

  1. 在 wordcraft/app/core/operations/index.ts 檔案中新增 匯入新作業 
    import {NewCharacterOperation} from './new_character_operation';
  2. 在同一個 index.ts 檔案中，新增下列項目的匯出項目： NewCharacterOperation 類別。 
    export {
  ...
  NewCharacterOperation, // add this class
  ...
};
  3. 在 wordcraft/app/main.ts 檔案中，註冊新的 作業。 
    const operationsService = wordcraftCore.getService(OperationsService);
operationsService.registerOperations(
  ...
  Operations.NewCharacterOperation, // add new operation
  ...
);

建立提示處理機制

在建立新控制項的最終階段，建立的程式碼 負責生成 AI 生成式模型的提示並處理回覆 作業的主要部分是在 wordcraft/app/models/gemini/prompts/ 目錄，會擷取使用者輸入內容 並組合要傳遞至生成式模型的提示

如要定義提示參數的介面：

  • 在 wordcraft/app/core/shared/interfaces.ts 檔案中新增 全新作業提示參數的介面。 
    export interface NewCharacterPromptParams {
  character: string;
}

若要定義新作業的提示處理常式：

  1. 在 wordcraft/app/models/gemini/prompts/ 目錄中建立 新的提示處理常式類別，並以 範本。如要取得新字元控制項，您可以複製 new_story.ts 類別並重新命名為 「new_character.ts」做為起點。
  2. 定義提示處理常式函式，並匯入 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. 建構 generatePrompt() 函式，取得使用者介面輸入內容 建立 AI 模型提示 
      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. 建立 getPromptContext() 函式來組合使用者 介面輸入內容和範例回應，並建構完整提示 
      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;
  }

如要整合新的字元提示處理常式：

  1. 在 wordcraft/app/models/gemini/index.ts 檔案中，匯入 新字元作業的提示處理常式。 
    import {makePromptHandler as newCharacter} from './prompts/new_character';
  2. 為 newCharacter 提示新增覆寫定義 處理常式。 
      override newCharacter = this.makePromptHandler(newCharacter);

如何使用模型定義註冊提示參數：

  1. 在 wordcraft/app/models/model.ts 檔案中，新增以下項目的匯入項目： 新增 NewCharacterPromptParams 介面 
    import {
  ...
  NewCharacterPromptParams,
  ...
} from '@core/shared/interfaces';
  2. 將 newCharacter 提示參數新增至模型類別。 
      async newCharacter(params: NewCharacterPromptParams): Promise<ModelResults> {
    throw new Error('Not yet implemented');
  }

測試新的書寫控制項

您的新控制項應該已經準備好在 Wordcraft 介面中進行測試。請確認 檢查程式碼是否有編譯錯誤，然後再繼續操作。

如何測試新字元控制項：

  1. 前往 Wordcraft 專案根目錄。 
    cd wordcraft/
  2. 在開發模式中執行專案： 
    npm run dev
  3. 在網路瀏覽器中，前往 Wordcraft 使用者介面。 特定位址會顯示在上個指令的輸出內容中，例如：
    http://localhost:3000/
  4. 在 Wordcraft 應用程式中建立新故事或開啟現有故事。
  5. 在故事編輯區域中，將遊標移到故事結尾。於 右側的「Control」分頁標籤，則「加入字元」控制項應該 顯示。
  6. 在「引言字元」欄位中，輸入 新字元，然後選取「引言字元」按鈕。

其他資源

如要進一步瞭解 Wordcraft 專案，請參閱 存放區你可以查看 本教學課程中所述的變更 提取要求。

正式版應用程式

如要為大量目標對象部署自訂的 Wordcraft 版本， 請注意，使用 Google Gemini API 可能會受到頻率限制 其他 使用限制。 如果您考慮使用 Gemini API 建構正式版應用程式，例如： 文件代理程式，結帳 Google Cloud Vertex AI 這些服務來提高應用程式的擴充性和可靠性。