見出し画像

Web標準でフロントエンド戦国時代に突入。そしてGoogleも動き出す!【Web30年史】2012-13

デジタルデザインの未来をWeb30年史から考える。今回は2012-2013年の出来事を中心に振り返ります。

2012年頃から数年間はFlashからWeb標準技術へ、フロントエンド戦国時代の到来。ブラウザベースでの表現を追求するなどの動きが見られます。Webアプリケーションでは開発環境が整備され、スタートアップビジネスに弾みがついていきます。
マーケティング界隈ではSEOに大きなテコ入れ、アプリ界隈ではガチャ問題など。社会において、デジタルの接点や活動の比重が上がってきたことの裏返しでもあり、業界の倫理を問われることになりました。

IMJが上場廃止。BAに続いて、古くからのWebのプレイヤーも力を失っていきます。その時のコメントも改めて振り返りたいと思います。

その頃FOURDIGITは…
FOURDIGITはこの頃、デジタルデザイン全般領域、設立当初からやっていた不動産領域、Yahoo!不動産の運用、CREATIVE SURVEY、決済を担うためのアメリカの会社。それぞれを子会社化し、ホールディングス体制に移行。それぞれのチームがそれぞれの領域で強くする方針に舵を切ったころです。


Flashからブラウザへ

Flashが終焉を迎えていく中、Web標準でありつつ新たなるリッチな体験をすることを目指していくようになりました。

クリエイティブ方面はブラウザの枠を超えて、VRやリアルを活用した体験型プロモーションへ。デジタルマーケティングは、ROIを前提としツールを活用したものへ。デジタルサービスはアプリとWeb(PC・スマホ)の両面で考えていくようになりました。

いくつかのプロジェクトの性質が分かれていったことで、必要とされる技術もそれぞれ違っていきます。

クリエイティブ方面だと2011年でブラウザシェアNo.1になったGoogle Chromeのチームが可能性を広げていきます。Googleのクリエイティブチーム(Google Creative / Chrome Experiment)がこの頃のWeb Awardをかなり多く受賞します。Flashの担っていたスクリーンの可能性をWeb標準で担うべく、試行錯誤、アピールしていった狙いがあったように思えます。

画像1



ブラウザでのリッチコンテンツを支える技術が発達

この頃から立て続けにフロントエンドの技術、JSフレームワークや開発環境が整っていきます。

2011年 WebGL、CSS Transform、Bootstrap by Twitter、Foundation2.0 by Zurb
2012年 CSSアニメーション、Grunt、Webpack、Typescript by Microsoft、Bower by Twitter、Bootstrap2 byTwitter
2013年 React by Facebook 、Gulp
2014年 W3CがHTML5 勧告、Vue.js by Google(個人)、Babel(6to5)、Angular 2+ by Google

なんかいろいろ書き漏れてる気もしますが、CSSフレームワーク、JSフレームワーク、AltCSS、AltJS、タスクランナー……、と言ってもマニアックなのですが、とにかく開発環境や言語がモダンになっていきました。

今までの作り方とは違い、より整理された書き方や明確な記法が可能になっていきます。


この技術的な変化は、いわゆるフロントエンドのテクニカルスキルの習得を必要とするため、モダン vs レガシー 問題が発生し、WebデザインとWebアプリケーションの実装スキルが交わらないレベルまで乖離してしまう結果にもなりました。

特にレガシーなWebサイトを運用したり、作り切りのWebサイトの実装の場合は、逆にモダンであることのデメリットがあったため、モダンなスキルセットを持つ人材はスタートアップに流れていく……という感じに。維持や保守が必要なものを中心に、モダンアーキテクチャはニーズが増加するが、依頼があっても人材がいない、という意味でプロダクションはなんとも言えない状況でした。

ようやく最近になってある程度のより戻しが起こっていますが、当時はなかなかスキルのトランスフォームができず、エンジニア各個人のキャッチアップに頼る以外はないような状況でした。

ところで、上記の通り、モダン実装のツール群は、Twitter、Google、Microsoft、Facebook、などから提供されています。

テック企業は単にツールの使い手というだけでなく、使うツール自体も生み出していくエンジニアマインドを持っていることがわかります。



レスポンシブデザインが当たり前に

画像2

2013年ごろになるとレスポンシブデザインが一般的になり、レスポンシブルって言う人も少なくなってました。

