2022 ソフトウェア設計及び演習用の班Wiki

22::gr08::三合堂恭平

archive mode

<<活動記録>>

!!!第1回
!!作業内容
*班決め
*テーマ決め((br))
テーマとして挙がったのは以下の3つ((br))
**タイマー((lp))メイン((rp))
**カレンダー
**ランキング
*意見交換(アイデア)
**1画面で表示する
**ゲージで進捗を可視化
**コメント機能によるモチベーションの充実((br))

次回は簡易企画書を作成することを目標とする。

!!!第2回
!!学習内容
*htmlの基礎((br))
今回の開発言語になる可能性が高いため、重点的に学習したい
*Javascriptの基礎
*gitlabの使い方
!!作業内容
*gitlabの設定
*テーマ決め((br))
今回のソフトウェアは主に３つの要素で構成されている。
**ログイン画面
((br))主にアカウントの管理
**タイマー機能
((br))時間、分、秒の範囲でセット
((br))複数のタイマーをセットとして使用
((br))記録機能を使用し時間を管理
**記録管理
((br))カレンダー機能と勉強時間の記録
((br))合計時間の記録を行う

((br))
次回はこのソフトウェアにおいてのものと動作について考える。

!!!第3回
!!作業内容
*テーマの確認
*ものと操作の洗い出し
**それぞれの画面からものと動作、遷移を考え、大まかなオブジェクトの構想を書き下ろした。
**全体の構造を粗方理解することができた。

!!洗い出しの内容
*ログイン画面からのソフトウェアの構成
*それぞれの画面のボタンとそれに対応する動作
*データベースを含めたものと動作とデータの割り当て
((br))

次回はそれぞれの画面、構成要素の優先順位を考え、プロジェクトの
方向性を固める。

!!!第4回
!!作業内容
*ものと操作の洗い出し
**タイマー画面(デスクトップ)のレイアウト
**レイアウトに沿ったものと操作の企画
**ポップアップ画面の挙動
**タイマー設定画面の調整
***主にタイマー周りの挙動
***設定ボタンの画像消去
*プログラム全体の構成
**タイマー周りの遷移
**機能と構成の調整
((br))

次回はモジュール分けを行う。

!!!第5回
!!作業内容
*データのやり取り
**データベースとのデータのやり取り
***firebaseを用いたソフトウェア
**画面の遷移
***同一ソフトウェアのデータの受け渡し
*モジュール分け
**それぞれの遷移ごとのモジュール
((br))

次回はモジュール分けの分担を行う。

!!!第6回
!!作業内容
*モジュールの分担
**サウンドモジュール
**時計システム・表示モジュール
*環境構築
**VS codeを用いて制作
**VS codeのターミナルを用いてGitにコードを追加
((br))

次回はプロトタイプの作成を行う。

!!!第7回
!!作業内容
*プロトタイプの作成
**サウンドモジュールの作成
***4つの異なるボタンにそれぞれ違う音を鳴らす
***一つの関数に効果音を入れて呼び出す
**時計モジュールの作成
***時刻を取得するDateオブジェクトを作成し、取得
***100ミリ秒ごとに端末から時刻を取得
((br))

次回はプロトタイプの調整を行う。

!!!第8回
!!作業内容
*プロトタイプの調整
**サウンドモジュールの作成((br))
プロトタイプではボタンをクリックしたら音がなるが、コンポーネントのため一つの関数として呼ばれる。((br))
完成するためには値の受け取りを行い、それに応じた効果音を鳴らさなければならない。
**時計モジュール((br))
これもコンポーネントの一つである。((br))
時計の文字自体を変更するCSSを作成する必要がある。
((br))

次回は中間発表。発表者のプログラムを参考にしたい。

!!!第9回
!!作業内容
*中間発表
**この日はコンピュータの操作を行った。
*モジュールのプロトタイプ
**棒グラフのプロトタイプ作成
((br))Javascriptの変数をCSSに送ることができなかった。
V-bindで値を送ることが出来るらしいが未だに成功せず。

((br))

次回はCSSをjavascriptの変数を生かして表現する。

!!!第10回
!!作業内容
*グラフ作成モジュールの作成
**最長に合わせて棒の長さを調整
**日付データと時刻データの分離
***日付はスラッシュ区切りで表示

((br))

次回はグラフを完成させる。

!!!第11回
!!作業内容
*グラフ表示モジュールの作成
**cssの描画からchart.jsに変更((br))
chart.jsはグラフ作成に特化した拡張機能((br))
サイズが可変になることによって拡張性が向上
*グラフモジュールのマージ
!!グラフモジュールの中身
*8桁の日付、時間、分、秒が入った配列を受け取る(7日分のデータ)
*勉強時間を分単位で計算(時間*60+分、秒は無視)
*日付は初めの4桁(年:yyyy)が一致するならmm/dd、そうでなければyyyy/mm/dd(月:mm、日:dd)
*日付を横軸、勉強時間を縦軸で棒グラフをvue3-chartsで生成

((br))
次回はpropsを用いたデータの受け渡しを行う。

!!!第12回
!!作業内容
*ダッシュボードのCSS作成
**色変更ボタンはグリッド表示を行う。
**結果画面はスクロールバーでスクロールを行えるようにする。
**メモ画面も同様にスクロール可能にする。
**各ブロックはグリッドで扱う
**長さはremで指定する

