Web制作会社とBAここ15年の変貌2017-01-18 たまキャリ#1

株式会社ビジネス・アーキテクツ太田良典

自己紹介

2

BA

3

ウェブアクセシビリティ基盤委員会（WAIC）

4

デザイニングWebアクセシビリティ

5

BAとは?

6

BA

7

BAのはじまり

1999年、当時活躍していた有名なデザイナーやエンジニアが集まる 個人では請けられない億単位の仕事も、

会社であれば請けられるようになる

1999年1月、株式会社リフレクス設立2000年6月、現社名に変更

8

社名の由来

BA = Business Architects Architect = 建築家

ビジネスを構築するプロの集団、というような意味

「Web」「インターネット」のような言葉はじきに廃れると考え、あえて入れなかった

9

BAの特徴

自立、自律、フリーランス気質 もともと第一線で活躍していたメンバーの集まり

指示を待たずに勝手に行動するのが基本

「猛獣と猛獣使いの集団」と呼ばれたことがある

高いプロ意識 品質への意識が高い

クライアントが求めた以上の物を提案しようとする

10

ここ15年の変貌

11

2000年ごろの話

12

2000年ごろのWeb

第一次ブラウザ戦争の終盤 Netscape4、IE5などの時代。2001年にIE6が登場

Flashによる演出が流行 企業サイトにスプラッシュページが存在したことも

ただし、Flashのクオリティはまちまち

ヤコブ・ニールセン「Flash：99％有害」https://u-site.jp/alertbox/20001029

13

2000年ごろのBA : 良く知られる姿

Flashコンテンツを多数手がける 高く評価され、さまざまな賞を受賞

ビジュアルデザインとインタラクションデザインに長けた集団として認知

ハイクオリティなビジュアルデザイン 和菓子の「とらや」のサイトなどは評価が高く、

業界に大きな影響を与えた (=頻繁に真似された)

14

2000年ごろのBA : あまり知られない姿

アクセシビリティへの取り組み サイト固有のアクセシビリティガイドラインの策定

tableレイアウトからの脱却を模索 大規模サイトをフルCSSで実装する方法を模索

くわしく知りたい方は: http://www.b-architects.com/careers/staff/staff02/

15

2005年ごろの話

16

2005年ごろのWeb

第二次ブラウザ戦争 IE6時代が長く続いたが、そこへ

Firefox、Safari、Chromeなどが参入。IE7は2006年

CSSが普通に使われる時代に tableレイアウトは終焉、

ブラウザの互換性に苦慮しつつもCSSで実装する時代

Flashもまだ健在

17

2005年ごろのWeb (つづき)

Webのセキュリティ問題が表面化 SQLインジェクション攻撃による情報流出など

アクセシビリティへの取り組みが加速 国内では2004年にJIS X 8341-3が成立

多くの企業サイトが、内部的にアクセシビリティガイドラインを持つように

18

2005年ごろのBA : 良く知られる姿

大規模企業サイトの戦略とIA IA = 情報設計

戦略、情報設計、ビジュアルデザインのセット

大規模サイトのガイドラインとガバナンス スタイルガイドに加え、実装、セキュリティ、

アクセシビリティなどさまざまな情報を盛り込む

組織内部のガバナンスに踏み込むことも

19

2005年ごろのBA : あまり知られない姿

大規模サイトのモバイル対応 ガラケー対応、スマートフォン対応

ガラケーの課金の仕組みが優れていたため、会員制サイトにはまだガラケー優先のものもあった

RIAの案件を多数手がける RIA = Rich Internet Application

Flashはプロモーションではなくシミュレータなどに

20

2010年ごろの話

21

2010年ごろのWeb

HTML5の時代へ ブラウザの戦争はほぼ終結し、標準化が進む

標準的なブラウザのHTML5対応が進むIEは対応が遅れ、2011年にIE9が登場する

スマートフォンの時代へ スマートフォンの普及が進む

Flashは終焉へ

22

2010年ごろのBA : 良く知られる姿

引き続き大規模企業サイトを手がける ただしスマートフォン対応を含むようになる

HTML5のアプリケーション実装 JavaScriptを活用したアプリケーション

IE9のプロモーションのために作成した「The Shodo」は高評価 (= そこそこ真似された)

23

2010年ごろのBA : あまり知られない姿

大規模企業サイトのスマートフォン対応 ガラケー対応からスマートフォン対応へ

FlashからHTML5への移行 シミュレータをJavaScriptで実装しなおすなど

新規案件も多数

24

最近の話

25

最近のWeb

というかWebなのか? スマートフォン利用者がPC利用者を上回る

さまざまなデバイスやアプリが登場、ユーザーは「Web」を意識しない時代へ

動画があたりまえのものに 動画によるわかりやすい説明、装飾としての動画も

26

最近のBA :良く知られる姿

モバイル中心、動画を活用した大規模サイト 動画を活用した銀行のサイトなど

アプリのUIデザインや実装 公表できない案件が多いが、けっこうやっている

実はWebデザインの知見がかなり生かせる

27

最近のBA : あまり知られない姿

28

まとめ

29

Webは移り変わっている

Webの姿は大きく変わっている PCブラウザの時代からモバイルの時代へ

tableレイアウトとFlashの時代からHTML5の時代へ

Webサイトの姿や求められるものも、それに合わせて大きく変わっている

30

BAも変化してきた

BAの得意分野も大きく変化している ビジュアルデザインから戦略、IAへ

Webから動画、アプリなどの周辺領域へ

31

BAの新しいロゴ

32

BAのロゴタイプ (2013年～)

33

ロゴタイプの意図

新しいロゴタイプは、パートナー企業様とのより密接なコミュニケーション、ならびに、弊社のクリエイティブが標榜する無限の可能性を表現すべく、あらゆる虚飾を排した２文字のアルファベットで構成されます。

http://www.b-architects.com/news/releases/20130901

34

BAの色

特定の色は定義されていない メンバーはさまざまな色の名刺を持つ

サイトもさまざまな色に変化する

以下のような意味がこめられている 「BA」はさまざまな色に柔軟に変化する

色が変化しても「BA」であることに変わりはない

35

変化を恐れない

「BA」であり続けるためには変化し続ける必要がある

36

ありがとうございました