starthome-logo 無料ゲーム
starthome-logo

わずか1行のコードで、Web制作が劇的に捗るサービスと連携し放題になる「StackPile」を使ってみた!

  • 2016年08月18日 20:01:00


stackpile-01
どうも、まさとらん(@0310lan)です!



最近は、Webサービスやサイトなどを制作する際に、ページの解析やユーザー行動の分析、チャットによるサポート、メールの配信…など、いろいろやることが増えてきました。



そこで、今回ご紹介するWebサービスを活用して、さまざまな「解析作業」や「機能追加」をお手軽に一元管理してみませんか。



【 StackPile 】

stackpile-02
HTMLファイルに、わずか1行のコードを追加するだけで、あとは専用の管理画面から多彩なWebサービスと簡単に連携することが出来るようになります。



必要が無くなったら、1クリックで「連携解除」も出来るので非常に便利ですよ!





使い方!

それでは、既存のWebページへ導入する手順を実際に使いながらご紹介しようと思います!





まずは、サイトにアクセスして「登録」ボタンをクリックします。

stackpile-03




すると、登録フォームが表示されます。

stackpile-04
ここで、「➀ユーザー名」「➁メールアドレス」「➂パスワード」を入力すればOK!(GitHubアカウントでも登録可能…)





次に、任意のプロジェクト名を入力します。

stackpile-05
これにより、例えばWebサイト別に管理を分けたりすることが可能になります。





続いて、1行のコードが発行されるので、これをコピーします。

stackpile-06




そして、WebページのHTMLファイル内にある「head要素」の最後に貼り付けます!

stackpile-07




あとは、コードを貼り付けたWebサイトのURLを入力して「VERIFY」ボタンをクリックすることで、ちゃんと認識できているかを確認できます。

stackpile-08
これで導入は完了です!





「Yes, let’s do it!」というリンクをクリックしてみましょう。



すると、管理画面が表示されて利用可能なWebサービスの一覧がチェックできます!

stackpile-09
Webページの解析に特化したサービスや、チャット機能、エラーチェック、マーケティングサポート、ユーザー行動の分析…など、とても多彩なサービスと連携できるのが分かります。





Webサービスを連携してみよう!

それでは、試しにいくつかのWebサービスを連携してみたいと思います。





例えば、さまざまな「シェアボタン」を生成してWebページに埋め込むことが出来る「AddThis」を連携してみます。

stackpile-10
(ユーザー登録は先に済ませておきましょう…)





「StackPile」の管理画面から、「AddThis」をクリックします。

stackpile-11




あとは、自分の「AddThis」アカウントの「ID番号」を入力して「ENABLE」ボタンをクリックすれば準備完了というお手軽さ!

stackpile-12




ちなみに、「ID番号」はAddThisの「General」ページに記載されているモノになります。(「ra-」は省略…)

stackpile-13




たったこれだけの作業で、例えば以下のようなサンプルサイトで…

stackpile-14




簡単に「シェアボタン」が表示されるわけです!

stackpile-15




さらに、チャット機能を簡単に追加できる「Drift」も連携してみましょう!

stackpile-16




こちらもID番号が必要なので、あらかじめDriftにて生成されたコードの中にある「ID」をコピーしておきます。

stackpile-17




あとは、IDを貼り付けて同じように「ENABLE」ボタンをクリックするだけで完了です!

stackpile-18




すると、ユーザーと対話可能な「チャット機能」が追加されているのが分かります。

stackpile-19
(Driftについての詳細はコチラ!)





Webページの解析でお馴染みの「Googleアナリティクス」も、トラッキングIDを入力するだけで適用完了です!

stackpile-20
このように、さまざまな便利サービスを必要なだけ連携できるうえ、ソースコードは一切変更しなくても良いのが大きな特徴と言えるでしょう。





ちなみに、連携した機能はクリック1発でいつでも「解除」可能です!

stackpile-21
その他、便利なサービスたち!

「StackPile」は、まだ新しいサービスですが、連携できるWebサービスはすでに60種近く存在します。





いずれもWeb制作&運用を強力にサポートしてくれるサービスばかりで、例えばユーザーへの「メール配信」をサポートしてくれる【 Aboardly 】があります。

stackpile-22
これは、「ユーザーが30日間ログインしてなかったら…」とか「ユーザー登録を済ませたら…」のように、独自のルール決めを簡単に作り、それに従って自動的にメールを配信してくれるようになります。





また、Web解析用に【 Crazy Egg 】も利用できます。

stackpile-23
主に、「ユーザー行動」について分析できるサービスになっており、ユーザーがどのように画面をスクロールしているかや、クリックした箇所、ユーザー属性などをヒートマップ状に可視化できるようになります。





他にも、Webページで利用しているJavaScriptのエラー可視化サービスとして【 TrackJS 】があります。

stackpile-24
いつ、どのようなエラーがどこで発生したのかをしっかりと記録してくれ、それによってどのようなユーザーに影響が出ているのかを自動で明確化してくれるサービスです。



早急な原因究明にも繋がるので、導入しておくと便利かと思います。



まだまだ優秀なサービスがたくさん存在しており、簡単に「A/Bテスト」を行うモノや、セキュリティを高めてくれるものなど、連携できるサービスを眺めているだけでも勉強になりますよ。





まとめ

最近は、特定の機能に特化したサービスが増えいていることもあり、便利な機能を持ったサービスをどんどん追加していると、いつの間にかソースコードが複雑化したり管理が大変になっていきます。



そういう意味でも「StackPile」を利用する意味は少なくないのではないでしょうか。



また、連携できるサービスは随時増えていくことになるので、今後の動向にもチェックしておきたいところ。



Webサービスやサイトを最小限のコードでパワーアップしたい方は、ぜひ一度トライしてみることをオススメ致します!





<参考>

「StackPile」公式サイト





written by まさとらん(@0310lan


    Loading...
    アクセスランキング
    game_banner
    Starthome

    StartHomeカテゴリー

    Copyright 2024
    ©KINGSOFT JAPAN INC. ALL RIGHTS RESERVED.