トモコレで作る理想のコミュニティー
キャラクター同士のつながりをデザインする
メインビジュアル、あるいは
プロジェクトの最新の状態を視覚的に掲載
概要
背景と目的
「トモコレで作る理想のコミュニティー」というテーマの背景には、現実では人間関係の悩みやコミュニケーション不足が増えていることがあります。その中で、トモコレのように個性の違う人たちが自由に関わり合い、楽しく生活する空間に注目しました。
目的は、ゲームの世界を通して「理想の人間関係」や「居心地の良いコミュニティー」を考え、自分らしく過ごせる社会について表現することです。
成果物の仕様
webサイト
制作ツール
Illustrator
wix
チャットgpt
メンバー
進捗記録
2026.06.22
サイトマップ
今回制作したプロトタイプ
プロトタイプの説明
- 一番上はロゴとページリンク
- 点線:文字
- 枠に✖️:画像
- 緑:リンク
- ピンク:表
- 紫線:イラスト
- AIに入れたい内容
- 「トモダチコレクション(トモコレ)を紹介する大学課題用のWebサイトを制作してください。
サイトの目的は、トモコレの魅力を伝えることと、私と友人の島を比較してゲームの面白さを紹介することです。
ターゲットは、トモコレを知らない人やプレイしたことがない人です。
デザインは、ゲームの中に入り込んだ感じのデザインで、黄色をメインカラー赤をサブカラー、差し色で青や紫、緑も入れる。
フォントもゲームぽく
おしゃれに凝っている感じに
サイト構成は以下の内容にしてください。
トップページ
・タイトル
・トモコレの世界観が伝わるキャッチコピー
・サイト概要
【トモコレとは】のページ
・発売日
・ゲーム概要
・どのような遊びができるのか
・ゲームの魅力
【トモコレの特徴】のページ
・住人作成機能
・性格の種類
・住人同士の人間関係
・予測できないイベントプレイヤーごとに異なる島になること
【島比較コーナー】のページ
・私の島の紹介
・友人の島の紹介
・住人数
・相関図
・特徴
・印象
・比較表
・デクランショットや鳥の様子を掲載できる
エリア
【まとめ】のページ
・比較して分かったこと
・トモコレの面白さ
・プレイヤーごとに異なる物語が生まれることを伝える文章
レスポンシブ対応(スマホ・PC両対応)にしてください。
HTML、CSS、JavaScriptを分けて作成してくださ
コードにはコメントを付け、初心者でも理解しやすい構成にしてください。後から自分と友達の島を比較した表や相関図を入れたい
2026.06.15
現状分析
課題定義
- 1. 小学生でも見やすいサイト
- 2. 基本情報を一目で
- 3. 比較
制作上のアイデア(課題ごとに複数のアイデア)
- 1. 小学生でも見やすいサイト
- 見やすいように考えた配色
- 文字ばっかりではなくイラストや写真も入れる
- ボタンなどは強調
- 3. 比較
- 自分の島とかおこの島を比較する
・・・土地、人間関係、人数、島の物、レベルなど
2026.06.08
テーマ候補
- トモコレの会話システムと感情表現
- トモコレで作る理想のコミュニティー
- Miiキャラクターによる自己表現の研究
成果物の仕様
この演習を通して身につけたいスキル
- Illustratorなどのデザインソフトの操作スキル
- レイアウト力
- 発想力