# テーマ：おうち時間
## ほっぴー
- 人との距離感つかみづらい問題
- 需要が増えた必需品(マスク、消毒液など)買いにくい問題
- オンラインだと人の感情分かりにくい問題(空気感?)
- 人類(一部を除いて)運動続かない問題
- 暇な時間に何かしたいけど何すればいいかわからない問題
- 一人でできることに限界感じやすい問題
- 高齢者(の特に先生)、資料作るの難しそう問題
- コロナで成功している人の話、実はあまり知らない問題

## ほどた
- コロナ
- リモート飲み会
- ゲーム
- 芸能人によるyoutube
- 一人
- 不規則な生活
- オンラインライブ
- 回線工事が集中する
- デリバリーサービス
- 家でやれること尽きてきてそろそろ限界説
- 個人的には影響ほぼなし

## みっちー
- ギリギリ時間に起床
- 直接の交流の機会が少なくなる
- 運動不足になる
- 趣味の時間が増える（？）
- 全員が全員快適な通信環境とは限らない
- SNS等を見る時間も増える
- 消費が極端に増える（又は減る）

## ぷれーん
- ゲーム
- 課題におわれる
- 生活リズム
- だらだら
- なにをするのにも回線ゲー
- 飽きる
- 周りの人と話すことがなくなる
- ゴミが増えた
- 授業の質()

## 深めていきたい話題
- 人と人との関係
- 回線
- 運動関係
- 必需品買いにくい問題
- 外見気にしない問題
- デリバリーサービスなど、広まってない部分はひろめられる工夫
- 暇な時間に何かしたいけど何すればいいかわからない問題
- 民度が不安
- 回線弱者大丈夫？？？

## 作っていくシステム
- 暇な人がターゲット
- 共通の話題で交流できるチャット or 掲示板的なもの？
- 交流のきっかけとしてお題を出したりも
- お題はルームのテーマに沿ったものが出る(遊んだり、運動したり、etc...)

## こんなんあったら良さそう
- ポイント制でアイテムもらえる的な
- チャットルームで使えるスタンプ的なもの
- ぱっとできるもの
- 短時間でできるもの(雑談とか)、長時間かかりそうなもの(ボドゲとか)
- コンテンツの分類分け
- UIはできるだけ簡単に
- 質問を3~5問位投げてそれに回答してもらい、システムが部屋を決める
## 具体的な仕様
- プラットフォームはスマホを想定
- 大学生・高専生をターゲット
- ネットリテラシーをある程度持っている学生を想定
- 部活ができなくなったり、気軽に遊びに行けなくなり、時間を持て余している学生をターゲットに
- 4~8人程度で話せる
- まずはチャットルームから
-
- 「低学年(特に1年生)の、周りに友達があまりおらずやりたいことが見つからなさそうな学生」の「時間を持て余している」という課題に対して「似たような興味を持ったユーザーとチャットやミニゲームなどをできる場所」を提供するサービス
### 使用する言語
- フロント

## 担当分け
- PO...山縣帆高
### フロントエンド
- ほっぴー&ほどた
### バックエンド
- みっちー&ぷれーん

## アプリのイメージ
- ポップな感じで

## リンク
Figma:https://www.figma.com/file/2VqivTBFM8aHno1mNI4nuO/2020-Cteam?node-id=0%3A1

## アプリの名前決め
### アプリのイメージに属するワード

#### ほっぴー
- 暇
- 共有・シェア
- 若い世代
- チャット
- 時間がある
- 知らない人
- 楽に
- ゆるく
-
#### ほどた
- 暇人
- 雑談チャット
- ミニゲーム
- 知らない人と
- いつでも
- スマホでできる
-
#### みっちー
- おうちじかん
- 交流
- 共有
- 学生
- 暇つぶしに
- 簡単に始められる
- どこでも
- 繋がる
-

#### ぷれーん
- チャット
- 大学生
- 暇
- 簡単
- 気軽に
- 雑談

