軽さ🎈によって、人と社会に光💨を届ける /
東京のデザインスタジオ🌏

Contact 📝 Contact 🤝🏻 Contact 📝 Contact 🤝🏻 Contact 📝 Contact 🤝🏻 Contact 📝 Contact 🤝🏻
大阪トヨペット株式会社

Web Design

自動車ショールームを、まちのゲームセンターに。

Client:
大阪トヨペット株式会社
Role:
Campaign site Copywriting
Date:
2025.7~
https://www.osaka-toyopet.jp/special/toyolab/programming/

大阪トヨペット株式会社が運営する体験型教育プログラム「トヨラボ」のプログラミングコースWebサイト制作。小学3年生から中学生を対象に、ゲームや仮想空間を通じてプログラミングを学ぶ全6回の実践講座のサイトです。別でサイエンスコースもあり、そちらとは別の世界観として、プログラムの中の世界に飛び込むような体験設計を構築しました。 学校では学べないサイエンス塾 | トヨラボ(サイエンスコース)

課題・背景

  • 「プログラミング=難しそう」という先入観を取り除き、画面を開いた瞬間に子どもが前のめりになるような視覚体験をどう設計するか
  • 親子が「行ってみたい」と感じる、学びの入口としてのWebサイトを設計すること

アプローチ

  • ゲームや仮想空間のビジュアル言語を世界観の起点に据え、「学習」ではなく「探検」として体験できるサイトを設計
  • 当初の依頼にはなかったキャラクター制作を提案し、世界観の核として構築した

クライアントについて

大阪トヨペット株式会社が展開する地域共育プラットフォーム「トヨラボ」のプログラミングコース。自動車販売店のショールームという場を活かし、「親子で学ぶ・まちで学ぶ」をテーマに年間を通じて開講しています。サイエンスコースと並ぶ2本柱として、子どもたちの「考える力・つくる力」を育む場を提供しています。

Point|テーマカラーと世界観の設計

サイエンスコースが明るく親しみやすいトーンで設計されているのに対し、プログラミングコースでは真逆のアプローチを選びました。ブラックをベースに、プログラムの中の世界を想起させるカラースキームとしています。

「プログラミング」と聞いたとき、英数字が並ぶコーディング画面を思い浮かべる人は多いと思います。それをそのまま見せるのではなく、プログラミングを「学ぶもの」ではなく「入り込むもの」として体験してもらうための切り口を考えました。キービジュアルにはプログラミングを想起させるゲームのようなデザインをピクセルアートで表現し、ビジュアルの温度感から先に届けることで、「難しそう」より「やってみたい」が前に来る状態をつくっています。

大阪トヨペット株式会社 desktop screen 1
大阪トヨペット株式会社 desktop screen 2
大阪トヨペット株式会社 mobile screen 1
大阪トヨペット株式会社 mobile screen 2
大阪トヨペット株式会社 mobile screen 3
大阪トヨペット株式会社 mobile screen 4

Team

Website

Agency
IDEI inc.
Art Direction
奥村匠真(tsukuru inc.)
Planning / Copy Writing
岡本大和(tsukuru inc.)
Illustration / Design
北川日和(tsukuru inc.)
Front-end Developer
増田 日吉