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

19::gr12::葛城玲弥

archive mode

!!!! 葛城玲弥の活動記録ページ
!!!目次
*目次
*私の作成物と使い方
*時間外活動の活動記録
*活動記録
*終わってみての感想
*リンク

!!!私の作成物と使い方(備忘録）

!!main.html
これは実行用のhtml。トップページの表示を行う、イベントが起こると画像が変わったり、色が変わったりする。イベントの処理はjsで実行。基本的にこのhtmlによって変数や関数を管理している。

!!sonota.html
当日にヘッダーの「その他」に何も設定されていないことに気づき、短時間で作成。ここにあるサイトは意外と便利なものが多いので結構使いやすいし、すぐ班Wikiに来れる。

!!windowsize.js
*htmlのclass名を取得し、その部分を書き換え
*最初のトップ画面の画像サイズとウィンドウサイズを取得
*拡大縮小率を求め、ウィンドウサイズに合わせて画像のサイズが変わる
**これはcssを書き換えている。
*シャボン玉の設定と表示(firefoxだとバグが発生、修復できなかった(chromなら可））

!!headerNavi.js
*html内のclassを取得し、cssを変更する
*スクロールがトリガー
*一定の位置を超えると、上にヘッダーが出現
*デザインはstyle.css

!!mainMapsize.js
*マップの画像サイズをウィンドウサイズに合わせる。
*中身はwindowsize.jsとほぼ同じ
*画像が切り替わっても使える

*最終的に統合の際にImagemapsterというライブラリ？といろいろな衝突があり、使わないことに決定。
**ライブラリを使うとこういうことがあるという良い勉強になったということで...少し残念だった。

!!mainPage.js
*変数pageID
**文字列でidを持っている。
**ページが変わるたびにそのページのIDを持つ
*変数nowPage
**bodyChangeで使う。

*image_obj
**二層目の画像ファイルを保存
*imageR
**三層目の理工学部の画像ファイルを保存
*imageCg
**三層目の学生センター（中央エリア）の画像ファイルを保存
*imageCe
**三層目の教育学部（中央エリア）の画像ファイルを保存
*imageCj
**三層目の人社（中央エリア）の画像ファイルを保存
*imageN
**三層目の農学部の画像ファイルを保存

*関数whatValue
**引数はページのIDの文字列
**valueの値を書き換える
**bodyChange.jsで呼び出され、IDを取得していく

*関数whatPage
**呼び出されると現在のページがどこかを返す

!!backButton.js
*1つ前の画像に戻る
*pageIDを変えることで実現
*誘導光ともリンクさせる予定(できなかった）

*話し合いの齟齬から仕様を変更（山口が仕様変更をしてくれた）

!!bodyChange.js
*画像の差し替えを行う
**if文で分岐
**PAGEIDから新しいページIDのと画像差し替えをする
**pageIDの書き換え
*戻るボタンにも対応
*一部統合で失敗して「戻るボタン」が動かないというバグも発生（直せなかった...)
*範囲指定がされているareとusemapさえあれば、マウスが乗った時に光ったり、ツールチップが出たりする。
*自分で作っていうのも変だが、割と有能だと思う。

!!!時間外活動の活動記録
以下は個人活動をした際に、みんなで共有できるように作った掲示板です。
!正直、こっちの活動記録より充実感があるので、気になる方は是非（笑）
*[[12班の活動掲示板|gr::12::掲示板]]
<<活動記録>>

<<<4/12 活動記録>>>
*班決め
*テーマ設定
((br))  私達のチームでは「情報提供をするマップの作成」をメインテーマとする。
*ページの編集等

<<<4/19 活動記録>>>
*テーマの内容の議論
((br))　岩手大学周辺、岩手大学内に関するマップを制作する。詳細は簡易企画書。
*[[簡易企画書 |gr12::簡易企画書]]の作成

<<<4/26 活動記録>>>
*各ページの構成を決めた
*それぞれのものと操作の洗い出し（大まかに）
*どういう操作が必要か考えた

<<<5/10 活動記録>>>
*[[ものと操作|19::gr12::ものと操作]]の洗い出し（詳しく）
*実際にマップのデータを収集（足を運んで）

<<<5/17 活動記録>>>
*ものと操作の洗い出し（現段階では終了)
*全員でどのような動きをするのか確認（操作の仕方の最終確認）
*上記にしたがってモジュール化
*お手本になるサイトのプログラムを見て、実現可能そうだとわかった

<<<5/24 活動記録>>>
*担当を決めた
*フロアマップを作成した（理工学部１号館と２号館）
*ホーム画面のフォーマット作成（初期段階）

<<<5/31 活動記録>>>
*プロトタイプの作成
**とりあえず、簡易的なホーム画面からの移動には成功した
**javascriptは私は使わなかったが、今後使う必要がありそう（レオの理工学部１号館のが良い手本）
**デザインをどうするのか、もっと考えなければならない
**検索バーの導入は苦戦しそう
<<<6/7　活動記録>>>
*プロトタイプの作成
**ホーム画面からの遷移はすべてできるようにした
**中央エリアのいくつかはhtmlの作成完了。画面の下にリンクを用意した（完成形では、地図上に）
**検索されたら光るという動きの再現に成功。中間発表のためにエンターを押したら光るようにjavascriptを導入。（ただし、エンターを押した後、光るのを止めることに成功してない、このプログラムを書き換えることで「検索されたら光る」につなげることができるのではないかと考えている、if文でまわせば）

<<<6/14 活動記録>>>
*中間発表
**他の班がすごくて刺激をうけた。勝負というわけではないが、少し対抗心が芽生えた。本番では、もっと良いのが発表できるように頑張りたい。
*話し合い
**モジュール分けを再度。正直、中間までの作業は自分がいろいろ手を出してしまって申し訳なかった。これからはしっかり分担して作業をしていく
**ちなみに自分の作業はデザイン。
*今後やること
**ホーム画面のデザイン
**jsを使って、画像のみの変更
**ウィンドウに合わせた画面表示

とりあえず、今月中に自分の分担部分は完成形にもっていく。残りの１ヶ月で調整ができればいいなというか、それが理想。
余裕があれば、他に個人的に機能を追加してみる。

<<<6/21 活動記録>>>
*とりあえず、私の一週間の成果を見せた（詳細は[[活動掲示板|gr::12::掲示板]])
**話し合いたいことは確認できた
**私のところが進まないと他のところが大変そう（全体像は私の担当なので他の人がイメージするためには私が早めにやらないと...)
*トップページはほぼ確定でいいかな
*セカンドページを作っているけど、jsで動かすことに成功していない
**自分がどこにいるかを記す関数whatPage();(返り値はa,b,c)←班ウィキ（誘導光）
**画像を変える関数
**というか、htmlのリンクのやつをjsでやるのもあり。
*来週までにある程度完成させる
**細部はいいけど、マップの遷移、拡大、値を返すなどは完成させたい

