コンセントが設計・構築等で支援した、東京科学大学「Science Tokyoデザインシステム」が公開されました

Webサイトの方針をも含むデザインシステム、国内大学では初（*1）の公開

株式会社コンセントで、設計・構築・システム開発・編集等の支援を行った、東京科学大学（以下、Science Tokyo）のデザインシステムが公開されました。2024年10月に2つの大学が統合してできた国立大学「Science Tokyo」のブランドをWebサイトでも実現するため、ブランドに関する各指針の他にも、Webサイトの設計方針やアクセシビリティ方針、Webスタイルガイドを含めている点や、誰もが参照できるようWeb上で公開している点など、国内の大学では他に類を見ないデザインシステムとなっています。

＊1：2025年2月28日公開時点。当社調べ。

東京科学大学「Science Tokyoデザインシステム」（https://design-system.isct.ac.jp/ja）

■イノベーションの創出を支えるデザインシステム

Science Tokyoは、東京医科歯科大学と東京工業大学が統合して2024年10月に誕生した国立大学です。同大では、両大学のさまざまな違いを踏まえ、統合されたブランド体系の構築と実装に取り組んでおり、言語、視覚、情報設計等を体系的に整備することで組織全体としての一貫性と信頼性を高め、1＋1を3にも4にもするようなイノベーションの創出を支えることを目的に、デザインシステムが開発されました。

Science Tokyoのブランドに関わるデザイン、用語、使い方をはじめ、Web制作のルールやスタイルガイド、ライティングガイドライン、ブランドの運営方針などが集約されたデザインシステムとなっています。

■Science Tokyoブランドを実現するWebガバナンス

コンセントはScience Tokyoのパートナーとして新大学のWebサイト構築からプロジェクトに参画し、推進部門である大学広報課とともに、同大のミッション「『科学の進歩』と『人々の幸せ』とを探求し、社会とともに新たな価値を創造する」の体現に寄与するデザインシステムのあり方を検討していきました。

Science Tokyoという新たなブランドを育成し学内外に浸透させていくために、さまざまな情報を発信し多様なステークホルダーとの接点となるWebサイトは、ブランド全体のエコシステムの中核として重要です。一方で、2つの大学が統合されたことで教育組織や研究組織、病院など多様な組織がScience Tokyoブランドを構成することとなり、関連するWebサイトは数百を超えるともいわれています。各サイトは管轄する学内組織や学外パートナーがそれぞれに運用するため、ともにScience Tokyoブランドを育てていくためには、Webサイト群全体で情報資産を活用し全体最適を行うWebガバナンスが不可欠でした。

こうした状況を踏まえ、ブランドに含まれるすべてのWebサイトを構築・運営するために必要な方針を定めることを広報課に提案、ともに実行していきました。一般的にデザインシステムというと効率的でまとまりのあるプロダクトの開発を目的に構築されることが多く、「Webサイトの方針」をも含んでいる点は、Science Tokyoデザインシステムの大きな特徴となっています。

同大ブランドに関連するすべてのWebサイトで発信される情報がブランド資産となるよう、Webサイトの方針を定めている

Webサイトに関する方針として、Science TokyoブランドをWeb上で実現するためのWebガバナンスの考え方と、ウェブアクセシビリティに対する考え方や対応の方針、取り組み内容について掲載。これらの方針のもと、具体的なWeb制作に向けデザインのルールを定義する「Webスタイルガイド」は、以下の内容で構成しています。

• 色やアイコン等の視覚的な特徴や雰囲気を定義する「デザイントークン」

• 一貫したデザインと使いやすさを実現するための「コンポーネント」

• コンポーネントを組み合わせたレイアウトのバリエーションとなる「ページパターン」

• デザイン制作に活用するFigmaのデザインデータと、開発済みコンポーネントの元となる開発ソースによって構成した「デザインリソース」

「Webスタイルガイド」と「デザイントークン」ページ

