作業場所クチコミサイト「Concent-rate」

OVERVIEW

フレームワークの学習の前に、webサービスの基本機能がどのように作られているのかを学んでおきたいと考え、素のPHPで制作しました。コンテンツのCRUD処理をはじめとして、会員登録、ログイン、検索、いいね等の基本的な機能を備えています。

制作期間:約2ヶ月

GitHub URL:https://github.com/TsutomuOikawa/ReviewSite_personalPJ

※Laravelの学習を優先したことから、現状デプロイされておりません。
 キャプチャのみ末尾に載せております。


サービス概要・基本機能


1. 作業場所に適した施設を検索
ユーザーの口コミ評価をもとに、作業場所として適した施設を探すことができます。


2. クチコミ投稿 & 施設追加

会員登録後は、口コミの投稿と施設の追加ができるようになります。


3. お気に入り機能

私は作業場所は複数知っておきたいタイプです。そのため、お気に入り機能でストックしておくこともできます。



使用技術


・PHP
・JavaScript
・jQuery
・SQL

※PHPを選択した理由
・先人が多く調べながら進めやすいと考えたため
・求人が多く、かつ大手プログラミングスクールでRubyを習った方々と競合しないため


DB構造


こだわり


1. 検索項目の充実化と点数化
作業場所に求めるものは人それぞれなので、検索項目は複数用意し、複合的に検索できるようにしました。

  • エリア
  • 施設タイプ(カフェ・図書館・シェアオフィスなど)
  • 利用目的
  • コンセントや電源の有無、およびそれらの点数
  • 静かさ(集中できる度合い)の点数


2. 作業しやすさを星の数でわかりやすくスコア化 & 特徴をタグ化
口コミの投稿段階で集中しやすさを5段階で評価してもらうことで、
平均点を算出しやすくしました。
実装のイメージから逆算して良いDB設計ができた箇所だと思っています。



反省


・ディレクトリ構成
今回の制作では、PHPやSQLの基本を理解することを優先したため、各ページに関連するHTMLとPHPの処理がひとつのファイルにまとまっています。
後々の保守性を考えると、整えておくべきだったと考えています。


・冗長化
例えば検索機能を複雑化したことで、SQLのコードは複雑化してしまいました。
一度取得したデータに対して、foreach文を回してさらにデータを取得するといったケースもあり、冗長的で読みにくいと感じます。

↓一例です (GitHubリンク)

施設データを取得する上では多くのテーブルをJOINするため、データ量やアクセスが増えると重くなることが予想されます。

例えば、DBの施設テーブルに各評価項目の平均点を格納するカラムを追加しておき、夜中の時間帯にバッチ処理で更新する等の+αの処理、少なくともそれを見越したDBの設計ができるとかなり良かったのかなと思います。


・投稿インセンティブの設計

プログラムとは直接は関係ありませんが、ユーザーが口コミを投稿するためのインセンティブが設計されていません。
このサービスは「作業場所」を扱っています。これは「グルメ」等と異なり、
「お気に入りの場所だけに通う」&「人に教えたくない」という心理が働きやすいです。良い口コミを投稿しなかったり、お気に入りの施設を新たに追加しなかったりといった行動をとる可能性もあります。

サービス設計としては甘くなってしまったと思います。



今後追加したい機能

・掲載施設の充実化(スクレイピング等でリアルな店舗のデータを取得)
・SNSシェア機能
・前述のバッチ処理
・各施設のページに地図情報を掲載
・問い合わせフォーム



制作背景


突然ですが、集中できる場所って意外と見つからないものではないでしょうか?
あるいは、周囲の会話が気になって読書に集中できなかった経験はありませんか?

勉強や読書、仕事のためにカフェなどに行かれる方は少なくないと思います。私も外の方が集中できるので、読書や勉強のためによくカフェに行くのですが、場所選びは難しいですよね。

・テーブルが狭い
・近所の学生や高齢者の集合場所になっており、会話の声が大きい
・利用時間の制限がある、店員さんが席の譲り合いを呼びかけている

「作業をする場所」としての適性は、お店で過ごしてみなければわからない面があり、それを事前に知っておくのは難しいです。

なので、作りました。


「Concent-rate」は「作業場所」に関する口コミサイトです。
コンセントのある場所(作業場所)の口コミ評価(rate)を確認することで、集中して作業に取り組んでほしい(concentrate)という考えから名づけました。



キャプチャ


①トップページ


②コンテンツ検索ページ


③施設詳細ページ


ここまでお読みいただきありがとうございました!