Salesforce – AI開発実践ラボ https://creativecontentlabtokyo.com AIで、作る力を手に入れる。 Tue, 12 May 2026 03:11:04 +0000 ja hourly 1 https://wordpress.org/?v=6.9.4 Salesforce ネイティブ アジャイルボード|外部ツール不要のアジャイルプロジェクト管理を、Salesforce の中だけで完結させる https://creativecontentlabtokyo.com/portfolio/sf-agile-board/ Tue, 12 May 2026 03:11:04 +0000 https://creativecontentlabtokyo.com/portfolio/sf-agile-board/ Salesforce を使っているのに、プロジェクト管理だけ別のツールにある

CRM にある顧客データ、外部のタスク管理ツールにあるチケット、スプレッドシートにある工数表——それぞれ別の場所に散らばった情報を毎週手でまとめていませんか？

Salesforce Agile Board は、その分断を解消します。作業項目・スプリント・レポートを、Salesforce のデータとして一元管理します。

30+
全画面・コンポーネント数
4
ロール対応
Admin / Manager / Member / Viewer
Phase 1
全機能 実装済み

主要機能

カンバンボード — ドラッグ＆ドロップで、ステータスを即更新

Sprint ごとのカンバンボード。カード移動でステータスが Salesforce レコードに即時反映されます。WIP 制限・スイムレーン表示にも対応し、チームの作業状況をリアルタイムで把握できます。

バックログ管理 — Epic から Story へ。構造化された作業分解

Epic / Story / Task / Bug を一覧管理。インライン編集、複合フィルタ、Sprint への割り当てをバックログ画面だけで完結させます。チケットをまたいでスクロールする手間がなくなります。

WBS / ガントチャート — 依存関係と工数を、Salesforce 上のガントで把握する

WBS 階層ツリーとガントチャートを統合表示。ドラッグで日付を変更し、依存関係線をリアルタイムで描画します。Excel インポートにも対応。Salesforce ネイティブでガントが動く唯一の選択肢です。

スプリント管理 — 計画・開始・完了・繰越をワンストップで

Sprint ごとの計画 SP・完了 SP・進捗バーを一覧表示。Sprint 比較ビューで直近 3 Sprint のベロシティを並列確認できます。スクラムマスターとチームメンバーそれぞれの視点で使い分けられます。

レポート — バーンダウン・ベロシティ・累積フロー。Sprint の健全度を可視化

4 タブ（バーンダウン / Epic バーンダウン / 累積フロー / スプリントレポート）。日次スナップショットを自動生成し、Sprint 終了後も履歴として参照可能です。

ダッシュボード — Sprint 進捗・ベロシティ・期限超過件数。経営層にも見せられる数値

6 つのメトリクスウィジェットをワンビューで確認。プロジェクトを切り替えるだけで表示が即時更新されます。定例会議の場でそのまま画面を共有できます。

アーキテクチャへのこだわり

  • Controller → Service の一方向呼び出しによる責務の明確な分離
  • Trigger Handler パターンで Apex の複雑度を管理
  • 9 カスタムオブジェクト（Work_Item__c が核心）
  • Epic / Story / Task / Bug をレコードタイプで区別
  • 4 権限セット（Admin / Manager / Member / Viewer）で細粒度アクセス制御
  • 2GP 管理パッケージ（namespace: agb）設計

さらに進化する機能

利用可能（Phase 1） カンバンボード、バックログ管理、WBS/ガント、スプリント管理、レポート（バーンダウン/ベロシティ/累積フロー）、ダッシュボード、設定
開発中（Phase 2） Swimlane、WIP 制限、ステータス遷移ルール、課題間リンク
予定（Phase 3） 外部プロジェクト管理ツール連携、Slack 連携、CSV インポート、2GP 正式リリース
]]> ウェルス会員ポータル|Salesforce Experience Cloud https://creativecontentlabtokyo.com/portfolio/wealth-club-portal/ Sat, 28 Mar 2026 04:17:14 +0000 https://test.creativecontentlabtokyo.com/portfolio/wealth-club%e4%bc%9a%e5%93%a1%e5%90%91%e3%81%91%e3%83%9d%e3%83%bc%e3%82%bf%e3%83%ab%e3%82%b5%e3%82%a4%e3%83%88/ プロジェクト概要

Next.js/Vercelで構築したWEALTH CLUBのWebアプリケーションを、Salesforce Experience Cloud上にLightning Web Components（LWC）を使って再構築したプロジェクトです。Salesforceプラットフォームの堅牢なセキュリティとデータ管理機能を活かしながら、元のデザインと同等のUI/UXを実現しています。

システム構成図

ウェルス会員ポータル システム構成図
ウェルス会員ポータル — System Architecture

