スマートデバイス急増! 企業が取るべき適切なweb対策とは? ·...

47
スマートデバイス急増! 企業が取るべき適切なWeb対策とは? ~ソリューションツールと今知っておきたい判断要素~ 株式会社クロス・コミュニケーション http://www.cross-c.co.jp/

Upload: others

Post on 10-Jul-2020

3 views

Category:

Documents


0 download

TRANSCRIPT

スマートデバイス急増! 企業が取るべき適切なWeb対策とは?

~ソリューションツールと今知っておきたい判断要素~

株式会社クロス・コミュニケーション http://www.cross-c.co.jp/

1

目次

5.実施にあたって

1.データで見る市場動向

2.市場環境とWeb対策方法

3.ツールの選定と開発

4.リリース後の対応

・変換ツールについて

・CMSについて

・アクセス解析について

2

データで見る市場動向

Market Trend

1.データで見る市場動向

2010 2011 2012 2009 2013 2014 2015 2016 2017

万台

2000

4000

6000

1000

スマートフォンの契約数と契約比率

出典:株式会社MM総研 スマートフォン市場規模の推移・予測(2012年3月13日発表)

2012年(3月末) ・契約数 2,522万台 ・契約比率 22.5%

<予測> 2014年50%超に

<予測> 2017年70%に迫る

2017年にはモバイル端末の契約比率においてスマートフォンが70%に迫り、スマートフォン主流の社会へ

3

1.データで見る市場動向

4

ユーザの増加と「スマ充」

スマートフォンユーザは3年間で3%→36%へ急増。 ユーザの約9割は「スマ充」を実感。利用内容も変化。

「スマ充」が約9割

ケータイの頃より 生活が楽しくなった

(スマ充)

89%

利用内容の変化

PCサイト 閲覧

SNS ミニブログ

動画共有 サービス

80

54 51

17 26

12

http://www.dentsu.co.jp/news/release/2012/pdf/2012036-0329.pdf

電通第50回モバイルユーザー調査

スマートフォンユーザが急増

1% 3% 14%

36%

2009.1 2010.1 2011.1 2012.1

1.データで見る市場動向

メディアへの接触状況

テレビ ラジオ 新聞 雑誌 パソコン (ネット利用)

携帯電話 (アプリ/ネット利用)

60

120

180

164

136

31 24 25

18 17 19

175

148

26 アプリ利用

ネット利用

53

70

フィーチャーフォンユーザ

スマートフォンユーザ

スマートフォンユーザーの携帯電話への接触時間が大きな伸びを見せ、メディアとしての重要性が高まってきている。

出典:株式会社D2C モバイル利用動向調査(2011年10月調査)

5

1.データで見る市場動向

シニア層のオンラインメディア接触状況

男女60~70代の36%がSNSを利用(n=5,452)。 PCからの利用が圧倒的だが、mobage、GREEなどはスマートフォンからの利用も目立つ。

6

利用者数(n=600) 利用デバイス(%)

(人) (%) PC タブレット スマート フォン

携帯電話 PHS

その他

Facebook 298 49.67 99.3 4.7 3.0 4.4 0.3

mixi 124 20.67 94.4 3.2 3.2 3.2 0.8

mobage 51 8.50 74.5 0.0 25.5 15.7 0.0

GREE 37 6.17 73.0 2.7 29.7 24.3 0.0

Twitter 251 41.83 96.4 4.8 4.0 3.6 0.4

Google+ 75 12.50 96.0 6.7 4.0 2.7 1.3

Q&A関連サイト 258 43.00 98.4 3.5 2.7 1.2 0.4

シニア向けSNS 80 13.33 96.3 3.8 1.3 0.0 0.3

スマートデバイスの利用

(n=5,452)

SNSの利用状況

利用している 36%

SNSの利用デバイス

※インターネット調査

(株)クロス・マーケティング「シニアのライフスタイルとSNS利用」に関する調査(2012.7)