### 共通する要素
- 暇
- 学生
- チャット
- つながる
- 知らない人

#### 良さそうな名前案
- 「暇な人」を「繋げる」→ヒマリンク
- 「学生」の「チャット」する場所→がくちゃ
-

## 発表について
### ざっくりした発表の流れ

1. 開発の経緯
2. ビジョン
3. アプリの紹介
4. デモ
5. 開発に使った技術

#### ざっくりした発表する内容(カッコ内は発表目安時間)

- 開発の経緯(2分)
- テーマは何だったか
- どうしてこのアプリを作ろうと思ったか
- ビジョン(30秒)
- 「低学年(特に1年生)の、周りに友達があまりおらずやりたいことが見つからなさそうな学生」の「時間を持て余している」という課題に対して「似たような興味を持ったユーザーとチャットやミニゲームなどをできる場所」を提供するサービス
- アプリの紹介(2分30秒)
- アプリ名の由来
- どんなアプリか
- 使い方
- こだわった点
- 推奨実行環境
- デモ(1分)
- リンクを紹介して使ってもらう or 画面共有で使ってる様子を紹介
- 開発に使った技術(3分)
- サーバー側の実行環境は何か
- バック側の話
- フロント側の話
### page1
それではCteam、開封厳禁による発表を始めます。
### page2,3
今回は、開発の経緯　解決したい課題　ビジョン　アプリの内容　デモ実演　使用技術　　　
　今後の展望といった順番で話していきたいと思います。
### page4
初めに開発の経緯について話します。
### page5
今回のアプリ開発のテーマはおうち時間の問題改善でした。
そこで、チーム全員でおうち時間で思いつくものをいろいろ上げていきました。
その中で私たちが注目したのは
「家に居すぎて、別にやりたくないけど惰性でゲームやってることがある」という意見ものでした。
皆さんの中にも暇だけどやりたいことがない人、別にやりたいわけじゃないけどやることないからゲームやってる、といった経験ある方、いらっしゃるかと思います。
私たちはこの状態の人が、このコロナの影響で増えていると考えています。特に学校に入ったばかりの大学１年生、新入生に増えていると考えました。
### page6
根拠として、まず大学１年生は新しい環境のため近くの友達は作りにくいというものがまず挙げられます。
さらに、車の免許が取れるようになったばかりで、免許を持っている人が少なく、友達のいる地元や感染リスクの少ない場所に出かけることも難しいと考えられます。
なので、こういった状態になっている人が多いと私たちは考えます。
そこで私たちはペルソナを大学一年生に設定し、どのような解決方法があるかを考えました。
### page7
そこで、不特定多数の人とチャットすることができれば暇な時間を過ごさずに済むのではないかと考えました。
また、複数人で簡単なゲームができればより時間をつぶすことができると考えました。
### page8
以上をもとに私たちはアプリの開発ビジョンを次のように定めました。
「低学年(特に1年生)の、周りに友達があまりおらずやりたいことが見つからなさそうな学生」の
### page9
「時間を持て余している」といった課題に対して
### page10
「似たような興味を持ったユーザーとチャットやミニゲームなどをできる場所」を提供し、やりたいことを見つけてもらうサービスとなりました。

/**ここでほどたさんにバトンタッチ**/

### page11,12
ここからいよいよアプリ自体の説明をしています。
(まず説明の前にデモを見てもらおうと思います。)

まず、本アプリのタイトルにこめた意味を紹介したいと思います。
### page14
このアプリのタイトルはジー、イー、ティーでGETといいます。
○○さん、GETのそれぞれにどんな意味があると思いますか？
さすがです。素晴らしい回答をありがとうございます。ただ、残念ながら正解ではありません
### page15
正解は、それぞれ事態に意味はありません (は？？？？？)
### page16
もちろんGET自体には意味はあります。
### page17
ユーザーにやりたいことを見つけてほしい、というビジョンから連想されたチームの思いから考え、タイトルはシンプルなものがよいという理由から、ユーザーにやりたいことをGETしてほしい、そこからGETと名付けました。
これをデザインの観点から大文字でアプリに入れることになり、その結果、それぞれに意味がありそうに見えたのでよっしーさんならいいアイディアがあると思い質問させていただきました。