主な機能

会員ダッシュボード

予約状況・お知らせ・ポイント残高をリアルタイム表示。会員ランクに応じたパーソナライズ。

レストラン予約

提携レストランの検索・詳細・予約。予約確定時にPlatform Eventsで即時通知。

ラウンジ予約

会員専用ラウンジの空き状況確認と即時予約。時間帯選択やオプション追加。

イベント管理

会員限定イベントの一覧・詳細・参加申込。カレンダー連携でスケジュール管理。

会員プロフィール

会員情報管理、ポイント履歴、通知設定。Shield暗号化で個人情報保護。

技術的なポイント

  • Salesforce Experience Cloud上にLWCで構築
  • WEALTH CLUB（Next.js版）のデザインをLWCで忠実に再現
  • Apex Controllers + SOQL/SOSLによるデータアクセス
  • Platform Eventsによるリアルタイム通知
  • Shield（Platform Encryption）による個人情報保護
  • カスタムオブジェクト（会員、予約、イベント、ポイント履歴）のデータモデル設計

開発プロセス

既存のNext.js版をリファレンスに、Salesforceプラットフォーム上での再実装をVibe Codingで実施。LWCコンポーネント設計からApex実装、Experience Cloudのテーマカスタマイズまで約5時間で完成しました。

]]> Salesforce App|モバイル営業支援ツール https://creativecontentlabtokyo.com/portfolio/salesforce-mobile-app/ Sat, 28 Mar 2026 16:57:56 +0000 https://test.creativecontentlabtokyo.com/portfolio/salesforce-mobile-app/ プロジェクト概要

外出先の営業担当者がSalesforceのデータにモバイルからアクセスし、取引先管理・商談確認・AI支援・名刺登録をワンストップで行えるネイティブアプリです。Salesforce REST APIとの連携により、リアルタイムのデータ同期を実現しています。

システム構成図

Salesforce モバイル営業支援 システム構成図
Salesforce モバイル営業支援 — System Architecture

主な機能

Salesforce認証 + 生体認証

Connected App OAuth認証とデバイスの指紋/Face IDによる二段階のセキュアなログイン。

取引先マップ

現在地周辺の取引先をピン表示。距離フィルタとRating色分けで重要顧客を即座に把握。

取引先・商談管理

Salesforceの取引先・商談データをモバイルで検索・一覧・詳細表示。外出先でもリアルタイムに確認。

AIコンシェルジュ

チャットUIで取引先のネクストベストアクションをAIが提案。音声入力にも対応。

名刺スキャン

カメラまたはファイル選択でAI-OCR読取。取引先・取引先責任者としてSalesforceに自動登録。

技術的なポイント

  • React Nativeによるクロスプラットフォーム開発（iOS/Android対応）
  • Salesforce Connected App OAuthによるセキュアな認証フロー
  • デバイスの生体認証（指紋/Face ID）による二段階認証
  • React Native Mapsで取引先の地理情報を可視化
  • AIエージェントによるネクストベストアクション提案
  • AI-OCRによる名刺読取→取引先自動登録パイプライン
  • Zustand + React Queryによる状態管理とキャッシュ戦略
  • Zodによる入力バリデーション

開発プロセス

AIを活用したVibe Codingアプローチで、認証フロー設計からUI実装・API連携・AI機能統合まで約5日間で完成。Salesforce REST APIの仕様に合わせたデータモデリングと、モバイル特有のUX（マップ操作・カメラ連携・音声入力）をネイティブ品質で実現しました。

]]> CloudFormGenerator|Salesforce帳票ジェネレータ https://creativecontentlabtokyo.com/portfolio/sf-form-generator/ Fri, 08 May 2026 17:42:05 +0000 https://creativecontentlabtokyo.com/portfolio/sf-form-generator/ プロジェクト概要

SalesforceのデータをWordテンプレートに自動差し込みしてPDF帳票を生成する、Salesforceネイティブの2GP管理パッケージです。外部サーバー不要でSalesforceのセキュリティポリシーをそのまま維持しながら、見積書・請求書・契約書・申請書などあらゆる帳票をノーコードで生成できます。

主な機能

Wordテンプレをそのまま持ち込める

社内で使っているWordファイルをアップロードするだけ。プレースホルダーを自動検出し、フォント・印鑑欄・書式を作り直す必要がありません。

ビジュアルマッピング — IT部門不要

Salesforceオブジェクトの項目をドロップダウンで選ぶだけでマッピング完了。5階層のドリルダウンで親子オブジェクトの深い参照も対応。

WYSIWYGエディタ — 印鑑・バーコードも自由配置

要素をドラッグ＆ドロップで配置。印鑑SVG・バーコード・QRコード・明細テーブル・計算式をビジュアルに設定できます。