7

P

Plan

Do Check

Act 市場環境とWeb対策方法

ツールの選定と開発 リリース後の対応

実施にあたって(まとめ)

本資料のテーマ

8

市場環境とWeb対策方法

P

D C

A Plan

2.市場環境とWeb対策方法

9

現在の状況

スマートデバイスが急速に普及

市場に多くのツールが氾濫

日進月歩のWeb技術(HTML5、CSS3、JQuery …)

デバイス仕様先行型の市場

・・・

適切な対応判断が難しい環境に

2.市場環境とWeb対策方法

10

スマートデバイスの登場と対策方法の変化

2010~2011年後半

■ 通信速度の課題

・3G回線が主流(7.2M~)

■ 端末(CPU)スペックの課題

ワンコア(600MHz~1Ghz)

デュアルコア(1.2G~1.5Ghz)

PC環境

画面サイズと共に、PCと通信面や 処理能力でスペック差がある。 このため、PCから変換するのは 多少難がある。

モバイルサイトからの変換 =◎

2012年前半~

回線速度:40M~100M CPU:2G~3.2GHz

■ LTEの普及

・iPhone5もLTE対応

■ スマートデバイスの増加

・タブレットが普及 ・Windows8の登場

■ 端末の処理速度が向上

・高スペック、高解像度の端末

■ ビジネスユースでの利用増加

・利用頻度が高まる

機能が向上し、ビジネスユース増。 通信環境も向上しつつあり、スマ ートデバイスが有力な情報入手方 法になりつつある。

マルチデバイス対策が必須の環境に

レスポンシブ Webデザイン

モバイル1st

新たなデバイス

カーナビ テレビ …

2.市場環境とWeb対策方法

11

マルチデバイス対策について

Webサイトをマルチデバイス対応にするには…

デバイス毎にWebサイトを用意 共通部分が少なく、高コストになりがち

1つのWebサイトで全てに対応 コストは下がるが、個別対応ができない

1,2のハイブリッドで対応 運用コストも軽減しながら、個別対応可能

デバイス(情報端末)が増え続ける現在、Webサイトに 求められるのは「ワンソース・マルチデバイス」

各種ツールや開発手法も ワンソース・マルチデバイス対応が主流に

CMS コンテンツ 変換

スクラッチ 開発

ワンソース・マルチデバイス

2.市場環境とWeb対策方法

12

対策方法

CMSの利用 スクラッチ開発 変換ツールの利用 1. 2. 3.

メリット

デメリット

・短期間

・ローコスト

・大量商品の表示 (ECの商品など)

・管理画面が充実

・開発基準が明確化

・コスト削減に寄与

・多機能化により、選定 が難しい

・設計が難しい

・(場合によって) スクラッチ開発よりも高コストとなる

・高コストになりやすい

・メンテナンスが容易

・自由度が高い

・運用ルールを反映させやすい

・メンテナンスがしにくくなる

特定メンバー・開発会社へ依存の可能性

・自由度が低くなりがち

・サービスの多様化で選定が難しい

・全て変換できない場合、 ハイブリッドでの設計が難しい。

2.市場環境とWeb対策方法

13

対策方法の選択

あたりまえですが・・・

要求把握と適切な対策方法を選定 することが大切。

変換ツール CMS スクラッチ

2.市場環境とWeb対策方法

14

対策方法の選択

ツールはどの程度活用できるのか?

変換ツール CMS

スクラッチ

15

ツールの選定と開発

P

D C

A

Do

3. ツールの選定と開発

16

ツールの利用

既存のPC(モバイル) サイトを活用

新規に構築を検討

変換ツールの活用

フルスクラッチ開発

CMSの活用

フルスクラッチ開発

CMSまたはスクラッチ開発 と変換のハイブリッド

3. ツールの選定と開発

17

ツールの選定

時間

コスト

変換ツール (自動変換)

