日誌担当者: 藤原創太

チームの活動内容

• UIづくり
• ゲームロジックづくり

投稿担当者の作業内容

• タイピングで遊ぶ画面のUIづくり

残タスク・次回の作業内容

• UI、背景、ゲームロジックづくり

久しぶりに日報じゃんけん負けてしまいました

日誌担当：鈴木祥護

プロジェクト名：MiraBa

[本日の主要な目標]

本日は、以下の項目を実施し、サイトの基盤となる機能とデザインを実装しました。

[活動内容]　[担当者の作業]

• レイアウト修正:

  • 左サイドバーを固定し、右側のメインコンテンツのみスクロールする2分割レイアウトを確立しました。

  • ヘッダーのデザインを変更し、アイコンエリアとして再構築しました。

• デザイン調整:

  • 背景画像を設定し、サイト全体の雰囲気を統一しました。

  • キャッチコピー「ーMIRABAー みらいの私たちの場所を ありがとう と 笑顔をともに」の配置とデザインを改善しました。

  • 全体をモノクロトーンを基調としつつ、テーマカラー（#4bbac2）をアクセントに使用しました。

• 投稿機能（暫定版）の復旧と拡張:

  • js/app.js にて投稿データのレンダリングロジックを実装しました。

  • 「green bird」のボランティア活動を参考にした画像付き投稿を追加しました。

  • 投稿に対するコメント機能の表示を実装しました。

• コードの整理:

  • 単一ファイルだったコードを index.html, css/style.css, js/app.js, js/firebase.js に分割し、保守性を向上させました。

[課題と解決の方向性]

なし

[次回の作業]

• 投稿機能の本格実装:

  • 現在はJavaScript内の固定データを表示していますが、フォームから入力された内容を画面に反映させる処理を作成します。

  • （発展）Firebase Firestoreへのデータ保存処理の追加検討。

• 画像アップロード機能の検討:

  • ユーザーが自分のデバイスから画像を選択し、投稿に添付できる仕組みの調査と実装準備。

• 背景設計（動画対応）:

  • 静止画の背景だけでなく、動画を背景にするための技術検証と実装。

• 新画像投稿への対応:

  • 様々なアスペクト比の画像が投稿されてもレイアウトが崩れないよう、CSS（object-fit 等）の調整。

チームの活動内容
UI、グラフィックの作成
コードの書き方の模索

投稿担当者の作業内容
UIの作成

残タスク、次回の作業内容
UI、機能の作成

UIを急ピッチで進めていきます。

日誌担当者：久保　拓也
【今日の活動内容】

・画面の背景作成

・画面デザインの変更

・データベース接続

・タイトル決め

・キャラクター作成

【投稿担当者の作業内容】

・画面の背景作成

・画面デザインの変更

・データベース接続

・キャラクター作成

【残タスク、次回の作業内容】

・画面遷移図の修正

日誌担当：鈴木祥護

プロジェクト名：MiraBa

[本日の主要な目標]

アプリのUI骨格の完全な完成およびコードの整理・分割を行い、開発の基盤を固めること。

[活動内容]　[担当者の作業]

UI骨格の作成と修正

１・2分割レイアウト: 左サイドバー（固定）と右メインコンテンツ（スクロール）の確立。

２・デザイン調整: 背景画像の適用、ヘッダーアイコンの配置、キャッチフレーズのスタイル調整（枠削除など）。

３・コンテンツ配置: 全体貢献度ウィジェットを最下部に、キャッチフレーズを最上部に配置するレイアウト変更を実施。

４・JavaScriptを用いて、サンプル投稿および画像付き投稿（ボランティア活動の様子）を動的にレンダリングする機能を実装した。

５・単一のHTMLファイルから、css/style.css、js/app.js、js/firebase.js へコードを分離し、保守性を向上させた。

[課題と解決の方向性]

左サイドバーの固定と右コンテンツのスクロールが干渉し、表示が崩れる問題が発生。

投稿フィードに追加した画像が表示されず、コメントも反映されない状態だった。

[次回の作業]

１・画像リソースの配置：フォルダを作成し、背景画像やヒーロー画像をローカル環境に配置する。

２・認証機能の強化:ログイン状態に応じた投稿フォームの表示制御（現在は表示のみ）を実装する。

３・Firestore連携: 実際のデータベースへの書き込み・読み込み処理を js/app.js に実装し、リアルタイム更新を有効化する。

報告者：G3A113佐藤桃香

活動内容：コード作成

報告者の活動内容：コード作成

次回の活動内容：コード作成

日誌担当者: 鎌田あるん

チームの活動内容
UI、グラフィックの作成

投稿担当者の作業内容
進捗状況の把握
軽微な修正

残タスク、次回の作業内容
役割分担
UI、グラフィックの作成
ゲームロジックの作成

久しぶりの登校だったので現状把握をしました。
元気になりました！いっぱい頑張ります！