ほけん相談SNS『ほけんとーく』を作ってみた

#はじめに

このサービスをチームメンバーと一緒に開発しました。
これからサービスを作りたいという人に少しでも参考になれば幸いです。


###自己紹介
現在２４歳、都内の文系大学を卒業して、金融企業に務めております。
２０２０年８月にプログラミングスクールに通い始め、プログラミングの基本を勉強いたしました。

#「ほけんとーく」とは
保険の悩み共有WEBアプリ「ほけんとーく」です。

保険に対する悩みを投稿することで、様々なユーザーからアドバイスをいただき解決のヒントとなるWEBアプリです。また、悩み投稿とコメントを共有することで、他のユーザーの悩み解決のヒントとなります。多くの人に見られたくない悩みは2人だけのチャット機能で相談することができます。

このアプリが目指すことは、ユーザーが保険の悩みを共有して①解決のヒントや、②安心感、③考えるきっかけ　以上のようなものを得ることです。
（直接保険営業マンとマッチングすることや、WEB上で保険の成立を目的とはしない）
![og.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1050579/b5a21daf-e6e9-0ba8-b236-8f8ec56caf9c.png)

#URL
[ほけんとーく](https://hoken-talk.net/)
※スマホの場合は、ホーム画面に追加することを推奨しております。
※WEBアプリのためインストール不要

#開発のきっかけ
発案者が保険会社で代理店営業を行なっていた際の経験をもとに、以下の理由でサービスの開発に至りました。
①保険に興味はあるけど、ほけんの窓口だと無理な保険を勧められそうで不安。
②保険加入者の多くは会社の利益を優先する営業マンより、利益を求めない知人に勧められることがきっかけ。
③営業マンではなく、一般の人が保険に対して意見交換する場がない。
④世に似たサービスがなかった。

#使用技術/使用ツール
php7/Laravel5.5 HTML5/CSS/Bootstrap/javascript
mysql
git/GitHub/Linux
slack/trello/調整くん/diagrams

#ER図
![ER.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1050579/66584a81-172b-c66a-c68a-ec24094bc9b9.png)


#操作方法
##全ユーザー共通（ログイン状況を問わない）　
①ホーム画面から悩み投稿の一覧を確認することができる。　
![スクリーンショット 2021-09-09 0.19.34.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1050579/64f21d81-dedd-37c5-3643-a698e66bbc98.png)

・左上のボタンをタップするとホーム画面に遷移します。
・各ページに10投稿まで表示しております。
・検索窓があり、興味がある投稿に絞って投稿を探すことができます。

②投稿一覧ページから投稿をクリックしていただくと、悩み投稿に対する解決の提案を確認することができる。　
![スクリーンショット 2021-09-09 0.21.34.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1050579/30a0c3a0-19eb-a7be-f016-47853c92a652.png)

③ユーザー名をクリックしていただくとプロフィールページに遷移して、ユーザー情報を確認することができる。　
![スクリーンショット 2021-09-09 0.22.39.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1050579/08672a45-2422-9887-1d82-87d33441324b.png)

④メニューバーからランキングページに遷移して、週間提案コメントランキングと、週間ユーザーランキング（どちらもコメントに対するいいねの数による）　
⑤お問い合わせページから運営に問い合わせることができる。
![スクリーンショット 2021-09-09 0.24.01.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1050579/f9b2b47e-b6ac-e8bc-d52a-d7bb26b156a0.png)
※いただいたお問い合わせは、管理者までメールと管理側のページで確認できる。

⑥禁止事項ページに遷移して禁止事項の一覧を見ることができる。

##ログインユーザーのみ　
①悩み投稿ページに遷移し、悩み投稿を行える。（削除と編集も可）　
![スクリーンショット 2021-09-09 0.20.21.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1050579/57363ed2-aee2-f00e-bc7e-ebaf8c61a11d.png)

②ログインユーザーのプロフィールページにてプロフィールを編集することができる。　
![スクリーンショット 2021-09-09 0.34.08.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1050579/55e3faaa-b7b9-f55d-db06-8b2626288cd8.png)


③他ユーザーのプロフィールページからフォローとフォロー解除することができる。　
④各ユーザーのプロフィールページからフォロー一覧ページに遷移することができる。　
⑤各ユーザーのプロフィールページからフォロワー一覧ページに遷移することができる。　
![スクリーンショット 2021-09-09 0.26.03.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1050579/539903f2-28ed-b8e2-547a-8201fc2b43c8.png)
※フォローするボタンを押すことによってフォローすることができます。

⑥他ユーザーのプロフィールページからチャットページに遷移し、個人チャットすることができる。（1度チャットを行ったユーザーはチャット相手選択ページに表示されます）　
![スクリーンショット 2021-09-09 0.27.22.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1050579/89af527c-d373-05db-a454-15b8ddf68e0f.png)

※自身の発信したチャットについては削除と編集をすることが可能です。
　　チャットの右下の青いボタンを押すことで編集する。赤いゴミ箱ボタンを押すことにより削除が可能。

⑦悩み投稿に対してコメントをすることができる。(削除と編集も可）　
⑧コメントに対して「いいね」をすることができる。　
![スクリーンショット 2021-09-09 0.28.18.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1050579/8747df47-b213-9228-ce49-3732f27b28b2.png)

⑨フォロー者の投稿とコメントを一覧で見ることができる。
![スクリーンショット 2021-09-09 0.26.46.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1050579/f48704f9-ba09-55c0-9d8c-ac5a52f2b113.png)

⑩パスワードを変更できる。
⑪プロフィールページから家族が加入している保険の情報を追加できる。
![スクリーンショット 2021-09-09 0.29.13.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1050579/c316cf22-dddd-6497-459c-2a8297d0017d.png)


　※ご不明点はメニューバーから遷移できるお問い合わせページからお願い致します。　
　※禁止事項を必ずご確認いただいた上でのご利用をお願いいたします。

#ポイント

###悩み投稿画面の設計

悩みを抱えているユーザーが少ない負担で最適な解決方法が見つかるように、投稿時にアドバイスするユーザーが最低限知りたい内容を盛り込む設計にしました。　

具体的には、ユーザーが悩み投稿をする画面で以下のような設問を設定しました。
「どんなタイプの悩み？」「誰の悩み？」「興味のある保険はなに？」(回答はすべてチェックボタンのため回答しやすいです)
これらの設問に回答いただいた上で投稿内容をみることにより、他のユーザーが悩み解決につながる適切な回答が出来ると考えます。

ファイナンシャルプランナー（FP）やライフプランアドバイザー（LPA）が保険の提案、保険の見直しをする際に、多くの質問をして情報を聞き出し出します。その上で、個人ごとに最適なプランを設計いたします。　
そのため、投稿時に多くのFP、LPAが知りたい最低限の内容を盛り込むことで、悩みを抱えているユーザーが少ない負担で解決に繋がりやすい設計にしました。　

###保険の内容に特化したプロフィール機能の設計

アドバイスするユーザーが悩み投稿からだけでなく、悩み投稿ユーザーの背景を汲み取れるような設計。また、実際に対面で話したいとなったときに会える距離なのかが分かるために活用されることを見込んで作成いたしました。

具体的には、　プロフィール画面に以下の情報を盛り込みました。
・年齢
・お住みの都道府県
・家(例、持ち家の一軒家、賃貸のマンション)
・家族構成
・家族が加入している保険
これらの情報を用いることで最適な解決方法が提案できると考えます。
例えば、お子様がまだ小さく、この都道府県は物価も高いから、これくらいの生命保険が必要かな〜と考える事ができます。

#開発で苦労した点

・メンバーの目線あわせ
私が作りたいものをメンバーに共有することに時間がかかりました。
特に共有するために作成したDB設計や、仕様書、ページ遷移表は時間が大変かかりました。
それ以外にも、git開発のルールを共有、コーティングルールの共有、日時のslackの連絡。週次のZoom会議などで意思統一して開発を進めていきました。
結果、細かい目線合わせをすることにより、サービスが良い方向に繋がりました。
優秀なメンバーに心から感謝しております。

・DBのカラム名を変更した際のファイルの修正作業
DBのカラム名が適切でない時に修正作業に苦労しました。様々なファイルに影響を与えていたため、手作業だと完璧に行えない可能性があり方法を模索しました。その時にgrepコマンドの使い方を知り、使いこなし修正できたことが勉強になりました。

[grepコマンドを使いこなす方法](https://qiita.com/yagiryu/items/6128ad998560510be5de)

#今後の計画
・使っていただくユーザーを増やす　
・非同期通信
・ランキング機能のパターンを増やす（月間ユーザー、月間コメント）　
・WEBサイト上にLPAによるブログ作成　
・pwa化　
・スマホアプリ化　
・チャット機能の改修