CMS (オープンソース)

変換ツール (テンプレート)

CMS (プロダクト)

3. ツールの選定と開発

3. ツールの選定と開発

18

変換ツールについて

3. ツールの選定と開発

19

変換ツールの活用

✔ PCサイトorモバイルサイトを既に開発済みで、“急ぎで” スマートデバイスにも対応したい。

✔ ECサイトなどで、商品画像が大量にあるサイトのスマホ対応 ⇒ 商品ページのみ変換ツールを適用

✔ 開発コスト・期間を抑えたい

▼ 従来の変換ツールに対するニーズ

✔ テンプレートベースで複雑なデザインにも対応可能

✔ PCコンテンツからの変換が主流に

✔ コンテンツ編集などの管理画面も充実

✔ デバイス情報を認識して、適切な表示をサポート

▼ 現在の変換ツールの機能

3. ツールの選定と開発

✔ テンプレートベースで複雑なデザインにも対応可能

✔ PCコンテンツからの変換が主流に

✔ コンテンツ編集などの管理画面も充実

✔ デバイス情報を認識して、適切な表示をサポート

▼ 現在の変換ツールの機能

20

変換ツールの活用

✔ PCサイトorモバイルサイトを既に開発済みで、“急ぎで” スマートデバイスにも対応したい。

✔ ECサイトなどで、商品画像が大量にあるサイトのスマホ対応 ⇒ 商品ページのみ変換ツールを適用

✔ 開発コスト・期間を抑えたい

▼ 従来の変換ツールに対するニーズ

マルチデバイスに対応するための “とりあえず”のツール

3. ツールの選定と開発

✔ テンプレートベースで複雑なデザインにも対応可能

✔ PCコンテンツからの変換が主流に

✔ コンテンツ編集などの管理画面も充実

✔ デバイス情報を認識して、適切な表示をサポート

▼ 現在の変換ツールの機能

21

変換ツールの活用

✔ PCサイトorモバイルサイトを既に開発済みで、“急ぎで” スマートデバイスにも対応したい。

✔ ECサイトなどで、商品画像が大量にあるサイトのスマホ対応 ⇒ 商品ページのみ変換ツールを適用

✔ 開発コスト・期間を抑えたい

▼ 従来の変換ツールに対するニーズ

マルチデバイスに対応するための “とりあえず”のツール

ワンソース・マルチデバイス実現に向けた、 強力なサポートツールとしての存在

3. ツールの選定と開発

22

変換ツールが向かないケース

✓ PCとスマホそれぞれにオリジナルコンテンツがあり、レイアウト変更の頻度が高いサイト。 ⇒PCサイトの変更に伴い、スマホ側も変更が必要なため、別に作ったほうが運用しやすい。

✓ PCからの変換を行う場合で、PC側のサイトの作りに規則性が無く、変換テ

ンプレートの制作が大量に必要なサイト ⇒コストパフォーマンスが悪い。

✓ 大量アクセスがあるサイトでのASPサービス利用

⇒トランザクション課金のサービスもあるため注意が必要。

✓ 静的ページが多く、更新頻度の少ないサイト ⇒スクラッチ開発のほうがコスト安になるケースもあり、メリットを享受しにくい

3. ツールの選定と開発

23

CMSについて

3. ツールの選定と開発

24

CMSについて

✔ ツール毎に機能が異なるため、選定が難しい

✔ 処理が重い。大規模サイトには向かない。

✔ 自由度が低くなってしまう、カスタマイズにコストがかかる。

✔ 価格が高い、ノウハウが必要

▼ 従来のCMS(のイメージ)

✔ 従来の期待機能については、ミドルクラス以上はほぼ実装されている。

✔ 価格幅が広く、数万円~数千万円まで存在。

✔ 「分析」「キャンペーン」などを実装し、コンテンツ管理以上の機能を実装

✔ オープンソースのツール群がプロダクトに引けを取らないレベルまで進化。

