Home> Progression3 > | トピックス > CSS Nite in FUKUI, Vol.3 ミニセッション「これからWebデザインをはじめたい人向けの学習プラットフォームについて」

CSS Nite in FUKUI, Vol.3 ミニセッション「これからWebデザインをはじめたい人向けの学習プラットフォームについて」

20091128-160600CSS Nite in FUKUI, Vol.3のミニセッションで、「これからWebデザインをはじめたい人向けの学習プラットフォームについて」と題し、短大での実践と地元のコミュニティについてお話させていただきました。

その中で、短大での授業で採用させていただいているProgressionについても紹介させていただきました。

(10月31日に参加させていただいたWCAN mini ActionScript Vol.13「名古屋でProgression!」では、本発表の一部(短大での実践部分)を拡充し「Webデザイン・ビギナー向けプラットフォームとしてのProgression」というタイトルで発表させていただきました。)

発表資料

発表のアウトライン

※発表前に準備したものです。実際の発表内容と若干異なるところもあります。

  • ... パチパチパチパチ(拍手) ...
  • すいません両眼1.5です。(※地元スピーカーが全員メガネというのはガセでした)
  • でも、メガネもってきました。
  • さて......
  • (非常勤講師をしていてる)短大での実践を中心にお話をします。
  • Webデザインの入り口で体験して欲しいこと →「Webサイトを作ってみること」  
    • 「かたち」になると嬉しい。楽しくなる。
    • 評価をしてもらる。自信が付く。課題が見つかる。
    • もっと表現力をつけたくなって、もっと学びたくなる。
    • 「自力で完成させた」という経験は、モチベーションの好循環を育むきっかけになる。
  • でも.....HTML/CSSでの制作は難しい!
    • 直観的にレイアウトできない(ビジュアル先行で考える人には苦手)
    • うまくいったと思って他のパソコンで見たら表示が崩れる(IE特有のバグというものがあることをここで知り愕然...)
    • 習得に時間がかかる
    • 「こういうビジュアルにしたい!」という欲求があるのにそれを形にできないのはストレスになり、モチベーションが下がってしまう
  • Webデザインの入り口ではシンプルに実装できる方がイイ。
  • Progressionでつくろう!
  • Progressionとは?
    • Flashサイト制作のフレームワーク
    • Flashの機能拡張として提供されている
    • ブランドサイトなどで採用多数
  • Progressionでは 複数の制作スタイルが用意されている
    • 「クラススタイル」では、オブジェクト指向プログラミングで作れる(ActionScriptゴリゴリ書きたい派はこちら)
    • 「コンポーネントスタイル」では、ActionScriptを一行も書かなくてもサイトが作れる
  • Progressionの詳しい機能や導入事例などは、公式サイトhttp://progression.jp/にて
  • 実践紹介: 学生が Progression でつくった作品(会場限定公開)
    • デザイン系志望でなく、これまで制作経験が全くなくても、ここまで作ることが出来る
    • 各シーン毎に個別のtitleやurlを持たせることができている(Progressionのすてきな機能)
  • カリキュラム概要
    • デザイン系志望でない学生を対象にしているので、1.5~2倍の時間をかけてゆっくりとすすめている
    • Fireworksで基本的な描画、変形、画像加工などの基本を学び、あとはFlash+Progressionでの制作を学ぶ
    • 通常Flashの入門時に学ぶフレームアニメーションは、この段階ではまだ学んでいない(フェード等のエフェクトもコンポーネントで実装できる)
  • 制作デモ ビデオチュートリアル: 3ページのシンプルなサイトをつくる

  • Progressionでつくる理由
    • 楽につくれるからではない。速くつくれるから。→ 節約できた時間を表現に
    • 次のステップがある

css nite in fukui vol.3 slide

  • 学習ロードマップ(案)
    • 色んな領域があるので、興味に合わせて学んでいこう
    • Progressionはプロトタイピングツールとして利用することができそう → IAのツールにも
    • コンポーネントスタイルでの制作を経験しておけば、Flashサイトの制作フローを体感できているので、クラススタイルで制作する場合も理解が早い
    • ActionScriptに興味があるけどハードルが高いという人は、Processingを経由してみることをおすすめ
    • 一般的なWeb制作会社でデザイナーとして働きたいなら、HTML/CSSを習得しておかないと就職は難しい(ほとんどの案件はHTML/CSSだから)
    • 福井で学ぶなら、次のコミュニティに参加することをおすすめします! WCAFFxUG北陸FITEA
  • まとめ
    • Webデザインをはじめたい人は、Progressionではじめよう!コミュニティに参加しよう!
    • Progressionの学習記録をブログにまとめてます。ご参考になれば。 → Progression 学習ノート
  • お知らせ:次回のWCAF勉強会で続編をお話させていただきます。
  • ありがとうございました!
  • ... パチパチパチパチ(拍手) ...
  • 質疑応答

おまけ資料1:プレゼンスライドの豆本版(持ち歩いて暗記用)

20091208-153553 20091208-153722

おまけ資料2:発表内容についてアイデア出しをしていたころのノート

cssnite fukui ideamap

Index of all entries

Home> Progression3 > | トピックス > CSS Nite in FUKUI, Vol.3 ミニセッション「これからWebデザインをはじめたい人向けの学習プラットフォームについて」

カテゴリ
アーカイブ
購読
Recommends
Web Designing (ウェブデザイニング) 2009年 08月号 [雑誌] Adobe Flash CS4 詳細!ActionScript3.0入門ノート[完全改訂版](CD-ROM付) .fla 2 ―Idea of Flash Creation― ブラウザで無料ではじめるActionScript 3.0 ―It's a wonderfl world― Flash3Dコンテンツ制作のためのPapervision3D入門 ActionScript 3.0 エラーアーカイブス コンパイルエラー・コンパイラ警告・ランタイムエラーの解法 FLASH OOP for ActionScript 3.0 詳説 ActionScript 3.0 初めてのActionScript 3.0 Flashユーザーのためのステップアップガイド Flash Math & Physics Design:ActionScript 3.0による数学・物理学表現[入門編] ActionScript 3.0 アニメーション AdvancED ActionScript 3.0 Animation 詳解 ActionScript 3.0アニメーション ―衝突判定・AI・3DからピクセルシェーダまでFlash上級テクニック
Powerd By

Return to page top