Analyzed Websiteウェブサイトの解析
[Link]
[Click ][Color]
[Text]
Credit
ウェブサイトの解析
―
デザイン:
中野豪雄
―
プログラミング:
吉川義盛
―
2016. Oct
―
21_21Design Siteで開催された
企画展「デザインの解剖展」に出展した作品。
株式会社明治ウェブサイトと「きのこの山・たけのこの里」
ブランドサイトを解析し可視化している。
・ウェブサイトの解析[リンク]
約1万ページに及ぶ株式会社明治のホームページの中から、
商品情報に関するページのみを抜粋してそのリンク構造を可視化。
上から下に向かって下層ページへとリンクしていく様子を描いた。
円弧は同階層のリンクを、曲線は他階層へのリンクを示しており、
「きのこの山・たけのこの里」ブランドサイトに紐づくラインのみ
太くしている。また、最下層にある「きのこの山・たけのこの里」
ブランドサイトはより詳細にリンク構造を示しており、
各ページのアクセス数を円の面積で表している。
・ウェブサイトの解析[クリック]
「きのこの山・たけのこの里」ブランドサイト全ページにおいて
クリックされた場所と回数を解析し、クリック数に応じて
該当箇所が膨張しながら発光する様子を描いた。
・ウェブサイトの解析[色]
「きのこの山・たけのこの里」ブランドサイト全ページの色を解析し、
色相・彩度・輝度の3軸で構成した色立体上に、
色の使用頻度を円の面積に置き換えてマッピングした。
左側の図では、輝度ごとの色相・彩度のマッピングのみ示し、
配色の偏りをより分かりやすく見れるようにしている。
・ウェブサイトの解析[文字]
「きのこの山・たけのこの里」ブランドサイトの
各ページの言葉の使用頻度と繋がりの頻度を描いている。
言葉は形態素解析を用いて品詞ごとに分類し、
使用頻度を棒グラフの長さで、繋がりの頻度を曲線の太さで表している。
Analyzed Website
―
Design:
Takeo Nakano
―
Programming:
Yoshimori Yoshikawa
―
2016. Oct