「HTML5」カテゴリーアーカイブ

自己紹介 M2A120高橋太一

初めまして。ゲームWeb科の高橋太一です。

趣味は体を動かすこと全般です。草野球チームに所属しています。(探さないでください)

”あいうえお自己紹介”

た 食べ物は残しません(好きなものに限る)

か 海岸沿いによく出現します。

は 歯医者が好きです。(ジャンプが無料で読めます)

し 白色が一番好きです。

宜しくお願い致します。

2020年度 HTMLファイ部!サブテーマ一覧

1.Fujie Lab Webの構築(レベル:★★☆☆☆)
・卒業研究ふじえゼミの公式Webサイトを作成する
・これに加えて、ブログのカスタマイズやメンバ向けページの作成も行う

2.PHPを用いた動的なWebサイトの構築(レベル:★★★☆☆)
・PHPを用いて、データベースと連携したサイトを作成する
・参考:http://tanukikurage.fujielab.com/
・参考:https://fujinavi.fujielab.com/

3.フレームワークを用いたWebゲーム作成(レベル:★★★☆☆)
・enchant.js等のフレームワークを用いて、ブラウザ上で動作するゲームを作成する
・参考:http://bambi.fujielab.com/
・参考:http://marshmallow.fujielab.com/

4.WebAPIを利用したマッシュアップサービスの開発(レベル:★★★☆☆)
・Twitter API、Google API等を組み合わせた、新たなサービスを実現する

5.HTML5 + JavaScriptでスマホアプリ作成(レベル:★★★★☆)
・Monaca等を用いて、iPhoneやAndroidで動作するアプリを作成する
・参考:https://onsen.fujielab.com/

6.地域社会に貢献するコンテンツの作成(レベル:★★★★☆)
・Webの技術を用いた、地域社会に貢献できるコンテンツを作成する
・区役所や警察署からの依頼を受けたり、売り込みをかけたりする
・参考:http://www.city.sapporo.jp/ncms/shiroishi/shiro-kids/enjoy/index.html
・参考:http://www.city.sapporo.jp/ncms/shiroishi/chonaikai/
・参考:http://maruyamap.com/

7.Webに関する最新技術の研究(レベル:★★★★★)
・Webに関する最新技術を研究し、技術を応用した作品をつくる
・WebGL、WebVR、Progressive Web Apps、WebRTC等
・参考:http://hats1999.fujielab.com/
・参考:https://spectacular.fujielab.com/
・参考:http://jsdo.it/controller/
・参考:http://fujielab.com/saika/

8.その他、おもしろいもの(レベル:?????)
・おもしろければ、基本的に何でもOK!

9.【隠しテーマ】Spheroプログラミング(レベル:?????)
・参考:https://www.sphero.com/

最後の言葉

あんなに長かったのに過ごしてみると「もう終わってしまった」という気持ちのほうが強いのはなぜでしょうか?

1.取り組んだ内容

作ったものまとめ

今回はTOPページと地域詳細ページ全般を担当しました。

HTML、CSS、Javascrpt、jQueryで作成されています

(今になって考えてみればなんでPHP使わなかったんでしょうか?)

Google Mapは今回使いたくなかったので地図はすべて手書きです。後でも書きますが地図を細かく描かなかったのでとても大変でした。観光情報や写真あつめはほとんどやってもらったので頭があがりませんペコペコ

なんだかスクリーンショットの色が淡い気がするのは私だけでしょうかね

2.よくできたところ

じつはTOPページのクリッカブルマップと地域詳細ページの地図はレスポンシブ対応してます。ここだけは時間かけてやっちゃいました。クリッカブルマップのほうは一人じゃうまくいかなくてインターネットに頼りました。有志の方がscript作っていて感激です。地域詳細ページのほうは一人で頑張りました。都市ピンも画像の大きさに合わせて位置が変わるようにしてみました。(positionポチポチして相対位置とか絶対位置とかムキー!としてました。途中からとても楽しかったです)


またクリッカブルマップをマウスオーバーしたときに色が変わるようにしたかったのですができなさそうだったので一か所ずつマウスオーバーした際に色が変わった画像をつくりjavascriptで変えました。この画像があと五枚はあります

なんとか横着してやってみようとしましたがようわからない図形ができたのもあります。なんですかねこれ?

 

 

 

 

 

 

 

あとじつはファーストビューの動画なんかも作っちゃいました。画質と重さのバランスが。。。

3.うまくいかなかったところ

まず最初のコンセプトとテーマがぶれてしまったところです。最後に一番頭を悩ませました。しんどかったです

あとは実力不足で実装できなかった二点の距離測定機能は足したかったです。Google Mapはやはりすごいですね。

最後はデザインです。だんだん崩れてしまいました。計画通りにはいかないものです。

全体的に見通しが甘かったのが一番うまくいかなかったことですね

4.感想

なんだかんだ北海道のことをたくさん調べたのでやる前よりもたくさんの知識を得ることができました。詳細情報を載せるためにその町の出来上がりを調べたり歴史も知る必要があったので図書館にも行ってみたりと知識を得るために精力的に動けたと思います。このテーマでやってよかったです。

5.個人特定

まだ学校にいますM2A1 tukagawamizuki です。

最後の言葉

温泉同好会のコーディング担当です!

最後の言葉ということで一か月振りにブログにログインしました(笑)

取り組んだ内容

北海道温泉図鑑という、北海道内の温泉(○○温泉という名前の旅館とかじゃなくて湧き出てるお湯のほう)をまとめた図鑑をアプリ形式で作成しました。

図鑑だけじゃちょっと足りないかなと思ってもう一つ、温泉図鑑の問い合わせをスマホで確認できるように管理者用アプリも作りました。

この問い合わせ管理アプリはアプリケーションキーなどを変更すればなないちいちグラムの方たちの問い合わせもパーフェクトプロポーズの方たちの問い合わせも管理することができます。

 

よくできたところ

二つのアプリも正常に機能するところですかね(笑)

温泉の情報が全部載っているかはわかりませんが、アプリは動くけどアプリの作成だけに時間をかけすぎて2,3個しか温泉の情報が載ってないなんてこともなくたくさんの情報を載せて図鑑として見れるものにはできたと思います。

 

うまくいかなかったところ

もう少し時間があればその温泉に入れるホテルや旅館の情報のところにリンクをつけて、温泉に入るための料金やその他のサービスについてもまとめたページに飛ばせるようにしようと考えていたんですが、さすがにそこまでの時間は取れませんでした。

ほかにも現在地からその温泉までの地図も載せようと思いましたが、時間の関係上断念。。。

また機会があればできなかったところを修正や機能の実装などができればと思います。

 

卒業研究の感想

ゼミはほかの学科学年の人たちと複数人で開発するものだと思ってがちがちに緊張して挑んだんですが、実際にはみんな仲のいい人で固まって何する?と話し合い同じテーマでチームを組むので、緊張をして損をしたというか逆にボッチの心配をしてしまいました。

結果的には同じ学科の人と二人でチームを組んだんですが、開発担当とデザインその他担当という雑な振り分けのおかげで私が休むと開発が進まないというまあ自業自得なんですがアクシデントなども発生して、テーマは決まっているけどどういうアプリにするかという方向性も結構な頻度で迷走していたので、アイデア担当もいればもっとよかったなと思いました(笑)

就職後も少人数または一人での開発などが多くなるので、就職前のいい経験になったかなと思います。

 

温泉同好会 S科  知名玲奈