日報担当:髙島海紗
【今日の活動内容】
ポスター修正
プレゼン資料修正
【投稿担当者の作業内容】
ポスター修正
【残タスク、次回の作業内容】
ポスター修正
プレゼン資料修正
日報担当:髙島海紗
【今日の活動内容】
ポスター修正
プレゼン資料修正
【投稿担当者の作業内容】
ポスター修正
【残タスク、次回の作業内容】
ポスター修正
プレゼン資料修正
作業担当者:鈴木 祥護
作業日 :2月9日
MIRABA の MAP(REQUEST)画面について、
UI設計を完成レベルまで引き上げ、
卒業研究として説明可能な設計状態に整理した。
・MAP(REQUEST)画面のUI設計を完成レベルまで仕上げる
・「REQUESTを探す」「REQUESTを出す」両枠の視認性・操作性を改善する
・卒業研究として、設計意図を説明できる状態に整理する
・左側「REQUESTを探す」枠、右側「REQUESTを出す」枠について
レイアウト・配色・装飾を統一
・MIRABAの世界観に合わせ、
暗めトーンをベースにブルー/シルバーハイライトを用いたデザインに調整
・画面全体として、役割の異なる2枠が直感的に理解できる構成とした
・フォーム内容が画面外にはみ出る問題を確認
・フォーム専用の縦スクロールを実装し、
画面全体のレイアウトを崩さずに入力可能な構造に変更
・スクロールバーは細め・シルバー調とし、
常時主張しない高級感のあるデザインを採用
・住所入力を自由入力方式から、
「郵便番号 → 都道府県 → 市区町村 → 詳細住所」
という 構造化入力方式に変更
・郵便番号検索ボタンを設置し、
外部APIを用いた自動住所入力の設計を実装
・入力ミスや表記ゆれを防止し、
将来的なMAP連携を見据えたデータ構造とした
・input / select / textarea のデザインを統一
・都道府県 select における色差問題について、
ブラウザ仕様を理解した上で制御方法を整理
・日付入力(カレンダーUI)については、
世界観とのズレを認識した上で、
実装の安定性を優先しブラウザ標準UIを採用する判断を行った
・現段階で 実装しない機能 と
将来実装予定の機能 を明確に切り分け
・卒業研究として
「なぜこの設計にしたのか」を説明できる状態に整理
・ユーザー情報(名前・アイコン)との連携
・REQUESTクリック時の詳細表示とMAP表示の連動
・Leaflet 等を用いた実マップ表示への差し替え検討
・現在のダミーMAP構造を活かした段階的実装
・REQUESTデータの保存・取得処理
・REQUESTが実際に行える環境の構築
・画面遷移・表示の動作テスト
・UI崩れ、入力不具合の確認
・卒業研究提出レベルでの安定性確認
日誌担当者
松村知生
チームの活動内容
スライド作り、ポスター作り、バグ直し
投稿担当者の作業内容
スライド作り
残タスク、次回の作業内容
スライド完成(動画撮影)
一言
風邪ひきましたー筋トレが早くしたいです
作業担当者:鈴木 祥護
作業日 : 2月6日
作業内容
プロフィール画面の追加機能に対応のため再定義
・プロフィールは
「人物の象徴」と「付随情報」を明確に分離する画面とする
・情報の重要度に応じて、視覚的レイヤーを分離する
【人物の核(正規・固定)】
・アバター
・表示名
・(将来)ユーザID(本人のみ確認可能)
【準公開・可変情報】
・年齢
・生年月日(公開/非公開 任意)
・性別(公開/非公開 任意)
・住所(都道府県のみ公開)
【活動情報】
・投稿数
・利用期間
・初期状態は 表示名のみ表示
・それ以外の項目は 非表示 または「–」表示
・未入力項目は必ず「–」で表示する
・年齢と生年月日は別項目として扱う
→ どちらか一方のみ表示可能な設計
・住所は 都道府県のみ公開(プライバシー保護)
【前提】
・背景(画面全体)は変更しない
・MIRABAの「落ち着いた暗さ」は維持する
【問題点】
・暗すぎて見づらい
・黒 × 黒で情報階層が分かりづらい
【解決策(確定)】
・カード内のみ明るくする
・特に「アイコン+名前」領域を
別レイヤーとして強調する
・profile-hero のデザインを完成レベルまで仕上げる
・プロフィール画面を
「UI完成」
「JS機能追加完了」
・メッセージ画面の新規追加機能に応じた画面設計再定義詳細機能の定義ui設計図の作成
日誌担当者: 鎌田あるん
チームの活動内容
投稿担当者の作業内容
残タスク・次回の作業内容
ゆびすま負けた
作業担当者:鈴木 祥護
作業日 :2月5日
RIGHT画面の役割定義
・RIGHT画面を、ユーザー投稿を時系列で表示するタイムライン画面として位置づけ
・TOP画面の体験価値を補完する「閲覧中心の画面」として設計
・操作を最小限に抑え、情報の流れを重視した構成とした
画面構造設計
・投稿カードを最小単位とした縦方向レイアウトを採用
・ユーザー情報、投稿テキスト、画像、コメント導線を
一つのカード内で完結させる構造とした
・RIGHT画面はJSによる動的生成を前提とし、
HTML構造を固定したままデータを差し替える設計を採用
コメントUIの責務分離
・コメント表示用(comment-preview)と入力用(comment-panel)を明確に分離
・表示と入力を混在させないことで、UXの混乱を防止
・コメントは新しいものが上に表示される降順構造とした
・表示件数を制限し、スクロール前提のUIとした
画像表示仕様
・画像は正方形(aspect-ratio: 1 / 1)表示に統一
・複数画像選択を可能としつつ、表示は常に1枚のみ
・左右ボタンによる切り替え方式を採用
・投稿画面およびマイページと仕様を完全に共通化
完了判定
・RIGHT画面はUI設計および構造設計ともに完成扱いとする
・今後の追加機能実装は行わない
■ プロフィール画面 報告内容
プロフィール画面の役割定義
・プロフィール画面を「ユーザー情報の閲覧専用画面」として設計
・編集操作は別画面(プロフィール編集)に分離し、
表示と入力の責務分離を徹底した
画面構造設計
・全画面共通サイドバーを維持し、main領域のみをプロフィール専用構成とした
・ユーザー名、基本情報を中心に、落ち着いた情報配置を採用
・過度な装飾を避け、公共性・信頼性を意識した構成とした
編集画面との分離設計
・編集ボタンから専用の編集画面へ遷移する構造を採用
・プロフィール画面自体には入力要素を持たせない
・将来的な公開/非公開制御を想定したデータ構造を前提とした
デザイン方針
・高級感・ガラス感・あたたかさ(ダーク寄り)の世界観を踏襲
・余白と文字色を重視し、視認性と落ち着きを両立
・MIRABA全体のトーンを崩さない画面デザインとした
完了判定
・プロフィール画面およびプロフィール編集画面は
UI設計・構造設計ともに完成扱いとする
・以後の改修・追加作業は行わない
日誌担当者: 藤原創太
チームの活動内容
投稿担当者の作業内容
残タスク・次回の作業内容
全体発表がんばります
日誌担当者:久保 拓也
【今日の活動内容】
・スライド修正
・紹介動画作成
・ポスター修正
【投稿担当者の作業内容】
・紹介動画作成
・スライド修正
【残タスク、次回の作業内容】
・スライド修正
・紹介動画作成
・ポスター修正
作業担当者:鈴木 祥護
作業日 :2月4日
プロジェクト全体の最終整理
・設定、フレンド(メッセージ)、マイページ、投稿画面、RIGHT画面について
UI設計および画面構造を確定
・全画面共通サイドバー固定構造、data-pageによる画面遷移仕様を最終仕様として整理・共有
次回の作業
① right画面:複数枚画像投稿(最優先)
② プロフィール:公開/非公開制御
日報担当:髙島海紗
【今日の活動内容】
ポスター直し
プレゼン資料直し
【投稿担当者の作業内容】
ポスター直し
【残タスク、次回の作業内容】
ポスター直し
プレゼン資料直し