#author("2026-07-20T13:53:16+09:00;2026-07-20T13:52:54+09:00","default:member","member") #author("2026-07-20T13:53:41+09:00;2026-07-20T13:52:54+09:00","default:member","member") *トモコレで作る理想のコミュニティー キャラクター同士のつながりをデザインする webサイト #image(a.jpg) -''丸石 樹・佐藤 禾生子'' -'''Keywords：トモコレ, 街作り''' ~ CENTER:☟🤎Click🤎☟ CENTER:&color(#513743){&size(20){[[トモコレで作る理想のコミュニティ>https://monchichi3110.github.io/tomotomo2/]]};}; //-__[[相互評価シート>https://www.example.com]]__ ← ここからコメントをお願いします。 //-__[[プロトタイプ相互評価シート>https://docs.google.com/spreadsheets/d/1t_x7UkS7PrtGynWucq7gYJXatgWdTvAABL9CiHRPBvo/edit?usp=sharing]]__ ← ここからコメントをお願いします。 ~ **概要 ***背景と目的 「トモコレで作る理想のコミュニティー」というテーマの背景には、現実では人間関係の悩みやコミュニケーション不足が増えていることがあります。その中で、トモコレのように個性の違う人たちが自由に関わり合い、楽しく生活する空間に注目しました。 目的は、ゲームの世界を通して「理想の人間関係」や「居心地の良いコミュニティー」を考え、自分らしく過ごせる社会について表現することです。 ~ ~ ***成果物の仕様 webサイト 4ページ ~ ~ ***制作ツール Illustrator（画像制作） Visual Studio Code（骨組み） gemini（内容） チャットgpt（内容） ~ ~ ***メンバー -丸石 樹⇨Visual Studio Code -[[佐藤 禾生子⇨Illustrator>佐藤禾生子/情報デザイン演習IIA_02]] ~ ~ #hr CENTER:''進捗記録'' #hr ~ ~ **2026.07.13 -イメージをがらっと変えた -画像を増やして、わかりやすく -アニメーションを入れて楽しいサイトに ~ ***gemini!!! ~ **2026.07.06 -htmlに変更 -自分の好きな色ではなくトモコレにあった色 -骨組みだけ完成 ~ ***チャットGPT!!! ~ **2026.06.29 ***見出された問題点 -内容が少なく感じる -どんなイメージにするか -wixで完成させるのか ~ ***好評を得た点 ＞ プロジェクトの特性として -テーマが流行り -自分以外の島が見れる ~ ~ **2026.06.22 ***サイトマップ #image(0101.png) ~ ***今回制作したプロトタイプ #image(1010.png) ~ ***プロトタイプの説明 -一番上はロゴとページリンク -点線：文字 -枠に✖️：画像 -緑：リンク -ピンク：表 -紫線：イラスト ~ ~ -AIに入れたい内容 ---「トモダチコレクション（トモコレ）を紹介する大学課題用のWebサイトを制作してください。 サイトの目的は、トモコレの魅力を伝えることと、私と友人の島を比較してゲームの面白さを紹介することです。 ターゲットは、トモコレを知らない人やプレイしたことがない人です。 デザインは、ゲームの中に入り込んだ感じのデザインで、黄色をメインカラー赤をサブカラー、差し色で青や紫、緑も入れる。 フォントもゲームぽく おしゃれに凝っている感じに サイト構成は以下の内容にしてください。 トップページ ・タイトル ・トモコレの世界観が伝わるキャッチコピー ・サイト概要 【トモコレとは】のページ ・発売日 ・ゲーム概要 ・どのような遊びができるのか ・ゲームの魅力 【トモコレの特徴】のページ ・住人作成機能 ・性格の種類 ・住人同士の人間関係 ・予測できないイベントプレイヤーごとに異なる島になること 【島比較コーナー】のページ ・私の島の紹介 ・友人の島の紹介 ・住人数 ・相関図 ・特徴 ・印象 ・比較表 ・デクランショットや鳥の様子を掲載できる エリア 【まとめ】のページ ・比較して分かったこと ・トモコレの面白さ ・プレイヤーごとに異なる物語が生まれることを伝える文章 レスポンシブ対応（スマホ・PC両対応）にしてください。 HTML、CSS、JavaScriptを分けて作成してくださ コードにはコメントを付け、初心者でも理解しやすい構成にしてください。後から自分と友達の島を比較した表や相関図を入れたい **2026.06.15 ***現状分析 -先行事例・・・[[hyperTsブログ>https://hyperts.net/tomocolle/memo/]] -歴史・・・[[Wikipedia>https://https://ja.wikipedia.org/wiki/トモダチコレクション]] -技術・・・[[Nintendo>https://www.nintendo.com/jp/interview/blfga/index.html]] ~ ***課題定義 -1. 小学生でも見やすいサイト -2. 基本情報を一目で -3. 比較 ~ ***制作上のアイデア（課題ごとに複数のアイデア） -1. 小学生でも見やすいサイト --見やすいように考えた配色 --文字ばっかりではなくイラストや写真も入れる --ボタンなどは強調 -2. 基本情報を一目で --島のレベルや、関係値、性格などを表にする -3. 比較 --自分の島とかおこの島を比較する ・・・土地、人間関係、人数、島の物、レベルなど ~ ~ **2026.06.08 ***テーマ候補 -トモコレの会話システムと感情表現 -''トモコレで作る理想のコミュニティー'' -Miiキャラクターによる自己表現の研究 ~ ***成果物の仕様 -形式：web -分量：島の構図 ：2つの島の相関図 ~ ***この演習を通して身につけたいスキル -Illustratorなどのデザインソフトの操作スキル -レイアウト力 -発想力 ~ ~