Home> Archives > 2009年11月アーカイブ

2009年11月アーカイブ

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」というタイトルで発表させていただきました。)

Continue reading

  • Comments (Close): 0
  • TrackBack (Close): 0

ビデオチュートリアル:3ページのシンプルなサイトを作る

YouTubeのアノテーション機能を使って、コンポーネントスタイルでのビデオチュートリアルを作ってみました。

ビデオチュートリアルの制作手順

  • QuickTimeの画面収録機能で、画面操作を記録保存。 ※Snow Leopard (Mac OS 10.6)の 新機能
  • QuickTime 7 Pro で編集
    • 余分な箇所をカット
    • 早送りで見せたいところは、該当部分を1秒1フレーム程度で連番画像に書き出し。連番画像を読み込み倍速動画を得る。
    • 音声は別途aifで書き出し、Audacityでピッチを調整
    • 編集が完了したら、QuickTime形式で書き出し。※YouTubeがHDに対応しているので、サイズ変更せずそのまま書き出す。今回のサイズは幅1280px・高さ800px
  • YouTubeにアップロード

できたもの

YouTube - Progression3 (component style) で3ページのシンプルなサイトを作る

Continue reading

  • Comments (Close): 0
  • TrackBack (Close): 0

シンプルなウェブサイトを作る その1 - ページを切り替える

SimpleSite - FlashDevelopではじめるProgression

コンポーネントスタイルで作ってみた3ページのシンプルなサイトと同じ構成のものを、クラススタイルで作ってみました。

手探り状態のところもあるので、「こうした方がいいよ!」というアドバイスがありましたらぜひお願いいたします。 m(_ _)m

完成サンプル

Progression公式サイトの「クラススタイルガイド」を参考にさせていただきました。

制作環境

↓FlashDevelop用 Progression 4 プロジェクトテンプレートの最新版はこちらからダウンロードできます
Downloads - flashdevelopjp - Project Hosting on Google Code

制作手順

  1. 画面の設計、UIの作成
  2. プロジェクトの新規作成、初期化
  3. シーンの作成
  4. イベントにコマンドを設定
  5. ボタンの作成
  6. UIの表示、ブラウザでの表示位置の調整

Continue reading

  • Comments (Close): 1
  • TrackBack (Close): 0

ボタンにマウスオーバーを設定する

ボタンにマウスポインタが重なったときに、ボタンの色が変化するアニメーションを追加します。

完成サンプル

手順

  1. up点、over点、current点の設定
  2. ボタンのデザイン

Continue reading

  • Comments (Close): 0
  • TrackBack (Close): 0

Index of all entries

Home> Archives > 2009年11月アーカイブ

カテゴリ
アーカイブ
購読
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