本科UI/UXデザイン専攻
インタラクションUI実装コース

公開日:2023-07-01

インタラクションUI実装コースとは

デザイン、IT、Web業界の企業はこれからさらにテクノロジーが加速していく制作現場で活躍できる柔軟な人材を求めています。

本科UI/UXD専攻はそんな企業からの要請に応えて生まれた専攻です。グラフィック、Web、スマートフォン、サイネージなど様々なデバイスのデザイン茎礎をしっかり学習した後、それぞれに特化したコースに分かれ、就詭・転職・フリーランスなど業界で活躍するための力を身に着けます。


今回は デザイナーに求められるUI/UXを理解したデザイン制作はもちろん、WebGLによる3D表現など幅広いアウトプットを学ぶ【インタラクションUI実践コース】 についてご紹介します。


カリキュラムの流れ

デザイン基礎

初めに、デザインの基礎となる色、文字、レイアウトといった知識と作品制作に必要なソフトスキル(Illustrator/Photoshop /InDesign/XD)を掛け合わせて学び、1ヵ月で広告デザインに挑戦します。

UX基礎

UXとは、ユーザーエクスペリエンスの略で、直訳すると「利用者体験」や「利用者経験」を意味します。そのためUI・UXデザイナーは、サービスやコンテンツを利用したユーザーの、より良い体験や経験を考えることが仕事内容になります。
UX基礎ではユーザーのことを知るための手法や考え方を学びます。

WebUIデザイン

媒体の制約があるデザインの勉強のため、WebのUIの勉強をします。Webと一言で言っても、PCで見る場合、タブレットで見る場合、スマホで見る場合など、媒体を想定してデザインします。

Webコーディング

WebコーディングはHTMLと呼ばれるマークアップ言語、CSSと呼ばれるWebページの文字の色や大きさ、背景、配置といったスタイルを設定する言語で構成されています。また、javascriptといったプログラミング言語も合わせることで、ブラウザ上での動きも実現します。Webコーディングを通して、アイデアを形にするテクノロジーの基本を理解していきます。

UX応用

UX基礎で設計したサービスのアプリUIデザインを制作。ユーザー体験を意識したUI制作を通し、実際に分析した結果を実践的に反映していきます。

Vue.js

Webアプリケーションのユーザーインターフェイス開発において利用される、オープンソースのJavaScriptフレームワーク。授業課題ではVue.jsを使ったWebアプリ開発を行う。

WebGL(Three.js)

任意のウェブブラウザで、プラグインを使用せずにインタラクティブなCG表現をレンダリングするためのJavaScript API。

3Dコンテンツを制作できる商用利用可能なJavaScriptライブラリである、Three.jsも活用し、Web上での3Dインタラクションコンテンツの作成を行う。

本科UI/UXデザイン専攻インタラクションUI実装コース卒業制作作品紹介

Facebookへの提案を想定した、インタラクティブコンテンツ。言語の壁を必要としない「写真」をピックアップし、世界中のいいね数を一覧やカレンダーで見れる特設サイトやイベントの企画。 デジタルフロンティア2012 ベストプランニング賞/準グランプリ作品


パラリンピックの花形競技である車いすバスケットボールをデジタルアートで表現で紹介・応援するウェブサイトです。ページからページへの遷移をThree.jsを使った3D空間移動で表現し、デジタル空間内のバスケットボールコートに入り込んだような演出にしています。ウェブサイトでありながら、インスタレーション作品のような「デジタル空間の手触り」を感じられる表現を目指しました。

https://3d-wc-basketball.com/


インタラクションUI実装コース担当講師


■Webプログラミング応用・WebGL担当 フリーランス デザイナー/ディレクター/エンジニア
荒木 寛厚 (あらき ひろあつ) 講師

(CSS・JavaScript応用/Vue.js/Webアプリ/WebGL/Three.js)

-メッセージ-
コーディング・プログラミング未経験の⽅からしっかりサポートします。

Webサイトやアプリが作れる⼈になりましょう。

開講校舎

  • デジタルハリウッド 東京本校

    デジタルハリウッド 東京本校

    JR「御茶ノ水駅」聖橋口より徒歩1分、東京メトロ千代田線「新御茶ノ水駅」B2出口直結、ノ内線「御茶ノ水駅」より徒歩4分

    〒101-0062
    東京都千代田区神田駿河台4-6 御茶ノ水ソラシティ アカデミア 4F
    デジタルハリウッド 東京本校
    Google Map

    0120-386-810(月曜定休日)

    tokyo@dhw.co.jp

    東京本校を見る

  • デジタルハリウッド STUDIO渋谷

    デジタルハリウッド STUDIO渋谷

    東京メトロ半蔵門線・副都心線 東急東横線・田園都市線「渋谷駅」徒歩2分
    JR各線 東京メトロ銀座線「渋谷駅」徒歩7分
    京王井の頭線「渋谷駅」徒歩9分
    ハチ公バス(夕やけこやけルート)「宮下公園前」徒歩2分

    〒150-0002
    東京都渋谷区渋谷1丁目23-21渋谷キャスト2F
    Google Map

    0120-382-810(月曜定休日)

    shibuya@dhw.co.jp

    STUDIO渋谷を見る

  • デジタルハリウッド 大阪本校

    デジタルハリウッド 大阪本校

    地下鉄谷町線「東梅田」駅直結
    地下鉄御堂筋線「梅田」駅徒歩4分
    阪神電鉄「梅田」駅徒歩3分
    阪急電鉄「梅田」駅徒歩5分
    JR「大阪」駅徒歩5分

    〒530-0057
    大阪市北区曽根崎二丁目12番4号コフレ梅田4階
    Google Map

    0120-804-810(月曜・祝日定休日)

    osaka@dhw.co.jp

    大阪本校を見る

著者:デジタルハリウッド スクール 編集部