Tokyo University of Science ~ 150th Anniversary Website
東京理科大学150周年サイト
東京理科大学様からご依頼いただき、東京理科大学150周年サイトのWEBのアートディレクションとデザインをSMDOにて担当させていただきました。これまで連綿と理科大に蓄積されてきた知識や科学技術が「結晶化された知能の積層」となっている様子を表し、理科大が「知能の集約拠点」として発展してきた歴史そのものを象徴したシンボルを考案し、そのシンボルをメインに据えたWEBサイトを目指しました。
東京理科大学の卒業生でもあるアートディレクター・佐野自身の経験と大学への理解を生かし、理科大ならではのテクノロジーをふんだんに盛り込んだギミックを随所に取り入れ、母校を知るからこその視点で、「理科大らしさ」を随所に落とし込んでいます。
WEB以外にも150周年事業ロゴとキービジュアルのビジュアルコンセプトとロゴデザインの考案、アートディレクション、フラッグやペットボトルのラベルデザインなども担当させていただいております。
.
.
Beyond the website, SMDO was also responsible for developing the visual concept and logo design for the 150th Anniversary Project, as well as its overall art direction and various applications, including flags and bottled-water labels.
理系の要素を取り入れたアイコン一覧
A Collection of Icons Inspired by Science and Technology
酵素反応
酵素と基質が結合する反応機構を、ボタンの動きに落とし込みました。 マウスオーバーすると、基質が酵素の“くぼみ”にぴたりとはまり、酵素–基質複合体を形成する様子を表現。科学的な仕組みを、直感的に楽しめるインタラクションへと展開しています。（左図：ミカエリス・メンテン式 / 右図：酵素反応をモチーフにしたボタンモーション）
Enzymatic Reaction
The mechanism by which an enzyme binds to a substrate is translated into the motion of a button. On mouseover, the substrate fits precisely into the enzyme’s “active site,” visually representing the formation of an enzyme–substrate complex. This scientific mechanism is transformed into an intuitive and engaging interactive experience.(Left: Michaelis–Menten Equation / Right: Button Motion Inspired by Enzymatic Reactions)
ニュートラルネットワーク
ニューラルネットワークを想起させる動的な背景表現により、 お二人のメッセージを情報が集約・分岐する「知のハブ」として際立たせる構成としています。
複数のノードが接続し、信号が行き交うイメージを重ねることで、個々の言葉が単なる挨拶文ではなく、 大学全体の知を束ね、次世代へと接続する中枢点であることを視覚的に示しています。
Neural Network
A dynamic background inspired by neural networks positions the messages from the two leaders as a “hub of knowledge,” where information converges and branches out.By layering imagery of interconnected nodes and signals flowing between them, the design presents their words not simply as greetings, but as a central point that brings together the university’s collective knowledge and connects it to the next generation.
一般相対性理論
東京理科大学の徽章は、アインシュタインによって確立された一般相対性理論を図案化したもので、太陽の重力によって曲げられる光の軌道を模式的に描いています。その徽章のモチーフから着想し、質量によって時空が歪むという考え方を、線と球によるシンプルな形と動きで視覚化しました。（左図：一般相対性理論をモチーフにしたメニューボタン / 右図：一般相対性理論の概念イメージ）
General Relativity
The emblem of Tokyo University of Science is based on a visualization of Einstein’s theory of general relativity, schematically depicting the path of light bent by the Sun’s gravity. Inspired by this motif, we visualized the concept of mass curving spacetime through simple forms and motion using lines and spheres.(Left: Menu Button Inspired by General Relativity / Right: Conceptual Visualization of General Relativity)
エントロピー
エントロピーの変化を可視化する動きを採用し、秩序から無秩序へと移行する状態変化を直感的に体験できる設計としています。 整理された低エントロピー状態から、操作を契機に要素が拡散する高エントロピー状態へと遷移させることで、抽象的な概念を視覚的に表現しました。
「状態」と「変化」をUIに落とし込むことで、理科大らしい知的なギミックと遊び心を両立させたデザインです。
Entropy
We adopted motion that visualizes changes in entropy, creating an intuitive experience of the transition from order to disorder. By shifting from an organized, low-entropy state to a dispersed, high-entropy state triggered by user interaction, the design gives visual form to an otherwise abstract concept.
By translating the ideas of “state” and “change” into the UI, the design combines an intellectually engaging mechanism inspired by the scientific spirit of Tokyo University of Science with a sense of playfulness.
クロマトグラフィー
クロマトグラフィーを想起させるアニメーションで、分析や実験のプロセスを動きと色彩の両面から表現しています。 理系らしい知性と実験性を感じさせるデザインです。
Chromatography
An animation inspired by chromatography expresses the process of analysis and experimentation through both movement and color. The design conveys a sense of scientific intelligence and experimentation, reflecting the distinctive character of Tokyo University of Science.
目盛り
目盛りを想起させる目盛りをモチーフに、情報の蓄積を視覚的に表現。スクロールに合わせて目盛りやグラデーションが変化し、知識が積み重なっていく感覚を演出しています。
理系らしいモチーフを、遊び心のあるUIへと落とし込みました。
Scale
Using scale markings as a motif, the design visually represents the accumulation of information. As users scroll, the markings and gradients shift, creating a sense of knowledge gradually building up.
Scientific elements are reinterpreted through a playful and engaging UI.
FVを構成するモーション
背景に浮かぶフレアには、光や波の「ゆらぎ」をイメージした動きを取り入れています。淡い光が上下にゆっくりと揺らめくことで、静止した空間の中にも絶えず変化するエネルギーの存在を表現しています。
シンボル以外の要素が動きを持ってふわっと現れた後、「結晶化された知能の積層」を表すシンボルが挙動を始めます。蓄積されてきた知識や科学技術を結晶の重なりに、それらをつなぐネットワークや人との絆を「輪」に見立て、知が集積し、相互につながることで新たな知へと発展していく姿を、動きとして表現しています。
Motion Elements of the FV
The flares in the background incorporate a gentle motion inspired by the subtle fluctuations of light and waves. Their soft, slow movement evokes a sense of energy that is constantly shifting, even within an otherwise still space.
After the surrounding elements softly emerge into view, the symbol representing “layers of crystallized intelligence” comes to life. The overlapping crystals represent accumulated knowledge and scientific technologies, while the rings symbolize the networks and human connections that link them together. Through motion, the symbol expresses how knowledge accumulates, connects, and evolves into new forms of intelligence.
サイト全体の構成 / デザイン
Overall Site Structure / Design
WEB design
Art Direction : Minami Sano(SMDO)
Assistant Direction : Shinnosuke Nakasone(SMDO)
Chief Graphic Designer : Yuichi Ikehata(SMDO)
Graphic Designer：Yuichi Ikehata(SMDO) , Sachiko Fukuoka(SMDO) , Romi Nakano(SMDO)
AssistantDesigner：Mariko Adachi(SMDO) , Machiko Terada(SMDO) , Anju Mori(SMDO)
Web Coding：CIN GROUP Inc , 株式会社HAMONI
cliant : Tokyo University of Science
東京理科大学 担当事例
150周年事業ロゴとキービジュアルのビジュアルコンセプトとロゴデザインの考案、アートディレクション、デザインをSMDOにて担当させていただきました。また制作グッズとしてポスター（2種類）、クリアファイルのアートディレクションとデザインも担当させていただきました。
.
Tokyo University of Science ~ Flag & Sign
フラッグ、看板のアートディレクションとデザインを担当させていただきました。。現在、野田キャンパスと葛飾キャンパスに掲載されております。
Tokyo University of Science ~ Plastic Bottle Label
「東京理科大学 ナチュラルミネラルウォーター」のラベルのアートディレクションとデザインも担当しております。キャンパスの販売店（生協等）、自動販売機で販売中。
Tokyo University of Science ~Interview
東京理科大学150周年サイトのWEBデザインを担当しました。
サイト内のインタビュー企画では、卒業生や教職員、学生それぞれの視点から、東京理科大学で培われてきた経験や学び、そしてこれからの未来について紹介しています。
Tokyo University of Science ~ RIDAIHITO
佐野の母校である東京理科大学様から取材のご依頼をいただき、東京理科大学報 第237号に掲載される「理大人」のコーナーでインタビューが公開れております。