2021年度第17回デジタルコンテンツ・コンテスト

インタラクティブ部門・優秀賞 TOKYO OLYMPICS 2020

2021年度第17回デジタルコンテンツ・コンテスト
氏名  研究科・学部  専攻・学科  学年 
宮坂 亮吾  デザイン工学研究科 システムデザイン専攻 M1
  • 使用ソフト
    Visual Studio Code
  • 開発・制作・動作環境等
    Mac OS
  • 使用素材
    音楽:Wondershare Filmora X

作品要旨

世界中の選手や注目や心配が集まった「TOKYO OLYMPICS 2020」は、間違いなく開催中、「世界の中心」だったと思います。記念作品として、光や国旗の色を活用した各国のメダル獲得枚数がわかるインタラクティブアートを制作しました。

作品解説

一年延期し、賛否の意見がある中で開催された東京オリンピックでしたが、そこには多くのドラマがあり、世界中に感動と活力を発信してくれたと思います。そんな世界中の選手や注目や心配が集まった「TOKYO OLYMPICS 2020」は、間違いなく開催中、「世界の中心」だったと思います。この歴史に残る東京大会の記念作品を作りたいという思いで本作品の制作を決めました。本作品の表示時は、五輪カラー(黒は見えないので白に代用)で全大陸から世界中の選手や注目や心配が集まり、世界の中心であることをビジュアル的に表現しました。また、直接的に五輪マークを作ってオリンピックを表現するのは具体的すぎると思ったので、五輪カラーと金銀銅のメダルでオリンピックを連想するようにしました。そして、ただのアートではなくオリンピックについての情報も得られるものにしたいと思い、地球儀を回しながら、国をマウスカーソルで選択すると国旗をモチーフにしたグラデーションカラーの国名と金銀銅それぞれのメダル獲得数が表示されるようにしました。国名の国旗グラデーションは、オリンピック参加国一つずつ設定し、国旗をすぐにイメージできるようグラデーションの向きや色の割合にこだわりました。

デジタル技術の使用箇所・方法

開発には、HTML/CSS/JavaScriptを使用し、マウスでインタラクティブに操作出来るようにしました。国名やオリンピック出場国、メダル獲得数、国旗の色など大量のデータを管理、処理するために試行錯誤し、国を選択すると、国名、国旗カラー、メダル獲得数の個別認識を可能にしました。地球儀はGio.jsというJSライブラリを活用し、光を日本に集めることで、世界中の選手や注目や心配が集まっていることを表現しました。

講評

本作品は、インタラクティブなインフォグラフィックであり、かつ今年のオリンピックを題材にしており,技術的にもコンテンツ的にも時流にのった作品である。内容は各国のメダル獲得数を表示する単純なものであるが、JavaScriptのライブラリを使っているためWebブラウザで手軽に体験可能なところも良い点である。国旗カラーを国名のカラーに反映させるなど、丁寧な作り込みもされていおり、全体に完成度がとても高い作品である。