<<<6/28 活動記録>>>
*関数と返す値、使える変数などの確認
*モジュール分け
**細部について
**正直、ちゃんと理解できていないところがあって申し訳ない
**オブジェクト指向をつかっていけたらなあ...
**もっとjavascriptを学ばなければいけない
*個人作業
**main.htmlがとてもキーになる部分なので、見やすく書き直す
**htmlは基本的にmainのみを使う
**jsを使っていろいろ動かすように変更する
**cssを使ったほうがよいところは、無理してjsにしない

<<<7/5 活動記録>>>
*とりあえず、クリックで画像の入れ替えはできた
**あとはHtmlのidさえ分かればなんとかなりそう
**ただ、jsのグローバル変数のせいでまだ完璧ではない
*whatPage関数は使えるようにした
**これもグローバル変数に問題あり、文字列でidをリターンします
*mydirにあるのでダウンロードして使ってください

<<<7/12 活動記録>>>
*班wikiに自分の作ったファイルと仕様について簡単に記述
*mainPage.jsとbodyChange.jsの修正
**単体モジュールでは成功
**もしかすると、他のモジュールに対応できないかも
**すれ違いが起こってそうで少し怖い
**この辺から統合しながら作業しないとプログラムが書きにくい
**条件分岐が多くなりそうなので、もっといいプログラムを考えなければいけないかもしれない
*gitの使い方が未だによくわからん
**なんかpullできない
**git hubみたいにディレクトリもいじれたらいいのに

<<<7/19 活動記録>>>
*少しずつ統合
**統合はやっぱり大変...
**検索バーは統合ができた
**マウスオーバーはちょっとむずかしそう。main.htmlを書き換えているのが原因。正直、main.htmlは変更しないで使いたかったが、担当の人が厳しそうなので、しかたない。
**他の人とは統合テストはしてないが、この２つと統合が完璧にできれば、ほかともできるはず
*bodyChange.jsの仕様について
**統合時にここが機能しなくなっている気がするので、少しずつ統合テストをしながら変更していく必要がありそう。

<<<7/26 活動記録>>>
*gitがうまくできなくなったので、ディレクトリを削除した。クローンが何故かできなかったので、これは明日以降確かめる。
*話し合ったことを理解してもらえてるのか微妙で少し残念
*今のままだと確実に統合作業の時間ない、と焦ってるのは私だけでしょうか
*mainの作成とか、画像の切り替えや値の受け渡しのモジュールをやっている私としては、もう統合しながらやらないと厳しい。