▼ 現在のCMS

3. ツールの選定と開発

25

CMSについて

✔ ツール毎に機能が異なるため、選定が難しい

✔ 処理が重い。大規模サイトには向かない。

✔ 自由度が低くなってしまう、カスタマイズにコストがかかる。

✔ 価格が高い、ノウハウが必要

▼ 従来のCMS(のイメージ)

✔ 従来の期待機能については、ミドルクラス以上はほぼ実装されている。

✔ 価格幅が広く、数万円~数千万円まで存在。

✔ 「分析」「キャンペーン」などを実装し、コンテンツ管理以上の機能を実装

✔ オープンソースのツール群がプロダクトに引けを取らないレベルまで進化。

▼ 現在のCMS

導入したら便利なんだろうけど… いまいちメリットがつかめない。

3. ツールの選定と開発

26

CMSについて

✔ ツール毎に機能が異なるため、選定が難しい

✔ 処理が重い。大規模サイトには向かない。

✔ 自由度が低くなってしまう、カスタマイズにコストがかかる。

✔ 価格が高い、ノウハウが必要

▼ 従来のCMS(のイメージ)

✔ 従来の期待機能については、ミドルクラス以上はほぼ実装されている。

✔ 価格幅が広く、数万円~数千万円まで存在。

✔ 「分析」「キャンペーン」などを実装し、コンテンツ管理以上の機能を実装

✔ オープンソースのツール群がプロダクトに引けを取らないレベルまで進化。

▼ 現在のCMS

導入したら便利なんだろうけど・・ いまいちメリットがつかめない。

様々な機能を備えた、 Webサイト開発プラットフォーム

オンライン・マーケティングツール としての存在

3. ツールの選定と開発

27

オープンソースCMS

トレンド(流行)度

EC/コンテンツ提供 利用方法(傾向)

高 低

ニュース/コーポレート

3. ツールの選定と開発

ニュース/コーポレート

EC/コンテンツ提供/マーケティング

トレンド(流行)度

利用方法(傾向)

28

オープンソースCMS

Concrete5: 直観的な操作 近年注目度高

Wordpress: 世界で最も用いられているCMS 多様なサイトで利用

Drupal: オープンソースCMSアワード 2年連続受賞(’07,’08) ホワイトハウスのサイトでも利用

トレンドはGoogleトレンド 9/9時点を参考

3. ツールの選定と開発

29

Concrete5について

米国で開発後、当初は130万円程度のパッケージCMSとして販売。 その使いやすさからオープンソースソフトウェアとしてリリース。 日本語化も対応済。 2008年10月にはSourceForgeで「Project of The Mouth」を受賞。

バンプレスト社の「一番くじ」 交通新聞社 ・東京基督教大学 ・筑波学院大学 ・一般社団法人奈良県助産師会 ・ひょうご環境創造協会

公共期間&学校関連

・フランスベッド販売株式会社 ・GALLERY収納 ・車オークション.com

企業関連

利用事例:

≪注≫ 本利用事例は弊社開発事例ではなく、インターネット上の 情報などから抜粋したものです。

3. ツールの選定と開発

30

Concrete5について

海外での利用事例・・・

その他も多数。

3. ツールの選定と開発

31

Concrete5について

機 能

費用

安 高

Concrete5は元々有償製品のCMSのため通常のオープンソースCMS よりも機能が多い。 また領域構造化されたオープンソースのためカスタマイズが容易であり 機能増加(お客様の要望に沿った機能)が可能。 簡易

CMS

Concrete5

CMS (OSS)

CMS (プロダクト)

スクラッチ開発

3. ツールの選定と開発

32

Concrete5の特長

