AIで複数人による共同作業が可能なオンラインサイトを構築するには？｜AIオフィスワーク必修レッスン 05

5ステップで複数人協働ウェブサイトを構築

QwenWork 活用ガイド

チーム協働の昔からの課題：プロジェクトの進捗はグループチャットでのメッセージ連投で確認し、素材はそれぞれのPCに散らばり、週報は一人ずつ催促しなければならない。統一されたウェブサイトを作りたいと思っても、業者に頼めばカスタム開発で5万元から、要件変更ならスケジュールは3週間後。自社でツールを維持しようとしても、人手も時間もない。

今回、QwenWorkを使って自分で構築します。一言の要件から、ログイン可能、協働可能、週報を収集できる複数人協働オンラインウェブサイトまで、全5ステップ：①要件の記述 → ②要件の分解 → ③設計プラン → ④ウェブサイトの構築 → ⑤公開とリリース。

01 要件の記述

口頭で明確に伝え、ドキュメントを添付すればなお良い

PRDを書く必要はありません。「部門週報ワークフローのウェブサイトを生成してください」と入力し、既存の『部門週報ワークフロー』ドキュメントを送って要件の参考資料とします。一言の指示と1つのドキュメントで、要件は十分に伝わります。

タスク指示を添付、そのままコピー

部門名とペインポイント（課題）をあなたのものに変えてください（例では部門週報ワークフローをデモとしています）：

指示・そのままコピー可能

「製品設計部」の複数人協働オンラインウェブサイトを生成してください。アップロードした『部門週報ワークフロー』ドキュメントを要件の参考資料としてください。背景の補足：実際の部門での適用であり、デモではありません。4つのペインポイント（タスク進捗の追跡、素材の散在、振り返りの欠如、引き継ぎの記録不足）のうち、初版ではタスク進捗の追跡を優先的に解決します。役割は2段階：責任者 + 一般メンバー。管理の粒度：プロジェクト→タスクの2階層。素材は小ファイル中心（デザイン画像/PDF）とし、大ファイルはリンクを保存。責任者側には「全体概要 + 週報」の2つの集約形式が必要です。まず設計プラン（スタイルテーマを2～3セット選択可能、領域設計、インタラクションロジック、アカウント体系と権限ルール）を提示し、私が確認してから構築を開始してください。公開後はアクセスパスワードを設定できるようにしてください。

指示が長いため、上下にスクロールして全文をご確認ください

02 要件の分解

AIが詳細を質問、あなたは決定するだけ

AIは2回のラウンドに分けて要件を明確にします。

第1ラウンドで骨子を決定：このウェブサイトの用途とポジショニングは何か？4つのペインポイントのうち最初にどれを解決するか？役割をどう分けるか？タスクとプロジェクトをどこまで細かく管理するか？実際の部門での適用、タスク進捗の追跡を優先、責任者 + メンバーの2段階、プロジェクト→タスクの2階層、4つの質問に4秒で回答します。

第2ラウンドで境界線を決定：どのモジュールを初版に含めるか（素材ライブラリ、プロジェクトの振り返り、引き継ぎの記録の取舍選択）？素材はどのような形式か（小ファイルは直接保存、それとも大ファイルはリンクか）？責任者側にはどのような集約が必要か（かんばんの全体概要、全体概要 + 週報、それともかんばんのみか）？

各項目は選択式なので、クリックするだけでOK。あなたが決め、AIが記憶します。この2ラウンドの質問が終わる頃には、AIは新しく入った見習い社員よりもあなたの部門を理解しています。

03 設計プラン

3種類のスタイルから自由に選択、プランを文書化

まず3種類のテーマスタイル案を提示します：深紅の落ち着いたビジネス風、青・白・金の報告・プレゼン風、墨緑の爽やかな協働風。かんばんの構造は同じで、雰囲気はあなたのお好みで選べます。

選択後は完全な設計プランになります：1. スタイルテーマ、2. 領域設計（責任者の初期画面ではプロジェクトかんばんと素材ライブラリを表示、一般メンバーの初期画面では自分のタスクのみ表示）、3. インタラクションロジック（週報の提出方法、タスクステータスの遷移）、4. アカウント体系と権限ルール。