新しい技術への入れ替わりはだいたい2年ぐらいかかり、多くて3年という感じでしょうか。


レスポンシブデザインでは、実装コストの安いフラットデザイン・ミニマルデザインが採用されることが多くなり、複雑なページ構造よりも1ページもので完結するものも多くなりました。その後、だんだん複雑な構造のサイトやサービスでも採用されていきますが、Web標準技術のスキルが必要とされ、技術的な整備も進むと、エンジニアだけでなく、デザイナー・IAに関わるメンバーもモダンなスキルセットが必要とされます。

こういう背景の中でシンプルなWebサイトが増加していく中、Webの表現はまだまだ開発されつつありました。

Flashの頃に最盛期を迎えたスクリーン上でのクリエイティブは、前述のGoolgeのチーム(Google Creative Team / Chrome Experiment)が、しっかりと未来に向けて可能性を広げようとしていたように見えます。


ペンギンとパンダが白黒つける

画像3

Web標準技術が改めて復活すると、Flashの影に潜んでいた(?)SEOに対しての比重が高くなり、検索エンジンを牛耳るGoogleの動向も激しくなります。今でもたまにGoogleの検索ランキングロジックが変更されるのですが、その大きな変更がこの時期に行われました。「ペンギンアップデート」「パンダアップデート」の二つです。

余談ですがGoogleはバージョンに対して動物の名前をつけていたり、お菓子の名前(Andoroid)をつけていたりしました。Appleは、OSにTigerとかLeopoldとかLionとかネコ科の名前をつけてました。


話はもどして、ペンギンとパンダ。両方とも白黒の動物。白黒つけようぜ、ということです。

画像4

そのころ、SEOは本来の目的と離れて、内容よりも上位表示をするための技術として使われていました。

「被リンクが多ければいい」や「内容が薄くてもキーワードがたくさん散りばめられていればいい」といったSEOをハックする考え方です。

上位表示されればページビューが増える、ページビューが増えれば広告の表示回数が増える、というお金の生み出し方が通用しました。そういう質の悪い上位表示をなくすため、Googleがアップデートを行ったわけです。


そんなの当たり前じゃん…と思いますが、当時は検索順位を上げるためにSEO業者に依頼すると次第に順位が上がってくる、という企業はたくさんあって、その業者がどういう手口でSEOをするのかは、関与してなかった。

そのため、悪質な手法を取る「ブラックハットSEO」と、悪質じゃないSEOを「ホワイトハットSEO」が見分けのつかない形で存在していました。ペンギンとパンダなど、文字通り、白黒つける、という感じです。

Googleの対策によって、ブラックハットの業者は淘汰され、悪質な手口を利用していたドメインはペナルティをくらうことになります。


今まで無駄なコンテンツやバックリンクをひたすら生成することでWebを汚しまくっていた手法も意味がなくなりました。Goolgeのガイドラインに従ってコンテンツを適切に表現すれば、自然に上位表示されるという自然な形になりました。

結局、コンテンツが一番大事だよね、という当たり前の帰結です。


ちなみに、Googleのアップデートでペナルティを受けて表示すらされないクライアントさんもいました。今でも「いいね量産」や「口コミ量産」の手口はありますよね。やっぱり悪質な業者はいるので気をつけましょう。


コンプガチャ問題

コンプガチャ

アプリ業界ではゲームが流行っていきました。いわゆるソシャゲです。

市場が成熟し、ヒットすれば利益率が高いということで、たくさんのタイトルがリリースされていきました。無料ではじまり、アイテムやキャラがほしけりゃ課金というモデルは新しいゲームのビジネスモデルとして確立します。

2012年に話題になった「コンプガチャ」問題は、アイテムを揃えないとレアアイテムを得られないため、多額の課金が必要になり、社会問題化しました。

特にまだ未成年に対する対応などが整備されておらず、親のクレジットカードを利用したりするケースも発生。すぐにコンプガチャが違法化されたことで、オンラインゲーム関連株が暴落。ソシャゲの協会ができてガイドラインが出来ました。経済の力はすごい。

今でもゲーム課金の問題はありますが、親への許可だったり未成年アカウントへの対応など、問題に対する対応策は取られていますよね。

この問題は一方で、ゲームはもうかる、という印象も大きかった事件でした。アプリ業者がゲームを作るのは当たり前だったし、デザイン会社もゲーム作り始めていました。