中でも「ページパターン」は、トップページ、インデックスページ、詳細ページといったWebサイト内での役割ごと、どのような情報をどう伝えたいかという観点で分類し、そのままベースとして利用したり、カスタマイズして活用したりすることを想定したページパターン集です。このような基本モデルをつくっておくことで、Science Tokyoブランドの一貫性を保たせながら、将来的にもサイト展開しやすくなるようにしています。

Webサイトのトップページとしての利用を想定した「ホームパターン」と、コンテンツの詳細を伝えるためのさまざまな用途に利用することを想定した「詳細パターン」

■「つくって終わりではないデザインシステム」を支える技術面

今回のScience TokyoデザインシステムはWebサイトに関する方針やガイドライン、スタイルガイドなど多岐にわたるものを包括しているため、広報課をはじめとした学内関係者やさまざまなパートナー企業が制作に携わることになり、開発以降もそうした多種多様なステークホルダーの方にとって、拠り所となり活用しやすいデザインシステムであり続けることが必要でした。

「つくって終わりではなく、育てていくもの」という同大が目指すデザインシステムのあり方を実現するため、技術面においては、専門的な知識なしに利用できるスタティック・サイト・ジェネレーターやGitのワークフロー等を組み合わせることで、特別な環境や知識を要せずとも誰もが簡単に更新できると同時に、承認フローを経ての公開・取り下げ管理ができる仕組みを構築しています。

「Science Tokyoデザインシステム」のWebシステム全体の構成・フローのイメージ図

■国内大学では初となるデザインシステムの公開。「社会の知の循環」の促進を目指す

デザインシステムを公開している大学は国内には見られず、また国外においてもあまり見られません（2025年2月28日公開時点。当社調べ）。活用する学内外関係者だけにとどめず、Web上で広く公開するに至った背景には、「『科学の進歩』と『人々の幸せ』とを探求し、社会とともに新たな価値を創造する」というミッションのもと、他大学や企業等のさまざまな人々に活用される中で、ブランドやデザインの考え方についてフィードバックを受けながら進化し、社会の知の循環を促進したいというScience Tokyoの想いがあります。

「デザインでひらく、デザインをひらく」をミッションにしているコンセントでは、今後もこうした取り組みを支援し、社会の中での知の循環に寄与していきます。

[ 関連リンク]

Science Tokyoプレスリリース「Science Tokyoデザインシステムを公開」

（2025年4月11日　https://www.isct.ac.jp/ja/news/82fniq2wvvm9）

⊹⊹⊹

[ 株式会社コンセントについて ]

コンセントは「デザインでひらく、デザインをひらく」をミッションに、企業や行政と伴走し活動を支えるデザイン会社です。

デザイン経営や事業開発、マーケティングやブランディング、クリエイティブ開発等において、サービスデザインの視点と技術を生かして戦略策定から実行まで一貫して支援しています。また、誰もがデザインについて学べる「コンセントデザインスクール」の運営等を通して「デザインの知の活用」を広く共有しています。生活者一人ひとりがデザインの視点を身につけ、問題解決に役立てられる社会となることを目指して活動しています。

会社名：株式会社コンセント

所在地：〒150-0022 東京都渋谷区恵比寿南1-20-6 プレファス恵比寿南

設立：1973年12月

代表者：代表取締役社長 長谷川敦士

事業内容：デザイン経営支援、事業開発や成長支援、デザイン組織や業務の構築支援、サービスデザイン、ブランディング支援、デジタルメディア開発、クリエイティブ開発

• コーポレートサイト　https://www.concentinc.jp/

• デザイン経営をリードする「Design Leadership」 https://www.concentinc.jp/solution/design-leadership/

• 誰もがデザインを実践できる世の中に「コンセントデザインスクール」 https://cds.concentinc.jp/

[ 本リリースに関するお問い合わせ先 ]

株式会社コンセント
Marketing group

岩楯ユカ、関本あやか
E-mail：[e-mail]

TEL：[phone]（代表）