### page13
そろそろみんなさんアプリを触ってみたくなりませんか？
この表示されているQRからスマホでアクセスしてみてください。
もしQRコードが読み込めない人や、今手元にスマホがない人はチャット欄のURLからアクセスしていただき、F12でスマホ画面にしていただければ同じ体験ができると思います。

そろそろ皆さんにもさわっていただき、アプリの良さを実感していただこうかなと思います
使い方の説明をしていきます。
まず、アプリの「話しに行く」ボタンを押していただくと、何問か質問が表示されると思います。直感でそれらに答えていただくと、あなたに興味のありそうなカテゴリが提案されます。チャットルームで使うハンドルネームを入力するとルームに入れます！ただし10文字以上の長い名前や空白などで入ろうとしても部屋に入れない設定になっているので気を付けてください。ルームに入るとログインメッセージが表示される思います。他の人が入退室をしても同じようにメッセージが教示されます。画面下側のテキストボックスより送りたいメッセージを入力しメッセージを送信します。今現在センシティブな内容のメッセージを制限する機能がついていないので、くれぐれも言動にはご注意ください…
もう満足!と思ったり他の部屋に行きたい!と思ったら画面左上の退出ボタンより退出してください。

/**ここでほっぴーにバトンタッチ**/

### page20
さて、お楽しみいただけたでしょうか、そろそろ説明に戻りたいと思います。
本アプリは先ほど説明したようにチャットがメインのアプリですが、ただ適当にマッチングさせチャットをするわけではありません。
簡単な質問に答えることにより同じようなトピックに興味がある人とマッチングし、そのトピックでチャットすることができます。これにより、初対面の人とも気軽に会話でき会話が弾むこと間違いないでしょう。
これが本アプリの最大の売りです。
### page20
さて、皆さん十分触れたと思うので、本アプリのこだわりポイントを説明していきたいと思います。
まずフロント側は先ほど説明した通り、デザインの面で使いやすさを意識しました。ボタンを少なくしたり、色をポップにしたり、各要素の配置をごちゃごちゃしないように意識したりしました。
また、トップ画面では縦スクロールでアプリの使い方を表示でき、さらにアニメーションで表示するなど、見やすさの中にも動的でかっこよく見せる要素が入っています。
### page20
バック側では、主にWebsocketを使って双方向通信のチャット機能を実装しました。
実装は1つのHTMLファイルですが、クライアント側で同じグループにいるメンバーからの情報しか表示しないようにしているため、複数のグループに分けているかのようにしています。
また、チャットと名前の部分では最低限HTMLタグをエスケープするようにはしています。H1で囲んでもそのままテキストで出力されます。~~クソデカ名前~~大きく名前が表示されることはありません。

/**ここでぷれーんにバトンタッチ**/

最後に、難しかった点と今後の展望について紹介したいと思います。
iPhoneを使用している時だけ切断時の判定がうまくいかずルームにユーザー情報だけ残ってしまうことがありましたが、既に接続が切れてメッセージを送信できなかったユーザーは消すことにしてなんとか動くようになりました。
グループで開発する際に、共同作業とタスクの割り振りが難しかったです。またお互いにどれだけ進捗が出てるかなど、フルリモートでの開発のコミュニケーションに関する部分が難しいと感じました。
### page25
今後の展望としては、ミニゲームの実装、スマホ横向きの対応、雑談のテーマをもっと増やす、Slackのスタンプ機能っぽいのを追加したい、部屋に1人しかいなかったときに自動返信Botくん的な機能を追加し、よりよいアプリにしたいと思います。
### page27,28,29
以上で私たちの発表を終わります。
ご清聴ありがとうございました。