Webアクション＆エフェクトのネタ帳
Chapter01 ハートをつかむ動きと仕掛けのネタ
001 マウスの動きに追従して静止画に波紋を起こす
002 マウスオーバーで音符があふれ出す楽しいメニュー
003 ぼかし画像を使ったズームイン効果
004 アイコンをクリックしてOSのファイルオープンのような効果
005 拡大率の変更も自由自在！ ルーペで覗くような拡大効果
006 ボタンをクリックすると動きながら画像が入れ替わる
007 マウスを追跡するフローティングメニュー
008 手描きの絵を着色してパラパラアニメに変換
009 かわいいキャラクターがナビゲーションを操作！
010 ブラウザを揺らして重さを表現する
011 アクセスするたびにランダムな背景を表示する
012 メニュー操作で、枠が対象フォーカスする！
013 上下左右にスライドする多層インターフェイス
Chapter02 目を奪うモーションタイポグラフィのネタ
014 数値を入力すると1桁ずつ数字を表示するカウンター
015 円がランダムに集まってくるさわやかなモーションタイポ
016 シャドウとシルエットを巧みに切り替える！
017 フォーカスのずれと動きで文字がスムーズに切り替わる
018 ロゴタイトルが分割されマルチにずれるモーション
019 ジャンプ、カットの動きで躍動感のあるリズムを演出！
020 カット、ズームインによるコマ落とし効果
021 画面分割によるマルチモーション
022 IllustratorのSWF書き出しでFlashアニメーション
023 手書き風に描かれながら文字が反射するモーションタイポ
024 断片が降ってきて文字になるモーションタイポ
025 ペンで書いたように文字が現れるテキストアニメ
026 白地からシャドウが伸びて浮かび上がるロゴアニメ
027 GIFアニメーションでテキスト出現のモザイク効果
028 デジタル処理風に整形されていくテキスト
029 ゆらゆらと揺れながら浮かび上がるタイトルロゴ
030 タイミングよくランダムに動き出すタイポグラフィ
031 Illustratorで作る回転するロゴ3Dアニメーション
Chapter03 機能的なメニュー＆ナビゲーションのネタ
032 メニューボタンのクリックでスライド表示するサブメニュー
033 グレイアウトするナビゲーションボタン
034 スライドメニューによるシームレスなコンテンツ移動
035 クリックで矢印が出現する楽しいナビゲーション
036 本のページをめくるような楽しいナビゲーション
037 キッチンタイマーの取っ手が回転してリンクを指し示す
038 トビラの向こうで手を振るキャラクター
039 パーツとして使い回しが効く独立型メニュー
040 ナビゲーションのバックをバブルのアニメーションに！
041 アイコンがスムーズに拡大！ OSXのDOC風ナビゲーション
042 スクロールしてコンテンツが入れ替わるインターフェイス
043 CSSで作るオーバー画像が切り替わるリストメニュー
Chapter04 サイトを彩るWebパーツのネタ
044 やわらかさを演出するAqua風半透明ボタン
045 CSSでテーブル背景色が変化するメニュー
046 思わず押したくなるリアルなボタン
047 ボーダーが緩やかに流れる動きのあるタイポタイトル
048 立体的でインパクトのあるクリアボタン
049 WEBページを印象づけるキャッチーなロゴループ
050 ビットマップのキャラクターがボーリングでナビゲート
051 ビットマップキャラが走るローディングアニメーション
052 WEBページの内容に即したナビゲーションボタン
053 グラデーションがなめらかに刻々と変化する帯デザイン
054 鮮やかなグラデーションの動きでクリックを誘導
055 モザイクにオーバーすると徐々にクリアな画像が出現
056 キラキラ回転しながら舞い落ちる星
057 マウスのカーソルをじっと見つめるキャラクター
058 再生逆再生で、なめなかに拡大／縮小するボタン
Chapter05 ユーザーを刺激するサウンド効果のネタ
059 効果的なSEの設定でイメージを伝わりやすく演出！
060 ランダムに効果音を再生するプレーヤー
061 複数のBGMをボタンでクロスフェード
062 アニメーションとサウンドをタイミングよく同期させる
063 サウンドのON／OFFをボタンでコントロール
Chapter06 Webで効果的な画像処理＆加工のネタ
064 境界が曖昧な画像の必殺切り抜きテクニック
065 異なる描画モードを重ねて雰囲気のある写真画像を作る
066 自在に応用が利く簡単画像加工ワザ
067 複数の写真画像をきれいにつないで見せる
068 写真画像を背景色にシームレスに溶け込ませる
069 トーンジャンプをノイズとぼかしで撃退！
070 雑誌の見開き風の影をFlashのグラデーションで！
071 スタイルの変更も簡単！ リッチテイストのはめ込み文字
072 網点が小さくなって最後に写真に変わるアニメーション
073 塗りにbitパターンを適用しデジタルなイメージを強調
074 ボタンをクリックすると画像にエンボス効果がかかる
075 写真の加工とパスのグラデで使い勝手のいい画像を作成
076 背景と商品が一体化したハイセンスなページデザイン
077 画像を地のテクスチャに溶け込ませる
Chapter07 完成度を高めるクオリティアップのネタ
078 backgroundを上手に使ったシームレスな背景
079 CSSを使ってカラフルで立体感のあるフォームを作る
080 ロールオーバーしたメニューの画像を最前面に表示する
081 CSSで手軽に背景にグラデーションを使う
082 見出しタグの背景に画像を利用する
083 CSSによる軽快なロールオーバー
084 外部テキストを読み込んで1文字ずつ表示する
085 Flashを使わずにNow Loadingを表示する
086 CSSとGIFアニメーションを組み合わせたロールオーバー
087 ボタンをクリックすると出現する入力フィールド
Chapter08 デザインパターンを広げるレイアウトのネタ
088 複数のウィンドウを連動させてコンテンツ表示
089 テーブルを使わずに角丸の枠をつくる
090 背景画像を差し替えるだけで更新もラクラクなトップページ
091 テーブルの枠線を利用した立体感のあるグラフィック
092 IFLAMEを利用した自由で効率的なレイアウト
093 画像の追加も簡単なFlashスライドショー
094 ボタンで写真を選択し別窓にズーム画像を表示
095 画像がスライドしながら入れ替わるように表示される
096 スペーサーを活用して曲線を生かしたレイアウト
097 机上の小物など、身近なモチーフでナビゲーション！
098 画面サイズを変更しても同じ位置にロゴが移動する