印鑑SVG自動生成（日本市場特化）

テキスト入力で縦書き・横書きの丸印鑑をリアルタイム生成。手書きモードではキャンバスに直接描画した印影も登録可能。

商談レコードから1クリックでPDF出力

マッピング設定が完了すれば、あとは1クリック。Salesforceデータが帳票に自動差し込みされ、生成PDFはレコードに自動添付。

競合との差別化

既存の帳票ツールの多くは外部サーバー（クラウド）でPDF処理を行うため、ユーザー数・出力件数に応じたライセンス費用が発生します。CloudFormGeneratorはSalesforce LWC+ApexのみでPDF生成を完結させるため外部依存がなく、月額固定・出力件数無制限で提供します。現在お使いのツールよりランニングコストが高くなるケースはまずありません。詳しくは評価版インストールページをご覧ください。

システム構成

Salesforce LWCとApexのみで完結する完全Salesforceネイティブ構成。外部サーバー・外部APIは一切使用していません。LWCコンポーネント群がApexコントローラー経由で独自実装のOOXMLエンジン・PDF生成エンジン・SVG印鑑ジェネレーターを呼び出し、生成したPDFをContentDocumentとしてSalesforceレコードに自動添付します。2GP管理パッケージ（namespace: cclab）としてパッケージ化し、AppExchange配布に対応したライセンス管理機能を搭載しています。

CloudFormGenerator システム構成図
CloudFormGenerator — System Architecture（Salesforce LWC + Apex only）

技術的なポイント

  • Salesforce LWC + Apexのみで完結（外部サーバー・外部APIなし）
  • OOXML処理エンジン独自実装 — .docxのプレースホルダー抽出・差し込み・レイアウト要素埋め込み
  • PDF出力2方式：標準版（Chromium・フォント制限なし・バーコードはJsBarcode）/ 大容量VF版（Flying Saucer・1,000項目超対応・バーコード/QRはQuickChart API利用）
  • 印鑑SVGジェネレーター — Canvas描画による手書き印影登録にも対応
  • バーコード / QRコード生成 — 6種類対応（Code128・JAN-13・JAN-8・Code39・NW-7・ITF-14）。標準PDF版はJsBarcode（外部依存なし）、大容量VF版はQuickChart API経由で生成
  • 5階層ドリルダウンマッピング — 親子・孫オブジェクトの深い参照を視覚的に設定
  • 明細テーブル自動改ページ — 行数に応じて複数ページに自動分割
  • テーブル行カラー設定 — 奇数行・偶数行に個別の背景色を設定可能（ゼブラストライプ対応）
  • 2GP管理パッケージ（namespace: cclab）— AppExchange配布に向けたライセンス管理機能搭載

開発プロセス

AI駆動開発アプローチで、要件定義・Apex設計・LWC実装・OOXMLエンジン開発を並行して進行。Salesforceのヒープ制限・SOQL上限・管理パッケージのコンパイル制約など、プラットフォーム固有の課題を一つひとつ解決しながら実用レベルの品質を実現しました。Sandboxで無料評価できるため、既存帳票との置き換え可否を検証してから導入判断できます。

サポート・免責事項

対象

本製品は法人・事業者のみを対象としています。個人（消費者）へのご提供はしておりません。

月額費用の位置づけ

月額費用（¥19,800〜）はサポート・保守サービスの対価です。パッケージ本体は一度インストールすれば、サポート終了後もお客様のSalesforce環境で引き続きご利用いただけます。

サポート対応範囲

  • バグ報告の受付：メール・お問い合わせフォーム経由
  • 回答目安：3営業日以内（個人運営のため保証はできません）
  • 修正リリース：重大なバグは優先対応、軽微なものは次回バージョンで対応

2GP管理パッケージについての重要事項

CloudFormGeneratorはSalesforce 2GP管理パッケージとして提供されています。Salesforceの仕様上、バグ修正版へのアップグレードは「アンインストール → データバックアップ → 再インストール」の手順が必要になる場合があります。導入前にSandbox環境での十分な評価を強く推奨します。本番環境への適用はお客様の判断と責任において行ってください。

サポート終了（EOL）について

開発者の都合によりサポートを終了する場合は、少なくとも3ヶ月前にサイト上およびご登録のメールアドレス宛に告知します。サポート終了日をもって月額費用の請求を停止します。サポート終了後も、インストール済みパッケージはお客様のSalesforce環境で引き続き動作しますが、バグ修正・セキュリティ対応・お問い合わせ対応は提供されません。なお、本製品は外部サーバーに依存しない設計のため、サポート終了によって即座に機能が停止することはありません。

