ブロックアニメーション機能
全部乗せ、マシマシ
ちゃんぷる
最悪の評判なのか
評判が悪いブロックアニメーションページを作りました。
評判が悪いブロックアニメーションを考えると、ご覧のこのページに採用している「ちゃんぷるブロックアニメーション」と思います。ちゃんぷるという言葉は沖縄県で一般的に使われる割合が多い方言です。意味は、あれこれ混ぜたモノと考えるといいでしょう。沖縄県内で飲食店のメニューに「ゴーヤちゃんぷる」、「フーチャンプル」よく書かれています。悪い意味ではありません。
このページの評判が悪い理由を考えると、お客様視点で考えていません。ホームページを見ると、「目が疲れる」、「目がチカチカする」といった見せ方に問題があると考えられます。記事内容（コンテンツ）の良し悪しはここでは触れません。
ブロックアニメーション機能そのものは、ページ内のブロックアニメーション採用箇所がお客様の目に触れたその瞬間に１回だけ動作するようにしているので、ページを読み進めて、その後振り返りをしても同一ページ内なのでブロックアニメーション動作は止まったままなのです。
多様することは禁物
ホームページ画面の動きにルールを決め、メリハリのあるものがおすすめ。
ブロックアニメーションは一つのブロックごとに設定が可能です。しかし、スクロールするたびに、右から上から下からと、どんどん動かすことができますが、ランダムに仕掛けると、ホームページ閲覧者を疲れさせてしまうことになります。
例えば、タイトルは「ローテートイン」で出てきて、長い文章が入るコンテンツはふわっと下から上へフェイドインしてくるなど、フェード系のゆったりしたものとその他のアクティブな動きをするものの組み合わせがオススメです。
あえて動かさないブロックを途中に入れることで、動きが活きてくることもあります。また、フリップインなどは、カラムが多いところに使用するとパラパラとカードのように現れて綺麗な表現をすることができます。
特に、バウンスウィング・シェイク・フリップイン・ローテートインの4種はなかなか大きな動きになるので、目立たせたいところに絞ってアイキャッチとして使うと効果的です。
ちゃんぷるは問題なのか
多様性という言葉があります。英語のカタカナ読みではダイバーシティ（diversity）なのでそのままカタカナ英語を使う人も見かけます。どちらを使うのが良いか悪いかと考えるよりも、まずは行動してみてはどうでしょうか。
ちゃんぷる
↓下部、ピンク色、黄色の背景色内（ピンクブロック、イエローブロック）のみ「ちゃんぷる」動作します。
フェード・イン
何か足りない、何かほしいに隠し味を加える
ブロックアニメーション機能
フェード・インとは
フェード・イン（fade-in）の動きは、音楽に例えれば、徐々に音を大きくすることです。ホームページ製作では私たちは文字、映像を徐々にはっきりさせる表現に使っています。
フェードインはホームページ画面を開いたときに一度だけ動作します。
もう一度動きを確かめる
ブラウザの持つ機能である再読み込み機能（キーボードからであれば一般に”F５”ボタン）で確認できます。
このブロックアニメーション機能は、ホームページを開いたときに「１回限り」動くように企画、設計、開発しています。
継続的に動き続ける、動きが止まらないアニメーションはブロックアニメーション機能ではなく、別の異なる機能としてご用意もしております。
フェード・イン（右へ）
何か足りない、何かほしいに隠し味、動き加える
ブロックアニメーション機能
フェード・イン（右へ）とは
基本となる普通のフェード・イン（fade-in）の動きに、右方向への移動しながらの動きを加えたものが「フェード・イン（右へ）」です。
「フェードイン右へ」は、画面正面左端からスタートし右へ移動しながらフェード・インし停止します。ホームページ画面閲覧時に一度だけ動作する機能です。
ブラウザの持つ機能である再読み込み機能（キーボードからであれば一般に”F５”ボタン）で確認できます。
このブロックアニメーション機能は、ホームページを開いたときに「１回限り」動くように企画、設計、開発しています。
継続的に動き続ける、動きが止まらないアニメーションはブロックアニメーション機能ではなく、別の異なる機能としてご用意もしております。
フェード・イン（左へ）
何か足りない、何かほしいに隠し味、動きを加える
ブロックアニメーション機能
フェード・イン（左へ）とは
基本となる普通のフェード・イン（fade-in）の動きに、左方向への移動しながらの動きを加えたものが「フェード・イン（左へ）」です。
「フェードイン左へ」は、画面正面右端からスタートし左へ移動しながらフェード・インし停止します。ホームページ画面閲覧時に一度だけ動作する機能です。
もう一度見る
ブラウザの持つ機能である再読み込み機能（キーボードからであれば一般に”F５”ボタン）で確認できます。
このブロックアニメーション機能は、ホームページを開いたときに「１回限り」動くように企画、設計、開発しています。
継続的に動き続ける、動きが止まらないアニメーションはブロックアニメーション機能ではなく、別の異なる機能としてご用意もしております。
フェード・イン（下へ）
何か足りない、何かほしいに隠し味、上からの動き
ブロックアニメーション機能
フェード・イン（下へ）とは
基本となる普通のフェード・イン（fade-in）の動きに、下方向への移動しながらの動きを加えたものが「フェード・イン（下へ）」です。
文字、画像が上から落ちてくる感じです。
「フェードイン下へ」は、画面正面上部からスタートし下部へ移動しながらフェード・インし停止します。ホームページ画面閲覧時に一度だけ動作する機能です。
もう一度見る
ブラウザの持つ機能である再読み込み機能（キーボードからであれば一般に”F５”ボタン）で確認できます。
このブロックアニメーション機能は、ホームページを開いたときに「１回限り」動くように企画、設計、開発しています。
継続的に動き続ける、動きが止まらないアニメーションはブロックアニメーション機能ではなく、別の異なる機能としてご用意もしております。
フェード・イン（上へ）
何か足りない、何かほしいに隠し味、下からの動き
ブロックアニメーション機能
フェード・イン（上へ）とは
基本となる普通のフェード・イン（fade-in）の動きに、上方向への移動しながらの動きを加えたものが「フェード・イン（上へ）」です。
文字、画像が植物が育つように土の中から成長してくる感じです。
もう一度見る
ブラウザの持つ機能である再読み込み機能（キーボードからであれば一般に”F５”ボタン）で確認できます。
このブロックアニメーション機能は、ホームページを開いたときに「１回限り」動くように企画、設計、開発しています。
継続的に動き続ける、動きが止まらないアニメーションはブロックアニメーション機能ではなく、別の異なる機能としてご用意もしております。
サイド・イン
何か足りない、何かほしいに隠し味、左右からの動き。
ブロックアニメーション機能
サイド・インとは
基本となる普通のフェード・イン（fade-in）の動きに、左右両サイドから移動しながらの動きを加えたものが「サイド・イン」です。
文字、画像が左右同時に中央へ集まる感じです。
もう一度見る
ブラウザの持つ機能である再読み込み機能（キーボードからであれば一般に”F５”ボタン）で確認できます。
このブロックアニメーション機能は、ホームページを開いたときに「１回限り」動くように企画、設計、開発しています。
継続的に動き続ける、動きが止まらないアニメーションはブロックアニメーション機能ではなく、別の異なる機能としてご用意もしております。
サイド・イン２
サイド・イン機能の応用編
２カラム以上
１カラム
このカラム１は、フェードインしながら左方向から入り右へ移動します。
２カラム
このカラム２は、静止状態でフェードインのみします。
３カラム
こカラム３は、フェードインしながら右方向から入り左へ移動します。
カラムの数により動きは異なります。
ズーム・イン
何か足りない、何かほしいに隠し味、カメラズームの動き
ブロックアニメーション機能
ズーム・インとは
基本となる普通のフェード・イン（fade-in）の動きに、連続的に拡大する動きを加えたものが「ズーム・イン」です。
カメラに例えると、ズームインはカメラがズームレンズを使って画面を徐々に拡大する、カメラの映像が連続的に拡大する、被写体を拡大撮影する、カメラマンが被写体に徐々に近づいて撮る、被写体をクローズアップする感じです。
もう一度見る
ブラウザの持つ機能である再読み込み機能（キーボードからであれば一般に”F５”ボタン）で確認できます。
このブロックアニメーション機能は、ホームページを開いたときに「１回限り」動くように企画、設計、開発しています。
継続的に動き続ける、動きが止まらないアニメーションはブロックアニメーション機能ではなく、別の異なる機能としてご用意もしております。
バウンズ・イン
何か足りない、何かほしいに隠し味、ボールの跳ねる動き
ブロックアニメーション機能
バウンズ・インとは
基本となる普通のフェード・イン（fade-in）の動きに、ボールが跳ねるような動きを加えたものが「バウンズ・イン」です。
野球やバスケットボールのボールが、跳ねたり、飛んだりする感じです。
もう一度見る
ブラウザの持つ機能である再読み込み機能（キーボードからであれば一般に”F５”ボタン）で確認できます。
このブロックアニメーション機能は、ホームページを開いたときに「１回限り」動くように企画、設計、開発しています。
継続的に動き続ける、動きが止まらないアニメーションはブロックアニメーション機能ではなく、別の異なる機能としてご用意もしております。
シェイク
何か足りない、何かほしいに隠し味、よく振る動き
ブロックアニメーション機能
シェイクとは
基本となる普通のフェード・イン（fade-in）の動きに、よく混ぜるために振るという動き加えたものが「シェイク」です。
例えば、カクテルをよりしっかりと混ぜるために、振るという動作です。
もう一度動きを確かめる
ブラウザの持つ機能である再読み込み機能（キーボードからであれば一般に”F５”ボタン）で確認できます。
このブロックアニメーション機能は、ホームページを開いたときに「１回限り」動くように企画、設計、開発しています。
継続的に動き続ける、動きが止まらないアニメーションはブロックアニメーション機能ではなく、別の異なる機能としてご用意もしております。
フリップイン
何か足りない、何かほしいに隠し味の動き。
ブロックアニメーション機能
ブロックアニメーションとは
何か足りない。そんな時にホームページに動きを加えることで伝えやすく、見やすく、華やかにする機能です。それが私達、がじまる図画工作室WEBチームが提案するブロックアニメーション機能です。
もう一度見る
ブラウザの持つ再生機能、もしくは再読み込みで確認できます。
このブロックアニメーション機能は、ホームページを開いたときに「１回限り」動くように企画、設計、開発しています。
動き続けるアニメーションはブロックアニメーション機能ではなく、別の異なる機能としてご用意しております。
ローテートイン
何か足りない、何かほしいに隠し味の動き。
ブロックアニメーション機能
ブロックアニメーションとは
何か足りない。そんな時にホームページに動きを加えることで伝えやすく、見やすく、華やかにする機能です。それが私達、がじまる図画工作室WEBチームが提案するブロックアニメーション機能です。
もう一度見る
ブラウザの持つ再生機能、もしくは再読み込みで確認できます。
このブロックアニメーション機能は、ホームページを開いたときに「１回限り」動くように企画、設計、開発しています。
動き続けるアニメーションはブロックアニメーション機能ではなく、別の異なる機能としてご用意しております。