✔ Concrete5は元々有償製品であるCMSがオープンソースとなったため十分な 機能を持ち柔軟性がある。 ✔ Concrete5は大規模サイトでも利用されている。 ✔ Concrete5は機能が「ユーザ領域」「管理領域」など領域ごとに構造化された CMSで、領域毎にバージョンアップやパッチ対応ができるため、カスタマイズ 部分に影響を及ぼさない。 ✔ 対象となる領域のみでカスタマイズやアドオンが可能。

他の領域に影響を及ぼしにくい。

3. ツールの選定と開発

33

ツールの活用方法

多様化する デバイス

部分的にスクラッチ 更新頻度が高い画面 などにCMSを適用

どうしても こだわりたい

CMSと変換ツールのハイブリッド ⇒ECなどの大量のコンテンツ対応・・・

新規の開発で、 開発・運用を効率化したい

短期間で対応したい 一定のデザイン性を保ちたい

スクラッチ開発

CMSの活用

変換ツール

3. ツールの選定と開発

34

ツールの活用方法

多様化する デバイス

部分的にスクラッチ 更新頻度が高い画面 などにCMSを適用

どうしても こだわりたい

CMSと変換ツールのハイブリッド ⇒ECなどの大量のコンテンツ対応・・・

新規の開発で、 開発・運用を効率化したい

短期間で対応したい 一定のデザイン性を保ちたい

スクラッチ開発

CMSの活用

変換ツール

✓ ハイブリッドでの開発も可能 ✓ ツールが多機能化 ⇒ 自社ニーズに合わせて正確な選定を! ✓ スクラッチ開発のほうが安価な場合も ✓ オープンソースCMSが進化 ⇒ 商用でも十分利用可能なレベル

3. ツールの選定と開発

35

事例① カプコン様 「モバイルカプコン」「モンハン部」

公式無料ポータルサイト及び大ヒットシリーズ「モンスターハンター」のファンサイトで、幅広いデジタルコンテンツを展開。

■モバイルカプコン

サービス提供時期:2009年2月~

サイトURL:http://mcap.jp/

提供サービス

提供デバイス

モバイルサイトを運用する上で必要な基本機能が全て実装されたCMSを提供。

ワンソースの登録で、フィーチャーフォン、スマートフォン、いずれも簡単に更新が可能。モバイルから、多くの会員を集客することに成功。

1ソースでiPhone、 Androidに対応

■モンハン部

サービス提供時期:2009年4月~ サイトURL:

http://mcap.jp/g/monhanbu/

3. ツールの選定と開発

36

事例② マイナビ様「マイナビ看護学生」

志高き看護学生と地域医療サービスの向上をはかる医療機関との“出会い”を創出する

総合情報サイト

サイトURL:

サービス開始時期:

PC/モバイル:2011年2月

スマートフォン:2012年2月

http://nurse.mynavi.jp/

提供サービス

提供デバイス

看護学生と医療機関を応援する為に誕生した「マイナビ看護学生」のPC・モバイル・スマートフォンの設計開発及びシステム保守で徹底サポート。

37

リリース後の対応

P

D C

A

Check

4. リリース後の対応

38

アクセス解析について

4. リリース後の対応

39

Web解析の悩み

・数値データの加工や、解析に膨大な時間と手間がかかる・・・ ・解析結果の数字を見ても、売上アップの具体的な改善策に結びつかない・・ ・数字だけでは見えてこない、サイトを訪れるユーザーのインサイトが知りたい・・・ ・テキストやバナーがどれだけ注目されているのか分からない・・・ ・サイト全体の指標に合わせて、コンバージョンしたユーザーの動線が見たい・・・

数値系解析ツール

・コストをかけて導入したが、データしか取れず、結局改善につながらなかった・・・ ・単純なビジュアルだけのヒートマップでは、うまく活用できない・・・ ・ヒートマップだけの機能にコストをかけるならGoogle Analyticsだけで十分か・・・

・導入費用が高くて、実施できない・・・ ・導入してもサンプルの人数が少なく、信頼できるデータなのか判断できない・・・

ヒートマップ解析ツール

アイトラッキング