免責事項

  • 評価利用（Sandbox/Developer）中に生じた損害について、開発者は責任を負いません
  • Salesforceのバージョンアップによる動作影響は保証の対象外です
  • 有償サービスに関する詳細な条件は別途サービス利用契約書に定めます
  • 個人開発製品であることをご理解のうえ、ご利用ください
]]> AI汎用入力フォームLWC https://creativecontentlabtokyo.com/portfolio/sf-universal-record-form/ Sat, 04 Apr 2026 16:35:45 +0000 https://test.creativecontentlabtokyo.com/portfolio/salesforce-%e6%b1%8e%e7%94%a8%e5%85%a5%e5%8a%9b%e3%83%95%e3%82%a9%e3%83%bc%e3%83%a0%e3%82%b3%e3%83%b3%e3%83%9d%e3%83%bc%e3%83%8d%e3%83%b3%e3%83%88-universalrecordform/ 背景・課題

Salesforceの標準フォームは1列表示が基本で、項目数が多いオブジェクトでは大量のスクロールが発生します。また、AI（Agentforce）との連携もカスタム実装が必要でした。

このコンポーネントは「あらゆるSalesforceオブジェクトに対応できる、高密度かつAI搭載の汎用入力フォーム」として設計しました。App Builderに配置するだけで動作し、objectApiNameを渡すだけで取引先・商談・カスタムオブジェクトすべてに対応します。

主要機能

列数切替（2 / 4 / 6 / 8列）

ツールバーのボタンで列数をリアルタイム切替。設定はlocalStorageに保存され、次回アクセス時に自動復元されます。8列表示では1画面に数十項目を表示でき、入力効率を大幅に向上させます。

4列グリッド表示
4列表示
2列グリッド表示
2列表示（デフォルト）
8列グリッド表示
8列表示（最高密度）

フィルタリング

「必須のみ」「空欄を隠す」の2つのトグルで表示項目を絞り込み。必要な項目だけに集中でき、大量項目のオブジェクトでも快適に入力できます。

必須項目のみフィルター
必須のみフィルター適用後
空欄を隠すフィルター
空欄を隠すフィルター適用後

セクション折り畳み & タブ表示

セクションヘッダークリックで展開・折り畳みを切替。状態はlocalStorageに保存されます。タブ表示に切り替えると、セクションをタブUIで切り替えられます。AI適用後はAIが定義したセクション構成に変わります。

セクション折り畳み
セクション折り畳み状態
タブ表示切替
タブ表示切替モード

ダーティ状態管理 & 変更ハイライト

フォームロード時の値を記録し、変更があった項目を黄色ハイライト表示。変更がある場合のみ保存・キャンセルボタンを表示。Ctrl+S（Cmd+S）でも保存できます。

未保存の変更バッジ
変更があった項目のハイライトと「未保存の変更あり」バッジ

Agentforce AI レイアウト最適化

「AI最適化」ボタンをクリックすると、AgentforceのFlex Prompt Templateがオブジェクトの項目定義を解析し、最適なレイアウト（列数・セクション構成・グリッドスパン）を提案します。提案はカスタムオブジェクト（UsfLayoutConfig__c）にサーバー保存され、チーム全員が同じ最適レイアウトを利用できます。

Agentforce AIレイアウト提案
AI提案レイアウトのプレビュー（設計意図も日本語で表示）
AI最適化適用後バッジ
適用後に「✦ AI最適化済み」バッジを表示

AI 入力補助（自然言語 → フォーム自動入力）

会話メモ・メール文章などの自然言語テキストをペーストすると、AgentforceのPrompt Templateが内容を解析して対応するフィールドに自動入力します。確信度（high/low）で✓/✗プレビュー表示し、ユーザーが確認してから適用できます。

AI入力補助 テキスト入力
自然言語テキストを入力
AI入力補助 解析プレビュー
解析結果を✓/✗でプレビュー
AI入力補助 フォーム適用後
フォームに自動入力された状態

技術的なポイント

  • 任意オブジェクト対応: objectApiNameを渡すだけで取引先・商談・カスタムオブジェクトすべてに対応
  • Prompt Template設計: Agentforce Flex Templateで列数・セクション・スパンをJSON出力。Setup > Prompt Builderで手動作成・アクティブ化
  • localStorageキャッシュ: 列数・折り畳み状態・AIレイアウトをobjectApiName単位でブラウザ保存
  • UsfLayoutConfig__c: AIが提案したレイアウト設定をカスタムオブジェクトにサーバー保存し組織共有
  • Enter移動: フィールド入力中のEnterキーで同列の次行フィールドへ移動（Excel的挙動）

コンポーネントのダウンロード

会員の方は、会員ポータルから本製品のベータ版インストール URL を確認することができます。

]]>