<<<7/30 活動記録>>>
*講義以外だが、みんなで集まってやったので、ここに記載。
*自分のモジュールは一応完成。
**統合作業でのデバッグはまだなので、はやくやりたい。
**山口モジュールとは統合済み（一応問題はない）
*細かな修正を明日以降行う。
**統合作業はmainを作った私の役目でもあるので、同時進行で
**あと２日でなんとか...

<<<7/31 活動記録>>>
*戻るボタンの実装
**前のやつはページの遷移だったので簡単だったが、中間後に話し合った結果、画像の入れ替えに変わったので対応
**画像の変更は実装済み
**誘導光のモジュールはまだなので、確認できていない
*細かなバグの修正
**cssの調整
**mapサイズが変わらないバグの修正
**検索フォームの出現位置の調整

<<<8/1 活動記録>>>
*マップのサイズが変わらないバグの修正
*サイトのヘッダー位置調整
*統合作業にてライブラリ？によって自分のモジュールが,,,
**ライブラリは諸刃の剣でした
**ライブラリを使うときは自分で説明できるようになってから
*一応完成形には近づけた
**妥協もうまくいかないモジュールもあった
**一応それなりには動くし、もちろん中間よりはよくなっている。
*cssとjavascriptの使い分けも大事ね

<<<8/2 活動記録>>>
*最終確認とその他ページの作成

<<<8/2 最終発表と感想>>>
*1班
**中間発表ですごいことはわかっていたが、最終発表ではさらに磨きがかかっていて、世の中に出回っているゲームと遜色がないと感じました。イラストもすごいし、ストーリー、システムも圧倒的でした。すごすぎて言葉がでてきません...

*2班
**1班と同じ音ゲーでした。ノードの動きやあたり判定は特にバグがなさそうで、他の難易度や他の音楽でも実演して、比較してみたかったです。

*3班
**シューティングゲームで、敵を倒したシーンや自分が敗北したシーンなども実演で見せて欲しかったです。ミニゲームへ切り替わるところは面白いと感じました。

*4班
**音ゲーで、一曲のみの実装ということでしたが、実演上では不具合はなく、成功画面や失敗画面の表示、スコアの表示も良かったです。DATA機能やキャラアイテムの購入画面、キャラのきせかえ（ゲーム画面への反映）は面白い機能でした。

*5班
**ウィジェットの作成で、webスクレイピング,Python,Djangoなど色々使っていて大変そうだなと思いました。実装されていた機能も色々あってよかったです。背景やボタンの色の設定もいいですね。

*6班
**unityによる３人称視点のゲーム。マップ、モデルの精度、キャラの動き方など丁寧に作られていてよかったです。他のステージの紹介とか、攻撃をうけるシーンもあるそうなので、みたかったです。

