「Social Pitt」を支える技術〜SNSマーケティングSaaSの開発と今後の展望〜

DX事業本部の長谷川です。

今回は、DX事業本部のグリーライフスタイル株式会社で提供している「Social Pitt（ソーシャルピット）」というサービスを支える技術についてご紹介します。

Social Pitt 紹介画像

Social Pittは、グリーライフスタイルにおけるSNSアカウント運用事業を効率化させるための内部ツールとして開発されました。

主に以下のような機能で運用チームをサポートしてきました。

社内の効率化をしていく一方で、業界をみると、当時はまだまだExcelやLINEで企業間のコミュニケーションをとっている企業は多かったため、このツールを他の企業に利用してもらうことでマーケティングのDXにつながると判断し、SaaS化していくことにしました。

SNSアカウント運用のツールとしてスタートしたSocial Pittですが、今ではUGC機能やクリエイター管理機能を追加し、 Eコマース事業者向けのマーケティングSaaSとして拡大しています。

コードは、以下のようにコア機能とアプリケーション機能でわけて管理されています。

Social Pitt 技術構成

Core

Coreの責務は2つです。

外部サービスとのI/OをCoreに集約することで、各Serviceにおいて重複実装することを防いでいます。

Serviceは機能ごとに独立したRailsアプリケーションになっています。

CoreのRubyクライアントを利用してデータを取得、認証もFirebase Authenticationを利用するために共通のRubyクライアントを利用しています。

Serviceを開発する人員は基本的に兼務はせず、それぞれがオーナーシップを持って担当プロダクトの開発に取り組んでいます。

ここからはSocial Pittで利用しているOSSの紹介とその選定理由について説明します。

Social Pittは、全てRuby on Railsで実装されています。技術スタックが統一になることで共有のgemが利用でき、実装工数の削減につながっています。

全てRails7で動いており、動的な表示にはStimulusやTurboを利用しているところもあります。 Turboは画面遷移時に意図せず不具合を生み出しがちで、まだ完全には使いこなせていません。

Social Pitt ダッシュボード

アカウントの運用の分析画面はVue.jsで実装されています。期間や並び順を切り替える毎に、Highchartsで実装されたグラフを描画し直します。

Social PittはSPAでは作成されていなかったのですが、グラフに関してはUX向上を目指し、部分的にSPAにし、日本で採用事例が多いVue.jsを利用しました。

UGC Social Pitt

SvelteはUGC機能のギャラリー表示の実装に利用されてます。 UGC機能はECサイトのLPにウィジェットとして埋め込み、CTR/CVRを計測しながら、LPのCVRを向上させることができます。

外部サイトで読み込まれるため、なるべく軽量で高速に動作するSvelteをフレームワークとして採用しました。

CSSのフレームワークはTailwind CSSを採用しています。今までは管理画面を作る際にはBootstrapを採用することが多かったのですが、 Railsが押していること、 Bootstrapよりも柔軟性があることを理由に選定しました。

コンポーネントを実装する際は、Tailwind CSSのコンポーネントを探して、一旦コピペしてきて、そこからアレンジするといったこともでき、時間の削減に貢献してくれています。

Social Pittの特徴として、外部サービスから多くのデータが溜まっていきます。今はそのデータを上手に活用できておらず、本来であれば機械学習を利用して付加価値のあるデータに転換できると考えています。

例えば、インフルエンサーをアサインする際には、インフルエンサーのフォロワー属性が重視される（女性インフルエンサーには必ずしも女性のフォロワーが多くない）ため、投稿内容を分析してフォロワー属性を推定するということも考えられます。

また、Socialリスニングで、自社商品のSNS上の反応はポジティブなのかネガティブなのか、どのような意見があるのか、をセンチメンタル分析でわかるようにするということも検討しています。

DX事業は、単なる業務の効率化に留まらず、データを活用して付加価値をつけることに価値があると考えており、今後チャレンジしていきたいと思います。