自由研究でSNSをつくろう！ フォローと気遣い編

自由研究でミニマムSNSを作る企画、今回は「フォロー」の仕組みを作っていきます。ユーザー同士の関係やコミュニケーションの基礎になる仕組みなので、なかなか気を遣うことになりそうです。

自由研究SNS(仮)

フォローの仕様について考える

「フォロー」そのものの仕組みはかんたんです。フォローする相手のIDをリスト化してサーバー上で読み書きするだけ。ちゃちゃっと作れます。

ただ、フォローに付随する周辺仕様については考慮すべきことがたくさんあるのでそう単純ではありません。「自分がフォローしている相手を他人に見られるのか」、あるいはフォローしたときやフォローを解除したとき「相手にわかるのか」などなど。SNSのポリシーのようなものを、この機会に決めておかないと、あとでめんどくさいことになりそうです。

これらの仕様は、基本的にはやればやればやるほど"オープン"になります。でもオープンにしすぎると、ユーザーとしては「しんどい」ことになりがちです。誰かをフォローしていることを批判されたり、フォローを解除したことが相手にわかると恨まれるかもと思って解除できない……といった具合です。

もちろん、オープンであることにはメリットもあります。自分がフォローされたら嬉しいですし、通知が届くことで相手に自分を知ってもらうこともできます。でもフォローされた嬉しさは解除された悲しさと表裏一体ですし、通知が届いているはずなのにリアクションがないと「無視された」という気持ちになってしまう人もいるでしょう。

結局、重きを置くべきは「プライバシーの尊重」ということになるのでしょうか。あと……

SNSなんかでやたら気を遣うのはいやだー!!（本音）

自由研究SNS（仮）には「ミニマムで行く」というコンセプトもあることですし、基本はできるだけクローズにしておいて、必要があればあとから「オープンにすることもできる」ようにすればいい、というスタンスでいくことにします。気遣いも、ミニマムにできるといいなと思います。

自由研究SNS（仮）のフォローの仕様

というわけで、自由研究SNS（仮）のフォローに関する仕様は、以下のようにすることにしました。簡素です。

・プロフィール画面からフォローできる。
・フォローすると、その相手を自分のフォローリストに追加する。
・自分のホーム画面でリストを確認できる。他人からは見えない。
・フォローしても解除しても相手に通知は届かない。
・相互フォローの関係はわかるようにする。

相互フォローの関係がわかるのは若干「プレッシャー要素」になります。とはいえ、これを認識できないと相互フォロワー同士でのみ使える機能（例えばダイレクトメッセージなど）を実装できません。なので、相互フォローの関係は表示することにしました。こういうのをあとから表示するように変えると「裏切り」になるので難しいところです。

つくってみた

プロフィール画面（ログイン中／他者を表示）にフォロー状態の表示とボタンを追加。

［登録］をクリックしてフォローし、表示が切り替わった状態。

ホーム画面にはフォローリスト（あれば）の表示を追加。

突貫作業のため見た目はめちゃくちゃ簡素ですが、なんとかできました！

まだフォローリストは相手の名前ではなくIDが表示されていますが、今後整えていきます。

さて、なんだかんだでけっこう要素が揃ってきましたが、それぞれのページが独立したままなのでページを行ったり来たりするのがたいへんです。

次回は、簡単なメニューを作りつつ、扱いやすいように全体のページ構成を整えようと思います。ついでに増えてきたコードの整理もしたいので、1週間程度間をあけてから続きを報告するつもりです！

（つづく）

参考ソースコード1 (profile.php/フォロー関連UI表示部)

    if($target_found==true and $login==1 and $target_me==0){
    //他者のプロフィール
        //フォロー状態を取得
        $answer=utFindListTarget($me_followlist,$target_user);
        if($answer==true){ 
            echo '・フォローしているユーザー　';
            $temp_href=$url_profile.'?/follow_off/'.$target_user.'/'.$token;
            $temp_title='解除';
        }else{
            echo '・フォローしていないユーザー　';
            $temp_href=$url_profile.'?/follow_on/'.$target_user.'/'.$token;
            $temp_title='登録';
        }
        utPrintButtonLike($temp_href,$temp_title);
    }

参考ソースコード2 (URLで指定されたフォローON/OFFコマンド処理部)

    //Extraコマンド処理
    if($login==1){
        if($extra_command[1]=='follow_on'){
            $go=true;
            //トークン比較
            if($extra_command[3]<>$token){$go=false;}
            //対象アカウント取得(小文字化)
            $temp_target=strtolower($extra_command[2]);
            if(utUserExists($temp_target)==false){
            //(対象アカウントが存在しない)
                $go=false;
            }
            if($go==true){
                if(utFindListTarget($me_followlist,$temp_target)==false){
                //(未フォロー)
                    //フォローリストに追加
                    $me_followlist[(count($me_followlist)+1)]=$temp_target;
                    //セーブ
                    utUserFollowListSave($account_id,$me_followlist);
                }
            }
            //ページ遷移
            header('location: '.$url_profile.'?'.$temp_target); //リダイレクト指定
            exit;
        }
        if($extra_command[1]=='follow_off'){
            $go=true;
            //トークン比較
            if($extra_command[3]<>$token){$go=false;} 
            //対象アカウント取得(小文字化)
            $temp_target=strtolower($extra_command[2]);
            if(utUserExists($temp_target)==false){
            //(対象アカウントが存在しない)
                $go=false;
            }
            if($go==true){
                if(utFindListTarget($me_followlist,$temp_target)==true){
                //(フォロー済み)
                    //フォローリストから削除
                    $i_line=0;
                    while($i_line<count($me_followlist)){
                        $i_line=$i_line+1;
                        if($me_followlist[$i_line]==$temp_target){
                        //(発見)
                            $me_followlist[$i_line]='';
                            break;
                        }
                    }
                    //セーブ
                    utUserFollowListSave($account_id,$me_followlist);
                }
            }
            //ページ遷移
            header('location: '.$url_profile.'?'.$temp_target); //リダイレクト指定
            exit;
        }
    }