*7班
**音ゲー。サウンドが綺麗(自作らしい、すごい）で背景とかデザインも凝っていて個人的には好きなタイプの音ゲーでした。言語切り替えや隠し要素も面白かったです。

*8班
**脱出ゲームを作って遊ぶという変わったゲーム。中間発表の時からいいアイデアだなと思っていました。鍵とか箱を関連付けたり、ユーザーが実際に色々設定して、ゲームを作れるのは面白いし、完成していてすごいと思いました。

*9班
**私達のグループと似たようなマップ。マップの表示は４号館のみで、イベント情報の表示などはこっちでできなかったのですごいと思いました。

*10班
**unityによる格闘ゲーム。ユーザーによる対戦型で3Dで面白かったと思います。当たり判定はモデルがすり抜けているのが気になりましたが、ダメージとかは問題なく出ていてよかったです。

*11班
**2Dの対戦型アクションゲーム。CPがランダム設定されていて、ユーザーのキー入力によって相手の動きが変わるのもすごいなと思いました。。

*13班
**ミニゲーム要素の組み合わせで、移動や当たり判定はしっかりしていたが、直前の仕様変更で動かない部分が出てしまったらしい。各要素は面白いところがあってよかったです。

<<最後に終わってみての感想>>
　ここには忖度なしで感想を述べたいと思います。中間まではモジュールわけもままならず、javascriptをほとんど使わずにhtmlとcssのみで実装していました。ただ、これでは意味ないし動的にするにはjavascriptの方がよいと思ったので、htmlはmainだけを使い、mainに無駄なことは書かないようにしようというふうに決めました。DOMはかなり使用しました。私のモジュールのほとんどは自分で作ったものです。一部はライブラリを使用していますが、他のモジュールに影響を及ぼさないように、理解をして使うように気をつけました。
((br))
　自分の作ったものは基本的にこの班Wikiの上の方に記載してあります。変数（ID）の受け渡しとか関数の使い方とか単体モジュールではほぼ完璧な動作をみせました。私と山口くんのモジュールは早めにできたので統合作業も早くでき、またお互いに影響を及ぼし合う部分がほとんどなかったのでうまくいって感動しました。この調子で全部の統合がうまくいけばいいなと思ってましたが、全てのモジュールが統合作業に入ることができたのが前日の夕方で、ImageMapsterというライブラリががっつり他のモジュールに影響を及ぼし、デバッグ作業、修正作業は地獄でした。このライブラリをちゃんと理解している人がいなく、直すにも直す場所がいまいち分からない、けれど無いとツールチップや光らせることができない、で泣く泣く私のモジュールを色々変更をかけたのですが、間に合わず...。色々手伝ってくれた人には感謝ですが、全モジュールの統合作業はもっと早くしなければならなかったし、ライブラリを使うときは完璧に理解してどう作用するのか説明できるレベルじゃなければならないことは後悔とともに大きな経験でした。
((br))
最後に投票で２位になることができたし、TAの評価も割と高かったようで、周りの方々にも少しは評価されるものができたのかなと思いました。副班長なのに色々口出しをしたりしてしまいましたが、班員の協力で最後、形にすることができてよかったです。頂いたクオカードはグループの打ち上げに使わせていただきます。

<<リンク先>>
*[[12班のWiki|19::gr12]]
*演習用に作ったホームページっぽいやつ<
>>{file:///home/h29j/h29j012/csd/jssample/practice/home.html}>
↑このリンクはもう使えません。sonota.htmlを作る際に使いました。

Tag:

Attachment

New: append-tag

(download: 209 bytes, at 2019/04/12 16:22:44 <frozen> )
(download: 406 bytes, at 2019/04/19 15:44:01 <frozen> )
(download: 480 bytes, at 2019/04/19 16:20:03 <frozen> )
(download: 789 bytes, at 2019/05/10 16:29:33 <frozen> )
(download: 819 bytes, at 2019/05/10 16:31:07 <frozen> )
(download: 1137 bytes, at 2019/05/17 16:00:21 <frozen> )
(download: 1321 bytes, at 2019/05/24 16:07:18 <frozen> )
(download: 1444 bytes, at 2019/05/24 16:12:02 <frozen> )
(download: 1839 bytes, at 2019/05/31 18:07:04 <frozen> )
(download: 2520 bytes, at 2019/06/12 14:42:44 <frozen> )
(download: 2568 bytes, at 2019/06/12 15:03:03 <frozen> )
(download: 2568 bytes, at 2019/06/12 15:03:35 <frozen> )
(download: 2749 bytes, at 2019/06/12 15:07:59 <frozen> )
(download: 3640 bytes, at 2019/06/14 16:16:00 <frozen> )
(download: 3742 bytes, at 2019/06/20 12:15:56 <frozen> )
(download: 4602 bytes, at 2019/06/21 15:52:40 <frozen> )
(download: 4632 bytes, at 2019/06/28 17:06:44 <frozen> )
(download: 5208 bytes, at 2019/06/29 10:34:18 <frozen> )
(download: 5576 bytes, at 2019/07/05 16:09:03 <frozen> )
(download: 5644 bytes, at 2019/07/05 16:09:38 <frozen> )
(download: 7713 bytes, at 2019/07/12 14:01:23 <frozen> )
(download: 7824 bytes, at 2019/07/12 14:04:51 <frozen> )
(download: 7824 bytes, at 2019/07/12 14:07:04 <frozen> )
(download: 8365 bytes, at 2019/07/12 15:23:44 <frozen> )
(download: 8495 bytes, at 2019/07/12 15:30:15 <frozen> )
(download: 9170 bytes, at 2019/07/19 15:35:37 <frozen> )
(download: 9724 bytes, at 2019/07/30 08:56:30 <frozen> )
(download: 9959 bytes, at 2019/07/31 11:22:16 <frozen> )
(download: 10708 bytes, at 2019/07/31 14:45:13 <frozen> )
(download: 10828 bytes, at 2019/08/01 09:24:14 <frozen> )
(download: 11271 bytes, at 2019/08/02 02:18:11 <frozen> )
(download: 12102 bytes, at 2019/08/02 13:36:25 <frozen> )
(download: 12632 bytes, at 2019/08/02 13:52:55 <frozen> )
(download: 12752 bytes, at 2019/08/02 13:58:01 <frozen> )
(download: 13283 bytes, at 2019/08/02 14:18:27 <frozen> )
(download: 13973 bytes, at 2019/08/02 14:41:20 <frozen> )
(download: 14619 bytes, at 2019/08/02 15:07:15 <frozen> )
(download: 14897 bytes, at 2019/08/02 15:15:21 <frozen> )
(download: 15762 bytes, at 2019/08/02 15:24:19 <frozen> )
(download: 15877 bytes, at 2019/08/02 15:34:47 <frozen> )

Edit

19::gr12::葛城玲弥

Attachment

Syntax Help

URL Link

Page Link

Image or Attachment

Text Decoration

Special Letter

Headline

Itemize

Enumerate

Table

Description

Quotation

Preformatted text