4. リリース後の対応

40

解析ツールについて

・アプリ

Appvisor ・会員DBとの連携するなどのカスタマイズが可能なため、 自社データとの比較を行なうことが可能。 既存システムとの連携を行いたいクライアントにはお奨め。

wellout ・サーバサイドのデータ連携し、レポートのカスタマイズが可能

symbigun ・アクティブユーザの計測に特化

Localytics

・生ログ抽出可能でBIとの連携可能なため、既存BIツールに取り込む会社には好評で決めてになっている

・windowsフォン対応は国内でLocaliticsのみなので、それを理由に選ばれるクライアントもいる

・PC ・スマフォ ・アプリ

MOBYLOG

・マルチデバイス、ヒートマップ、イベントログ機能など多機能 ・多機能でも管理画面のUIの工夫により使いやすい ・JSにより外部リンクへのイベントログ取得可能。 →FBのいいねログなど

・PC ・スマフォ

クリックテール

・開発もとはイスラエル企業 ・ヒートマップ ・ブラウザの録画可能 ・スマフォ対応は年内予定 ・1ページあたりに情報量、各コンテンツへの入口等が多いページは効果的

・コンサルサービスも実施 ・サイトリニューアル前にサイトの動向、人気コンテンツの把握、LPに活かすコンテンツの抽出に利用する傾向が強い

Visonalist

・導線分析がしやすい ・ダッシュボード機にセグメントをつける機能がありマーケ、営業など他部署での利用に適している

・スマフォに特化しているわけではないのでスマフォデータみるときは絞り込みを行う

Google Analisticは オフラインログが取れず、 一括取得になってしまう。 ⇒オンライン時に一括取得

安価。 マウスの動きまで取得可能

4. リリース後の対応

41

ツール紹介(抜粋)

UIが優れていて、使いやすい 導線分析が分かりやすい

4. リリース後の対応

42

ツール紹介(抜粋)

問合わせフォームのヒートマップ ・1つ目の設問にためらいをかんじている →なので1つ目の設問はフリーではなくラジオ ・1つ目のフリー入力にためらいを感じている ・1つ目のフリー入力が完了するとあとは比較的 スムーズに入力してもらえる

ユーザのためらいをヒートマップ化

マウスの録画が可能

離脱率や入力にかかった時間も計測

4. リリース後の対応

43

アクセス解析について

✓ Webサイト(スマホ含む)の通常解析については、Google Analitics(GA) で十分だが、以下の注意が必要

・仕様がGoogleに準拠、突然の仕様変更の可能性有。 ・カスタマイズは出来ない。 ・利用・運用方法を社内で固めて行く必要がある。 ・アプリのオフラインログ取得については、一括取得になってしまう。

【GA利用の注意点】

✓ 独自の運用を固める場合には、有償ツールの導入も検討 ✓ 単純なログ解析だけではなく、クリックやマウスの軌道などを取得するツールも 安価で登場しており、詳細な分析を行いたい場合は導入を検討

44

実施にあたって(まとめ)

P

D C

A Act

実施にあたって

45

まとめ

1.短期間での対応を行いたい場合は、変換ツールの利用を検討

変換ツールは、かなり複雑なデザインにも対応可能に。

2.運用効率を向上、定型化したい場合はCMSの導入を検討

本格的なワンソース・マルチデバイス対応へ。

3.ツール選定は+α要素(だけ)に目を向けない

どんどん多機能になっているため、+αの機能に目を奪われがちに。 導入に際しては本質的な目的を忘れない。

4.リリース後も考えた導入を

「運用が複雑になる」「効果がどの程度か分からない」などの状況を 招かない事前設計、アクセス解析後の改修がやりやすい構築を図る。

46

ご質問・お問合せ先

株式会社クロス・コミュニケーション

セールスディビジョン

[email protected]

050-5833-8510

お気軽にご相談ください

URL:http://www.cross-c.co.jp/