不満があれば率直に言ってください。あなたが納得するまで修正します。

04 ウェブサイトの構築

ページが一つずつ積み上げられていく様子を見守る

プラン確認後、施工プロセスに入ります。全体の構築は対話の中で完了します：4枚のデザイン図を掲げて一つずつ処理し、各ステップは「コマンドの実行、ファイルの修正」です。カレンダーの追加、プロジェクトの切り替え、メンバー選択パネルの作成など、どのファイルを変更し、どのコマンドを実行したかが全程で可視化されます。構築完了後、自動的に全機能検証を行い、検証に合格し、テストデータをクリーンアップしてから引き渡します。

完成品はどのようなものか？責任者が初期画面を開くと：今週推進待ち12件、期限超過2件。チームの近況が1画面で一目瞭然：今週完了タスク187（週間目標180、達成済み）、相互ヘルプ2940回、平均返信速度1時間24分。納品完了率86%（期日通り68%、遅延の可能性22%、期限超過10%）。進行中の4つのプロジェクトのそれぞれの進捗も一目瞭然。右側のチームカレンダーには今日の3つの会議が予定されています。

複数人協働はまさに真の協働：アカウントAとアカウントBが同時にオンラインになり、それぞれが自分のプロジェクト視点で閲覧し、データはリアルタイムに同期されます。新しいメンバーがログインページを開くと、6つのデモアカウントがワンクリックで入力されます：責任者、ビジュアルデザイナー、フロントエンドエンジニア、プロダクトマネージャー、インタラクションデザイナー、データアナリスト。それぞれが自分のメインページにアクセスします。

05 公開とリリース

ワンクリックでリリース、パスワード設定も可能

「自分のウェブページとして公開」をクリックすると、ドメインに qwenwork.host を含む正式なURLが取得でき、ブラウザで開いてすぐに使用できます。

「自分のウェブページ」内で一元管理：公開状態、バージョン番号、動的/静的タイプが一目瞭然。右クリックでアクセスパスワードを設定することも可能。保存後、このウェブページにアクセスするにはパスワードの入力が必要になるため、部門内での利用も安心です。

リリース直後のチームでも教育不要：ウェブサイトには7ステップの初心者ガイドが備わっており、30秒従うだけで、検索コマンドパネル、チームカレンダー、新規プロジェクトの作成などすべて使えるようになります。

最後に、2つの高度なテクニック

テクニック1：データはすべてあなたの手に

ウェブサイトにはデータ追跡機能が備わっています：ページビュー、タスク完了、検索。誰がどれくらい使っているかがバックエンドの1画面で一目瞭然で、ワンクリックでExcel（CSV）にエクスポートすることも可能。さらに深く掘り下げると、「データベース」内の各テーブル（タスク、メンバーアカウント、コメント、マイルストーンなど）をSQLで直接照会でき、Excelのインポート・エクスポートにも対応しています。これは単なるウェブページではなく、あなたの部門のデータ資産なのです。

テクニック2：スマートフォンのホーム画面に追加して、アプリのように使う

スマートフォンのSafariでウェブサイトのURLを開き、「共有」→「ホーム画面に追加」を選択すると、ホーム画面にアイコンが追加されます。タップすると全画面表示のウェブサイトが立ち上がり、ネイティブアプリと全く変わりません。

以上で第5期AIオフィス必修コースの全内容となります。次回は、QwenWorkの次の効率化シーンを引き続き探っていきます。

「QwenWork」公式アカウントをフォローして、最新情報をいち早くお届けします。

We dedicated to serving clients with professional DingTalk solutions. If you'd like to learn more about DingTalk platform applications, feel free to contact our online customer service or email at このメールアドレスはスパムボットから保護されています。閲覧するにはJavaScriptを有効にする必要があります。. With a skilled development and operations team and extensive market experience, we’re ready to deliver expert DingTalk services and solutions tailored to your needs!