UTokyo Channel 動画メディアサイト | ウェブデザイン | NON-GRID INC.

ISSUE

「UTokyo OCW」と「東大TV」は、それぞれ異なる形で学術情報を届けてきた一方で、ユーザーにとっては両者の違いや、自分に合ったコンテンツへの辿り着き方が分かりづらくなっていました。また、長年蓄積された膨大な学術コンテンツを必要な人へ適切に届けるためには、情報を整理するだけでなく、興味や目的に合わせて自然に探索できる体験設計が必要でした。
東京大学が持つ知の信頼性を守りながら、専門的な学びをより開かれたものへ。新たな利用者との接点を生み出し、学術と社会をつなぐコミュニケーション設計が求められていました。

PROCESS

01 | ヒアリング・分析・戦略設計

事前に整理されたユーザーニーズや現状リサーチをもとに、プロジェクトの背景や課題を多角的に分析することから着手しました。ユーザーがどのようなきっかけで知に出会い、興味を広げ、継続的に学びへアクセスしていくのかを探り、情報設計・コンテンツ構成・ビジュアル表現のあり方を整理。ユーザー体験とブランド表現の両面から検討を重ね、「UTokyo Channel」が目指す体験やコミュニケーションの軸を固めていきました。

02 | コンセプト開発

東京大学の知と社会をつなぐ「ひらかれた接点」として、UTokyo Channelが提供する体験やコミュニケーションのあり方を整理。東京大学独自のVIコンパスを基準に、学術機関としての「アカデミックさ」と、より多くの人へ開かれた親しみやすい「ポップさ」のバランスを探りました。検証を重ねる中で、クリーンで整理された信頼感と、自由で親しみのある印象が共存する『みんなに開かれた知の実験場をデザインする』というコンセプトを策定しました。知を一方的に届ける場ではなく、多様な知や人が出会い、互いに影響を受けながら新たな価値が生まれる、誰もが参加できる開かれた学びの場を目指しました。

03 | 制作

確立したコンセプトのもと、デジタルからフィジカルなグラフィックまで、それぞれのメディア特性やユーザーのタッチポイントに合わせて、一気通貫したビジュアル表現を展開しました。

コンセプトである『みんなに開かれた知の実験場をデザインする』を体現するため、知のうごめきや相互作用を抽象的な形状で表現。常に変化する多様な知がこの場で出会い、影響を受け合い、融合・変化しながら新たな価値へと発展していくプロセスをキービジュアルへ落とし込み、その世界観をサイト全体へ展開しています。UTokyo Channelを起点に、知と社会の共創が生まれていく様子を再現しました。

背景には、ビジュアル要素が持つ鮮やかさを活かしつつ、長時間の閲覧でも心地よい体験となるよう、視覚的負担の少ない柔らかな有彩色を採用。そこに東京大学としての厳格な品位を示すVIカラーをアクセントとして配置しました。

さらに、ホバー時のインタラクションなどの動的な演出を取り入れながら、みんなにひらかれた実験場らしい活発さと、包摂性を感じられるやさしいUIを両立。フラットで親しみやすいデザインを通して、可読性と探索性を高め、膨大なコンテンツを好奇心のままに巡ることのできる回遊体験を実現しています。

▼ 中高生TOPページ / 英語TOPページ

メインターゲットだけでなく、サブターゲットである中高生や海外のユーザーにも東京大学の知への接点を広げるため、対象ユーザーごとの閲覧体験を設計しました。各ページでは、メインページの世界観を継承しながらも、中高生向けの親しみやすいビジュアルアプローチや、英語圏のユーザーに向けた情報の見せ方を、それぞれのユーザー特性に合わせた情報設計とビジュアル表現へと最適化しました。

あらゆるタッチポイントで「UTokyo Channel」らしい知的でひらかれた印象が一貫して伝わるよう、統一感あるブランド体験を設計しました。