SEO業界もそうですが、Webやアプリの世界がGoogleやAppleなどのリーダーシップで、クリーンな世界になっていきます。デジタルマーケットに関わる会社は、きちんとした倫理観を持っていなければならない、となっていったように思えます。


IMJの上場停止

IMJの発表資料

この頃から、デザイン会社のスタンスによって潮目が分かれていったように思えます。アイデアやクリエイティビティで突破できる会社、ブランディングに広げていく会社、ビジネスソリューションとして上流から関わる会社…などなど。

そんな中、IMJが上場を廃止します。

Webの成長とともにあった会社だし、黎明期を切り開いた会社だったので、BAの買収と並びにインパクトがありました。当時の「意見表明のお知らせ」を一部抜粋します。上場企業はこういう透明性があるのはいいですね。

当社の事業領域であるWebインテグレーション業界・インターネット広告業界においては、スマートフォン、タブレット、PC などの新型携帯端末の急速な普及やソーシャルネットワーキングサービス(SNS)の浸透によって、消費者のインターネットへの接触時間が増加し、また接触シーンが多様化してきていることも相まって、企業のデジタルマーケティングに対する需要は拡大傾向にあるものの、Webインテグレーション業界・インターネット広告業界自体は参入障壁が非常に低いために、多くの競合企業が参入し、激しい価格競争に晒されております。 そのため業界全体で利益水準が低下しており、各社共厳しい環境が続いております。 当社においても、顧客の意思決定の長期化やプロジェクトの延期・消滅に加え、不採算案件の一部発生並びに映画制作中止損や減損損失等を原因として、平成20年3月期から平成23 年3月期にかけて、連結ベースでは 4期連続で当期純損失の計上を余儀なくされる事態となりました。

まず、最後の4期連続の赤字というのが決定的ですね。

消費者のインターネット・モバイル利用が急速に高まっている環境下なのに、2008年あたりから赤字であったということになります。2008年といえばリーマンショックですので、そこからずっとということになります。さらに、価格競争による利益水準の悪化ということも書いてあります。


デジタル業界は変化が早い早いと言われていますが、何が早いのかというと、こういったユーザー環境の変化とバックボーンにある技術の変化が、常に水面化で起こり続けているという意味です。

そのためボヤッとしてると、価値の置き所が変わることに付いていけず、置いていかれてしまいます。
置いていかれた結果、激しい価格競争に巻き込まれます。技術や価値が逓減するスピードが早くて、レガシーな状態で残るのは価格競争です。

スタートアップのエコシステムが作られることで、資金力を持ったチームが人材獲得にも影響し、高い価値を生み出せる人材は逓減する価値を守るために流出してしまいます。そして、そのパターンで流出したのち、価値を守るための場所を探し続けるという結論を生みやすくなります。

その後IMJは上場廃止したのちにV字で立て直し回復、2017年にアクセンチュアグループに入ることになります。このへんの舵取りはさすがです。


Google Glass / ウェアラブル

ウェアラブル

ウェアラブルデバイス、という言葉が生まれたのもこの頃。Google Glassが発表されました。

iPhone・スマホに続く、次のデバイスは何か?
ということもあり話題になりました。

ハードウェアがネットにつながることが分かったことで、IoT(Internet of Things)といった言葉も生まれ始めます。ネットにつながるものたち。ネットにつながるメガネ。ネットにつながる時計、車、エアコン、テレビ、炊飯器、って、炊飯器はつながってなくていいだろ、という物までだいぶ迷走してますね。

ただ、Google Glass はモニタの新しい未来やVR的な部分では貢献していったと思います。Microsoft のHoloLends など(みんなが使うとは言い難いけど)活用できそうなデバイスへのアイデアにつながっていきます。

TEDでセルゲイブリンのGoogle Glassプレゼンがあるんですが、やっぱりスティーブジョブズは別格だなとむしろ感じました。興味がある人は見てみてください。なんだか「欲しい!」ってならないんですよね。結果的に日本では発売されなかったと思います。(僕はアメリカにいた友人に頼んで仕入れました)


次回予告

2013年、Fjordをアクセンチュアが買収。欧米で始まったコンサルティング会社によるデザイン会社の買収劇。ビジネスにデザインが必要である、という風潮は強くなっていきました。同時にWebデザイン業界も、Flash時代の終わりによる技術的な転換が迫られ、新しい表現や作り方に対応する必要がありました。

記事一覧:デジタルデザインの未来をWeb30年史と考える