((br))
次回はCSSの調整を行う。

!!!第13回
!!作業内容
*cssの調整
**gridやpaddingを用いて表示位置の調整
**画面サイズ可変に対応
**ボタンクリックに対してリアクション追加

((br))
!!!作業内容まとめ
*サウンドモジュールの作成
**リアクションに応じて関数の呼び出しを行い、効果音を鳴らす
*時計表示
**端末から時刻の情報を取り出し、画面に表示する
*グラフ表示の処理とデザインのモジュール
**渡されたデータに対して対応するようにデータを抽出し、棒グラフとして表示する
*ダッシュボードのデザイン（css）作成
**他の人が担当したhtmlに対して書式を崩さないようにデザインする

Tag:

Attachment

New: append-tag

(download: 53 bytes, at 2022/04/15 15:43:52 <frozen> )
(download: 282 bytes, at 2022/04/15 15:50:33 <frozen> )
(download: 288 bytes, at 2022/04/15 15:50:50 <frozen> )
(download: 428 bytes, at 2022/04/15 15:56:23 <frozen> )
(download: 430 bytes, at 2022/04/15 15:56:58 <frozen> )
(download: 444 bytes, at 2022/04/22 11:36:24 <frozen> )
(download: 659 bytes, at 2022/04/22 15:03:11 <frozen> )
(download: 1100 bytes, at 2022/04/22 16:40:37 <frozen> )
(download: 1197 bytes, at 2022/04/22 16:42:03 <frozen> )
(download: 1227 bytes, at 2022/05/06 14:14:52 <frozen> )
(download: 1283 bytes, at 2022/05/06 15:52:15 <frozen> )
(download: 1599 bytes, at 2022/05/06 15:56:16 <frozen> )
(download: 1601 bytes, at 2022/05/06 15:56:30 <frozen> )
(download: 1829 bytes, at 2022/05/06 16:15:55 <frozen> )
(download: 1826 bytes, at 2022/05/06 16:16:22 <frozen> )
(download: 1889 bytes, at 2022/05/13 15:02:10 <frozen> )
(download: 2004 bytes, at 2022/05/13 15:05:26 <frozen> )
(download: 2043 bytes, at 2022/05/13 15:06:43 <frozen> )
(download: 2159 bytes, at 2022/05/13 15:35:02 <frozen> )
(download: 2160 bytes, at 2022/05/13 15:35:25 <frozen> )
(download: 2153 bytes, at 2022/05/13 15:36:13 <frozen> )
(download: 2245 bytes, at 2022/05/13 15:38:34 <frozen> )
(download: 2329 bytes, at 2022/05/20 14:29:05 <frozen> )
(download: 2353 bytes, at 2022/05/20 14:31:00 <frozen> )
(download: 2550 bytes, at 2022/05/20 16:32:20 <frozen> )
(download: 2666 bytes, at 2022/05/27 12:20:17 <frozen> )
(download: 2965 bytes, at 2022/06/03 08:49:10 <frozen> )
(download: 3408 bytes, at 2022/06/10 13:01:06 <frozen> )
(download: 3403 bytes, at 2022/06/10 13:01:32 <frozen> )
(download: 3869 bytes, at 2022/06/10 14:38:21 <frozen> )
(download: 4036 bytes, at 2022/06/10 14:41:16 <frozen> )
(download: 4079 bytes, at 2022/06/17 14:37:30 <frozen> )
(download: 4436 bytes, at 2022/06/24 12:31:30 <frozen> )
(download: 4444 bytes, at 2022/06/24 12:32:00 <frozen> )
(download: 4448 bytes, at 2022/06/24 12:32:26 <frozen> )
(download: 4711 bytes, at 2022/07/01 15:55:02 <frozen> )
(download: 5454 bytes, at 2022/07/01 16:08:50 <frozen> )
(download: 5846 bytes, at 2022/07/15 12:47:18 <frozen> )

Syntax Help

URL Link

[text|http://example.com//] http://example.com/to{text}

Page Link

[[PageName]] [[text|PageName]] >>{PageName} >>{PageName}{text}

Image or Attachment

<<{filename} <<{filename}{text}

Text Decoration

'' Italic '' ''' Bold ''' '''' Large-font '''' `` Typewriter `` `?` Preformatted `?` __ Underline __ == Strike == == DEL =={ INS } ((br)) line feed

Special Letter

((amp)) & ((bq)) ` ((lt)) < ((gt)) > ((lp)) ( ((rp)) ) ((lb)) [ ((rb)) ] ((ll)) (( ((rr)) ))

Headline

!!!! site-name !!! section-name !! subsection-name ! subsubsectino-name << section-name >> <<< subsection-name >>> <<<< subsubsection-name >>>> >> Centering and Large-font <<

Itemize

* item1 ** item1-1 ** item1-2

Enumerate

+ item1 + item2 ++ item2-1

Table

|| 1-1 | 1-2 | 1-3 || 2-1 | 2-2 | 2-3

Description

:item ::description

Quotation

6< quotation >9

Preformatted text

8< preformatted-text >8

Edit