1/7開催｜CSSだけで作るFadeIn実装セミナー

スクロールで自然に現れる「動き」を学ぶ――無料オンラインセミナーの狙いと開催概要

クリーク･アンド･リバー社（C&R社）は2026年1月7日（水）に、Webデザイナーやコーダー、専門学校やスクールでWebを学んでいる方を対象とした無料オンラインセミナーを開催します。プレスリリースは2025年12月17日 20時30分に発表されました。

本セミナーは「デモンストレーションを見ながら学ぶサイト制作の基礎（２）〜FadeInアニメーションを利用してコンテンツを表現してみる〜」と題し、スクロールに合わせて要素がFadeInして現れる表現を、CSSのみで実装する手法に焦点を当てます。参加費は無料で、定員は60名です。開催日時や締切などの主要項目は以下の通りです。

• 開催日時：2026年1月7日（水）19:00〜20:00
• 申込締切：2026年1月7日（水）20:00（同日20時までに申込要）
• 場所：オンライン開催
• 参加費：無料
• 定員：60名
• 申込ページ：https://www.creativevillage.ne.jp/category/crv_event/169717/

実践的な「FadeIn」実装を学ぶ――セミナーで扱う技術と期待できる習得項目

本セミナーの主な目的は、スクロールに連動して要素がフェードインする演出を、JavaScriptに頼らずCSSのみで実装する方法の構造を理解することです。シリーズの第2回にあたり、1つのWebサイトをheaderから順に作成していく構成の中で、今回は各コンテンツ部分に入ります。

対象レベルとしては、基本的なHTMLやCSSを理解していること、jQueryの使い方を理解していることが推奨されています。以下の内容を中心にデモンストレーションを交えながら解説が行われます。

セミナーの主な内容

FadeInアニメーションの基本構造と仕組み

CSSのみで実装するスクロール連動アニメーション

FadeInの実装概要

セミナーでは、フェードインの基本的なCSS設計（初期状態、トランジション、スクロールで発火させるトリガーの構成など）を確認します。視覚効果を実現するためのベースとなるプロパティと、その組み合わせ方を丁寧に解説します。

また、セマンティクスやアクセシビリティを損なわない実装の考え方、アニメーションがパフォーマンスに与える影響の軽減方法、ブラウザ互換性の考慮点についても触れられます。デモンストレーションを通じて、コードの変化とブラウザ上での動作を同時に確認しながら学びます。

登壇者のプロフィールと運営・申込に関する詳細

本回の登壇者は塚田大祐（つかだ・だいすけ）氏。肩書きは「『祐』-たすく- 代表取締役」で、Web・OfficeインストラクターおよびWebディレクターとしての豊富な実務・教育経験を有します。専門学校での教員経験や雑誌・チラシ・カタログ・Webサイト制作、大学や専門学校での非常勤講師、企業向けデザイン研修、Office研修などを中心に活動してきました。

塚田氏はMac検定委員会の検定準備委員会役員や検定問題の基礎構築・問題作成に携わっており、『マックでマンガ』（共著）での執筆実績もあります。Web制作の実務と教育現場双方の視点を持つ講師による、実践的な解説が期待できます。

申込方法と問い合わせ先

申込はクリエイティブ関連情報サイト「CREATIVE VILLAGE」の該当ページより行います。申込ページのURLは複数箇所で案内されていますが、代表的な申込先は以下です：https://www.creativevillage.ne.jp/category/crv_event/169717/。申込締切は2026年1月7日（水）20:00です。

問い合わせは株式会社クリーク･アンド･リバー社 PEC事務局「サイト制作の基礎」セミナー担当まで。連絡先はメール：pec_seminar@pr.cri.co.jpです。

C&R社の関連サービスと関連リンク、参考資料

C&R社（クリーク･アンド･リバー社）は1990年創業のクリエイター・エージェンシーで、映像、ゲーム、Web、広告・出版、作家、舞台芸術、建築、AI/DXなど広範な分野でプロフェッショナル支援を展開しています。本セミナーは教育部門PEC（Professional Education Center）による取り組みの一環です。

PECはウェビナーのアーカイブを法人向けにパッケージ化したオンライン研修サービス「PECスタ」を開始しています。IT・デジタル・クリエイティブ領域のコンテンツを中心に、デザイン、プログラミング、AIなどの最新技術もカバーしています。

• PECサービス詳細：https://www.creativevillage.ne.jp/category/topcreators/web-creator/110965/
• PECスタ案内：https://www.cri.co.jp/news/005792.html
• C&R社ニュース（関連プレスリリース）：https://www.cri.co.jp/news/006034.html?prt
• 制作イメージ（YouTube）：https://www.youtube.com/watch?v=7JkLO2DE_N4&t=17s
• CREATIVE VILLAGEサイト：https://www.creativevillage.ne.jp/

そのほか、関連するデザイン・クリエイティブ系のセミナー情報として次の講座が案内されています。

1. 卓越したUIを作る ゲーム、アプリ、Webサイト（eラーニング）：https://www.creativevillage.ne.jp/category/crv_event/154594/
2. Figma入門講座（eラーニング／全21回）：https://www.creativevillage.ne.jp/category/crv_event/151513/
3. その他のデザイン・クリエイティブ関連セミナー案内ページ：https://www.creativevillage.ne.jp/category/crv_event_category/crv_event_creative-design/

この記事では、セミナーの目的、扱う技術、登壇者情報、申し込み方法、C&R社の関連サービスと参考リンクを整理しました。参加を検討する場合は、申込締切および定員にご注意のうえ、上記の申込ページより手続きを行ってください。