<?xml version="1.0" encoding="UTF-8"?><rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>ティップスマッシュ</title>
	<atom:link href="https://ko-jyblog.com/feed/" rel="self" type="application/rss+xml" />
	<link>https://ko-jyblog.com</link>
	<description>映像制作の初心者でも中級者になれる知識を紹介</description>
	<lastBuildDate>Fri, 06 Mar 2026 13:01:58 +0000</lastBuildDate>
	<language>ja</language>
	<sy:updatePeriod>
	hourly	</sy:updatePeriod>
	<sy:updateFrequency>
	1	</sy:updateFrequency>
	<generator>https://wordpress.org/?v=6.9.1</generator>

<image>
	<url>https://ko-jyblog.com/wp-content/uploads/2022/05/cropped-logo_sqaure_1080_ok_textnasi-32x32.jpg</url>
	<title>ティップスマッシュ</title>
	<link>https://ko-jyblog.com</link>
	<width>32</width>
	<height>32</height>
</image> 
	<item>
		<title>動画編集初心者必携！AEJuice「I Want It All Bundle Lifetime」はコスパ最強</title>
		<link>https://ko-jyblog.com/aftereffects/%e3%82%b3%e3%82%b9%e3%83%91%e6%9c%80%e5%bc%b7%e3%81%aeaftereffects%e7%b4%a0%e6%9d%90%e9%9b%86%e3%80%90%e5%89%b2%e5%bc%95%e3%82%af%e3%83%bc%e3%83%9d%e3%83%b3%e3%81%82%e3%82%8a%e3%80%91/</link>
					<comments>https://ko-jyblog.com/aftereffects/%e3%82%b3%e3%82%b9%e3%83%91%e6%9c%80%e5%bc%b7%e3%81%aeaftereffects%e7%b4%a0%e6%9d%90%e9%9b%86%e3%80%90%e5%89%b2%e5%bc%95%e3%82%af%e3%83%bc%e3%83%9d%e3%83%b3%e3%81%82%e3%82%8a%e3%80%91/#comments</comments>
		
		<dc:creator><![CDATA[コージー]]></dc:creator>
		<pubDate>Thu, 27 Jun 2024 02:45:19 +0000</pubDate>
				<category><![CDATA[After Effects]]></category>
		<category><![CDATA[AEJuice]]></category>
		<category><![CDATA[AfterEffects]]></category>
		<category><![CDATA[アフターエフェクト]]></category>
		<category><![CDATA[素材集]]></category>
		<category><![CDATA[動画素材]]></category>
		<guid isPermaLink="false">https://ko-jyblog.com/?p=788</guid>

					<description><![CDATA[動画編集や映像制作をやってみたい、仕事にしたいと思っている方に向けて、コスパ最強の素材集AfterEffectsの素材集「I Want It All Bundle Lifetime」を紹介します。 I Want It A [&#8230;]]]></description>
										<content:encoded><![CDATA[
<p>動画編集や映像制作をやってみたい、仕事にしたいと思っている方に向けて、コスパ最強の素材集AfterEffectsの素材集「I Want It All Bundle Lifetime」を紹介します。</p>



<figure class="wp-block-embed is-type-video is-provider-youtube wp-block-embed-youtube wp-embed-aspect-16-9 wp-has-aspect-ratio"><div class="wp-block-embed__wrapper">
<iframe title="[98% OFF] &quot;Lowest Price + New Coupon Released!&quot; AEJuice&#039;s charm/best cost performance Ae preset" width="1256" height="707" src="https://www.youtube.com/embed/9xMqx1I5cJQ?feature=oembed" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe>
</div></figure>



<h2 class="wp-block-heading">I Want It All Bundle Lifetimeとは</h2>



<p>「I Want It All Bundle Lifetime」とは、すべてのAEJuice拡張パックをセットにしたお得なバンドル製品です。<br>単品で購入することもできますが、バンドルを購入する方が圧倒的にお得です。</p>



<p>「I Want It All Bundle Lifetime」には70種類以上の製品が収録されています。<br>しかもそれぞれの製品の中に大量の素材が含まれているので、数えきれないほど膨大な数が収録されています。<br>欲しい素材をちょこちょこ単品で買うよりも<span class="bold-red"><span class="fz-22px">断然お得</span></span>です！<br>これだけの数があれば、あらゆる場面に対応できるでしょう。</p>



<p>これから副業で動画編集をしようと思っている方、映像制作の仕事を目指している方は持っていて損はありません！</p>



<p>しかもすべて<span class="marker"><strong><span class="fz-32px"><span class="fz-24px">商用利用可能</span></span></strong></span>！<br>動画編集の仕事を始めたばかりの方でも、AEJuiceを使えば一気に動画のクオリティーをアップさせることができます。</p>



<div class="wp-block-cocoon-blocks-balloon-ex-box-1 speech-wrap sb-id-24 sbs-stn sbp-l sbis-cb cf block-box"><div class="speech-person"><figure class="speech-icon"><img decoding="async" src="https://ko-jyblog.com/wp-content/uploads/2022/05/cf1dcd9e96b70f9e785d4ca581cef762.jpg" alt="マル" class="speech-icon-image"/></figure><div class="speech-name">マル</div></div><div class="speech-balloon has-text-color has-background has-border-color has-black-color has-watery-yellow-background-color has-yellow-border-color">
<p>これだけの数の素材が入っているなら、お値段も高いんじゃない？</p>
</div></div>



<div class="wp-block-cocoon-blocks-balloon-ex-box-1 speech-wrap sb-id-15 sbs-stn sbp-r sbis-cb cf block-box"><div class="speech-person"><figure class="speech-icon"><img decoding="async" src="https://ko-jyblog.com/wp-content/uploads/2021/11/Tvman_render_profile_512.jpg" alt="コージー" class="speech-icon-image"/></figure><div class="speech-name">コージー</div></div><div class="speech-balloon has-background has-border-color has-watery-yellow-background-color has-yellow-border-color">
<p><span class="fz-16px">通常価格だと8000ドル以上するけど、セール中だと<strong><span class="marker-under-red"><span class="fz-20px">149ドル</span></span></strong>で購入することができるよ。</span></p>
</div></div>



<p>タイトルの「コスパ最強」というのは「I Want It All Bundle Lifetime」をセール中に購入した時限定です。<br>通常価格で購入するのはもったいない&#8230;<br><strong><span class="fz-18px"><span class="fz-32px"><span class="bold-red">絶対</span></span></span></strong>にセールのタイミングで購入することをオススメします。</p>



<p>下記の25％OFFクーポンを使うことでさらにお得に購入できます。</p>



<h3 class="wp-block-heading">25％OFFクーポンの使い方</h3>



<p>　ステップ１. 「add to cart」をクリック<br>　ステップ２. 画面右上の買い物カートボタンをクリック<br>　ステップ３. 「Got a coupon code?」をクリック<br>　ステップ４. クーポンコードの欄に「<strong><span class="bold-red"><span class="fz-20px">F2KM25</span></span></strong>」を入力</p>



<div class="wp-block-cocoon-blocks-button-1 button-block"><a rel="noopener" href="https://aejuice.com/product/i-want-it-all-bundle-lifetime/?ref=tipsmash" class="btn btn-m btn-circle has-text-color has-background has-white-color has-deep-orange-background-color" target="_blank">購入はこちら</a></div>



<h2 class="wp-block-heading">AEJuiceの使用例</h2>



<p>文字PVでの使用例をご紹介します。</p>



<iframe width="560" height="315" src="https://www.youtube.com/embed/d0unkLyZNx8?si=agLDJZvJg2a8zwKc&amp;clip=UgkxpcqpEOeWBcVmFOAy8z6OeMnUC0fBAjMT&amp;clipt=EMyxNRjD0jY" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe>



<h3 class="wp-block-heading"><span class="fz-24px"><strong>使用した製品</strong></span></h3>



<div class="wp-block-media-text is-stacked-on-mobile" style="grid-template-columns:20% auto"><figure class="wp-block-media-text__media"><img fetchpriority="high" decoding="async" width="402" height="551" src="https://ko-jyblog.com/wp-content/uploads/2024/06/Text-Animation-Presets.png" alt="" class="wp-image-807 size-full" srcset="https://ko-jyblog.com/wp-content/uploads/2024/06/Text-Animation-Presets.png 402w, https://ko-jyblog.com/wp-content/uploads/2024/06/Text-Animation-Presets-300x411.png 300w" sizes="(max-width: 402px) 100vw, 402px" /></figure><div class="wp-block-media-text__content">
<p><strong><span class="fz-16px"><span class="fz-22px"><a href="https://aejuice.com/product/text-animation-presets/?ref=tipsmash">Text Animation Presets</a></span></span></strong></p>



<p>After Effects および Premiere Pro用の2Dテキストアニメーションプリセットタイトルのパックです。</p>
</div></div>



<div class="wp-block-media-text is-stacked-on-mobile" style="grid-template-columns:20% auto"><figure class="wp-block-media-text__media"><img loading="lazy" decoding="async" width="402" height="551" src="https://ko-jyblog.com/wp-content/uploads/2024/06/2D-Animation-Presets.png" alt="" class="wp-image-808 size-full" srcset="https://ko-jyblog.com/wp-content/uploads/2024/06/2D-Animation-Presets.png 402w, https://ko-jyblog.com/wp-content/uploads/2024/06/2D-Animation-Presets-300x411.png 300w" sizes="auto, (max-width: 402px) 100vw, 402px" /></figure><div class="wp-block-media-text__content">
<p><strong><span class="fz-22px"><a href="https://aejuice.com/product/2d-animation-presets/?ref=tipsmash">2D Animation Presets</a></span></strong></p>



<p>After Effects および Premiere Pro用の2Dアニメーションプリセットパックです。<br>約2250種類も収録されており、様々な場面に対応できます。</p>
</div></div>



<div class="wp-block-media-text is-stacked-on-mobile" style="grid-template-columns:20% auto"><figure class="wp-block-media-text__media"><img loading="lazy" decoding="async" width="402" height="551" src="https://ko-jyblog.com/wp-content/uploads/2024/06/Liquid-Elements.png" alt="" class="wp-image-816 size-full" srcset="https://ko-jyblog.com/wp-content/uploads/2024/06/Liquid-Elements.png 402w, https://ko-jyblog.com/wp-content/uploads/2024/06/Liquid-Elements-300x411.png 300w" sizes="auto, (max-width: 402px) 100vw, 402px" /></figure><div class="wp-block-media-text__content">
<p><span class="fz-22px"><strong><a href="https://aejuice.com/product/liquid-elements/?ref=tipsmash">Liquid Elements</a></strong></span></p>



<p>雷や蒸気、水しぶきなどの流体エフェクトが約1000種類も収録されています。<br>複数のバリエーションが収録されているので、動画に合ったものを選ぶことができます。</p>
</div></div>



<div class="wp-block-media-text is-stacked-on-mobile" style="grid-template-columns:20% auto"><figure class="wp-block-media-text__media"><img loading="lazy" decoding="async" width="402" height="551" src="https://ko-jyblog.com/wp-content/uploads/2024/06/Monster-Transitions.png" alt="" class="wp-image-804 size-full" srcset="https://ko-jyblog.com/wp-content/uploads/2024/06/Monster-Transitions.png 402w, https://ko-jyblog.com/wp-content/uploads/2024/06/Monster-Transitions-300x411.png 300w" sizes="auto, (max-width: 402px) 100vw, 402px" /></figure><div class="wp-block-media-text__content">
<p><strong><span class="fz-22px"><a href="https://aejuice.com/product/monster-transitions/?ref=tipsmash">Monster Transitions</a></span></strong></p>



<p>After Effects、Premiere Pro、その他のビデオエディター用のトランジションのパックです。<br>円形、シャッター、ストライプなどポップなデザインのものが多く収録されています。</p>
</div></div>



<div class="wp-block-media-text is-stacked-on-mobile" style="grid-template-columns:20% auto"><figure class="wp-block-media-text__media"><img loading="lazy" decoding="async" width="402" height="551" src="https://ko-jyblog.com/wp-content/uploads/2024/06/Liquid-Transitions.png" alt="" class="wp-image-817 size-full" srcset="https://ko-jyblog.com/wp-content/uploads/2024/06/Liquid-Transitions.png 402w, https://ko-jyblog.com/wp-content/uploads/2024/06/Liquid-Transitions-300x411.png 300w" sizes="auto, (max-width: 402px) 100vw, 402px" /></figure><div class="wp-block-media-text__content">
<p><span class="fz-22px"><strong><a href="https://aejuice.com/product/liquid-transitions/?ref=tipsmash">Liquid Transitions</a></strong></span></p>



<p>After Effects、Premiere Pro、その他のビデオエディター用のリキッドトランジションのパックです。</p>
</div></div>



<div class="wp-block-media-text is-stacked-on-mobile" style="grid-template-columns:20% auto"><figure class="wp-block-media-text__media"><img loading="lazy" decoding="async" width="402" height="551" src="https://ko-jyblog.com/wp-content/uploads/2024/06/Animated-Backgrounds.png" alt="" class="wp-image-809 size-full" srcset="https://ko-jyblog.com/wp-content/uploads/2024/06/Animated-Backgrounds.png 402w, https://ko-jyblog.com/wp-content/uploads/2024/06/Animated-Backgrounds-300x411.png 300w" sizes="auto, (max-width: 402px) 100vw, 402px" /></figure><div class="wp-block-media-text__content">
<p><span class="fz-22px"><strong><a href="https://aejuice.com/product/animated-backgrounds/?ref=tipsmash">Animated Backgrounds</a></strong></span></p>



<p>グラデーションやテクスチャなど、インパクトのあるアニメーション背景が約140種類収録されています。</p>
</div></div>



<div class="wp-block-media-text is-stacked-on-mobile" style="grid-template-columns:20% auto"><figure class="wp-block-media-text__media"><img loading="lazy" decoding="async" width="402" height="551" src="https://ko-jyblog.com/wp-content/uploads/2024/06/Glitch-Pack.png" alt="" class="wp-image-815 size-full" srcset="https://ko-jyblog.com/wp-content/uploads/2024/06/Glitch-Pack.png 402w, https://ko-jyblog.com/wp-content/uploads/2024/06/Glitch-Pack-300x411.png 300w" sizes="auto, (max-width: 402px) 100vw, 402px" /></figure><div class="wp-block-media-text__content">
<p><span class="fz-22px"><strong><a href="https://aejuice.com/product/glitch-pack/?ref=tipsmash">Glitch Pack</a></strong></span></p>



<p>After Effects用のアニメーショングリッチが約150種類収録されたパックです。</p>
</div></div>



<div class="wp-block-media-text is-stacked-on-mobile" style="grid-template-columns:20% auto"><figure class="wp-block-media-text__media"><img loading="lazy" decoding="async" width="402" height="551" src="https://ko-jyblog.com/wp-content/uploads/2024/06/Glitch-Kinetic-Typography.png" alt="" class="wp-image-814 size-full" srcset="https://ko-jyblog.com/wp-content/uploads/2024/06/Glitch-Kinetic-Typography.png 402w, https://ko-jyblog.com/wp-content/uploads/2024/06/Glitch-Kinetic-Typography-300x411.png 300w" sizes="auto, (max-width: 402px) 100vw, 402px" /></figure><div class="wp-block-media-text__content">
<p><strong><span class="fz-22px"><a href="https://aejuice.com/product/glitch-kinetic-typography/?ref=tipsmash">Glitch Kinetic Typography</a></span></strong></p>



<p>12種類のキネティックタイポグラフィープリセットが収録されたパックです。</p>
</div></div>



<div class="wp-block-media-text is-stacked-on-mobile" style="grid-template-columns:20% auto"><figure class="wp-block-media-text__media"><img loading="lazy" decoding="async" width="402" height="551" src="https://ko-jyblog.com/wp-content/uploads/2024/06/Cartoon-Comics-Pack.png" alt="" class="wp-image-812 size-full" srcset="https://ko-jyblog.com/wp-content/uploads/2024/06/Cartoon-Comics-Pack.png 402w, https://ko-jyblog.com/wp-content/uploads/2024/06/Cartoon-Comics-Pack-300x411.png 300w" sizes="auto, (max-width: 402px) 100vw, 402px" /></figure><div class="wp-block-media-text__content">
<p><span class="fz-22px"><strong><a href="https://aejuice.com/product/cartoon-comics-pack/?ref=tipsmash">Cartoon Comics Pack</a></strong></span></p>



<p>タイトルやバックグラウンドなど、7カテゴリー150種類以上のカートゥーンエフェクトが収録されたパックです。</p>
</div></div>



<div class="wp-block-media-text is-stacked-on-mobile" style="grid-template-columns:20% auto"><figure class="wp-block-media-text__media"><img loading="lazy" decoding="async" width="402" height="551" src="https://ko-jyblog.com/wp-content/uploads/2024/06/Confetti-box.png" alt="" class="wp-image-813 size-full" srcset="https://ko-jyblog.com/wp-content/uploads/2024/06/Confetti-box.png 402w, https://ko-jyblog.com/wp-content/uploads/2024/06/Confetti-box-300x411.png 300w" sizes="auto, (max-width: 402px) 100vw, 402px" /></figure><div class="wp-block-media-text__content">
<p><span class="fz-22px"><strong><a href="https://aejuice.com/product/confetti/?ref=tipsmash">Confetti</a></strong></span></p>



<p>約80種類の紙吹雪のストックビデオが収録されたパックです。</p>
</div></div>



<div class="wp-block-media-text is-stacked-on-mobile" style="grid-template-columns:20% auto"><figure class="wp-block-media-text__media"><img loading="lazy" decoding="async" width="402" height="551" src="https://ko-jyblog.com/wp-content/uploads/2024/06/Newspaper-Constructor.png" alt="" class="wp-image-806 size-full" srcset="https://ko-jyblog.com/wp-content/uploads/2024/06/Newspaper-Constructor.png 402w, https://ko-jyblog.com/wp-content/uploads/2024/06/Newspaper-Constructor-300x411.png 300w" sizes="auto, (max-width: 402px) 100vw, 402px" /></figure><div class="wp-block-media-text__content">
<p><span class="fz-22px"><strong><a href="https://aejuice.com/product/newspaper-constructor/?ref=tipsmash">Newspaper Constructor</a></strong></span></p>



<p>ニュース速報やヘッドライン、フロントページなど90種類以上の新聞をモチーフとしたアニメーションプリセットが収録されたパックです。<br>すべてのテキスト、色、写真、背景をカスタマイズできます。<br><span class="marker-under-red"><span class="bold-red"><span class="marker-under">クオリティが高いのでAEJuiceの中でも特におすすめなパックです。</span></span></span></p>
</div></div>



<div class="wp-block-media-text is-stacked-on-mobile" style="grid-template-columns:20% auto"><figure class="wp-block-media-text__media"><img loading="lazy" decoding="async" width="402" height="551" src="https://ko-jyblog.com/wp-content/uploads/2024/06/Burning-Transitions.png" alt="" class="wp-image-811 size-full" srcset="https://ko-jyblog.com/wp-content/uploads/2024/06/Burning-Transitions.png 402w, https://ko-jyblog.com/wp-content/uploads/2024/06/Burning-Transitions-300x411.png 300w" sizes="auto, (max-width: 402px) 100vw, 402px" /></figure><div class="wp-block-media-text__content">
<p><span class="fz-22px"><strong><a href="https://aejuice.com/product/burning-transitions/?ref=tipsmash">Burning Transitions</a></strong></span></p>



<p>紙やフィルムが焼け落ちるようなトランジションが収録されたパックです。</p>
</div></div>



<div class="wp-block-media-text is-stacked-on-mobile" style="grid-template-columns:20% auto"><figure class="wp-block-media-text__media"><img loading="lazy" decoding="async" width="402" height="551" src="https://ko-jyblog.com/wp-content/uploads/2024/06/Neon-Titles.png" alt="" class="wp-image-805 size-full" srcset="https://ko-jyblog.com/wp-content/uploads/2024/06/Neon-Titles.png 402w, https://ko-jyblog.com/wp-content/uploads/2024/06/Neon-Titles-300x411.png 300w" sizes="auto, (max-width: 402px) 100vw, 402px" /></figure><div class="wp-block-media-text__content">
<p><span class="fz-22px"><strong><a href="https://aejuice.com/product/neon-titles/?ref=tipsmash">Neon Titles</a></strong></span></p>



<p>After Effects および Premiere Pro用のネオンタイトルのパックです。<br>様々な言語やフォントに対応しています。</p>
</div></div>



<div class="wp-block-media-text is-stacked-on-mobile" style="grid-template-columns:20% auto"><figure class="wp-block-media-text__media"><img loading="lazy" decoding="async" width="402" height="551" src="https://ko-jyblog.com/wp-content/uploads/2024/06/Broken-Glass.png" alt="" class="wp-image-810 size-full" srcset="https://ko-jyblog.com/wp-content/uploads/2024/06/Broken-Glass.png 402w, https://ko-jyblog.com/wp-content/uploads/2024/06/Broken-Glass-300x411.png 300w" sizes="auto, (max-width: 402px) 100vw, 402px" /></figure><div class="wp-block-media-text__content">
<p><span class="fz-22px"><strong><a href="https://aejuice.com/product/broken-glass/?ref=tipsmash">Broken Glass</a></strong></span></p>



<p>After Effects と Premiere Pro用の割れたガラスのエフェクトパックです。<br><span class="marker-under-red"><span class="bold-red"><span class="marker-under">クオリティが高いのでAEJuiceの中で</span></span></span><span class="marker-under-red"><span class="bold-red"><span class="marker-under">も</span></span></span><span class="marker-under-red"><span class="bold-red"><span class="marker-under">特におすすめなパックです。</span></span></span></p>
</div></div>



<h2 class="wp-block-heading">購入するなら単品よりバンドルがお得</h2>



<p><span class="fz-22px"><strong><a href="https://aejuice.com/product/newspaper-constructor/?ref=tipsmash">Newspaper Constructor</a></strong></span> と<span class="fz-14px"> <span class="fz-18px"><span class="fz-22px"><strong><a href="https://aejuice.com/product/broken-glass/?ref=tipsmash">Broken Glass</a></strong></span> </span></span>の２つはAEJuiceの製品の中で特におすすめなパックです。<br>どちらも自分で１から素材を準備するにはかなり労力がかかるので、これらの製品を活用することをおすすめします。<br>Newspaper Constructor と Broken Glassはそれぞれ単品で購入すると119ドル。<br><strong><a href="https://aejuice.com/product/i-want-it-all-bundle-lifetime/?ref=tipsmash">I Want It All Bundle Lifetime</a></strong> は70種類以上のパックが収録されて、セール価格なら149ドル。<br>圧倒的にI Want It All Bundle Lifetimeの方がコスパが良いです。</p>



<h3 class="wp-block-heading">購入方法</h3>



<p>　ステップ１. 「add to cart」をクリック<br>　ステップ２. 画面右上の買い物カートボタンをクリック<br>　ステップ３. 「Got a coupon code?」をクリック<br>　ステップ４. クーポンコードの欄に「<strong><span class="bold-red"><span class="fz-20px">F2KM25</span></span></strong>」を入力</p>



<div class="wp-block-cocoon-blocks-button-1 button-block"><a rel="noopener" href="https://aejuice.com/product/i-want-it-all-bundle-lifetime/?ref=tipsmash" class="btn btn-m btn-circle has-text-color has-background has-white-color has-deep-orange-background-color" target="_blank">購入はこちら</a></div>



<h2 class="wp-block-heading">まとめ</h2>



<p>動画編集初心者なら持っていて損はないAfterEffectsのコスパ最強素材集「I Want It All Bundle Lifetime」を紹介しました。</p>



<p>使い切れないほど膨大な数の素材が収録されているので、様々な場面に対応できると思います。<br>文字PVでの使用例も参考にしていただけるとうれしいです。</p>



<div class="wp-block-cocoon-blocks-balloon-ex-box-1 speech-wrap sb-id-16 sbs-stn sbp-l sbis-cb cf block-box"><div class="speech-person"><figure class="speech-icon"><img decoding="async" src="https://ko-jyblog.com/wp-content/uploads/2021/11/Tvman_render_profile_512.jpg" alt="コージー" class="speech-icon-image"/></figure><div class="speech-name">コージー</div></div><div class="speech-balloon has-background has-white-background-color">
<p><span class="fz-24px"><span class="fz-18px">私のYoutubeチャンネルでは、この他にもAfterEffectsのおすすめプラグインを動画で詳しく紹介しています。</span></span><br><span class="fz-24px"><span class="fz-18px">ぜひチェックしてみてください。</span></span></p>
</div></div>



<div class="wp-block-cocoon-blocks-button-1 button-block"><a rel="noopener" href="https://www.youtube.com/@tipsmash" class="btn btn-m btn-circle has-text-color has-background has-border-color has-white-color has-deep-orange-background-color has-deep-orange-border-color" target="_blank">Youtubeチャンネル「ティップスマッシュ」はこちら</a></div>



<div class="wp-block-cocoon-blocks-blogcard blogcard-type bct-related">
<a href="https://ko-jyblog.com/aftereffects/aftereffects%e5%88%9d%e5%bf%83%e8%80%85%e5%bf%85%e6%90%ba%ef%bc%81%e3%82%b3%e3%82%b9%e3%83%91%e6%9c%80%e5%bc%b7%e3%81%ae%e7%b4%a0%e6%9d%90%e9%9b%86%e3%81%aa%e3%82%89%e3%80%8caejuice%e3%80%8d/" title="【無料版】AEJuiceのインストール方法【AfterEffects素材集】" class="blogcard-wrap internal-blogcard-wrap a-wrap cf"><div class="blogcard internal-blogcard ib-left cf"><div class="blogcard-label internal-blogcard-label"><span class="fa"></span></div><figure class="blogcard-thumbnail internal-blogcard-thumbnail"><img loading="lazy" decoding="async" width="160" height="90" src="https://ko-jyblog.com/wp-content/uploads/2024/02/thumbnail_AEJuice_ok-160x90.jpg" class="blogcard-thumb-image internal-blogcard-thumb-image wp-post-image" alt="" srcset="https://ko-jyblog.com/wp-content/uploads/2024/02/thumbnail_AEJuice_ok-160x90.jpg 160w, https://ko-jyblog.com/wp-content/uploads/2024/02/thumbnail_AEJuice_ok-500x281.jpg 500w, https://ko-jyblog.com/wp-content/uploads/2024/02/thumbnail_AEJuice_ok-800x450.jpg 800w, https://ko-jyblog.com/wp-content/uploads/2024/02/thumbnail_AEJuice_ok-300x169.jpg 300w, https://ko-jyblog.com/wp-content/uploads/2024/02/thumbnail_AEJuice_ok-768x432.jpg 768w, https://ko-jyblog.com/wp-content/uploads/2024/02/thumbnail_AEJuice_ok-1536x864.jpg 1536w, https://ko-jyblog.com/wp-content/uploads/2024/02/thumbnail_AEJuice_ok-120x68.jpg 120w, https://ko-jyblog.com/wp-content/uploads/2024/02/thumbnail_AEJuice_ok-320x180.jpg 320w, https://ko-jyblog.com/wp-content/uploads/2024/02/thumbnail_AEJuice_ok.jpg 1920w" sizes="auto, (max-width: 160px) 100vw, 160px" /></figure><div class="blogcard-content internal-blogcard-content"><div class="blogcard-title internal-blogcard-title">【無料版】AEJuiceのインストール方法【AfterEffects素材集】</div><div class="blogcard-snippet internal-blogcard-snippet">無料で使用できるAfterEffects素材集の「AEJuice」のインストール方法を紹介します。AfterEffects初心者は一度試してほしい素材集です。</div></div><div class="blogcard-footer internal-blogcard-footer cf"><div class="blogcard-site internal-blogcard-site"><div class="blogcard-favicon internal-blogcard-favicon"><img loading="lazy" decoding="async" src="https://www.google.com/s2/favicons?domain=ko-jyblog.com" alt="" class="blogcard-favicon-image internal-blogcard-favicon-image" width="16" height="16" /></div><div class="blogcard-domain internal-blogcard-domain">ko-jyblog.com</div></div><div class="blogcard-date internal-blogcard-date"><div class="blogcard-post-date internal-blogcard-post-date">2024.06.10</div></div></div></div></a>
</div>
]]></content:encoded>
					
					<wfw:commentRss>https://ko-jyblog.com/aftereffects/%e3%82%b3%e3%82%b9%e3%83%91%e6%9c%80%e5%bc%b7%e3%81%aeaftereffects%e7%b4%a0%e6%9d%90%e9%9b%86%e3%80%90%e5%89%b2%e5%bc%95%e3%82%af%e3%83%bc%e3%83%9d%e3%83%b3%e3%81%82%e3%82%8a%e3%80%91/feed/</wfw:commentRss>
			<slash:comments>2</slash:comments>
		
		
			</item>
		<item>
		<title>【無料版】AEJuiceのインストール方法【AfterEffects素材集】</title>
		<link>https://ko-jyblog.com/aftereffects/aftereffects%e5%88%9d%e5%bf%83%e8%80%85%e5%bf%85%e6%90%ba%ef%bc%81%e3%82%b3%e3%82%b9%e3%83%91%e6%9c%80%e5%bc%b7%e3%81%ae%e7%b4%a0%e6%9d%90%e9%9b%86%e3%81%aa%e3%82%89%e3%80%8caejuice%e3%80%8d/</link>
					<comments>https://ko-jyblog.com/aftereffects/aftereffects%e5%88%9d%e5%bf%83%e8%80%85%e5%bf%85%e6%90%ba%ef%bc%81%e3%82%b3%e3%82%b9%e3%83%91%e6%9c%80%e5%bc%b7%e3%81%ae%e7%b4%a0%e6%9d%90%e9%9b%86%e3%81%aa%e3%82%89%e3%80%8caejuice%e3%80%8d/#comments</comments>
		
		<dc:creator><![CDATA[コージー]]></dc:creator>
		<pubDate>Sun, 09 Jun 2024 20:56:19 +0000</pubDate>
				<category><![CDATA[After Effects]]></category>
		<guid isPermaLink="false">https://ko-jyblog.com/?p=722</guid>

					<description><![CDATA[動画でも詳しく解説しています AEJuiceのインストール方法 AEJuiceを使用するには、「AEJuice Pack Manager」というウィンドウを使用します。このウィンドウから、それぞれのパックの購入やダウンロ [&#8230;]]]></description>
										<content:encoded><![CDATA[
<h2 class="wp-block-heading">動画でも詳しく解説しています</h2>



<figure class="wp-block-embed is-type-video is-provider-youtube wp-block-embed-youtube wp-embed-aspect-16-9 wp-has-aspect-ratio"><div class="wp-block-embed__wrapper">
<iframe loading="lazy" title="[98% OFF] AEJuice&#039;s charm/best cost performance Ae preset &amp; material collection [VFX dictionary]" width="1256" height="707" src="https://www.youtube.com/embed/9xMqx1I5cJQ?feature=oembed" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe>
</div></figure>



<h2 class="wp-block-heading">AEJuiceのインストール方法</h2>



<p>AEJuiceを使用するには、「AEJuice Pack Manager」というウィンドウを使用します。<br>このウィンドウから、それぞれのパックの購入やダウンロード、素材のプロジェクトへのインポートまですべてをおこなえるようになっています。<br>ここではAEJuice無料版のインストール方法をご紹介します。</p>



<h3 class="wp-block-heading">インストール手順</h3>



<p>①AEJuiceにアクセスします。<br>https://aejuice.com/</p>



<p>②画面上部タブの「Free Plugins」をクリックします。</p>



<figure class="wp-block-image size-large is-style-default"><img loading="lazy" decoding="async" width="800" height="450" src="https://ko-jyblog.com/wp-content/uploads/2024/06/2-800x450.jpg" alt="" class="wp-image-743" srcset="https://ko-jyblog.com/wp-content/uploads/2024/06/2-800x450.jpg 800w, https://ko-jyblog.com/wp-content/uploads/2024/06/2-500x281.jpg 500w, https://ko-jyblog.com/wp-content/uploads/2024/06/2-300x169.jpg 300w, https://ko-jyblog.com/wp-content/uploads/2024/06/2-768x432.jpg 768w, https://ko-jyblog.com/wp-content/uploads/2024/06/2-1536x864.jpg 1536w, https://ko-jyblog.com/wp-content/uploads/2024/06/2-120x68.jpg 120w, https://ko-jyblog.com/wp-content/uploads/2024/06/2-160x90.jpg 160w, https://ko-jyblog.com/wp-content/uploads/2024/06/2-320x180.jpg 320w, https://ko-jyblog.com/wp-content/uploads/2024/06/2.jpg 1920w" sizes="auto, (max-width: 800px) 100vw, 800px" /></figure>



<p><br>③ダウンロードボタンをクリックします。<br>OSによってボタンが分かれているので、お使いのOSに該当する方のボタンをクリックしてください。</p>



<figure class="wp-block-image size-large"><img loading="lazy" decoding="async" width="800" height="450" src="https://ko-jyblog.com/wp-content/uploads/2024/06/3-1-800x450.jpg" alt="" class="wp-image-744" srcset="https://ko-jyblog.com/wp-content/uploads/2024/06/3-1-800x450.jpg 800w, https://ko-jyblog.com/wp-content/uploads/2024/06/3-1-500x281.jpg 500w, https://ko-jyblog.com/wp-content/uploads/2024/06/3-1-300x169.jpg 300w, https://ko-jyblog.com/wp-content/uploads/2024/06/3-1-768x432.jpg 768w, https://ko-jyblog.com/wp-content/uploads/2024/06/3-1-1536x864.jpg 1536w, https://ko-jyblog.com/wp-content/uploads/2024/06/3-1-120x68.jpg 120w, https://ko-jyblog.com/wp-content/uploads/2024/06/3-1-160x90.jpg 160w, https://ko-jyblog.com/wp-content/uploads/2024/06/3-1-320x180.jpg 320w, https://ko-jyblog.com/wp-content/uploads/2024/06/3-1.jpg 1920w" sizes="auto, (max-width: 800px) 100vw, 800px" /></figure>



<p><br>④メールアドレスを入力し、プライバシーポリシーの同意にチェックを入れ、ダウンロードボタンをクリックします。</p>



<figure class="wp-block-image size-large"><img loading="lazy" decoding="async" width="800" height="450" src="https://ko-jyblog.com/wp-content/uploads/2024/06/4-800x450.jpg" alt="" class="wp-image-731" srcset="https://ko-jyblog.com/wp-content/uploads/2024/06/4-800x450.jpg 800w, https://ko-jyblog.com/wp-content/uploads/2024/06/4-500x281.jpg 500w, https://ko-jyblog.com/wp-content/uploads/2024/06/4-300x169.jpg 300w, https://ko-jyblog.com/wp-content/uploads/2024/06/4-768x432.jpg 768w, https://ko-jyblog.com/wp-content/uploads/2024/06/4-1536x864.jpg 1536w, https://ko-jyblog.com/wp-content/uploads/2024/06/4-120x68.jpg 120w, https://ko-jyblog.com/wp-content/uploads/2024/06/4-160x90.jpg 160w, https://ko-jyblog.com/wp-content/uploads/2024/06/4-320x180.jpg 320w, https://ko-jyblog.com/wp-content/uploads/2024/06/4.jpg 1920w" sizes="auto, (max-width: 800px) 100vw, 800px" /></figure>



<p><br>⑤「メールを確認してください」という案内が出るので、手順の④で入力したメールアドレスの受信BOXを確認します。</p>



<p>⑥AEJuiceからのメールを開き、「Yes,I want to subscribe(購読)」ボタンを押します。</p>



<figure class="wp-block-image size-large"><img loading="lazy" decoding="async" width="800" height="450" src="https://ko-jyblog.com/wp-content/uploads/2024/06/6-800x450.png" alt="" class="wp-image-745" srcset="https://ko-jyblog.com/wp-content/uploads/2024/06/6-800x450.png 800w, https://ko-jyblog.com/wp-content/uploads/2024/06/6-500x281.png 500w, https://ko-jyblog.com/wp-content/uploads/2024/06/6-300x169.png 300w, https://ko-jyblog.com/wp-content/uploads/2024/06/6-768x432.png 768w, https://ko-jyblog.com/wp-content/uploads/2024/06/6-1536x864.png 1536w, https://ko-jyblog.com/wp-content/uploads/2024/06/6-120x68.png 120w, https://ko-jyblog.com/wp-content/uploads/2024/06/6-160x90.png 160w, https://ko-jyblog.com/wp-content/uploads/2024/06/6-320x180.png 320w, https://ko-jyblog.com/wp-content/uploads/2024/06/6.png 1920w" sizes="auto, (max-width: 800px) 100vw, 800px" /></figure>



<p><br>⑦ファイルがダウンロードされるので、「pack_manager_installer.zip」というZIPファイルを解凍します。</p>



<p>⑧解凍したフォルダ内にあるインストーラー（pack_manager_installer.exe）を起動します。</p>



<figure class="wp-block-image size-large"><img loading="lazy" decoding="async" width="800" height="450" src="https://ko-jyblog.com/wp-content/uploads/2024/06/8-1-800x450.jpg" alt="" class="wp-image-746" srcset="https://ko-jyblog.com/wp-content/uploads/2024/06/8-1-800x450.jpg 800w, https://ko-jyblog.com/wp-content/uploads/2024/06/8-1-500x281.jpg 500w, https://ko-jyblog.com/wp-content/uploads/2024/06/8-1-300x169.jpg 300w, https://ko-jyblog.com/wp-content/uploads/2024/06/8-1-768x432.jpg 768w, https://ko-jyblog.com/wp-content/uploads/2024/06/8-1-1536x864.jpg 1536w, https://ko-jyblog.com/wp-content/uploads/2024/06/8-1-120x68.jpg 120w, https://ko-jyblog.com/wp-content/uploads/2024/06/8-1-160x90.jpg 160w, https://ko-jyblog.com/wp-content/uploads/2024/06/8-1-320x180.jpg 320w, https://ko-jyblog.com/wp-content/uploads/2024/06/8-1.jpg 1920w" sizes="auto, (max-width: 800px) 100vw, 800px" /></figure>



<p><br>⑨セットアップのウィンドウが出てきたら、「Next」をクリックして内容を確認して「I accept the agreement」にチェックを入れ、「Next」をクリックします。</p>



<figure class="wp-block-image size-large"><img loading="lazy" decoding="async" width="800" height="450" src="https://ko-jyblog.com/wp-content/uploads/2024/06/9-800x450.jpg" alt="" class="wp-image-747" srcset="https://ko-jyblog.com/wp-content/uploads/2024/06/9-800x450.jpg 800w, https://ko-jyblog.com/wp-content/uploads/2024/06/9-500x281.jpg 500w, https://ko-jyblog.com/wp-content/uploads/2024/06/9-300x169.jpg 300w, https://ko-jyblog.com/wp-content/uploads/2024/06/9-768x432.jpg 768w, https://ko-jyblog.com/wp-content/uploads/2024/06/9-1536x864.jpg 1536w, https://ko-jyblog.com/wp-content/uploads/2024/06/9-120x68.jpg 120w, https://ko-jyblog.com/wp-content/uploads/2024/06/9-160x90.jpg 160w, https://ko-jyblog.com/wp-content/uploads/2024/06/9-320x180.jpg 320w, https://ko-jyblog.com/wp-content/uploads/2024/06/9.jpg 1920w" sizes="auto, (max-width: 800px) 100vw, 800px" /></figure>



<p><br>⑩インストールしたい製品をチェックして「Next」をクリックします。<br>（基本的にすべてチェックでいいと思います）</p>



<figure class="wp-block-image size-large"><img loading="lazy" decoding="async" width="800" height="450" src="https://ko-jyblog.com/wp-content/uploads/2024/06/8-800x450.jpg" alt="" class="wp-image-736" srcset="https://ko-jyblog.com/wp-content/uploads/2024/06/8-800x450.jpg 800w, https://ko-jyblog.com/wp-content/uploads/2024/06/8-500x281.jpg 500w, https://ko-jyblog.com/wp-content/uploads/2024/06/8-300x169.jpg 300w, https://ko-jyblog.com/wp-content/uploads/2024/06/8-768x432.jpg 768w, https://ko-jyblog.com/wp-content/uploads/2024/06/8-1536x864.jpg 1536w, https://ko-jyblog.com/wp-content/uploads/2024/06/8-120x68.jpg 120w, https://ko-jyblog.com/wp-content/uploads/2024/06/8-160x90.jpg 160w, https://ko-jyblog.com/wp-content/uploads/2024/06/8-320x180.jpg 320w, https://ko-jyblog.com/wp-content/uploads/2024/06/8.jpg 1920w" sizes="auto, (max-width: 800px) 100vw, 800px" /></figure>



<p>⑪インストールが完了したら「Finish」をクリックします。</p>



<p>⑫AfterEffectsを起動します。</p>



<p>⑬メニューバーの「ウィンドウ」から「AEJuice Pack Manager」を開きます。</p>



<p>インストール方法はここまでです。</p>



<p>無料版も有料版も「AEJuice Pack Manager」から使用します。<br>有料版のパッケージも表示されますが、購入していない場合は使用できません。<br>収録されている素材を見ることはできますので、購入する際の参考にしてみてください。</p>



<h2 class="wp-block-heading">無料版でできること</h2>



<p>AEJuiceの無料版では、パッケージ８つとスクリプト6つが使用できます。</p>



<h3 class="wp-block-heading">パッケージ</h3>



<div class="wp-block-media-text is-stacked-on-mobile is-vertically-aligned-center" style="grid-template-columns:20% auto"><figure class="wp-block-media-text__media"><img loading="lazy" decoding="async" width="402" height="551" src="https://ko-jyblog.com/wp-content/uploads/2024/06/001_Starter-Pack.png" alt="" class="wp-image-764 size-full" srcset="https://ko-jyblog.com/wp-content/uploads/2024/06/001_Starter-Pack.png 402w, https://ko-jyblog.com/wp-content/uploads/2024/06/001_Starter-Pack-300x411.png 300w" sizes="auto, (max-width: 402px) 100vw, 402px" /></figure><div class="wp-block-media-text__content">
<p class="has-text-align-left"><span class="bold">・スターターパック</span><br>有料製品のうち、22種類のパッケージのプリセットが使用できます。<br><span class="marker-red"><span class="red">各パッケージの一部しか使用できない点に注意してください。</span></span><br>「モーションカフェUI」というパッケージだけ完全版が収録されており、50種類のヘッドディスプレイの素材を使用できます。</p>
</div></div>



<div class="wp-block-media-text is-stacked-on-mobile" style="grid-template-columns:20% auto"><figure class="wp-block-media-text__media"><img loading="lazy" decoding="async" width="199" height="274" src="https://ko-jyblog.com/wp-content/uploads/2024/06/002_Starter_Pack_VFX.png" alt="" class="wp-image-771 size-full"/></figure><div class="wp-block-media-text__content">
<p><span class="bold">・スターターパックVFX</span><br>10種類の爆発や煙などの素材が使えます。</p>
</div></div>



<div class="wp-block-media-text is-stacked-on-mobile" style="grid-template-columns:20% auto"><figure class="wp-block-media-text__media"><img loading="lazy" decoding="async" width="402" height="551" src="https://ko-jyblog.com/wp-content/uploads/2024/06/003_Slides-Beginner-Collection-1.png" alt="" class="wp-image-767 size-full" srcset="https://ko-jyblog.com/wp-content/uploads/2024/06/003_Slides-Beginner-Collection-1.png 402w, https://ko-jyblog.com/wp-content/uploads/2024/06/003_Slides-Beginner-Collection-1-300x411.png 300w" sizes="auto, (max-width: 402px) 100vw, 402px" /></figure><div class="wp-block-media-text__content">
<p><span class="bold">・Slides Beginner collection</span><br>ワイプトランジションのプリセットが使え、解像度、スライドショーのタイプ、音楽、写真を選択してスライドショーを自動で作成してくれます。</p>
</div></div>



<div class="wp-block-media-text is-stacked-on-mobile" style="grid-template-columns:20% auto"><figure class="wp-block-media-text__media"><img loading="lazy" decoding="async" width="402" height="551" src="https://ko-jyblog.com/wp-content/uploads/2024/06/004_NeonMind-AI-Box.png" alt="" class="wp-image-768 size-full" srcset="https://ko-jyblog.com/wp-content/uploads/2024/06/004_NeonMind-AI-Box.png 402w, https://ko-jyblog.com/wp-content/uploads/2024/06/004_NeonMind-AI-Box-300x411.png 300w" sizes="auto, (max-width: 402px) 100vw, 402px" /></figure><div class="wp-block-media-text__content">
<p><span class="bold">・Neon Mind AI</span><br>Ae内でStable Diffusionを利用できるツールです。<br>モデルを使用してテキストや画像から別の画像や動画を生成することができます。<br>（最大解像度に制限があります）</p>
</div></div>



<div class="wp-block-media-text is-stacked-on-mobile" style="grid-template-columns:20% auto"><figure class="wp-block-media-text__media"><img loading="lazy" decoding="async" width="199" height="274" src="https://ko-jyblog.com/wp-content/uploads/2024/06/005_Free-Lens-Textures.png" alt="" class="wp-image-772 size-full"/></figure><div class="wp-block-media-text__content">
<p><span class="bold">・Free Lens Textures</span><br>８つのレンズテクスチャーが使用できます。<br>画面をリッチにするためのレンズの質感を表現できます。</p>
</div></div>



<div class="wp-block-media-text is-stacked-on-mobile" style="grid-template-columns:20% auto"><figure class="wp-block-media-text__media"><img loading="lazy" decoding="async" width="199" height="274" src="https://ko-jyblog.com/wp-content/uploads/2024/06/006_Expressions-Pack.png" alt="" class="wp-image-773 size-full"/></figure><div class="wp-block-media-text__content">
<p><span class="bold">・Expressions Pack</span><br>47個の便利なエクスプレッションのプリセットが収録されています。</p>
</div></div>



<div class="wp-block-media-text is-stacked-on-mobile" style="grid-template-columns:20% auto"><figure class="wp-block-media-text__media"><img loading="lazy" decoding="async" width="402" height="551" src="https://ko-jyblog.com/wp-content/uploads/2024/06/008_Sound-Effects-Free.png" alt="" class="wp-image-769 size-full" srcset="https://ko-jyblog.com/wp-content/uploads/2024/06/008_Sound-Effects-Free.png 402w, https://ko-jyblog.com/wp-content/uploads/2024/06/008_Sound-Effects-Free-300x411.png 300w" sizes="auto, (max-width: 402px) 100vw, 402px" /></figure><div class="wp-block-media-text__content">
<p><span class="bold">・Sound Effects</span><br>モーショングラフィックス用の効果音が267種類収録されています。<br>キーボードを打つ音や映画の予告に使いそうなインパクトの音などもあります。</p>
</div></div>



<div class="wp-block-media-text is-stacked-on-mobile" style="grid-template-columns:20% auto"><figure class="wp-block-media-text__media"><img loading="lazy" decoding="async" width="402" height="551" src="https://ko-jyblog.com/wp-content/uploads/2024/06/009_2.5D-Devices-Collection.png" alt="" class="wp-image-770 size-full" srcset="https://ko-jyblog.com/wp-content/uploads/2024/06/009_2.5D-Devices-Collection.png 402w, https://ko-jyblog.com/wp-content/uploads/2024/06/009_2.5D-Devices-Collection-300x411.png 300w" sizes="auto, (max-width: 402px) 100vw, 402px" /></figure><div class="wp-block-media-text__content">
<p><span class="bold">・2.5D Devices collection</span><br>Ae用のスマートフォンモデルが利用可能です。</p>
</div></div>



<h3 class="wp-block-heading">スクリプト</h3>



<p><span class="bold">・AEJuice　Export GIF</span><br>ワンクリックでAeからGIFデータを書き出すことができるスクリプトです。</p>



<p><span class="bold">・Anti-Static ToolBox</span><br>レイヤーの並べ替えや複製、親子付け、画面内のオブジェクトの整列などを素早く実行できるツールです。</p>



<p><span class="bold">・AEJuice Toolbar</span><br>自分でツールバーをカスタマイズすることができます。<br>ボタンにはエフェクトを適用したり、エクスプレッションを入力したりｍスクリプトの実行を割り当てることができます。</p>



<p><span class="bold">・Quick Folders</span><br>必要なフォルダーにワンクリックで素早く移動できます。</p>



<p><span class="bold">・Copy Ease</span><br>キーフレームの速度と影響をコピーすることができます。<br>速度グラフの形をそのままコピーして貼り付けることができます。</p>



<p><span class="bold">・Shifter</span><br>正確なフレーム数だけインポイントまたはアウトポイントをずらしたり、選択したパターンに従ってレイヤーを整列またはずらすスクリプトです。</p>



<h2 class="wp-block-heading">コスパ最強な「I Want It All Bundle Lifetime」</h2>


<div class="wp-block-image">
<figure class="aligncenter size-large"><img loading="lazy" decoding="async" width="800" height="450" src="https://ko-jyblog.com/wp-content/uploads/2024/06/render_Top_aejuice-800x450.jpg" alt="" class="wp-image-862" srcset="https://ko-jyblog.com/wp-content/uploads/2024/06/render_Top_aejuice-800x450.jpg 800w, https://ko-jyblog.com/wp-content/uploads/2024/06/render_Top_aejuice-500x281.jpg 500w, https://ko-jyblog.com/wp-content/uploads/2024/06/render_Top_aejuice-300x169.jpg 300w, https://ko-jyblog.com/wp-content/uploads/2024/06/render_Top_aejuice-768x432.jpg 768w, https://ko-jyblog.com/wp-content/uploads/2024/06/render_Top_aejuice-1536x864.jpg 1536w, https://ko-jyblog.com/wp-content/uploads/2024/06/render_Top_aejuice-120x68.jpg 120w, https://ko-jyblog.com/wp-content/uploads/2024/06/render_Top_aejuice-160x90.jpg 160w, https://ko-jyblog.com/wp-content/uploads/2024/06/render_Top_aejuice-320x180.jpg 320w, https://ko-jyblog.com/wp-content/uploads/2024/06/render_Top_aejuice.jpg 1920w" sizes="auto, (max-width: 800px) 100vw, 800px" /></figure>
</div>


<p>無料版では物足りない方には<span class="bold"><span class="marker-under-blue">「I Want It All Bundle Lifetime」</span></span>がおすすめです。</p>



<p>「I Want It All Bundle Lifetime」には78種類のバンドル製品が収録されています。<br>しかもそれぞれのバンドル製品の中に複数の素材が含まれているので、数えきれないほど膨大な数が収録されています。<br>欲しい素材をちょこちょこ単品で買うよりも<span class="bold-red"><span class="fz-22px">断然お得</span></span>です！<br>これだけの数があれば、あらゆる場面に対応できるでしょう。</p>



<p>これから副業で動画編集をしようと思っている方、映像制作の仕事を目指している方は持っていて損はありません！</p>



<h3 class="wp-block-heading">使用例</h3>



<iframe loading="lazy" width="560" height="315" src="https://www.youtube.com/embed/d0unkLyZNx8?si=agLDJZvJg2a8zwKc&amp;clip=UgkxpcqpEOeWBcVmFOAy8z6OeMnUC0fBAjMT&amp;clipt=EMyxNRjD0jY" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe>



<p>このテキストアニメーションは「I Want It All Bundle Lifetime」に収録されているプリセットなどを組み合わせて作っています。<br>AfterEffects初心者の方でも簡単にテキストアニメーションを作ってみることができます。</p>



<div class="wp-block-cocoon-blocks-blogcard blogcard-type bct-detail">
<a href="https://ko-jyblog.com/aftereffects/%e3%82%b3%e3%82%b9%e3%83%91%e6%9c%80%e5%bc%b7%e3%81%aeaftereffects%e7%b4%a0%e6%9d%90%e9%9b%86%e3%80%90%e5%89%b2%e5%bc%95%e3%82%af%e3%83%bc%e3%83%9d%e3%83%b3%e3%81%82%e3%82%8a%e3%80%91/" title="動画編集初心者必携！AEJuice「I Want It All Bundle Lifetime」はコスパ最強" class="blogcard-wrap internal-blogcard-wrap a-wrap cf"><div class="blogcard internal-blogcard ib-left cf"><div class="blogcard-label internal-blogcard-label"><span class="fa"></span></div><figure class="blogcard-thumbnail internal-blogcard-thumbnail"><img loading="lazy" decoding="async" width="160" height="90" src="https://ko-jyblog.com/wp-content/uploads/2024/06/render_Top_aejuice-160x90.jpg" class="blogcard-thumb-image internal-blogcard-thumb-image wp-post-image" alt="" srcset="https://ko-jyblog.com/wp-content/uploads/2024/06/render_Top_aejuice-160x90.jpg 160w, https://ko-jyblog.com/wp-content/uploads/2024/06/render_Top_aejuice-500x281.jpg 500w, https://ko-jyblog.com/wp-content/uploads/2024/06/render_Top_aejuice-800x450.jpg 800w, https://ko-jyblog.com/wp-content/uploads/2024/06/render_Top_aejuice-300x169.jpg 300w, https://ko-jyblog.com/wp-content/uploads/2024/06/render_Top_aejuice-768x432.jpg 768w, https://ko-jyblog.com/wp-content/uploads/2024/06/render_Top_aejuice-1536x864.jpg 1536w, https://ko-jyblog.com/wp-content/uploads/2024/06/render_Top_aejuice-120x68.jpg 120w, https://ko-jyblog.com/wp-content/uploads/2024/06/render_Top_aejuice-320x180.jpg 320w, https://ko-jyblog.com/wp-content/uploads/2024/06/render_Top_aejuice.jpg 1920w" sizes="auto, (max-width: 160px) 100vw, 160px" /></figure><div class="blogcard-content internal-blogcard-content"><div class="blogcard-title internal-blogcard-title">動画編集初心者必携！AEJuice「I Want It All Bundle Lifetime」はコスパ最強</div><div class="blogcard-snippet internal-blogcard-snippet">I Want It All Bundle Lifetimeはコスパ最強の素材集です。文字PVでの使用例と使用した製品も紹介しています。25％OFFクーポンも配布中！ぜひお得にAEJuiceを購入してください。</div></div><div class="blogcard-footer internal-blogcard-footer cf"><div class="blogcard-site internal-blogcard-site"><div class="blogcard-favicon internal-blogcard-favicon"><img loading="lazy" decoding="async" src="https://www.google.com/s2/favicons?domain=ko-jyblog.com" alt="" class="blogcard-favicon-image internal-blogcard-favicon-image" width="16" height="16" /></div><div class="blogcard-domain internal-blogcard-domain">ko-jyblog.com</div></div><div class="blogcard-date internal-blogcard-date"><div class="blogcard-post-date internal-blogcard-post-date">2024.06.27</div></div></div></div></a>
</div>



<p>しかもすべて<span class="marker"><strong><span class="fz-32px"><span class="fz-24px">商用利用可能</span></span></strong></span>！<br>動画編集の仕事を始めたばかりの方でも、AEJuiceを使えば一気に動画のクオリティーをアップさせることができます。</p>



<div class="wp-block-cocoon-blocks-balloon-ex-box-1 speech-wrap sb-id-20 sbs-line sbp-l sbis-cb cf block-box"><div class="speech-person"><figure class="speech-icon"><img decoding="async" src="https://ko-jyblog.com/wp-content/uploads/2022/05/cf1dcd9e96b70f9e785d4ca581cef762.jpg" alt="マル" class="speech-icon-image"/></figure><div class="speech-name">マル</div></div><div class="speech-balloon">
<p>これだけの数の素材が入っているなら、お値段も高いんじゃない？</p>
</div></div>



<div class="wp-block-cocoon-blocks-balloon-ex-box-1 speech-wrap sb-id-13 sbs-line sbp-r sbis-cb cf block-box"><div class="speech-person"><figure class="speech-icon"><img decoding="async" src="https://ko-jyblog.com/wp-content/uploads/2021/11/Tvman_render_profile_512.jpg" alt="コージー" class="speech-icon-image"/></figure><div class="speech-name">コージー</div></div><div class="speech-balloon">
<p>通常価格だと8000ドル以上するけど、セール中だと<strong><span class="marker-under-red">149ドル</span></strong>で購入することができるよ。</p>
</div></div>



<p>タイトルの「コスパ最強」というのは「I Want It All Bundle Lifetime」をセール中に購入した時限定です。<br>通常価格で購入するのはもったいない&#8230;</p>



<p><strong><span class="fz-18px"><span class="fz-32px"><span class="bold-red">絶対</span></span></span></strong>にセールのタイミングで購入することをオススメします。</p>



<p><span class="fz-20px"><span class="fz-28px">さらに！</span></span>この記事を読んでくださった方は、<strong><span class="fz-18px"><span class="fz-20px"><span class="fz-24px"><span class="bold"><span class="marker-red">25%OFFクーポン</span></span></span></span></span></strong>をお使いいただけます。</p>



<h3 class="wp-block-heading">25％OFFクーポンの使い方</h3>



<p>　ステップ１. 「add to cart」をクリック<br>　ステップ２. 画面右上の買い物カートボタンをクリック<br>　ステップ３. 「Got a coupon code?」をクリック<br>　ステップ４. クーポンコードの欄に「<strong><span class="bold-red"><span class="fz-20px">F2KM25</span></span></strong>」を入力</p>



<div class="wp-block-cocoon-blocks-button-1 button-block"><a rel="noopener" href="https://aejuice.com/product/i-want-it-all-bundle-lifetime/?ref=tipsmash" class="btn btn-m btn-circle has-text-color has-background has-white-color has-deep-orange-background-color" target="_blank">購入はこちら</a></div>



<div class="wp-block-cocoon-blocks-balloon-ex-box-1 speech-wrap sb-id-16 sbs-stn sbp-l sbis-cb cf block-box"><div class="speech-person"><figure class="speech-icon"><img decoding="async" src="https://ko-jyblog.com/wp-content/uploads/2021/11/Tvman_render_profile_512.jpg" alt="コージー" class="speech-icon-image"/></figure><div class="speech-name">コージー</div></div><div class="speech-balloon has-background has-white-background-color">
<p><span class="fz-24px">お得な25％OFFクーポンをお忘れなく！</span></p>
</div></div>



<h2 class="wp-block-heading">まとめ</h2>



<p>これから動画編集をしたいと考えている初心者の方、AfterEffectsの勉強を始めたばかりの方は、とりあえず無料版をインストールすることをおすすめします。</p>



<p>本気で動画編集を副業にしたい、ゆくゆくは本業にしたい方はぜひ「I Want It All Bundle Lifetime」を購入して動画編集に活用してみてください。</p>



<p>ティップスマッシュのYouTubeチャンネルでは、AfterEffectsを使ったエフェクトの作り方、おすすめプラグインを紹介しています。<br>ぜひチェックしてみてください！</p>



<div class="wp-block-cocoon-blocks-button-1 button-block"><a rel="noopener" href="https://www.youtube.com/channel/UCjf7-3qIjDihd7ugmr8AyaQ" class="btn btn-m btn-circle has-text-color has-background has-white-color has-deep-orange-background-color" target="_blank">Youtubeチャンネル「ティップスマッシュ」はこちら</a></div>
]]></content:encoded>
					
					<wfw:commentRss>https://ko-jyblog.com/aftereffects/aftereffects%e5%88%9d%e5%bf%83%e8%80%85%e5%bf%85%e6%90%ba%ef%bc%81%e3%82%b3%e3%82%b9%e3%83%91%e6%9c%80%e5%bc%b7%e3%81%ae%e7%b4%a0%e6%9d%90%e9%9b%86%e3%81%aa%e3%82%89%e3%80%8caejuice%e3%80%8d/feed/</wfw:commentRss>
			<slash:comments>2</slash:comments>
		
		
			</item>
		<item>
		<title>After Effectsのキーフレームの種類と補間法</title>
		<link>https://ko-jyblog.com/aftereffects/after-effects%e3%81%ae%e3%82%b3%e3%83%a9%e3%83%83%e3%83%97%e3%82%b9%e3%83%88%e3%83%a9%e3%83%b3%e3%82%b9%e3%83%95%e3%82%a9%e3%83%bc%e3%83%a0%e3%81%ab%e3%81%a4%e3%81%84%e3%81%a6-2/</link>
					<comments>https://ko-jyblog.com/aftereffects/after-effects%e3%81%ae%e3%82%b3%e3%83%a9%e3%83%83%e3%83%97%e3%82%b9%e3%83%88%e3%83%a9%e3%83%b3%e3%82%b9%e3%83%95%e3%82%a9%e3%83%bc%e3%83%a0%e3%81%ab%e3%81%a4%e3%81%84%e3%81%a6-2/#respond</comments>
		
		<dc:creator><![CDATA[コージー]]></dc:creator>
		<pubDate>Wed, 15 Mar 2023 01:21:46 +0000</pubDate>
				<category><![CDATA[After Effects]]></category>
		<guid isPermaLink="false">https://ko-jyblog.com/?p=577</guid>

					<description><![CDATA[キーフレームアニメーションとは キーフレームは、トランスフォーム、エフェクト、その他多くのプロパティのパラメーターにアニメーションをつけるために使用します。ストップウォッチマークがついていれば、そのパラメーターはアニメー [&#8230;]]]></description>
										<content:encoded><![CDATA[
<div class="iframe-wrapper"><iframe loading="lazy" width="560" height="315" src="https://www.youtube.com/embed/ufpEFK6fUsU" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen></iframe></div>



<h2 class="wp-block-heading">キーフレームアニメーションとは</h2>



<p>キーフレームは、トランスフォーム、エフェクト、その他多くのプロパティのパラメーターにアニメーションをつけるために使用します。<br>ストップウォッチマークがついていれば、そのパラメーターはアニメーションさせることができます。</p>



<figure class="wp-block-image size-large"><img loading="lazy" decoding="async" width="800" height="450" src="https://ko-jyblog.com/wp-content/uploads/2023/07/d3aa70501164fefaf4115709957e6e94-800x450.jpg" alt="" class="wp-image-620" srcset="https://ko-jyblog.com/wp-content/uploads/2023/07/d3aa70501164fefaf4115709957e6e94-800x450.jpg 800w, https://ko-jyblog.com/wp-content/uploads/2023/07/d3aa70501164fefaf4115709957e6e94-500x281.jpg 500w, https://ko-jyblog.com/wp-content/uploads/2023/07/d3aa70501164fefaf4115709957e6e94-300x169.jpg 300w, https://ko-jyblog.com/wp-content/uploads/2023/07/d3aa70501164fefaf4115709957e6e94-768x432.jpg 768w, https://ko-jyblog.com/wp-content/uploads/2023/07/d3aa70501164fefaf4115709957e6e94-1536x864.jpg 1536w, https://ko-jyblog.com/wp-content/uploads/2023/07/d3aa70501164fefaf4115709957e6e94-120x68.jpg 120w, https://ko-jyblog.com/wp-content/uploads/2023/07/d3aa70501164fefaf4115709957e6e94-160x90.jpg 160w, https://ko-jyblog.com/wp-content/uploads/2023/07/d3aa70501164fefaf4115709957e6e94-320x180.jpg 320w, https://ko-jyblog.com/wp-content/uploads/2023/07/d3aa70501164fefaf4115709957e6e94.jpg 1920w" sizes="auto, (max-width: 800px) 100vw, 800px" /></figure>



<p>Aeのレイヤーを開いてみると必ずあるのがトランスフォームです。<br>トランスフォームではレイヤーの位置、スケール、回転、不透明度をアニメーションできます。<br>これら4つのパラメーターだけでも組み合わせれば、複雑なアニメーションが作成できます。</p>



<figure class="wp-block-video"><video height="1080" style="aspect-ratio: 1920 / 1080;" width="1920" controls src="https://ko-jyblog.com/wp-content/uploads/2023/07/4bunkatu_01.mp4"></video></figure>



<p>さらにアフターエフェクツでは様々なエフェクトをかけることにより複雑な表現が可能となり、エフェクトのパラメーターも多くはこのストップウォッチがついていて、アニメーションが可能となっています。</p>



<p>トランスフォームとエフェクトを組み合わせることでさらに複雑で独創的なキーフレームアニメーションが作れるわけです。</p>



<h2 class="wp-block-heading">キーフレームアニメーションのコツ</h2>



<p>キーフレームアニメーションは難しく考える必要はありません。<br>同じアニメーションでも例えばテレビアニメのようなセルアニメーションを描く技術などは動画で簡単に教えられませんし、3Dアニメーションなどもモデリングから学ばなければ、アニメーションを作成するまでは遠い道のりです。</p>



<p>それらと比較すると、キーフレームアニメーションで作成できるような、モーショングラフィックスの映像は誰でも気軽に作れますし、コストや作成にかかる時間のことを考えてもとても需要があると思います。<br>そして、手軽でありながら様々な映像を表現することが可能です。</p>



<p>かっこいいアニメーションを作るにはリズム感や動きの緩急だったりタイミングなどが重要なので<br>キーフレームの編集に慣れることが大事になってきます。</p>



<h2 class="wp-block-heading">キーフレームとは</h2>



<p>1920*1080のフルHDのコンポジションを作って、イラストのバスを用意しました。</p>



<figure class="wp-block-image size-large"><img loading="lazy" decoding="async" width="800" height="450" src="https://ko-jyblog.com/wp-content/uploads/2023/07/1f2469673104bec7e7a21858551dfa8e-800x450.jpg" alt="" class="wp-image-635" srcset="https://ko-jyblog.com/wp-content/uploads/2023/07/1f2469673104bec7e7a21858551dfa8e-800x450.jpg 800w, https://ko-jyblog.com/wp-content/uploads/2023/07/1f2469673104bec7e7a21858551dfa8e-500x281.jpg 500w, https://ko-jyblog.com/wp-content/uploads/2023/07/1f2469673104bec7e7a21858551dfa8e-300x169.jpg 300w, https://ko-jyblog.com/wp-content/uploads/2023/07/1f2469673104bec7e7a21858551dfa8e-768x432.jpg 768w, https://ko-jyblog.com/wp-content/uploads/2023/07/1f2469673104bec7e7a21858551dfa8e-1536x864.jpg 1536w, https://ko-jyblog.com/wp-content/uploads/2023/07/1f2469673104bec7e7a21858551dfa8e-120x68.jpg 120w, https://ko-jyblog.com/wp-content/uploads/2023/07/1f2469673104bec7e7a21858551dfa8e-160x90.jpg 160w, https://ko-jyblog.com/wp-content/uploads/2023/07/1f2469673104bec7e7a21858551dfa8e-320x180.jpg 320w, https://ko-jyblog.com/wp-content/uploads/2023/07/1f2469673104bec7e7a21858551dfa8e.jpg 1920w" sizes="auto, (max-width: 800px) 100vw, 800px" /></figure>



<p>Aeの座標は左上を原点としてX座標は右に行くほど数字が増え、Y座標は下に行くほど数字が増えます。<br>フルHDのこのコンポジションの中心の座標はXが960,Yが540です。</p>



<p>アニメーションするには最低2つ以上のキーフレームを設定する必要があります。<br>例えばタイムラインの0フレームにX座標を200、Y座標を550と入力してみます。</p>



<figure class="wp-block-image size-large"><img loading="lazy" decoding="async" width="800" height="450" src="https://ko-jyblog.com/wp-content/uploads/2023/07/3dcb5282a6459bb3539f698474a68790-800x450.jpg" alt="" class="wp-image-636" srcset="https://ko-jyblog.com/wp-content/uploads/2023/07/3dcb5282a6459bb3539f698474a68790-800x450.jpg 800w, https://ko-jyblog.com/wp-content/uploads/2023/07/3dcb5282a6459bb3539f698474a68790-500x281.jpg 500w, https://ko-jyblog.com/wp-content/uploads/2023/07/3dcb5282a6459bb3539f698474a68790-300x169.jpg 300w, https://ko-jyblog.com/wp-content/uploads/2023/07/3dcb5282a6459bb3539f698474a68790-768x432.jpg 768w, https://ko-jyblog.com/wp-content/uploads/2023/07/3dcb5282a6459bb3539f698474a68790-1536x864.jpg 1536w, https://ko-jyblog.com/wp-content/uploads/2023/07/3dcb5282a6459bb3539f698474a68790-120x68.jpg 120w, https://ko-jyblog.com/wp-content/uploads/2023/07/3dcb5282a6459bb3539f698474a68790-160x90.jpg 160w, https://ko-jyblog.com/wp-content/uploads/2023/07/3dcb5282a6459bb3539f698474a68790-320x180.jpg 320w, https://ko-jyblog.com/wp-content/uploads/2023/07/3dcb5282a6459bb3539f698474a68790.jpg 1920w" sizes="auto, (max-width: 800px) 100vw, 800px" /></figure>



<p>そして「位置」のストップウォッチマークをクリックして、3秒後にX座標を1000と入力してみます。<br>するとダイヤのマーカーが打たれます。</p>



<figure class="wp-block-image size-large"><img loading="lazy" decoding="async" width="800" height="450" src="https://ko-jyblog.com/wp-content/uploads/2023/07/8ae6b38f4ab3df7918b3352d7293e579-800x450.jpg" alt="" class="wp-image-637" srcset="https://ko-jyblog.com/wp-content/uploads/2023/07/8ae6b38f4ab3df7918b3352d7293e579-800x450.jpg 800w, https://ko-jyblog.com/wp-content/uploads/2023/07/8ae6b38f4ab3df7918b3352d7293e579-500x281.jpg 500w, https://ko-jyblog.com/wp-content/uploads/2023/07/8ae6b38f4ab3df7918b3352d7293e579-300x169.jpg 300w, https://ko-jyblog.com/wp-content/uploads/2023/07/8ae6b38f4ab3df7918b3352d7293e579-768x432.jpg 768w, https://ko-jyblog.com/wp-content/uploads/2023/07/8ae6b38f4ab3df7918b3352d7293e579-1536x864.jpg 1536w, https://ko-jyblog.com/wp-content/uploads/2023/07/8ae6b38f4ab3df7918b3352d7293e579-120x68.jpg 120w, https://ko-jyblog.com/wp-content/uploads/2023/07/8ae6b38f4ab3df7918b3352d7293e579-160x90.jpg 160w, https://ko-jyblog.com/wp-content/uploads/2023/07/8ae6b38f4ab3df7918b3352d7293e579-320x180.jpg 320w, https://ko-jyblog.com/wp-content/uploads/2023/07/8ae6b38f4ab3df7918b3352d7293e579.jpg 1920w" sizes="auto, (max-width: 800px) 100vw, 800px" /></figure>



<p>今、値を指定した2つのキーフレームの間は補間されます。<br>2点以上の値を入力することで、間を補間して アニメーションが作成できます。<br>このダイヤのマークのことを<span class="bold-red">キーフレーム</span>といいます。</p>



<h2 class="wp-block-heading">キーフレームの補間法</h2>



<p>キーフレームは大きくいうと、この3種類の補間法により形を変えます。</p>



<figure class="wp-block-image size-large"><img loading="lazy" decoding="async" width="800" height="450" src="https://ko-jyblog.com/wp-content/uploads/2023/07/9a279c41ca296144aad49617fcf79ea0-800x450.jpg" alt="" class="wp-image-622" srcset="https://ko-jyblog.com/wp-content/uploads/2023/07/9a279c41ca296144aad49617fcf79ea0-800x450.jpg 800w, https://ko-jyblog.com/wp-content/uploads/2023/07/9a279c41ca296144aad49617fcf79ea0-500x281.jpg 500w, https://ko-jyblog.com/wp-content/uploads/2023/07/9a279c41ca296144aad49617fcf79ea0-300x169.jpg 300w, https://ko-jyblog.com/wp-content/uploads/2023/07/9a279c41ca296144aad49617fcf79ea0-768x432.jpg 768w, https://ko-jyblog.com/wp-content/uploads/2023/07/9a279c41ca296144aad49617fcf79ea0-1536x864.jpg 1536w, https://ko-jyblog.com/wp-content/uploads/2023/07/9a279c41ca296144aad49617fcf79ea0-120x68.jpg 120w, https://ko-jyblog.com/wp-content/uploads/2023/07/9a279c41ca296144aad49617fcf79ea0-160x90.jpg 160w, https://ko-jyblog.com/wp-content/uploads/2023/07/9a279c41ca296144aad49617fcf79ea0-320x180.jpg 320w, https://ko-jyblog.com/wp-content/uploads/2023/07/9a279c41ca296144aad49617fcf79ea0.jpg 1920w" sizes="auto, (max-width: 800px) 100vw, 800px" /></figure>



<p>リニア補間法のキーフレームでアニメーションさせた場合、一定の速度で値が変化するので機械的なアニメーションになります。</p>



<p>ベジェ補間法では緩急のついた値の変化で、より自然なモーションを再現できます。</p>



<p>停止は次のキーフレームまで値は変化しません。</p>



<p>また、キーフレームは左半分の入ってくる動きの補間法と右半分の出ていく動きの補間法に分けられます。<br>下図のように左右で形が変わる場合もあります。</p>



<figure class="wp-block-image size-large"><img loading="lazy" decoding="async" width="800" height="450" src="https://ko-jyblog.com/wp-content/uploads/2023/07/04fa9412bb42a880eaffbb7af6858525-800x450.jpg" alt="" class="wp-image-640" srcset="https://ko-jyblog.com/wp-content/uploads/2023/07/04fa9412bb42a880eaffbb7af6858525-800x450.jpg 800w, https://ko-jyblog.com/wp-content/uploads/2023/07/04fa9412bb42a880eaffbb7af6858525-500x281.jpg 500w, https://ko-jyblog.com/wp-content/uploads/2023/07/04fa9412bb42a880eaffbb7af6858525-300x169.jpg 300w, https://ko-jyblog.com/wp-content/uploads/2023/07/04fa9412bb42a880eaffbb7af6858525-768x432.jpg 768w, https://ko-jyblog.com/wp-content/uploads/2023/07/04fa9412bb42a880eaffbb7af6858525-1536x864.jpg 1536w, https://ko-jyblog.com/wp-content/uploads/2023/07/04fa9412bb42a880eaffbb7af6858525-120x68.jpg 120w, https://ko-jyblog.com/wp-content/uploads/2023/07/04fa9412bb42a880eaffbb7af6858525-160x90.jpg 160w, https://ko-jyblog.com/wp-content/uploads/2023/07/04fa9412bb42a880eaffbb7af6858525-320x180.jpg 320w, https://ko-jyblog.com/wp-content/uploads/2023/07/04fa9412bb42a880eaffbb7af6858525.jpg 1920w" sizes="auto, (max-width: 800px) 100vw, 800px" /></figure>



<p>例えば上図右側のキーフレームは、左側がベジェのキーフレームで右側がリニアのキーフレームの形なので、入ってくる動きの補間法はベジェで減速しながら入ってきて、出ていく動きの補間法はリニアなので一定の速度で出ていきます。</p>



<figure class="wp-block-image size-large"><img loading="lazy" decoding="async" width="800" height="450" src="https://ko-jyblog.com/wp-content/uploads/2023/07/a898700fd6b19379603fc190d3708650-800x450.jpg" alt="" class="wp-image-623" srcset="https://ko-jyblog.com/wp-content/uploads/2023/07/a898700fd6b19379603fc190d3708650-800x450.jpg 800w, https://ko-jyblog.com/wp-content/uploads/2023/07/a898700fd6b19379603fc190d3708650-500x281.jpg 500w, https://ko-jyblog.com/wp-content/uploads/2023/07/a898700fd6b19379603fc190d3708650-300x169.jpg 300w, https://ko-jyblog.com/wp-content/uploads/2023/07/a898700fd6b19379603fc190d3708650-768x432.jpg 768w, https://ko-jyblog.com/wp-content/uploads/2023/07/a898700fd6b19379603fc190d3708650-1536x864.jpg 1536w, https://ko-jyblog.com/wp-content/uploads/2023/07/a898700fd6b19379603fc190d3708650-120x68.jpg 120w, https://ko-jyblog.com/wp-content/uploads/2023/07/a898700fd6b19379603fc190d3708650-160x90.jpg 160w, https://ko-jyblog.com/wp-content/uploads/2023/07/a898700fd6b19379603fc190d3708650-320x180.jpg 320w, https://ko-jyblog.com/wp-content/uploads/2023/07/a898700fd6b19379603fc190d3708650.jpg 1920w" sizes="auto, (max-width: 800px) 100vw, 800px" /></figure>



<p>さらによく見るとキーフレームには明暗があり、暗くなったキーフレームは補間が機能していないことを表しています。</p>



<p>1つ目のキーフレームをタイムラインに打つと1つではアニメーションしないので、リニアの補間が機能していないので全体が暗いキーフレームが打たれます。<br>2つ目のキーフレームを打つとキーフレームの内側だけが明るくなって外側は暗いままです。<br>これは2点の前後にキーフレームがないので内側だけ補間が有効となっていることを表しています。<br>また、停止の後のキーフレームの左半分(入ってくる補間法)は必ず無効となり、暗くなります。</p>



<h2 class="wp-block-heading">例：バスのアニメーション</h2>



<p>これはバスが1秒ずつ隣のバス停に移動するアニメーションです。</p>



<figure class="wp-block-video"><video height="1080" style="aspect-ratio: 1920 / 1080;" width="1920" controls src="https://ko-jyblog.com/wp-content/uploads/2023/07/bus.mp4"></video></figure>



<div class="wp-block-media-text is-stacked-on-mobile is-vertically-aligned-top" style="grid-template-columns:15% auto"><figure class="wp-block-media-text__media"><img loading="lazy" decoding="async" width="200" height="200" src="https://ko-jyblog.com/wp-content/uploads/2023/07/c182ad372ab42e2aaafbaa58b6564d91-2.png" alt="" class="wp-image-643 size-full" srcset="https://ko-jyblog.com/wp-content/uploads/2023/07/c182ad372ab42e2aaafbaa58b6564d91-2.png 200w, https://ko-jyblog.com/wp-content/uploads/2023/07/c182ad372ab42e2aaafbaa58b6564d91-2-100x100.png 100w, https://ko-jyblog.com/wp-content/uploads/2023/07/c182ad372ab42e2aaafbaa58b6564d91-2-150x150.png 150w" sizes="auto, (max-width: 200px) 100vw, 200px" /></figure><div class="wp-block-media-text__content">
<p>１つ目のキーフレームはリニアで入ってリニアで出るキーフレームになっています。<br>このキーフレームの前にキーが打たれてないので入ってくる動きがそもそもないので、左半分のリニアの補間は機能していません。<br>なので暗くなっています。<br>このキーフレームの右半分は、出ていく動きの補間法がリニアになっているので、バスは加速せずいきなり最高スピードでパス停を出発しています。</p>
</div></div>



<div class="wp-block-media-text is-stacked-on-mobile is-vertically-aligned-top" style="grid-template-columns:15% auto"><figure class="wp-block-media-text__media"><img loading="lazy" decoding="async" width="200" height="200" src="https://ko-jyblog.com/wp-content/uploads/2023/07/962912039e46c7851f668906946a028e.png" alt="" class="wp-image-644 size-full" srcset="https://ko-jyblog.com/wp-content/uploads/2023/07/962912039e46c7851f668906946a028e.png 200w, https://ko-jyblog.com/wp-content/uploads/2023/07/962912039e46c7851f668906946a028e-100x100.png 100w, https://ko-jyblog.com/wp-content/uploads/2023/07/962912039e46c7851f668906946a028e-150x150.png 150w" sizes="auto, (max-width: 200px) 100vw, 200px" /></figure><div class="wp-block-media-text__content">
<p>２つ目のキーフレームも左半分の入ってくる動きがリニアになっているので、減速せずバス停に入ってきます。<br>二つ目のキーフレームでは右半分が停止の四角形になっているので次のキーフレームまで停止します。</p>
</div></div>



<div class="wp-block-media-text is-stacked-on-mobile is-vertically-aligned-top" style="grid-template-columns:15% auto"><figure class="wp-block-media-text__media"><img loading="lazy" decoding="async" width="200" height="200" src="https://ko-jyblog.com/wp-content/uploads/2023/07/91290db9a12ae6bed82e4d0405719ac6.png" alt="" class="wp-image-645 size-full" srcset="https://ko-jyblog.com/wp-content/uploads/2023/07/91290db9a12ae6bed82e4d0405719ac6.png 200w, https://ko-jyblog.com/wp-content/uploads/2023/07/91290db9a12ae6bed82e4d0405719ac6-100x100.png 100w, https://ko-jyblog.com/wp-content/uploads/2023/07/91290db9a12ae6bed82e4d0405719ac6-150x150.png 150w" sizes="auto, (max-width: 200px) 100vw, 200px" /></figure><div class="wp-block-media-text__content">
<p>直前のキーフレームは停止なので３つ目のキーフレームの左半分がベジェになっていますが、この補間は機能しません。<br>停止の後の補間は必ず暗くなり無効化されます。<br>なので補間されず、瞬間移動で3つ目のバス停に到着します。<br>右半分の出ていく動きの補間法がベジェの影響100％になっているので、3つ目のバス停から急加速して出ていきます。</p>
</div></div>



<div class="wp-block-media-text is-stacked-on-mobile" style="grid-template-columns:15% auto"><figure class="wp-block-media-text__media"><img loading="lazy" decoding="async" width="200" height="200" src="https://ko-jyblog.com/wp-content/uploads/2023/07/b96416d732da9bc8981465b615893352.png" alt="" class="wp-image-646 size-full" srcset="https://ko-jyblog.com/wp-content/uploads/2023/07/b96416d732da9bc8981465b615893352.png 200w, https://ko-jyblog.com/wp-content/uploads/2023/07/b96416d732da9bc8981465b615893352-100x100.png 100w, https://ko-jyblog.com/wp-content/uploads/2023/07/b96416d732da9bc8981465b615893352-150x150.png 150w" sizes="auto, (max-width: 200px) 100vw, 200px" /></figure><div class="wp-block-media-text__content">
<p>4つ目のキーフレームは入ってくる動きと出ていく動きがリニアになっているので、そのまま真ん中のバス停を通過します。</p>
</div></div>



<div class="wp-block-media-text is-stacked-on-mobile is-vertically-aligned-top" style="grid-template-columns:15% auto"><figure class="wp-block-media-text__media"><img loading="lazy" decoding="async" width="200" height="200" src="https://ko-jyblog.com/wp-content/uploads/2023/07/cef4e2d3922e096619c6f01d36677750.png" alt="" class="wp-image-647 size-full" srcset="https://ko-jyblog.com/wp-content/uploads/2023/07/cef4e2d3922e096619c6f01d36677750.png 200w, https://ko-jyblog.com/wp-content/uploads/2023/07/cef4e2d3922e096619c6f01d36677750-100x100.png 100w, https://ko-jyblog.com/wp-content/uploads/2023/07/cef4e2d3922e096619c6f01d36677750-150x150.png 150w" sizes="auto, (max-width: 200px) 100vw, 200px" /></figure><div class="wp-block-media-text__content">
<p>5つ目のキーフレームの左半分の入ってくる動きの補間法はベジェの影響33％になっているので、適度に減速して止まります。<br>右半分の出ていく補間法が停止になっているので次のキーフレームまで停止します。</p>
</div></div>



<div class="wp-block-media-text is-stacked-on-mobile" style="grid-template-columns:15% auto"><figure class="wp-block-media-text__media"><img loading="lazy" decoding="async" width="200" height="200" src="https://ko-jyblog.com/wp-content/uploads/2023/07/e117e7a1ea80da274f5fb826dccf6907.png" alt="" class="wp-image-648 size-full" srcset="https://ko-jyblog.com/wp-content/uploads/2023/07/e117e7a1ea80da274f5fb826dccf6907.png 200w, https://ko-jyblog.com/wp-content/uploads/2023/07/e117e7a1ea80da274f5fb826dccf6907-100x100.png 100w, https://ko-jyblog.com/wp-content/uploads/2023/07/e117e7a1ea80da274f5fb826dccf6907-150x150.png 150w" sizes="auto, (max-width: 200px) 100vw, 200px" /></figure><div class="wp-block-media-text__content">
<p>６つ目のキーフレームの左半分の入ってくる補間法は停止になっていますが、５つ目のキーフレームが停止なので、ここは関係なく瞬間移動になります。</p>
</div></div>



<p>補間法の中でもリニアと停止はとても単純で分かりやすいですが、ベジェはキーフレーム速度と影響の度合いを調整することで値の変化の緩急が大きく変わります。</p>



<h2 class="wp-block-heading">ベジェ補間について</h2>



<p>アニメーションのキーフレーム間の出ていく動きの補間法にベジェを使用することをイージーイーズアウト、入ってくる動きの補間法にベジェを使用することをイージーイーズイン、出ていく動きと入ってくる動きの両方の補間法にベジェを使用することをイージーイーズと呼んでいます。</p>



<figure class="wp-block-video"><video height="1080" style="aspect-ratio: 1920 / 1080;" width="1920" controls src="https://ko-jyblog.com/wp-content/uploads/2023/07/bus_hikaku.mp4"></video></figure>



<p>キーフレームを選択して右クリックでキーフレーム速度を変更することができます</p>



<figure class="wp-block-image size-large"><img loading="lazy" decoding="async" width="800" height="450" src="https://ko-jyblog.com/wp-content/uploads/2023/07/13067bbf47d6222f40602ca72289e212-800x450.jpg" alt="" class="wp-image-657" srcset="https://ko-jyblog.com/wp-content/uploads/2023/07/13067bbf47d6222f40602ca72289e212-800x450.jpg 800w, https://ko-jyblog.com/wp-content/uploads/2023/07/13067bbf47d6222f40602ca72289e212-500x281.jpg 500w, https://ko-jyblog.com/wp-content/uploads/2023/07/13067bbf47d6222f40602ca72289e212-300x169.jpg 300w, https://ko-jyblog.com/wp-content/uploads/2023/07/13067bbf47d6222f40602ca72289e212-768x432.jpg 768w, https://ko-jyblog.com/wp-content/uploads/2023/07/13067bbf47d6222f40602ca72289e212-1536x864.jpg 1536w, https://ko-jyblog.com/wp-content/uploads/2023/07/13067bbf47d6222f40602ca72289e212-120x68.jpg 120w, https://ko-jyblog.com/wp-content/uploads/2023/07/13067bbf47d6222f40602ca72289e212-160x90.jpg 160w, https://ko-jyblog.com/wp-content/uploads/2023/07/13067bbf47d6222f40602ca72289e212-320x180.jpg 320w, https://ko-jyblog.com/wp-content/uploads/2023/07/13067bbf47d6222f40602ca72289e212.jpg 1920w" sizes="auto, (max-width: 800px) 100vw, 800px" /></figure>



<p>この入る速度と出る速度はイージーイーズに設定した初期状態では0になっているので、キーフレーム到達時のスピードは0となり、バスは止まります。<br>出ていく速度が0ということは止まっている状態から加速するということです。<br>入ってくる速度と出ていく速度を同じ数値にすれば、スムーズにその数値でバスは通過します。</p>



<p>さらに、影響の数値でベジェのアニメーションの加速や減速の緩急の強さが調整できます。<br>％の値が大きい方が動きの緩急が強くなり、0に近づくほど動きがリニアに近づきます。</p>



<p>影響を変えてどのように見え方が変わるか見比べてみましょう。</p>



<figure class="wp-block-video"><video height="1080" style="aspect-ratio: 1920 / 1080;" width="1920" controls src="https://ko-jyblog.com/wp-content/uploads/2023/07/bus_hikaku_02.mp4"></video></figure>



<p>影響0％はリニアを表しています。<br>影響の割合が高いほどアニメーションの緩急が強くなっています</p>



<p>回転だと影響によりこのように見え方が変わります。</p>



<figure class="wp-block-video"><video height="1080" style="aspect-ratio: 1920 / 1080;" width="1920" controls src="https://ko-jyblog.com/wp-content/uploads/2023/07/rotation.mp4"></video></figure>



<p>これはスケールのアニメーションです。<br>同じように比べてみましょう。</p>



<figure class="wp-block-video"><video height="1080" style="aspect-ratio: 1920 / 1080;" width="1920" controls src="https://ko-jyblog.com/wp-content/uploads/2023/07/scale.mp4"></video></figure>



<p>このようにベジェ補間の値の変化は速度と影響によって、制御されています。</p>



<h2 class="wp-block-heading">空間補間法</h2>



<p>今まで説明してきた時間補間法の他に空間補間法があります。</p>



<figure class="wp-block-image size-large"><img loading="lazy" decoding="async" width="800" height="450" src="https://ko-jyblog.com/wp-content/uploads/2023/07/46168cc9d81ac94e7e716b908d8bf2d1-2-800x450.jpg" alt="" class="wp-image-656" srcset="https://ko-jyblog.com/wp-content/uploads/2023/07/46168cc9d81ac94e7e716b908d8bf2d1-2-800x450.jpg 800w, https://ko-jyblog.com/wp-content/uploads/2023/07/46168cc9d81ac94e7e716b908d8bf2d1-2-500x281.jpg 500w, https://ko-jyblog.com/wp-content/uploads/2023/07/46168cc9d81ac94e7e716b908d8bf2d1-2-300x169.jpg 300w, https://ko-jyblog.com/wp-content/uploads/2023/07/46168cc9d81ac94e7e716b908d8bf2d1-2-768x432.jpg 768w, https://ko-jyblog.com/wp-content/uploads/2023/07/46168cc9d81ac94e7e716b908d8bf2d1-2-1536x864.jpg 1536w, https://ko-jyblog.com/wp-content/uploads/2023/07/46168cc9d81ac94e7e716b908d8bf2d1-2-120x68.jpg 120w, https://ko-jyblog.com/wp-content/uploads/2023/07/46168cc9d81ac94e7e716b908d8bf2d1-2-160x90.jpg 160w, https://ko-jyblog.com/wp-content/uploads/2023/07/46168cc9d81ac94e7e716b908d8bf2d1-2-320x180.jpg 320w, https://ko-jyblog.com/wp-content/uploads/2023/07/46168cc9d81ac94e7e716b908d8bf2d1-2.jpg 1920w" sizes="auto, (max-width: 800px) 100vw, 800px" /></figure>



<p>時間補間法ではキーフレームの間の値の変化の仕方を設定しました。<br>時間補間法を変えるとキーフレームの形が変わりましたが、空間補間法は実際のアニメーションの軌跡についての補間のことをいいます。</p>



<p>「マスクとシェイプのパスを表示」のボタンを押すとモーションパスが表示できます。<br>モーションパスとは動きの軌跡のことです。</p>



<figure class="wp-block-image size-large"><img loading="lazy" decoding="async" width="800" height="450" src="https://ko-jyblog.com/wp-content/uploads/2023/07/27f50ef0f383ca60cf3381e24360a599-800x450.jpg" alt="" class="wp-image-660" srcset="https://ko-jyblog.com/wp-content/uploads/2023/07/27f50ef0f383ca60cf3381e24360a599-800x450.jpg 800w, https://ko-jyblog.com/wp-content/uploads/2023/07/27f50ef0f383ca60cf3381e24360a599-500x281.jpg 500w, https://ko-jyblog.com/wp-content/uploads/2023/07/27f50ef0f383ca60cf3381e24360a599-300x169.jpg 300w, https://ko-jyblog.com/wp-content/uploads/2023/07/27f50ef0f383ca60cf3381e24360a599-768x432.jpg 768w, https://ko-jyblog.com/wp-content/uploads/2023/07/27f50ef0f383ca60cf3381e24360a599-1536x864.jpg 1536w, https://ko-jyblog.com/wp-content/uploads/2023/07/27f50ef0f383ca60cf3381e24360a599-120x68.jpg 120w, https://ko-jyblog.com/wp-content/uploads/2023/07/27f50ef0f383ca60cf3381e24360a599-160x90.jpg 160w, https://ko-jyblog.com/wp-content/uploads/2023/07/27f50ef0f383ca60cf3381e24360a599-320x180.jpg 320w, https://ko-jyblog.com/wp-content/uploads/2023/07/27f50ef0f383ca60cf3381e24360a599.jpg 1920w" sizes="auto, (max-width: 800px) 100vw, 800px" /></figure>



<p>上図のようにパスを山なりに設定するとバスがジャンプします。<br>全く同じキーフレームの値が打たれたアニメーションですが、動きがかなり変わります。</p>



<p>今度は3点の値のキーフレームを打ってみます。</p>



<figure class="wp-block-image size-large"><img loading="lazy" decoding="async" width="800" height="450" src="https://ko-jyblog.com/wp-content/uploads/2023/07/fdc618d9e2f4eba952d84d7adf85f5de-1-800x450.jpg" alt="" class="wp-image-631" srcset="https://ko-jyblog.com/wp-content/uploads/2023/07/fdc618d9e2f4eba952d84d7adf85f5de-1-800x450.jpg 800w, https://ko-jyblog.com/wp-content/uploads/2023/07/fdc618d9e2f4eba952d84d7adf85f5de-1-500x281.jpg 500w, https://ko-jyblog.com/wp-content/uploads/2023/07/fdc618d9e2f4eba952d84d7adf85f5de-1-300x169.jpg 300w, https://ko-jyblog.com/wp-content/uploads/2023/07/fdc618d9e2f4eba952d84d7adf85f5de-1-768x432.jpg 768w, https://ko-jyblog.com/wp-content/uploads/2023/07/fdc618d9e2f4eba952d84d7adf85f5de-1-1536x864.jpg 1536w, https://ko-jyblog.com/wp-content/uploads/2023/07/fdc618d9e2f4eba952d84d7adf85f5de-1-120x68.jpg 120w, https://ko-jyblog.com/wp-content/uploads/2023/07/fdc618d9e2f4eba952d84d7adf85f5de-1-160x90.jpg 160w, https://ko-jyblog.com/wp-content/uploads/2023/07/fdc618d9e2f4eba952d84d7adf85f5de-1-320x180.jpg 320w, https://ko-jyblog.com/wp-content/uploads/2023/07/fdc618d9e2f4eba952d84d7adf85f5de-1.jpg 1920w" sizes="auto, (max-width: 800px) 100vw, 800px" /></figure>



<p>このような位置にキーフレームを打つと、直線的な動きで移動します。<br>これは空間補間法がリニアになっているからです。</p>



<figure class="wp-block-image size-large"><img loading="lazy" decoding="async" width="800" height="450" src="https://ko-jyblog.com/wp-content/uploads/2023/07/b4e9e8a3064887c17fbe26eb770ef452-800x450.jpg" alt="" class="wp-image-632" srcset="https://ko-jyblog.com/wp-content/uploads/2023/07/b4e9e8a3064887c17fbe26eb770ef452-800x450.jpg 800w, https://ko-jyblog.com/wp-content/uploads/2023/07/b4e9e8a3064887c17fbe26eb770ef452-500x281.jpg 500w, https://ko-jyblog.com/wp-content/uploads/2023/07/b4e9e8a3064887c17fbe26eb770ef452-300x169.jpg 300w, https://ko-jyblog.com/wp-content/uploads/2023/07/b4e9e8a3064887c17fbe26eb770ef452-768x432.jpg 768w, https://ko-jyblog.com/wp-content/uploads/2023/07/b4e9e8a3064887c17fbe26eb770ef452-1536x864.jpg 1536w, https://ko-jyblog.com/wp-content/uploads/2023/07/b4e9e8a3064887c17fbe26eb770ef452-120x68.jpg 120w, https://ko-jyblog.com/wp-content/uploads/2023/07/b4e9e8a3064887c17fbe26eb770ef452-160x90.jpg 160w, https://ko-jyblog.com/wp-content/uploads/2023/07/b4e9e8a3064887c17fbe26eb770ef452-320x180.jpg 320w, https://ko-jyblog.com/wp-content/uploads/2023/07/b4e9e8a3064887c17fbe26eb770ef452.jpg 1920w" sizes="auto, (max-width: 800px) 100vw, 800px" /></figure>



<p>このキーフレームの右クリックで空間補間法をリニアからベジェに変えます。<br>するとモーションパスが曲線に変わり、アニメーションが変わりました。<br>これが空間補間法です。<br>難しく考えず、モーションパスのキーフレーム間の補間法のことです。</p>



<div class="wp-block-cocoon-blocks-sticky-box blank-box block-box sticky">
<p>時間ロービングを選ぶと全体の速度を一定のアニメーション速度になるようにキーフレームのタイミングを自動で動かして調整してくれます。<br>この時自動で調整されたキーフレームは丸いマークに形が変わり、これは自動ベジェといい、キーフレーム間の変化率をスムーズにするために自動調整されたキーフレームを表します。</p>
</div>



<h2 class="wp-block-heading">まとめ</h2>



<p>ここまでの解説で大体キーフレームの調整の仕方は理解できたかと思います。<br>やはりキーフレームの扱いは慣れが必要だと思います。</p>



<p>私がアニメーションを付けるときに大事にすることは直感的に作業することです。<br>キーフレームアニメーションはフレーム単位で設定するわけですけど、結局再生して人間の目にどう見えるかが大事です。</p>



<p>なのでプレビューして微調整しての繰り返しで、とにかく気持ち良いところを見つける作業です。</p>



<p>そしてベストなアニメーションには、大体正解があると思っています。<br>私もテレビ局や映像制作会社で多くのOPなどを作ってきましたが、やはりキーフレームのタイミングは大体ココかココだ、みたいな感じで、本当に気持ちいいところは2択ぐらいに絞られるものです。</p>



<p>ぜひ自分でアニメーションを作成して、理解を深めてください。</p>
]]></content:encoded>
					
					<wfw:commentRss>https://ko-jyblog.com/aftereffects/after-effects%e3%81%ae%e3%82%b3%e3%83%a9%e3%83%83%e3%83%97%e3%82%b9%e3%83%88%e3%83%a9%e3%83%b3%e3%82%b9%e3%83%95%e3%82%a9%e3%83%bc%e3%83%a0%e3%81%ab%e3%81%a4%e3%81%84%e3%81%a6-2/feed/</wfw:commentRss>
			<slash:comments>0</slash:comments>
		
		<enclosure url="https://ko-jyblog.com/wp-content/uploads/2023/07/4bunkatu_01.mp4" length="0" type="video/mp4" />
<enclosure url="https://ko-jyblog.com/wp-content/uploads/2023/07/bus.mp4" length="0" type="video/mp4" />
<enclosure url="https://ko-jyblog.com/wp-content/uploads/2023/07/bus_hikaku.mp4" length="0" type="video/mp4" />
<enclosure url="https://ko-jyblog.com/wp-content/uploads/2023/07/bus_hikaku_02.mp4" length="0" type="video/mp4" />
<enclosure url="https://ko-jyblog.com/wp-content/uploads/2023/07/rotation.mp4" length="0" type="video/mp4" />
<enclosure url="https://ko-jyblog.com/wp-content/uploads/2023/07/scale.mp4" length="0" type="video/mp4" />

			</item>
		<item>
		<title>After Effectsのコラップストランスフォームについて</title>
		<link>https://ko-jyblog.com/aftereffects/after-effects%e3%81%ae%e3%82%b3%e3%83%a9%e3%83%83%e3%83%97%e3%82%b9%e3%83%88%e3%83%a9%e3%83%b3%e3%82%b9%e3%83%95%e3%82%a9%e3%83%bc%e3%83%a0%e3%81%ab%e3%81%a4%e3%81%84%e3%81%a6/</link>
					<comments>https://ko-jyblog.com/aftereffects/after-effects%e3%81%ae%e3%82%b3%e3%83%a9%e3%83%83%e3%83%97%e3%82%b9%e3%83%88%e3%83%a9%e3%83%b3%e3%82%b9%e3%83%95%e3%82%a9%e3%83%bc%e3%83%a0%e3%81%ab%e3%81%a4%e3%81%84%e3%81%a6/#comments</comments>
		
		<dc:creator><![CDATA[コージー]]></dc:creator>
		<pubDate>Wed, 01 Mar 2023 11:59:34 +0000</pubDate>
				<category><![CDATA[After Effects]]></category>
		<guid isPermaLink="false">https://ko-jyblog.com/?p=525</guid>

					<description><![CDATA[動画で見たい方はコチラ コラップストランスフォームとは AEのレイヤーにあるこのスイッチのことです。コラップストランスフォームはスイッチの中でも少し複雑で、AE初心者には説明が必要なスイッチです。YouTube動画も見て [&#8230;]]]></description>
										<content:encoded><![CDATA[
<h2 class="wp-block-heading">動画で見たい方はコチラ</h2>



<div class="iframe-wrapper"><iframe loading="lazy" width="560" height="315" src="https://www.youtube.com/embed/ZsO4_MuEIfQ" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen=""></iframe></div>



<h2 class="wp-block-heading">コラップストランスフォームとは</h2>



<p>AEのレイヤーにあるこのスイッチのことです。<br>コラップストランスフォームはスイッチの中でも少し複雑で、AE初心者には説明が必要なスイッチです。<br>YouTube動画も見ていただくと、よりわかりやすいと思います。</p>



<p>このスイッチのややこしいところは、見た目は同じなのに、付いているレイヤーの種類で呼び名が変わりるところです。</p>



<figure class="wp-block-image size-large"><img loading="lazy" decoding="async" width="800" height="450" src="https://ko-jyblog.com/wp-content/uploads/2023/03/cora01-800x450.jpg" alt="" class="wp-image-564" srcset="https://ko-jyblog.com/wp-content/uploads/2023/03/cora01-800x450.jpg 800w, https://ko-jyblog.com/wp-content/uploads/2023/03/cora01-500x281.jpg 500w, https://ko-jyblog.com/wp-content/uploads/2023/03/cora01-300x169.jpg 300w, https://ko-jyblog.com/wp-content/uploads/2023/03/cora01-768x432.jpg 768w, https://ko-jyblog.com/wp-content/uploads/2023/03/cora01-1536x864.jpg 1536w, https://ko-jyblog.com/wp-content/uploads/2023/03/cora01-120x68.jpg 120w, https://ko-jyblog.com/wp-content/uploads/2023/03/cora01-160x90.jpg 160w, https://ko-jyblog.com/wp-content/uploads/2023/03/cora01-320x180.jpg 320w, https://ko-jyblog.com/wp-content/uploads/2023/03/cora01.jpg 1920w" sizes="auto, (max-width: 800px) 100vw, 800px" /></figure>



<p>コンポジションレイヤーについているこのスイッチを「コラップストランスフォーム」といい、ベクターレイヤーについてるこのスイッチを「連続ラスタライズ」と呼びます。<br>見た目は全く同じであるため、初心者の人は別物として認識しにくいと思います。</p>



<h2 class="wp-block-heading">ラスターデータとベクターデータの違い</h2>



<p>コラップストランスフォームを理解する上で重要なラスターデータとベクターデータの違いについて解説します。</p>



<figure class="wp-block-image size-large"><img loading="lazy" decoding="async" width="800" height="450" src="https://ko-jyblog.com/wp-content/uploads/2023/02/85363f38d8fe89c0a98e21c59a4a7246-800x450.jpg" alt="" class="wp-image-531" srcset="https://ko-jyblog.com/wp-content/uploads/2023/02/85363f38d8fe89c0a98e21c59a4a7246-800x450.jpg 800w, https://ko-jyblog.com/wp-content/uploads/2023/02/85363f38d8fe89c0a98e21c59a4a7246-500x281.jpg 500w, https://ko-jyblog.com/wp-content/uploads/2023/02/85363f38d8fe89c0a98e21c59a4a7246-300x169.jpg 300w, https://ko-jyblog.com/wp-content/uploads/2023/02/85363f38d8fe89c0a98e21c59a4a7246-768x432.jpg 768w, https://ko-jyblog.com/wp-content/uploads/2023/02/85363f38d8fe89c0a98e21c59a4a7246-1536x864.jpg 1536w, https://ko-jyblog.com/wp-content/uploads/2023/02/85363f38d8fe89c0a98e21c59a4a7246-120x68.jpg 120w, https://ko-jyblog.com/wp-content/uploads/2023/02/85363f38d8fe89c0a98e21c59a4a7246-160x90.jpg 160w, https://ko-jyblog.com/wp-content/uploads/2023/02/85363f38d8fe89c0a98e21c59a4a7246-320x180.jpg 320w, https://ko-jyblog.com/wp-content/uploads/2023/02/85363f38d8fe89c0a98e21c59a4a7246.bmp 1920w" sizes="auto, (max-width: 800px) 100vw, 800px" /></figure>



<p>皆さんが一般的に想像するjpgなどの画像データは、ラスターデータです。<br>左側のラスターデータは元画像の大きさから拡大するとボケていますが、右側のベクターデータの方はボケていません。<br>左側の魚の拡大図はイメージですが、ラスターデータとはピクセルごとの色情報を記録するデータです。<br>ラスターデータをピクセルが確認できるまで拡大すると実際にこのように見えます。</p>



<p>ラスター画像はピクセル一つ一つの色情報を記録するのでデータ量が膨大になることが想像できます。<br>デジタルで絵を描くソフトのうち、ラスター画像を扱うソフトのadobe photoshopやクリスタなどのことをペイント系ソフトといいます。</p>



<p>一方、ベクターデータは特殊なデータで、パスの頂点の座標と曲線を描くためのベジェ情報、それと塗りの色情報を記録するという特殊なデータの持ち方をするので、拡大しても座標データから変換して画質が荒れずに拡大できるのが特徴です。<br>この特徴は強力でイラストやロゴなどの図形を作成するのに向いているデータ形式です。<br>色の変化が複雑な写真などには向きません。<br>ベクター系画像ファイルは代表的なものでEPSファイルやAiファイルがあります。<br>そして、デジタルで絵を描くソフトのうち、ベクターデータを扱えるソフトをドロー系ソフトと呼びます。代表的なソフトでいうとadobe illustratorがあります。</p>



<h2 class="wp-block-heading">連続ラスタライズ</h2>



<p>AfterEffectsはラスターデータを扱うソフトです。<br>ベクターデータのEPSやAIファイルもそのままでは、ラスターデータとして扱われてしまいます。</p>



<p>連続ラスタライズのスイッチをONにすると、拡大しても画像が荒れなくなります。<br>ベクターレイヤーはこのスイッチを押して初めてベクターデータとして扱われることになり、本来AIファイルが持っている、拡大しても荒れない特徴を活用できるようになります。<br>これが連続ラスタライズの効果です。</p>



<figure class="wp-block-image size-large"><img loading="lazy" decoding="async" width="800" height="450" src="https://ko-jyblog.com/wp-content/uploads/2023/03/cora02-800x450.jpg" alt="" class="wp-image-565" srcset="https://ko-jyblog.com/wp-content/uploads/2023/03/cora02-800x450.jpg 800w, https://ko-jyblog.com/wp-content/uploads/2023/03/cora02-500x281.jpg 500w, https://ko-jyblog.com/wp-content/uploads/2023/03/cora02-300x169.jpg 300w, https://ko-jyblog.com/wp-content/uploads/2023/03/cora02-768x432.jpg 768w, https://ko-jyblog.com/wp-content/uploads/2023/03/cora02-1536x864.jpg 1536w, https://ko-jyblog.com/wp-content/uploads/2023/03/cora02-120x68.jpg 120w, https://ko-jyblog.com/wp-content/uploads/2023/03/cora02-160x90.jpg 160w, https://ko-jyblog.com/wp-content/uploads/2023/03/cora02-320x180.jpg 320w, https://ko-jyblog.com/wp-content/uploads/2023/03/cora02.jpg 1920w" sizes="auto, (max-width: 800px) 100vw, 800px" /></figure>



<p>ラスタライズとはベクターデータやリンク画像・埋め込み画像を「ビットマップ画像」へ変換することを言います。<br>「連続ラスタライズ」とは、拡大縮小する前に一時的にベクターデータに戻して、変形後にラスタライズしているというイメージです。</p>



<p>AE内でベクターレイヤーとして作成できる平面、テキスト、シェイプのうち、平面は連続ラスタライズのスイッチがオンオフ切り替えれますが、テキストとシェイプはデフォルトで連続ラスタライズのスイッチが強制的にオンになっています。</p>



<figure class="wp-block-image size-large"><img loading="lazy" decoding="async" width="800" height="450" src="https://ko-jyblog.com/wp-content/uploads/2023/03/cora03-800x450.jpg" alt="" class="wp-image-566" srcset="https://ko-jyblog.com/wp-content/uploads/2023/03/cora03-800x450.jpg 800w, https://ko-jyblog.com/wp-content/uploads/2023/03/cora03-500x281.jpg 500w, https://ko-jyblog.com/wp-content/uploads/2023/03/cora03-300x169.jpg 300w, https://ko-jyblog.com/wp-content/uploads/2023/03/cora03-768x432.jpg 768w, https://ko-jyblog.com/wp-content/uploads/2023/03/cora03-1536x864.jpg 1536w, https://ko-jyblog.com/wp-content/uploads/2023/03/cora03-120x68.jpg 120w, https://ko-jyblog.com/wp-content/uploads/2023/03/cora03-160x90.jpg 160w, https://ko-jyblog.com/wp-content/uploads/2023/03/cora03-320x180.jpg 320w, https://ko-jyblog.com/wp-content/uploads/2023/03/cora03.jpg 1920w" sizes="auto, (max-width: 800px) 100vw, 800px" /></figure>



<p>なのでテキストとシェイプのレイヤーはどれだけ拡大しても荒れません。</p>



<h2 class="wp-block-heading">コラップストランスフォーム</h2>



<div class="wp-block-cocoon-blocks-info-box block-box primary-box">
<p><span class="fz-16px"><span class="fz-22px"><strong>★☆Ae用語の確認☆★</strong></span></span></p>



<figure class="wp-block-image size-large"><img loading="lazy" decoding="async" width="800" height="450" src="https://ko-jyblog.com/wp-content/uploads/2023/02/b1457c3a5be8d82acf96a637e5a684f9-800x450.jpg" alt="" class="wp-image-534" srcset="https://ko-jyblog.com/wp-content/uploads/2023/02/b1457c3a5be8d82acf96a637e5a684f9-800x450.jpg 800w, https://ko-jyblog.com/wp-content/uploads/2023/02/b1457c3a5be8d82acf96a637e5a684f9-500x281.jpg 500w, https://ko-jyblog.com/wp-content/uploads/2023/02/b1457c3a5be8d82acf96a637e5a684f9-300x169.jpg 300w, https://ko-jyblog.com/wp-content/uploads/2023/02/b1457c3a5be8d82acf96a637e5a684f9-768x432.jpg 768w, https://ko-jyblog.com/wp-content/uploads/2023/02/b1457c3a5be8d82acf96a637e5a684f9-1536x864.jpg 1536w, https://ko-jyblog.com/wp-content/uploads/2023/02/b1457c3a5be8d82acf96a637e5a684f9-120x68.jpg 120w, https://ko-jyblog.com/wp-content/uploads/2023/02/b1457c3a5be8d82acf96a637e5a684f9-160x90.jpg 160w, https://ko-jyblog.com/wp-content/uploads/2023/02/b1457c3a5be8d82acf96a637e5a684f9-320x180.jpg 320w, https://ko-jyblog.com/wp-content/uploads/2023/02/b1457c3a5be8d82acf96a637e5a684f9.bmp 1920w" sizes="auto, (max-width: 800px) 100vw, 800px" /></figure>



<p>コンポジションを別のコンポジションの中に含めることをネスト化といい、<br>ネスト化されたコンポジションはプリコンポジションと呼ばれます。<br>プリコンポーズとはレイヤーを新規コンポジションにまとめて、プリコンポジションにすることをいいます。</p>
</div>



<p>コラップストランスフォームを説明するために1920×1080のフルHDのコンポジションに、5kのトラの写真とAIデータのトラのイラスト、背景としてサバンナの風景写真を用意しました。</p>



<figure class="wp-block-image size-large"><img loading="lazy" decoding="async" width="800" height="450" src="https://ko-jyblog.com/wp-content/uploads/2023/03/cora05-800x450.jpg" alt="" class="wp-image-567" srcset="https://ko-jyblog.com/wp-content/uploads/2023/03/cora05-800x450.jpg 800w, https://ko-jyblog.com/wp-content/uploads/2023/03/cora05-500x281.jpg 500w, https://ko-jyblog.com/wp-content/uploads/2023/03/cora05-300x169.jpg 300w, https://ko-jyblog.com/wp-content/uploads/2023/03/cora05-768x432.jpg 768w, https://ko-jyblog.com/wp-content/uploads/2023/03/cora05-1536x864.jpg 1536w, https://ko-jyblog.com/wp-content/uploads/2023/03/cora05-120x68.jpg 120w, https://ko-jyblog.com/wp-content/uploads/2023/03/cora05-160x90.jpg 160w, https://ko-jyblog.com/wp-content/uploads/2023/03/cora05-320x180.jpg 320w, https://ko-jyblog.com/wp-content/uploads/2023/03/cora05.jpg 1920w" sizes="auto, (max-width: 800px) 100vw, 800px" /></figure>



<p>5kのトラの写真は解像度が高いので拡大しても荒れにくく、AIデータは連続ラスタライズがONになっているので拡大しても画像は荒れない状態です。</p>



<p>この2つのレイヤーをネスト化してプリコンポジションにした場合、プリコンポジションは「事前合成」という意味なので、プリコンポジションの中身は事前にレンダリングされます。<br>AEの合成では下の階層のコンポジションは先にレンダリングされるということです。</p>



<p>プリコンポジションの中のイラストを動かすと上の階層のプレビューも動きます。</p>



<figure class="wp-block-image size-large"><img loading="lazy" decoding="async" width="800" height="450" src="https://ko-jyblog.com/wp-content/uploads/2023/03/cora08-800x450.jpg" alt="" class="wp-image-568" srcset="https://ko-jyblog.com/wp-content/uploads/2023/03/cora08-800x450.jpg 800w, https://ko-jyblog.com/wp-content/uploads/2023/03/cora08-500x281.jpg 500w, https://ko-jyblog.com/wp-content/uploads/2023/03/cora08-300x169.jpg 300w, https://ko-jyblog.com/wp-content/uploads/2023/03/cora08-768x432.jpg 768w, https://ko-jyblog.com/wp-content/uploads/2023/03/cora08-1536x864.jpg 1536w, https://ko-jyblog.com/wp-content/uploads/2023/03/cora08-120x68.jpg 120w, https://ko-jyblog.com/wp-content/uploads/2023/03/cora08-160x90.jpg 160w, https://ko-jyblog.com/wp-content/uploads/2023/03/cora08-320x180.jpg 320w, https://ko-jyblog.com/wp-content/uploads/2023/03/cora08.jpg 1920w" sizes="auto, (max-width: 800px) 100vw, 800px" /></figure>



<p>AEはレイヤーの下から順番に合成されていきますので、背景がレンダリングされ、次にプリコンポジションが合成されますが、事前にレンダリングされたプリコンポジションは1枚の1920×1080のラスターデータとして扱われてしまいます。</p>



<p>そのため、プリコンポジション内を見ると5kの写真と、荒れないはずのベクターデータであるのにも関わらず、プリコンポジションを拡大すると画像はボケてしまっています。</p>



<figure class="wp-block-image size-large"><img loading="lazy" decoding="async" width="800" height="450" src="https://ko-jyblog.com/wp-content/uploads/2023/03/cora04-800x450.jpg" alt="" class="wp-image-569" srcset="https://ko-jyblog.com/wp-content/uploads/2023/03/cora04-800x450.jpg 800w, https://ko-jyblog.com/wp-content/uploads/2023/03/cora04-500x281.jpg 500w, https://ko-jyblog.com/wp-content/uploads/2023/03/cora04-300x169.jpg 300w, https://ko-jyblog.com/wp-content/uploads/2023/03/cora04-768x432.jpg 768w, https://ko-jyblog.com/wp-content/uploads/2023/03/cora04-1536x864.jpg 1536w, https://ko-jyblog.com/wp-content/uploads/2023/03/cora04-120x68.jpg 120w, https://ko-jyblog.com/wp-content/uploads/2023/03/cora04-160x90.jpg 160w, https://ko-jyblog.com/wp-content/uploads/2023/03/cora04-320x180.jpg 320w, https://ko-jyblog.com/wp-content/uploads/2023/03/cora04.jpg 1920w" sizes="auto, (max-width: 800px) 100vw, 800px" /></figure>



<p>さらにコンポジションの解像度でレンダリングされるので、トラのイラストが切れてしまっています。</p>



<figure class="wp-block-image size-large"><img loading="lazy" decoding="async" width="800" height="450" src="https://ko-jyblog.com/wp-content/uploads/2023/02/5391de8d48e2a167b1d41dc583a8b227-800x450.jpg" alt="" class="wp-image-535" srcset="https://ko-jyblog.com/wp-content/uploads/2023/02/5391de8d48e2a167b1d41dc583a8b227-800x450.jpg 800w, https://ko-jyblog.com/wp-content/uploads/2023/02/5391de8d48e2a167b1d41dc583a8b227-500x281.jpg 500w, https://ko-jyblog.com/wp-content/uploads/2023/02/5391de8d48e2a167b1d41dc583a8b227-300x169.jpg 300w, https://ko-jyblog.com/wp-content/uploads/2023/02/5391de8d48e2a167b1d41dc583a8b227-768x432.jpg 768w, https://ko-jyblog.com/wp-content/uploads/2023/02/5391de8d48e2a167b1d41dc583a8b227-1536x864.jpg 1536w, https://ko-jyblog.com/wp-content/uploads/2023/02/5391de8d48e2a167b1d41dc583a8b227-120x68.jpg 120w, https://ko-jyblog.com/wp-content/uploads/2023/02/5391de8d48e2a167b1d41dc583a8b227-160x90.jpg 160w, https://ko-jyblog.com/wp-content/uploads/2023/02/5391de8d48e2a167b1d41dc583a8b227-320x180.jpg 320w, https://ko-jyblog.com/wp-content/uploads/2023/02/5391de8d48e2a167b1d41dc583a8b227.bmp 1920w" sizes="auto, (max-width: 800px) 100vw, 800px" /></figure>



<p>プリコンポジションにも連続ラスタライズと同じスイッチがついていますが、これは連続ラスタライズとは別物で、コラップストランスフォームというスイッチになります。<br>今回の本題のコラップストランスフォームです。</p>



<p>コラップストランスフォームをオンにすることで、プリコンポジション内の「事前レンダリング」がされず、コンポジション内の属性をコンポジションの外に通過させることができます。<br>その結果、画像は荒れなくなります。</p>



<figure class="wp-block-image size-large"><img loading="lazy" decoding="async" width="800" height="450" src="https://ko-jyblog.com/wp-content/uploads/2023/03/cora09-800x450.jpg" alt="" class="wp-image-570" srcset="https://ko-jyblog.com/wp-content/uploads/2023/03/cora09-800x450.jpg 800w, https://ko-jyblog.com/wp-content/uploads/2023/03/cora09-500x281.jpg 500w, https://ko-jyblog.com/wp-content/uploads/2023/03/cora09-300x169.jpg 300w, https://ko-jyblog.com/wp-content/uploads/2023/03/cora09-768x432.jpg 768w, https://ko-jyblog.com/wp-content/uploads/2023/03/cora09-1536x864.jpg 1536w, https://ko-jyblog.com/wp-content/uploads/2023/03/cora09-120x68.jpg 120w, https://ko-jyblog.com/wp-content/uploads/2023/03/cora09-160x90.jpg 160w, https://ko-jyblog.com/wp-content/uploads/2023/03/cora09-320x180.jpg 320w, https://ko-jyblog.com/wp-content/uploads/2023/03/cora09.jpg 1920w" sizes="auto, (max-width: 800px) 100vw, 800px" /></figure>



<p>言い換えるとプリコンポジションの中のレイヤーを外に出した状態、つまりプリコンポーズする前と同じ状態になります。<br>素材のポテンシャルを最大限に活かすことができる機能ともいえます。</p>



<p>コラップストランスフォームがオンの状態であれば、5kの写真は5kの写真の耐えうる範囲では荒れないですし、事前レンダリングされないので、コンポジションのサイズでトリミングされずに画面の外側のイラストも切れません。</p>



<h2 class="wp-block-heading">共通していること</h2>



<p>コラップストランスフォームと連続ラスタライズのスイッチに共通していることは、これらのスイッチをオンにすると、レイヤー内のレンダリングの処理の順番が変更されることです。</p>



<p>例として写真とイラストが入ったプリコンポジションに星型シェイプのマスクをかけます。<br>そこにエフェクトのフラクタルノイズをかけます。<br>その後、レイヤースタイルの縁取りをして、スケールでアニメーションをします。</p>



<p>コラップストランスフォームのスイッチがオフのままだと、500％に拡大すると、エフェクトのノイズがかなりぼけてしまいます。(下の画像左側)<br>コラップストランスフォームのスイッチをオンにするとノイズがくっきりしましたが、ノイズの500％の拡大がされていないようです。(下の画像右側)</p>



<figure class="wp-block-image size-large"><img loading="lazy" decoding="async" width="800" height="450" src="https://ko-jyblog.com/wp-content/uploads/2023/02/5fc804f6513b9e80479f10e54d35ebeb-2-800x450.jpg" alt="" class="wp-image-541" srcset="https://ko-jyblog.com/wp-content/uploads/2023/02/5fc804f6513b9e80479f10e54d35ebeb-2-800x450.jpg 800w, https://ko-jyblog.com/wp-content/uploads/2023/02/5fc804f6513b9e80479f10e54d35ebeb-2-500x281.jpg 500w, https://ko-jyblog.com/wp-content/uploads/2023/02/5fc804f6513b9e80479f10e54d35ebeb-2-300x169.jpg 300w, https://ko-jyblog.com/wp-content/uploads/2023/02/5fc804f6513b9e80479f10e54d35ebeb-2-768x432.jpg 768w, https://ko-jyblog.com/wp-content/uploads/2023/02/5fc804f6513b9e80479f10e54d35ebeb-2-1536x864.jpg 1536w, https://ko-jyblog.com/wp-content/uploads/2023/02/5fc804f6513b9e80479f10e54d35ebeb-2-120x68.jpg 120w, https://ko-jyblog.com/wp-content/uploads/2023/02/5fc804f6513b9e80479f10e54d35ebeb-2-160x90.jpg 160w, https://ko-jyblog.com/wp-content/uploads/2023/02/5fc804f6513b9e80479f10e54d35ebeb-2-320x180.jpg 320w, https://ko-jyblog.com/wp-content/uploads/2023/02/5fc804f6513b9e80479f10e54d35ebeb-2.bmp 1920w" sizes="auto, (max-width: 800px) 100vw, 800px" /></figure>



<p>コラップストランスフォームのスイッチが入っていない場合、モーションブラーをかけるとレイヤー内のレンダリングの処理は上から順番に処理がされています。<br>コラップストランスフォームスイッチが入っている場合、エフェクトをトランスフォームの後に処理して、エフェクトの描画がトランスフォームの影響を受けないように処理されるようになります。</p>



<div class="wp-block-cocoon-blocks-tab-box-1 blank-box bb-tab bb-check block-box">
<p>この処理順はコラップストランスフォームと連続ラスタライズの両方のスイッチで共通です。<br>スイッチが入っているものは処理順が変わるということを覚えておきましょう。</p>
</div>



<h2 class="wp-block-heading">&#8220;コンポジション内の属性をコンポジションの外に通過させる&#8221;とは？</h2>



<p>コラップストランスフォームをONにするとコンポジションの外に通過させることができる属性は以下の通りです。<br>　・描画モード<br>　・レイヤースタイル<br>　・エフェクト<br>　・トランスフォーム<br>　・下の透明部分を保持<br>　・品質とサンプリング<br>　・モーションブラースイッチ<br>　・調整レイヤースイッチ</p>



<p>描画モードの場合を見てみましょう。</p>



<figure class="wp-block-image size-large"><img loading="lazy" decoding="async" width="800" height="450" src="https://ko-jyblog.com/wp-content/uploads/2023/03/cora10-800x450.jpg" alt="" class="wp-image-571" srcset="https://ko-jyblog.com/wp-content/uploads/2023/03/cora10-800x450.jpg 800w, https://ko-jyblog.com/wp-content/uploads/2023/03/cora10-500x281.jpg 500w, https://ko-jyblog.com/wp-content/uploads/2023/03/cora10-300x169.jpg 300w, https://ko-jyblog.com/wp-content/uploads/2023/03/cora10-768x432.jpg 768w, https://ko-jyblog.com/wp-content/uploads/2023/03/cora10-1536x864.jpg 1536w, https://ko-jyblog.com/wp-content/uploads/2023/03/cora10-120x68.jpg 120w, https://ko-jyblog.com/wp-content/uploads/2023/03/cora10-160x90.jpg 160w, https://ko-jyblog.com/wp-content/uploads/2023/03/cora10-320x180.jpg 320w, https://ko-jyblog.com/wp-content/uploads/2023/03/cora10.jpg 1920w" sizes="auto, (max-width: 800px) 100vw, 800px" /></figure>



<p>RGBの三原色を描画モード「加算」で合成しています。<br>このコンポジションをサバンナの背景写真に重ねてプリコンポジションとして使用します。<br>そのままの状態だとプリコンポジションが事前にレンダリングされて、背景に通常で合成されています。</p>



<figure class="wp-block-image size-large"><img loading="lazy" decoding="async" width="800" height="450" src="https://ko-jyblog.com/wp-content/uploads/2023/03/6feda2c66892702140fa9a074ce71f1d-1-800x450.jpg" alt="" class="wp-image-572" srcset="https://ko-jyblog.com/wp-content/uploads/2023/03/6feda2c66892702140fa9a074ce71f1d-1-800x450.jpg 800w, https://ko-jyblog.com/wp-content/uploads/2023/03/6feda2c66892702140fa9a074ce71f1d-1-500x281.jpg 500w, https://ko-jyblog.com/wp-content/uploads/2023/03/6feda2c66892702140fa9a074ce71f1d-1-300x169.jpg 300w, https://ko-jyblog.com/wp-content/uploads/2023/03/6feda2c66892702140fa9a074ce71f1d-1-768x432.jpg 768w, https://ko-jyblog.com/wp-content/uploads/2023/03/6feda2c66892702140fa9a074ce71f1d-1-1536x864.jpg 1536w, https://ko-jyblog.com/wp-content/uploads/2023/03/6feda2c66892702140fa9a074ce71f1d-1-120x68.jpg 120w, https://ko-jyblog.com/wp-content/uploads/2023/03/6feda2c66892702140fa9a074ce71f1d-1-160x90.jpg 160w, https://ko-jyblog.com/wp-content/uploads/2023/03/6feda2c66892702140fa9a074ce71f1d-1-320x180.jpg 320w, https://ko-jyblog.com/wp-content/uploads/2023/03/6feda2c66892702140fa9a074ce71f1d-1.bmp 1920w" sizes="auto, (max-width: 800px) 100vw, 800px" /></figure>



<p>このプリコンポジションのコラップストランスフォームをONにするとこのような変化が起きます。</p>



<figure class="wp-block-image size-large"><img loading="lazy" decoding="async" width="800" height="450" src="https://ko-jyblog.com/wp-content/uploads/2023/03/dc06563808574c044fb4e4e948070ab6-800x450.jpg" alt="" class="wp-image-555" srcset="https://ko-jyblog.com/wp-content/uploads/2023/03/dc06563808574c044fb4e4e948070ab6-800x450.jpg 800w, https://ko-jyblog.com/wp-content/uploads/2023/03/dc06563808574c044fb4e4e948070ab6-500x281.jpg 500w, https://ko-jyblog.com/wp-content/uploads/2023/03/dc06563808574c044fb4e4e948070ab6-300x169.jpg 300w, https://ko-jyblog.com/wp-content/uploads/2023/03/dc06563808574c044fb4e4e948070ab6-768x432.jpg 768w, https://ko-jyblog.com/wp-content/uploads/2023/03/dc06563808574c044fb4e4e948070ab6-1536x864.jpg 1536w, https://ko-jyblog.com/wp-content/uploads/2023/03/dc06563808574c044fb4e4e948070ab6-120x68.jpg 120w, https://ko-jyblog.com/wp-content/uploads/2023/03/dc06563808574c044fb4e4e948070ab6-160x90.jpg 160w, https://ko-jyblog.com/wp-content/uploads/2023/03/dc06563808574c044fb4e4e948070ab6-320x180.jpg 320w, https://ko-jyblog.com/wp-content/uploads/2023/03/dc06563808574c044fb4e4e948070ab6.bmp 1920w" sizes="auto, (max-width: 800px) 100vw, 800px" /></figure>



<p>スイッチをオンにすると描画モードは横線表示になりました。<br>これはプリコンポジションの中身の描画モードの属性が通過して、外に出てきている状態を表します。<br>RGBのシェイプがサバンナの背景にそれぞれ加算で合成されています。</p>



<p>描画モードと同じようにコラップストランスフォームのスイッチをONにすると「品質とサンプリング」「モーションブラー」「下の透明部分を保持」の部分も横線表示になり、触れなくなります。<br>この横線表示は通過を意味し、言い方を変えれば「コンポジション内の各レイヤーの設定に従う」という意味です。</p>



<p>それでは調整レイヤーはどうでしょうか。</p>



<figure class="wp-block-image size-large"><img loading="lazy" decoding="async" width="800" height="450" src="https://ko-jyblog.com/wp-content/uploads/2023/03/1f41f49dbb44df61ee18ffe027e3cde2-800x450.jpg" alt="" class="wp-image-556" srcset="https://ko-jyblog.com/wp-content/uploads/2023/03/1f41f49dbb44df61ee18ffe027e3cde2-800x450.jpg 800w, https://ko-jyblog.com/wp-content/uploads/2023/03/1f41f49dbb44df61ee18ffe027e3cde2-500x281.jpg 500w, https://ko-jyblog.com/wp-content/uploads/2023/03/1f41f49dbb44df61ee18ffe027e3cde2-300x169.jpg 300w, https://ko-jyblog.com/wp-content/uploads/2023/03/1f41f49dbb44df61ee18ffe027e3cde2-768x432.jpg 768w, https://ko-jyblog.com/wp-content/uploads/2023/03/1f41f49dbb44df61ee18ffe027e3cde2-1536x864.jpg 1536w, https://ko-jyblog.com/wp-content/uploads/2023/03/1f41f49dbb44df61ee18ffe027e3cde2-120x68.jpg 120w, https://ko-jyblog.com/wp-content/uploads/2023/03/1f41f49dbb44df61ee18ffe027e3cde2-160x90.jpg 160w, https://ko-jyblog.com/wp-content/uploads/2023/03/1f41f49dbb44df61ee18ffe027e3cde2-320x180.jpg 320w, https://ko-jyblog.com/wp-content/uploads/2023/03/1f41f49dbb44df61ee18ffe027e3cde2.bmp 1920w" sizes="auto, (max-width: 800px) 100vw, 800px" /></figure>



<p>プリコンポジション内にある調整レイヤーにエフェクト（白黒）をかけると、調整レイヤーはそれより下のレイヤーにエフェクトを適用する効果があります。<br>そのため、効果はコンポジションの一番下にまでかかり、プリコンポジション内で事前レンダリングが行われ、エフェクトの効果が外に出ることはありません。</p>



<figure class="wp-block-image size-large"><img loading="lazy" decoding="async" width="800" height="450" src="https://ko-jyblog.com/wp-content/uploads/2023/03/cora11-800x450.jpg" alt="" class="wp-image-573" srcset="https://ko-jyblog.com/wp-content/uploads/2023/03/cora11-800x450.jpg 800w, https://ko-jyblog.com/wp-content/uploads/2023/03/cora11-500x281.jpg 500w, https://ko-jyblog.com/wp-content/uploads/2023/03/cora11-300x169.jpg 300w, https://ko-jyblog.com/wp-content/uploads/2023/03/cora11-768x432.jpg 768w, https://ko-jyblog.com/wp-content/uploads/2023/03/cora11-1536x864.jpg 1536w, https://ko-jyblog.com/wp-content/uploads/2023/03/cora11-120x68.jpg 120w, https://ko-jyblog.com/wp-content/uploads/2023/03/cora11-160x90.jpg 160w, https://ko-jyblog.com/wp-content/uploads/2023/03/cora11-320x180.jpg 320w, https://ko-jyblog.com/wp-content/uploads/2023/03/cora11.jpg 1920w" sizes="auto, (max-width: 800px) 100vw, 800px" /></figure>



<p>しかしコンポジションのコラップストランスフォームをONにするとこの事前レンダリングが行われないので、調整レイヤーの属性が外に通過して、プリコンポジションより下まで影響が伸びてサバンナの背景写真にまでエフェクトが延長してかかるようになりました。</p>



<figure class="wp-block-image size-large"><img loading="lazy" decoding="async" width="800" height="450" src="https://ko-jyblog.com/wp-content/uploads/2023/03/fd46dcd5a1a3198880df14f13a362c13-1-800x450.jpg" alt="" class="wp-image-563" srcset="https://ko-jyblog.com/wp-content/uploads/2023/03/fd46dcd5a1a3198880df14f13a362c13-1-800x450.jpg 800w, https://ko-jyblog.com/wp-content/uploads/2023/03/fd46dcd5a1a3198880df14f13a362c13-1-500x281.jpg 500w, https://ko-jyblog.com/wp-content/uploads/2023/03/fd46dcd5a1a3198880df14f13a362c13-1-300x169.jpg 300w, https://ko-jyblog.com/wp-content/uploads/2023/03/fd46dcd5a1a3198880df14f13a362c13-1-768x432.jpg 768w, https://ko-jyblog.com/wp-content/uploads/2023/03/fd46dcd5a1a3198880df14f13a362c13-1-1536x864.jpg 1536w, https://ko-jyblog.com/wp-content/uploads/2023/03/fd46dcd5a1a3198880df14f13a362c13-1-120x68.jpg 120w, https://ko-jyblog.com/wp-content/uploads/2023/03/fd46dcd5a1a3198880df14f13a362c13-1-160x90.jpg 160w, https://ko-jyblog.com/wp-content/uploads/2023/03/fd46dcd5a1a3198880df14f13a362c13-1-320x180.jpg 320w, https://ko-jyblog.com/wp-content/uploads/2023/03/fd46dcd5a1a3198880df14f13a362c13-1.bmp 1920w" sizes="auto, (max-width: 800px) 100vw, 800px" /></figure>



<p>要は「プリコンポジションの外で調整レイヤーをかけたのと同じことが起きる。」ということです。</p>



<p>3Dレイヤーを扱う場合もコラップスをONにしないとプリコンポジションの事前レンダリングによりラスター化されて2Dとして認識されてしまうので、3Dレイヤーとして扱いたい場合は基本的にはコラップスをONにして、属性を通過させる必要があります。</p>



<figure class="wp-block-image size-large"><img loading="lazy" decoding="async" width="800" height="450" src="https://ko-jyblog.com/wp-content/uploads/2023/03/cora12-800x450.jpg" alt="" class="wp-image-574" srcset="https://ko-jyblog.com/wp-content/uploads/2023/03/cora12-800x450.jpg 800w, https://ko-jyblog.com/wp-content/uploads/2023/03/cora12-500x281.jpg 500w, https://ko-jyblog.com/wp-content/uploads/2023/03/cora12-300x169.jpg 300w, https://ko-jyblog.com/wp-content/uploads/2023/03/cora12-768x432.jpg 768w, https://ko-jyblog.com/wp-content/uploads/2023/03/cora12-1536x864.jpg 1536w, https://ko-jyblog.com/wp-content/uploads/2023/03/cora12-120x68.jpg 120w, https://ko-jyblog.com/wp-content/uploads/2023/03/cora12-160x90.jpg 160w, https://ko-jyblog.com/wp-content/uploads/2023/03/cora12-320x180.jpg 320w, https://ko-jyblog.com/wp-content/uploads/2023/03/cora12.jpg 1920w" sizes="auto, (max-width: 800px) 100vw, 800px" /></figure>



<p>そして3Dスイッチは座標などのコントローラを3次元化するスイッチなので3Dとして動かす場合は3DスイッチもONにして、座標を3次元にする必要があります。</p>



<h2 class="wp-block-heading">最後に</h2>



<p>連続ラスタライズとコラップストランスフォームの違いを理解していただけましたか。<br>コラップストランスフォームは、たくさんある属性が一つのスイッチによって、コンポジションを通過して画面の見え方が大きく変わってしまうので、知らずに使用すると混乱するスイッチです。<br>しかし、使い方が分かればとても便利な機能です。<br>色々な表現を可能にしてくれるスイッチでもあるのでぜひ活用してみてください。</p>
]]></content:encoded>
					
					<wfw:commentRss>https://ko-jyblog.com/aftereffects/after-effects%e3%81%ae%e3%82%b3%e3%83%a9%e3%83%83%e3%83%97%e3%82%b9%e3%83%88%e3%83%a9%e3%83%b3%e3%82%b9%e3%83%95%e3%82%a9%e3%83%bc%e3%83%a0%e3%81%ab%e3%81%a4%e3%81%84%e3%81%a6/feed/</wfw:commentRss>
			<slash:comments>6</slash:comments>
		
		
			</item>
		<item>
		<title>Photoshopのコピースタンプツールについて</title>
		<link>https://ko-jyblog.com/photoshop/%e3%82%b3%e3%83%94%e3%83%bc%e3%82%b9%e3%82%bf%e3%83%b3%e3%83%97%e3%83%84%e3%83%bc%e3%83%ab/</link>
					<comments>https://ko-jyblog.com/photoshop/%e3%82%b3%e3%83%94%e3%83%bc%e3%82%b9%e3%82%bf%e3%83%b3%e3%83%97%e3%83%84%e3%83%bc%e3%83%ab/#respond</comments>
		
		<dc:creator><![CDATA[マル]]></dc:creator>
		<pubDate>Mon, 30 May 2022 02:00:00 +0000</pubDate>
				<category><![CDATA[Photoshop]]></category>
		<guid isPermaLink="false">https://ko-jyblog.com/?p=502</guid>

					<description><![CDATA[動画で見たい方はコチラ コピースタンプツールとは 画像の一部を同じ画像の別の部分にペイントすることができ、オブジェクトを複製したり、画像内のゴミを取り除くのに便利です。 使い方 ※毛玉に見立てた赤い部分を消してみます。  [&#8230;]]]></description>
										<content:encoded><![CDATA[
<h2 class="has-blue-background-color has-background wp-block-heading">動画で見たい方はコチラ</h2>



<div class="iframe-wrapper"><iframe loading="lazy" width="840" height="472" src="https://www.youtube.com/embed/hTCknebjF78?rel=0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen=""></iframe></div>



<h2 class="has-blue-background-color has-background wp-block-heading">コピースタンプツールとは</h2>



<p>画像の一部を同じ画像の別の部分にペイントすることができ、オブジェクトを複製したり、画像内のゴミを取り除くのに便利です。</p>



<h4 class="wp-block-heading">使い方</h4>



<p>※毛玉に見立てた赤い部分を消してみます。</p>



<p><strong>①Altキーを押しながらサンプリングしたい部分をクリックする。</strong></p>



<figure class="wp-block-image size-large"><img loading="lazy" decoding="async" width="800" height="450" src="https://ko-jyblog.com/wp-content/uploads/2022/05/171522292c291e76b731114364ea105a-800x450.jpg" alt="" class="wp-image-515" srcset="https://ko-jyblog.com/wp-content/uploads/2022/05/171522292c291e76b731114364ea105a-800x450.jpg 800w, https://ko-jyblog.com/wp-content/uploads/2022/05/171522292c291e76b731114364ea105a-500x281.jpg 500w, https://ko-jyblog.com/wp-content/uploads/2022/05/171522292c291e76b731114364ea105a-300x169.jpg 300w, https://ko-jyblog.com/wp-content/uploads/2022/05/171522292c291e76b731114364ea105a-768x432.jpg 768w, https://ko-jyblog.com/wp-content/uploads/2022/05/171522292c291e76b731114364ea105a-1536x864.jpg 1536w, https://ko-jyblog.com/wp-content/uploads/2022/05/171522292c291e76b731114364ea105a-120x68.jpg 120w, https://ko-jyblog.com/wp-content/uploads/2022/05/171522292c291e76b731114364ea105a-160x90.jpg 160w, https://ko-jyblog.com/wp-content/uploads/2022/05/171522292c291e76b731114364ea105a-320x180.jpg 320w, https://ko-jyblog.com/wp-content/uploads/2022/05/171522292c291e76b731114364ea105a.jpg 1920w" sizes="auto, (max-width: 800px) 100vw, 800px" /></figure>



<p><strong>②Altを離して、ブラシの要領で消したい部分を塗る。</strong></p>



<figure class="wp-block-image size-large"><img loading="lazy" decoding="async" width="800" height="450" src="https://ko-jyblog.com/wp-content/uploads/2022/05/6e4500918df4ee08a6140e008c7a7efe-800x450.jpg" alt="" class="wp-image-516" srcset="https://ko-jyblog.com/wp-content/uploads/2022/05/6e4500918df4ee08a6140e008c7a7efe-800x450.jpg 800w, https://ko-jyblog.com/wp-content/uploads/2022/05/6e4500918df4ee08a6140e008c7a7efe-500x281.jpg 500w, https://ko-jyblog.com/wp-content/uploads/2022/05/6e4500918df4ee08a6140e008c7a7efe-300x169.jpg 300w, https://ko-jyblog.com/wp-content/uploads/2022/05/6e4500918df4ee08a6140e008c7a7efe-768x432.jpg 768w, https://ko-jyblog.com/wp-content/uploads/2022/05/6e4500918df4ee08a6140e008c7a7efe-1536x864.jpg 1536w, https://ko-jyblog.com/wp-content/uploads/2022/05/6e4500918df4ee08a6140e008c7a7efe-120x68.jpg 120w, https://ko-jyblog.com/wp-content/uploads/2022/05/6e4500918df4ee08a6140e008c7a7efe-160x90.jpg 160w, https://ko-jyblog.com/wp-content/uploads/2022/05/6e4500918df4ee08a6140e008c7a7efe-320x180.jpg 320w, https://ko-jyblog.com/wp-content/uploads/2022/05/6e4500918df4ee08a6140e008c7a7efe.jpg 1920w" sizes="auto, (max-width: 800px) 100vw, 800px" /></figure>



<p>この作業を繰り返していきます。<br>きれいにゴミを取り除くには、<span class="marker-under"><span class="bold-red">消したい部分の近くからサンプリングをすること</span></span>が重要です。</p>



<h2 class="has-blue-background-color has-background wp-block-heading">まとめ</h2>



<p>ECサイトの商品画像でタグやゴミなどを取り除くときによく使うツールです。<br>作業自体は簡単ですが違和感がないように塗っていくのは少し慣れが必要だと思いますので、積極的に使ってみてください。<br></p>
]]></content:encoded>
					
					<wfw:commentRss>https://ko-jyblog.com/photoshop/%e3%82%b3%e3%83%94%e3%83%bc%e3%82%b9%e3%82%bf%e3%83%b3%e3%83%97%e3%83%84%e3%83%bc%e3%83%ab/feed/</wfw:commentRss>
			<slash:comments>0</slash:comments>
		
		
			</item>
		<item>
		<title>描画モード⑤色相・彩度・輝度を使う描画モード</title>
		<link>https://ko-jyblog.com/aftereffects/blendmode05/</link>
					<comments>https://ko-jyblog.com/aftereffects/blendmode05/#comments</comments>
		
		<dc:creator><![CDATA[コージー]]></dc:creator>
		<pubDate>Tue, 10 May 2022 16:45:00 +0000</pubDate>
				<category><![CDATA[After Effects]]></category>
		<guid isPermaLink="false">https://ko-jyblog.com/?p=471</guid>

					<description><![CDATA[動画で見たい方はコチラ 色相・彩度・輝度を使う描画モード【色相・彩度・カラー・輝度】 こちらは計算式というものではありませんが、行っている処理について説明します。まず描画モード：輝度について先に説明します。 この平面の合 [&#8230;]]]></description>
										<content:encoded><![CDATA[
<h2 class="wp-block-heading">動画で見たい方はコチラ</h2>



<div class="iframe-wrapper"><iframe loading="lazy" width="840" height="472" src="https://www.youtube.com/embed/g2sZNsJc67M?rel=0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen=""></iframe></div>



<div class="iframe-wrapper"><iframe loading="lazy" width="840" height="472" src="https://www.youtube.com/embed/zYLa0pDCLio?rel=0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen=""></iframe></div>



<h2 class="wp-block-heading">色相・彩度・輝度を使う描画モード【色相・彩度・カラー・輝度】</h2>



<p>こちらは計算式というものではありませんが、行っている処理について説明します。<br>まず描画モード：<span class="bold">輝度</span>について先に説明します。</p>



<div class="wp-block-cocoon-blocks-info-box block-box primary-box">
<p><span class="bold">輝度（色相・彩度・輝度を使う描画モード）　</span><br><span class="bold">輝度</span>は<span class="bold-green">合成色</span>の値を使用する（色相と彩度は基本色の値を使用）</p>
</div>



<figure class="wp-block-image size-large"><img loading="lazy" decoding="async" width="800" height="450" src="https://ko-jyblog.com/wp-content/uploads/2022/05/d5208ebc5ed3fe759bde361daca0e40d-800x450.jpg" alt="" class="wp-image-472" srcset="https://ko-jyblog.com/wp-content/uploads/2022/05/d5208ebc5ed3fe759bde361daca0e40d-800x450.jpg 800w, https://ko-jyblog.com/wp-content/uploads/2022/05/d5208ebc5ed3fe759bde361daca0e40d-500x281.jpg 500w, https://ko-jyblog.com/wp-content/uploads/2022/05/d5208ebc5ed3fe759bde361daca0e40d-300x169.jpg 300w, https://ko-jyblog.com/wp-content/uploads/2022/05/d5208ebc5ed3fe759bde361daca0e40d-768x432.jpg 768w, https://ko-jyblog.com/wp-content/uploads/2022/05/d5208ebc5ed3fe759bde361daca0e40d-1536x864.jpg 1536w, https://ko-jyblog.com/wp-content/uploads/2022/05/d5208ebc5ed3fe759bde361daca0e40d-120x68.jpg 120w, https://ko-jyblog.com/wp-content/uploads/2022/05/d5208ebc5ed3fe759bde361daca0e40d-160x90.jpg 160w, https://ko-jyblog.com/wp-content/uploads/2022/05/d5208ebc5ed3fe759bde361daca0e40d-320x180.jpg 320w, https://ko-jyblog.com/wp-content/uploads/2022/05/d5208ebc5ed3fe759bde361daca0e40d.jpg 1920w" sizes="auto, (max-width: 800px) 100vw, 800px" /></figure>



<p>この平面の合成を見れば分かります。<br>合成色と結果色の輝度が24％で同じになっています。<br>描画モード：輝度で合成すると<span class="bold-green"><span class="bold-blue">基本色</span></span>の色相と彩度を使用しながら、<br>輝度だけは必ず<span class="bold-blue">合成色</span>の値を使用します。</p>



<div class="wp-block-cocoon-blocks-info-box block-box primary-box">
<p><span class="bold">色相（色相・彩度・輝度を使う描画モード）　</span><br><span class="bold">色相</span>は<span class="bold-green">合成色</span>の値を使用する（輝度と彩度は基本色の値を使用）</p>
</div>



<div class="wp-block-cocoon-blocks-info-box block-box primary-box">
<p><span class="bold">彩度（色相・彩度・輝度を使う描画モード）　</span><br><span class="bold">彩度</span>は<span class="bold-green">合成色</span>の値を使用する（色相と輝度は基本色の値を使用）</p>
</div>



<div class="wp-block-cocoon-blocks-info-box block-box primary-box">
<p><span class="bold">カラー（色相・彩度・輝度を使う描画モード）　</span><br><span class="bold">色相と彩度</span>は<span class="bold-green">合成色</span>の値を使用する（輝度は基本色の値を使用）</p>
</div>



<figure class="wp-block-image size-large"><img loading="lazy" decoding="async" width="800" height="450" src="https://ko-jyblog.com/wp-content/uploads/2022/05/0c9b3e2b108c5874a986b6f4d7b43ac3-800x450.jpg" alt="" class="wp-image-473" srcset="https://ko-jyblog.com/wp-content/uploads/2022/05/0c9b3e2b108c5874a986b6f4d7b43ac3-800x450.jpg 800w, https://ko-jyblog.com/wp-content/uploads/2022/05/0c9b3e2b108c5874a986b6f4d7b43ac3-500x281.jpg 500w, https://ko-jyblog.com/wp-content/uploads/2022/05/0c9b3e2b108c5874a986b6f4d7b43ac3-300x169.jpg 300w, https://ko-jyblog.com/wp-content/uploads/2022/05/0c9b3e2b108c5874a986b6f4d7b43ac3-768x432.jpg 768w, https://ko-jyblog.com/wp-content/uploads/2022/05/0c9b3e2b108c5874a986b6f4d7b43ac3-1536x864.jpg 1536w, https://ko-jyblog.com/wp-content/uploads/2022/05/0c9b3e2b108c5874a986b6f4d7b43ac3-2048x1152.jpg 2048w, https://ko-jyblog.com/wp-content/uploads/2022/05/0c9b3e2b108c5874a986b6f4d7b43ac3-120x68.jpg 120w, https://ko-jyblog.com/wp-content/uploads/2022/05/0c9b3e2b108c5874a986b6f4d7b43ac3-160x90.jpg 160w, https://ko-jyblog.com/wp-content/uploads/2022/05/0c9b3e2b108c5874a986b6f4d7b43ac3-320x180.jpg 320w" sizes="auto, (max-width: 800px) 100vw, 800px" /></figure>



<p>この描画モードの便利な使い方については動画で詳しく説明してます。<br>是非見てみてください。<br><span class="bold-red">※ここで紹介しなかった他の描画モードについても、動画で解説しています。</span></p>



<p><a href="https://ko-jyblog.com/aftereffects/blendmode00/" data-type="URL" data-id="https://ko-jyblog.com/aftereffects/blendmode00/">After Effectsの全描画モードの種類と考え方</a><br><a href="https://ko-jyblog.com/aftereffects/blendmode01/" data-type="URL" data-id="https://ko-jyblog.com/aftereffects/blendmode01/">描画モード①明るくする描画モードの計算式</a><br><a href="https://ko-jyblog.com/aftereffects/blendmode02/" data-type="URL" data-id="https://ko-jyblog.com/aftereffects/blendmode02/">描画モード②暗くする描画モードの計算式</a><br><a href="https://ko-jyblog.com/aftereffects/blendmode03/" data-type="URL" data-id="https://ko-jyblog.com/aftereffects/blendmode03/">描画モード③コントラストを強くする描画モードの計算式</a><br><a href="https://ko-jyblog.com/aftereffects/blendmode04/" data-type="URL" data-id="https://ko-jyblog.com/aftereffects/blendmode04/">描画モード④色を反転させる描画モードの計算式</a><br><a href="https://ko-jyblog.com/aftereffects/blendmode05/" data-type="URL" data-id="https://ko-jyblog.com/aftereffects/blendmode05/">描画モード⑤色相・彩度・輝度を使う描画モード</a></p>



<p></p>
]]></content:encoded>
					
					<wfw:commentRss>https://ko-jyblog.com/aftereffects/blendmode05/feed/</wfw:commentRss>
			<slash:comments>1</slash:comments>
		
		
			</item>
		<item>
		<title>描画モード④色を反転させる描画モードの計算式</title>
		<link>https://ko-jyblog.com/aftereffects/blendmode04/</link>
					<comments>https://ko-jyblog.com/aftereffects/blendmode04/#comments</comments>
		
		<dc:creator><![CDATA[コージー]]></dc:creator>
		<pubDate>Tue, 10 May 2022 16:45:00 +0000</pubDate>
				<category><![CDATA[After Effects]]></category>
		<guid isPermaLink="false">https://ko-jyblog.com/?p=459</guid>

					<description><![CDATA[動画で見たい方はコチラ 色を反転させる描画モード【差・除外・減算・除算】の計算式の紹介 計算式は基本色と合成色を比べて、大きい方ひく小さい方の計算をします。この計算式を見ると、結果色を黒にすること、つまり0にするには合成 [&#8230;]]]></description>
										<content:encoded><![CDATA[
<h2 class="wp-block-heading">動画で見たい方はコチラ</h2>



<div class="iframe-wrapper"><iframe loading="lazy" width="840" height="472" src="https://www.youtube.com/embed/g2sZNsJc67M?rel=0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen=""></iframe></div>



<div class="iframe-wrapper"><iframe loading="lazy" width="840" height="472" src="https://www.youtube.com/embed/zYLa0pDCLio?rel=0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen=""></iframe></div>



<h2 class="wp-block-heading">色を反転させる描画モード【差・除外・減算・除算】の計算式の紹介</h2>



<p></p>



<div class="wp-block-cocoon-blocks-info-box block-box primary-box">
<p><span class="bold">差（色を反転させる描画モード）　</span><br><span class="bold-red">結果色</span>＝max｛ <span class="bold-blue">基本色</span>,<span class="bold-green">合成色</span>｝－min｛ <span class="bold-blue">基本色</span>,<span class="bold-green">合成色</span>｝</p>
</div>



<p>計算式は<span class="bold-blue">基本色</span>と<span class="bold-green">合成色</span>を比べて、<span class="bold-red">大きい方ひく小さい方の計算</span>をします。この計算式を見ると、結果色を黒にすること、つまり0にするには合成色と基本色のRGBがそれぞれ同じ数字にならないとありえません。<span class="bold-red"><span class="marker-under">合成色と基本色が完全に一致しないと真っ黒にはなりません</span></span>。</p>



<p>その特徴を利用して、合成色と基本色の<span class="bold-red">違う部分を抽出</span>できます。</p>



<figure class="wp-block-video"><video height="1080" style="aspect-ratio: 1920 / 1080;" width="1920" controls src="https://ko-jyblog.com/wp-content/uploads/2022/05/render_05_sa.mp4"></video></figure>



<figure class="wp-block-video"><video height="1080" style="aspect-ratio: 1920 / 1080;" width="1920" controls src="https://ko-jyblog.com/wp-content/uploads/2022/05/render_05_sasa.mp4"></video></figure>



<p>カラーバーを合成してみましょう。カラーバーの<span class="bold-red">黒い部分が無効化</span>して<span class="bold-red">白い部分は色を反転</span>させます。<br>画像の合成に使用するのは中々難しいのかなと思います。</p>



<div class="wp-block-cocoon-blocks-info-box block-box primary-box">
<p><span class="bold">除外<span class="bold">（色を反転させる描画モード）</span></span><br><span class="bold"><span class="bold-red">結果色</span>＝<span class="bold-blue">基本色</span>＋<span class="bold-green">合成色</span>－2×<span class="bold-blue">基本色</span>×<span class="bold-green">合成色</span></span></p>
</div>



<figure class="wp-block-image size-large"><img loading="lazy" decoding="async" width="800" height="450" src="https://ko-jyblog.com/wp-content/uploads/2022/05/ce2e0f97a9bc045f0c64e3b1f2f4984a-800x450.jpg" alt="" class="wp-image-466" srcset="https://ko-jyblog.com/wp-content/uploads/2022/05/ce2e0f97a9bc045f0c64e3b1f2f4984a-800x450.jpg 800w, https://ko-jyblog.com/wp-content/uploads/2022/05/ce2e0f97a9bc045f0c64e3b1f2f4984a-500x281.jpg 500w, https://ko-jyblog.com/wp-content/uploads/2022/05/ce2e0f97a9bc045f0c64e3b1f2f4984a-300x169.jpg 300w, https://ko-jyblog.com/wp-content/uploads/2022/05/ce2e0f97a9bc045f0c64e3b1f2f4984a-768x432.jpg 768w, https://ko-jyblog.com/wp-content/uploads/2022/05/ce2e0f97a9bc045f0c64e3b1f2f4984a-1536x864.jpg 1536w, https://ko-jyblog.com/wp-content/uploads/2022/05/ce2e0f97a9bc045f0c64e3b1f2f4984a-120x68.jpg 120w, https://ko-jyblog.com/wp-content/uploads/2022/05/ce2e0f97a9bc045f0c64e3b1f2f4984a-160x90.jpg 160w, https://ko-jyblog.com/wp-content/uploads/2022/05/ce2e0f97a9bc045f0c64e3b1f2f4984a-320x180.jpg 320w, https://ko-jyblog.com/wp-content/uploads/2022/05/ce2e0f97a9bc045f0c64e3b1f2f4984a.jpg 1920w" sizes="auto, (max-width: 800px) 100vw, 800px" /></figure>



<p><span class="bold">除外</span>は今紹介した<span class="bold">差</span>とよく似た描画モードです。</p>



<p>ですが<span class="bold-red">差のように同じ画像を重ねても真っ黒になりません</span>。<br>これは値のグラフを見てみるとよくわかります。</p>



<p><span class="bold-red">黒い部分が無効化</span>して<span class="bold-red">白い部分は色を反転させるところも同じ</span>です。<br>差が基本色と合成色の数値が近い部分で黒になる分、<br><span class="bold-red">差より合成後コントラストが弱くなるイメージ</span>です。</p>



<div class="wp-block-cocoon-blocks-info-box block-box primary-box">
<p><span class="bold">減算<span class="bold">（色を反転させる描画モード）</span></span><br><span class="bold"><span class="bold-red">結果色</span>＝<span class="bold-blue">基本色</span>－<span class="bold-green">合成色</span></span></p>
</div>



<figure class="wp-block-image size-large"><img loading="lazy" decoding="async" width="800" height="450" src="https://ko-jyblog.com/wp-content/uploads/2022/05/e98dad094b49d3f57c7e4d1bb89b11ba-800x450.jpg" alt="" class="wp-image-467" srcset="https://ko-jyblog.com/wp-content/uploads/2022/05/e98dad094b49d3f57c7e4d1bb89b11ba-800x450.jpg 800w, https://ko-jyblog.com/wp-content/uploads/2022/05/e98dad094b49d3f57c7e4d1bb89b11ba-500x281.jpg 500w, https://ko-jyblog.com/wp-content/uploads/2022/05/e98dad094b49d3f57c7e4d1bb89b11ba-300x169.jpg 300w, https://ko-jyblog.com/wp-content/uploads/2022/05/e98dad094b49d3f57c7e4d1bb89b11ba-768x432.jpg 768w, https://ko-jyblog.com/wp-content/uploads/2022/05/e98dad094b49d3f57c7e4d1bb89b11ba-1536x864.jpg 1536w, https://ko-jyblog.com/wp-content/uploads/2022/05/e98dad094b49d3f57c7e4d1bb89b11ba-120x68.jpg 120w, https://ko-jyblog.com/wp-content/uploads/2022/05/e98dad094b49d3f57c7e4d1bb89b11ba-160x90.jpg 160w, https://ko-jyblog.com/wp-content/uploads/2022/05/e98dad094b49d3f57c7e4d1bb89b11ba-320x180.jpg 320w, https://ko-jyblog.com/wp-content/uploads/2022/05/e98dad094b49d3f57c7e4d1bb89b11ba.jpg 1920w" sizes="auto, (max-width: 800px) 100vw, 800px" /></figure>



<p>計算式は<span class="bold-blue">基本色</span>引く<span class="bold-green">合成色</span>と単純で、同じ画像を合成した場合の挙動は<span class="bold">差</span>と同じで真っ黒になりますが、<span class="bold-blue">基本色</span>の値が<span class="bold-green">合成色</span>の値より小さい場合、同じ画像でなくても真っ黒になってしまうので、<br><span class="bold">差</span>と同じように<span class="bold-red">異なる部分を抽出することはできません</span>。<br><br>基本色が合成色より小さい値の部分は黒になります。<span class="bold-red"><span class="marker-under">数値が減るので画面は必ず暗くなります</span></span>。</p>



<p>カラーバーの合成では、<span class="bold-red">合成色が黒い部分が無効化</span>されて<span class="bold-red">白い部分は反転され黒として活かされます</span>。</p>



<figure class="wp-block-image size-large"><img loading="lazy" decoding="async" width="800" height="450" src="https://ko-jyblog.com/wp-content/uploads/2022/05/7df8fe5a119abb5acfbb17363751b7d5-800x450.jpg" alt="" class="wp-image-468" srcset="https://ko-jyblog.com/wp-content/uploads/2022/05/7df8fe5a119abb5acfbb17363751b7d5-800x450.jpg 800w, https://ko-jyblog.com/wp-content/uploads/2022/05/7df8fe5a119abb5acfbb17363751b7d5-500x281.jpg 500w, https://ko-jyblog.com/wp-content/uploads/2022/05/7df8fe5a119abb5acfbb17363751b7d5-300x169.jpg 300w, https://ko-jyblog.com/wp-content/uploads/2022/05/7df8fe5a119abb5acfbb17363751b7d5-768x432.jpg 768w, https://ko-jyblog.com/wp-content/uploads/2022/05/7df8fe5a119abb5acfbb17363751b7d5-1536x864.jpg 1536w, https://ko-jyblog.com/wp-content/uploads/2022/05/7df8fe5a119abb5acfbb17363751b7d5-120x68.jpg 120w, https://ko-jyblog.com/wp-content/uploads/2022/05/7df8fe5a119abb5acfbb17363751b7d5-160x90.jpg 160w, https://ko-jyblog.com/wp-content/uploads/2022/05/7df8fe5a119abb5acfbb17363751b7d5-320x180.jpg 320w, https://ko-jyblog.com/wp-content/uploads/2022/05/7df8fe5a119abb5acfbb17363751b7d5.jpg 1920w" sizes="auto, (max-width: 800px) 100vw, 800px" /></figure>



<p>上の画面では<span class="bold-blue">基本色</span>から<span class="bold-red">青の要素を128だけ減算</span>させています。<br>水色の平面から青みが減算され結果色は緑色になっています。</p>



<div class="wp-block-cocoon-blocks-info-box block-box primary-box">
<p><span class="bold">除算<span class="bold">（色を反転させる描画モード）</span></span><br><span class="bold"><span class="bold-red">結果色</span>＝<span class="bold-blue">基本色</span>÷<span class="bold-green">合成色</span></span></p>
</div>



<p><span class="bold">除算</span>は割り算ですが、計算に使われるのは0～1.0の割合なので<br><span class="bold-red">数値は必ず増えるので画面は必ず明るくなります</span>。</p>



<figure class="wp-block-image size-large"><img loading="lazy" decoding="async" width="800" height="450" src="https://ko-jyblog.com/wp-content/uploads/2022/05/2f0b2f2898de5e0bcd26d6b61a1b82f6-800x450.jpg" alt="" class="wp-image-469" srcset="https://ko-jyblog.com/wp-content/uploads/2022/05/2f0b2f2898de5e0bcd26d6b61a1b82f6-800x450.jpg 800w, https://ko-jyblog.com/wp-content/uploads/2022/05/2f0b2f2898de5e0bcd26d6b61a1b82f6-500x281.jpg 500w, https://ko-jyblog.com/wp-content/uploads/2022/05/2f0b2f2898de5e0bcd26d6b61a1b82f6-300x169.jpg 300w, https://ko-jyblog.com/wp-content/uploads/2022/05/2f0b2f2898de5e0bcd26d6b61a1b82f6-768x432.jpg 768w, https://ko-jyblog.com/wp-content/uploads/2022/05/2f0b2f2898de5e0bcd26d6b61a1b82f6-1536x864.jpg 1536w, https://ko-jyblog.com/wp-content/uploads/2022/05/2f0b2f2898de5e0bcd26d6b61a1b82f6-120x68.jpg 120w, https://ko-jyblog.com/wp-content/uploads/2022/05/2f0b2f2898de5e0bcd26d6b61a1b82f6-160x90.jpg 160w, https://ko-jyblog.com/wp-content/uploads/2022/05/2f0b2f2898de5e0bcd26d6b61a1b82f6-320x180.jpg 320w, https://ko-jyblog.com/wp-content/uploads/2022/05/2f0b2f2898de5e0bcd26d6b61a1b82f6.jpg 1920w" sizes="auto, (max-width: 800px) 100vw, 800px" /></figure>



<p><span class="bold">除算</span>は<span class="bold">減算</span>と対照的に<br><span class="bold-red">合成色の黒いところが白く反転されて活かされます</span>。</p>



<p>白は割合でいうと1なので、割り算は1で割っても結果は変わりません。<br>なので<span class="bold-red">白を<span class="bold">除算</span>で合成しても無効化</span>されます。</p>



<p><a href="https://ko-jyblog.com/aftereffects/blendmode00/" data-type="URL" data-id="https://ko-jyblog.com/aftereffects/blendmode00/">After Effectsの全描画モードの種類と考え方</a><br><a href="https://ko-jyblog.com/aftereffects/blendmode01/" data-type="URL" data-id="https://ko-jyblog.com/aftereffects/blendmode01/">描画モード①明るくする描画モードの計算式</a><br><a href="https://ko-jyblog.com/aftereffects/blendmode02/" data-type="URL" data-id="https://ko-jyblog.com/aftereffects/blendmode02/">描画モード②暗くする描画モードの計算式</a><br><a href="https://ko-jyblog.com/aftereffects/blendmode03/" data-type="URL" data-id="https://ko-jyblog.com/aftereffects/blendmode03/">描画モード③コントラストを強くする描画モードの計算式</a><br><a href="https://ko-jyblog.com/aftereffects/blendmode04/" data-type="URL" data-id="https://ko-jyblog.com/aftereffects/blendmode04/">描画モード④色を反転させる描画モードの計算式</a><br><a href="https://ko-jyblog.com/aftereffects/blendmode05/" data-type="URL" data-id="https://ko-jyblog.com/aftereffects/blendmode05/">描画モード⑤色相・彩度・輝度を使う描画モード</a></p>



<p></p>
]]></content:encoded>
					
					<wfw:commentRss>https://ko-jyblog.com/aftereffects/blendmode04/feed/</wfw:commentRss>
			<slash:comments>1</slash:comments>
		
		<enclosure url="https://ko-jyblog.com/wp-content/uploads/2022/05/render_05_sa.mp4" length="0" type="video/mp4" />
<enclosure url="https://ko-jyblog.com/wp-content/uploads/2022/05/render_05_sasa.mp4" length="0" type="video/mp4" />

			</item>
		<item>
		<title>描画モード③コントラストを強くする描画モードの計算式</title>
		<link>https://ko-jyblog.com/aftereffects/blendmode03/</link>
					<comments>https://ko-jyblog.com/aftereffects/blendmode03/#comments</comments>
		
		<dc:creator><![CDATA[コージー]]></dc:creator>
		<pubDate>Tue, 10 May 2022 16:45:00 +0000</pubDate>
				<category><![CDATA[After Effects]]></category>
		<guid isPermaLink="false">https://ko-jyblog.com/?p=424</guid>

					<description><![CDATA[動画で見たい方はコチラ コントラストを強くする描画モード【ソフトライト・オーバーレイ・ハードライト・リニアライト・ビビッドライト・ピンライト・ハードミックス】の計算式の紹介 上の表を見てください。よく使う描画モードをまと [&#8230;]]]></description>
										<content:encoded><![CDATA[
<h2 class="wp-block-heading">動画で見たい方はコチラ</h2>



<div class="iframe-wrapper"><iframe loading="lazy" width="840" height="472" src="https://www.youtube.com/embed/g2sZNsJc67M?rel=0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen=""></iframe></div>



<div class="iframe-wrapper"><iframe loading="lazy" width="840" height="472" src="https://www.youtube.com/embed/zYLa0pDCLio?rel=0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen=""></iframe></div>



<h2 class="wp-block-heading">コントラストを強くする描画モード【ソフトライト・オーバーレイ・ハードライト・リニアライト・ビビッドライト・ピンライト・ハードミックス】の計算式の紹介</h2>



<figure class="wp-block-image size-large"><img loading="lazy" decoding="async" width="800" height="450" src="https://ko-jyblog.com/wp-content/uploads/2022/05/4d1ef7fffa8d744b023a43ba21243113-800x450.jpg" alt="" class="wp-image-362" srcset="https://ko-jyblog.com/wp-content/uploads/2022/05/4d1ef7fffa8d744b023a43ba21243113-800x450.jpg 800w, https://ko-jyblog.com/wp-content/uploads/2022/05/4d1ef7fffa8d744b023a43ba21243113-500x281.jpg 500w, https://ko-jyblog.com/wp-content/uploads/2022/05/4d1ef7fffa8d744b023a43ba21243113-300x169.jpg 300w, https://ko-jyblog.com/wp-content/uploads/2022/05/4d1ef7fffa8d744b023a43ba21243113-768x432.jpg 768w, https://ko-jyblog.com/wp-content/uploads/2022/05/4d1ef7fffa8d744b023a43ba21243113-1536x864.jpg 1536w, https://ko-jyblog.com/wp-content/uploads/2022/05/4d1ef7fffa8d744b023a43ba21243113-120x68.jpg 120w, https://ko-jyblog.com/wp-content/uploads/2022/05/4d1ef7fffa8d744b023a43ba21243113-160x90.jpg 160w, https://ko-jyblog.com/wp-content/uploads/2022/05/4d1ef7fffa8d744b023a43ba21243113-320x180.jpg 320w, https://ko-jyblog.com/wp-content/uploads/2022/05/4d1ef7fffa8d744b023a43ba21243113.jpg 1920w" sizes="auto, (max-width: 800px) 100vw, 800px" /></figure>



<p>上の表を見てください。よく使う描画モードをまとめた図です。<br>縦の列が<span class="marker-under-red"><span class="bold">明るくする描画モード</span></span>、<span class="marker-under-blue"><span class="bold">暗くする描画モード</span></span>、<span class="marker-under"><span class="bold">コントラストを強くする描画モード</span></span>で上にいくほど<span class="bold-red">画面に与える変化が大きい描画モード</span>です。<br>横に並んだ描画モードは<span class="bold-red">同等の強さの描画モード</span>と言えます。<br>下の6つの描画モードについては<span class="bold"><span class="bold-red">特殊な描画モード</span></span>なので、その関係性からはハズれます。<br>次は、<span class="bold"><span class="marker-under">コントラストを強くする描画モードの計算式</span></span>について紹介していきます！</p>



<p></p>



<div class="wp-block-cocoon-blocks-info-box block-box primary-box">
<p><span class="bold-red"><span class="marker-red"><span class="bold-blue"><span class="marker-blue"><span class="marker"><span class="bold-green">オーバーレイ（コントラストを強くする描画モード）</span></span></span></span></span></span>　<br><span class="bold">①<span class="bold-blue">基本色</span>の値の割合が0.5より小さい場合…</span><br><span class="bold-red">結果色</span>＝２×<span class="bold-blue">基本色</span>×<span class="bold-green">合成色</span><br><span class="bold">②<span class="bold-blue">基本色</span>の値の割合が0.5より大きい場合…</span><br><span class="bold-red">結果色</span>＝１－２×(１－<span class="bold-blue">基本色</span>)×(１－<span class="bold-green">合成色</span>)</p>
</div>



<p>計算式を見るに…<br>基本色が0.5より小さい時は<span class="marker-under-blue"><span class="bold">乗算</span></span>に<br>基本色が0.5より大きいときは<span class="marker-under-red"><span class="bold">スクリーン</span></span>の処理をしています。</p>



<figure class="wp-block-image size-large"><img loading="lazy" decoding="async" width="800" height="450" src="https://ko-jyblog.com/wp-content/uploads/2022/05/54176491da8691760e7a6207accb85ca-800x450.jpg" alt="" class="wp-image-446" srcset="https://ko-jyblog.com/wp-content/uploads/2022/05/54176491da8691760e7a6207accb85ca-800x450.jpg 800w, https://ko-jyblog.com/wp-content/uploads/2022/05/54176491da8691760e7a6207accb85ca-500x281.jpg 500w, https://ko-jyblog.com/wp-content/uploads/2022/05/54176491da8691760e7a6207accb85ca-300x169.jpg 300w, https://ko-jyblog.com/wp-content/uploads/2022/05/54176491da8691760e7a6207accb85ca-768x432.jpg 768w, https://ko-jyblog.com/wp-content/uploads/2022/05/54176491da8691760e7a6207accb85ca-1536x864.jpg 1536w, https://ko-jyblog.com/wp-content/uploads/2022/05/54176491da8691760e7a6207accb85ca-120x68.jpg 120w, https://ko-jyblog.com/wp-content/uploads/2022/05/54176491da8691760e7a6207accb85ca-160x90.jpg 160w, https://ko-jyblog.com/wp-content/uploads/2022/05/54176491da8691760e7a6207accb85ca-320x180.jpg 320w, https://ko-jyblog.com/wp-content/uploads/2022/05/54176491da8691760e7a6207accb85ca.jpg 1920w" sizes="auto, (max-width: 800px) 100vw, 800px" /></figure>



<p><span class="bold">オーバーレイ</span>は、<span class="bold-red"><span class="marker-under"><span class="bold-blue">基本色</span>が暗いところはより暗く、<span class="bold-blue">基本色</span>が明るいところはより明るくする特徴</span></span>があります。つまり絵的にはコントラストが強くなり、鮮やかな印象になります。<br>基本色が<span class="bold-red">黒と白の場合両方活かされます</span>。そしてRGBの値が<span class="bold-red">中間の128で無効化</span>されます。</p>



<figure class="wp-block-image size-large"><img loading="lazy" decoding="async" width="800" height="450" src="https://ko-jyblog.com/wp-content/uploads/2022/05/c7fa6892ea112f4c11b0013fa6d2cee5-800x450.jpg" alt="" class="wp-image-447" srcset="https://ko-jyblog.com/wp-content/uploads/2022/05/c7fa6892ea112f4c11b0013fa6d2cee5-800x450.jpg 800w, https://ko-jyblog.com/wp-content/uploads/2022/05/c7fa6892ea112f4c11b0013fa6d2cee5-500x281.jpg 500w, https://ko-jyblog.com/wp-content/uploads/2022/05/c7fa6892ea112f4c11b0013fa6d2cee5-300x169.jpg 300w, https://ko-jyblog.com/wp-content/uploads/2022/05/c7fa6892ea112f4c11b0013fa6d2cee5-768x432.jpg 768w, https://ko-jyblog.com/wp-content/uploads/2022/05/c7fa6892ea112f4c11b0013fa6d2cee5-1536x864.jpg 1536w, https://ko-jyblog.com/wp-content/uploads/2022/05/c7fa6892ea112f4c11b0013fa6d2cee5-2048x1152.jpg 2048w, https://ko-jyblog.com/wp-content/uploads/2022/05/c7fa6892ea112f4c11b0013fa6d2cee5-120x68.jpg 120w, https://ko-jyblog.com/wp-content/uploads/2022/05/c7fa6892ea112f4c11b0013fa6d2cee5-160x90.jpg 160w, https://ko-jyblog.com/wp-content/uploads/2022/05/c7fa6892ea112f4c11b0013fa6d2cee5-320x180.jpg 320w" sizes="auto, (max-width: 800px) 100vw, 800px" /></figure>



<p><span class="bold">オーバーレイ</span>は合成する側、される側を意識して、使う必要があります。<br><span class="bold">オーバーレイ</span>はあくまで合成される側、<span class="bold-blue">基本色</span>を見て計算するというところに注意が必要です。</p>



<figure class="wp-block-video"><video height="1080" style="aspect-ratio: 1920 / 1080;" width="1920" controls src="https://ko-jyblog.com/wp-content/uploads/2022/05/4dc582cc2a016f841f5738efdb91c1a7.mp4"></video></figure>



<p><span class="bold">オーバーレイ</span>は<span class="bold-blue">基本色</span>の<span class="bold-red">白と黒を活かすという特徴</span>があるので、<br>モノクロ画像の陰影を活かして、フィルターのように<span class="bold-red">中間値に色を重ねる</span>ことができます。</p>



<div class="wp-block-cocoon-blocks-info-box block-box primary-box">
<p><span class="bold-red"><span class="marker-red"><span class="bold-blue"><span class="marker-blue"><span class="marker"><span class="bold-green">ハードライト（コントラストを強くする描画モード）</span></span></span></span></span></span>　<br><span class="bold">①<span class="bold-blue"><span class="bold-green">合成色</span></span>の値の割合が0.5より小さい場合…</span><br><span class="bold-red">結果色</span>＝２×<span class="bold-blue">基本色</span>×<span class="bold-green">合成色</span><br><span class="bold">②<span class="bold-blue"><span class="bold-green">合成色</span></span>の値の割合が0.5より大きい場合…</span><br><span class="bold-red">結果色</span>＝１－２×(１－<span class="bold-blue">基本色</span>)×(１－<span class="bold-green">合成色</span>)</p>
</div>



<figure class="wp-block-image size-large"><img loading="lazy" decoding="async" width="800" height="450" src="https://ko-jyblog.com/wp-content/uploads/2022/05/5a0bb3f5ce2ec29f22dbc176a3c108c9-800x450.jpg" alt="" class="wp-image-448" srcset="https://ko-jyblog.com/wp-content/uploads/2022/05/5a0bb3f5ce2ec29f22dbc176a3c108c9-800x450.jpg 800w, https://ko-jyblog.com/wp-content/uploads/2022/05/5a0bb3f5ce2ec29f22dbc176a3c108c9-500x281.jpg 500w, https://ko-jyblog.com/wp-content/uploads/2022/05/5a0bb3f5ce2ec29f22dbc176a3c108c9-300x169.jpg 300w, https://ko-jyblog.com/wp-content/uploads/2022/05/5a0bb3f5ce2ec29f22dbc176a3c108c9-768x432.jpg 768w, https://ko-jyblog.com/wp-content/uploads/2022/05/5a0bb3f5ce2ec29f22dbc176a3c108c9-1536x864.jpg 1536w, https://ko-jyblog.com/wp-content/uploads/2022/05/5a0bb3f5ce2ec29f22dbc176a3c108c9-120x68.jpg 120w, https://ko-jyblog.com/wp-content/uploads/2022/05/5a0bb3f5ce2ec29f22dbc176a3c108c9-160x90.jpg 160w, https://ko-jyblog.com/wp-content/uploads/2022/05/5a0bb3f5ce2ec29f22dbc176a3c108c9-320x180.jpg 320w, https://ko-jyblog.com/wp-content/uploads/2022/05/5a0bb3f5ce2ec29f22dbc176a3c108c9.jpg 1920w" sizes="auto, (max-width: 800px) 100vw, 800px" /></figure>



<figure class="wp-block-image size-large"><img loading="lazy" decoding="async" width="800" height="450" src="https://ko-jyblog.com/wp-content/uploads/2022/05/4a0101b93a431c7df9d12274d5839b67-800x450.jpg" alt="" class="wp-image-449" srcset="https://ko-jyblog.com/wp-content/uploads/2022/05/4a0101b93a431c7df9d12274d5839b67-800x450.jpg 800w, https://ko-jyblog.com/wp-content/uploads/2022/05/4a0101b93a431c7df9d12274d5839b67-500x281.jpg 500w, https://ko-jyblog.com/wp-content/uploads/2022/05/4a0101b93a431c7df9d12274d5839b67-300x169.jpg 300w, https://ko-jyblog.com/wp-content/uploads/2022/05/4a0101b93a431c7df9d12274d5839b67-768x432.jpg 768w, https://ko-jyblog.com/wp-content/uploads/2022/05/4a0101b93a431c7df9d12274d5839b67-1536x864.jpg 1536w, https://ko-jyblog.com/wp-content/uploads/2022/05/4a0101b93a431c7df9d12274d5839b67-120x68.jpg 120w, https://ko-jyblog.com/wp-content/uploads/2022/05/4a0101b93a431c7df9d12274d5839b67-160x90.jpg 160w, https://ko-jyblog.com/wp-content/uploads/2022/05/4a0101b93a431c7df9d12274d5839b67-320x180.jpg 320w, https://ko-jyblog.com/wp-content/uploads/2022/05/4a0101b93a431c7df9d12274d5839b67.jpg 1920w" sizes="auto, (max-width: 800px) 100vw, 800px" /></figure>



<p><span class="bold">オーバーレイ</span>と<span class="bold">ハードライト</span>の違いは、<span class="bold-blue">基本色</span><span class="marker-under">の中間値でスクリーンと乗算を使い分けているのが<br><span class="bold">オーバーレイ</span></span>であるのに対し、<span class="bold-green">合成色</span><span class="marker-under">の中間値でスクリーンと乗算を使い分けているのが<span class="bold">ハードライト</span></span>です。<span class="bold-red">条件が基本色の値で見るか合成色の値で見るかの違い</span>で、画面に与える変化の強さは<span class="bold-red">スクリーンと乗算と同等</span>です。</p>



<div class="wp-block-cocoon-blocks-info-box block-box primary-box">
<p><span class="bold-red"><span class="marker-red"><span class="bold-blue"><span class="marker-blue"><span class="marker"><span class="bold-green">リニアライト（コントラストを強くする描画モード）</span></span></span></span></span></span>　<br><span class="bold">①<span class="bold-blue"><span class="bold-green">合成色</span></span>の値の割合が0.5より小さい場合…</span><br><span class="bold-red">結果色</span>＝<span class="bold-blue">基本色</span>＋２×(<span class="bold-green">合成色</span>－0.5)<br><span class="bold">②<span class="bold-blue"><span class="bold-green">合成色</span></span>の値の割合が0.5より大きい場合…</span><br><span class="bold-red">結果色</span>＝<span class="bold-blue">基本色</span>＋２×<span class="bold-green">合成色</span>－１</p>
</div>



<div class="wp-block-cocoon-blocks-info-box block-box primary-box">
<p><span class="bold-red"><span class="marker-red"><span class="bold-blue"><span class="marker-blue"><span class="marker"><span class="bold-green">ビビッドライト（コントラストを強くする描画モード）</span></span></span></span></span></span>　<br><span class="bold">①<span class="bold-blue"><span class="bold-green">合成色</span></span>の値の割合が0.5より小さい場合…</span><br><span class="bold-red">結果色</span>＝１－(１－<span class="bold-blue">基本色</span>)÷(２×<span class="bold-green">合成色</span>)<br><span class="bold">②<span class="bold-blue"><span class="bold-green">合成色</span></span>の値の割合が0.5より大きい場合…</span><br><span class="bold-red">結果色</span>＝<span class="bold-blue">基本色</span>÷(１－２×(<span class="bold-green">合成色</span>－0.5))</p>
</div>



<figure class="wp-block-image size-large"><img loading="lazy" decoding="async" width="800" height="450" src="https://ko-jyblog.com/wp-content/uploads/2022/05/67a51edf9d3807e804e8bf6f3b4c3e6e-800x450.jpg" alt="" class="wp-image-450" srcset="https://ko-jyblog.com/wp-content/uploads/2022/05/67a51edf9d3807e804e8bf6f3b4c3e6e-800x450.jpg 800w, https://ko-jyblog.com/wp-content/uploads/2022/05/67a51edf9d3807e804e8bf6f3b4c3e6e-500x281.jpg 500w, https://ko-jyblog.com/wp-content/uploads/2022/05/67a51edf9d3807e804e8bf6f3b4c3e6e-300x169.jpg 300w, https://ko-jyblog.com/wp-content/uploads/2022/05/67a51edf9d3807e804e8bf6f3b4c3e6e-768x432.jpg 768w, https://ko-jyblog.com/wp-content/uploads/2022/05/67a51edf9d3807e804e8bf6f3b4c3e6e-1536x864.jpg 1536w, https://ko-jyblog.com/wp-content/uploads/2022/05/67a51edf9d3807e804e8bf6f3b4c3e6e-120x68.jpg 120w, https://ko-jyblog.com/wp-content/uploads/2022/05/67a51edf9d3807e804e8bf6f3b4c3e6e-160x90.jpg 160w, https://ko-jyblog.com/wp-content/uploads/2022/05/67a51edf9d3807e804e8bf6f3b4c3e6e-320x180.jpg 320w, https://ko-jyblog.com/wp-content/uploads/2022/05/67a51edf9d3807e804e8bf6f3b4c3e6e.jpg 1920w" sizes="auto, (max-width: 800px) 100vw, 800px" /></figure>



<p><span class="bold">リニアライト</span>は<br>合成色が0.5より小さい時は<span class="bold">焼き込みリニア</span>に<br>合成色が0.5より大きい時は<span class="bold">加算</span><span class="bold">（覆い焼きリニア）</span>の処理をしています。</p>



<p><span class="bold">ビビッドライト</span>は<br>合成色が0.5より小さい時は<span class="bold">焼き込みカラー</span>に<br>合成色が0.5より大きい時は<span class="bold">覆い焼きカラー</span>の処理をしています。<br><br>オーバーレイとハードライト&lt;リニアライト&lt;ビビッドライト と順番に合成による効果が強くなります。共通して暗いところはより暗く、明るいところはより明るくする特徴があります。</p>



<div class="wp-block-cocoon-blocks-info-box block-box primary-box">
<p><span class="bold-red"><span class="marker-red"><span class="bold-blue"><span class="marker-blue"><span class="marker"><span class="bold-green">ソフトライト（コントラストを強くする描画モード）</span></span></span></span></span></span>　<br><span class="bold">①<span class="bold-blue"><span class="bold-green">合成色</span></span>の値の割合が0.5より小さい場合…</span><br><span class="bold-red">結果色</span>＝2×<span class="bold-blue">基本色</span>×<span class="bold-green">合成色</span>＋<span class="bold-blue">基本色</span><sup>2</sup>×(1－2×<span class="bold-green">合成色</span>)<br><span class="bold">②<span class="bold-blue"><span class="bold-green">合成色</span></span>の値の割合が0.5より大きい場合…</span><br><span class="bold-red">結果色</span>＝2×<span class="bold-blue"><span class="bold-blue">基本色</span></span>×(1－<span class="bold-blue"><span class="bold-green">合成色</span></span><strong>)</strong>＋√<span class="bold-blue"><span class="bold-blue">基本色</span></span>×(2×<span class="bold-blue"><span class="bold-green">合成色</span></span>－1)</p>
</div>



<p>計算式は紹介した描画モードの中でも最も複雑です。ただし全く難しく考える必要はありません。</p>



<figure class="wp-block-image size-large"><img loading="lazy" decoding="async" width="800" height="450" src="https://ko-jyblog.com/wp-content/uploads/2022/05/26211f2cc7a71345aa7fe8a2a30b63db-800x450.jpg" alt="" class="wp-image-451" srcset="https://ko-jyblog.com/wp-content/uploads/2022/05/26211f2cc7a71345aa7fe8a2a30b63db-800x450.jpg 800w, https://ko-jyblog.com/wp-content/uploads/2022/05/26211f2cc7a71345aa7fe8a2a30b63db-500x281.jpg 500w, https://ko-jyblog.com/wp-content/uploads/2022/05/26211f2cc7a71345aa7fe8a2a30b63db-300x169.jpg 300w, https://ko-jyblog.com/wp-content/uploads/2022/05/26211f2cc7a71345aa7fe8a2a30b63db-768x432.jpg 768w, https://ko-jyblog.com/wp-content/uploads/2022/05/26211f2cc7a71345aa7fe8a2a30b63db-1536x864.jpg 1536w, https://ko-jyblog.com/wp-content/uploads/2022/05/26211f2cc7a71345aa7fe8a2a30b63db-2048x1152.jpg 2048w, https://ko-jyblog.com/wp-content/uploads/2022/05/26211f2cc7a71345aa7fe8a2a30b63db-120x68.jpg 120w, https://ko-jyblog.com/wp-content/uploads/2022/05/26211f2cc7a71345aa7fe8a2a30b63db-160x90.jpg 160w, https://ko-jyblog.com/wp-content/uploads/2022/05/26211f2cc7a71345aa7fe8a2a30b63db-320x180.jpg 320w" sizes="auto, (max-width: 800px) 100vw, 800px" /></figure>



<p>計算式の通り<span class="bold-green">合成色</span>の中間値を基準にしているのは、<span class="bold">ハードライト</span>と同じですが、<br>見える効果としては<span class="bold">オーバーレイ</span>によく似た効果です。</p>



<p>明るいところはより明るく、暗いところはより暗くなるコントラストを強める描画モードですが、<br><span class="bold-red"><span class="marker-under">オーバーレイと比べて効果が弱くなります。</span></span><br><span class="bold-red"><span class="marker-under">「少しだけコントラストが上がる」描画モード</span></span>と覚えるとよいでしょう。</p>



<div class="wp-block-cocoon-blocks-info-box block-box primary-box">
<p><span class="bold-red"><span class="marker-red"><span class="bold-blue"><span class="marker-blue"><span class="marker"><span class="bold-green">ピンライト（コントラストを強くする描画モード）</span></span></span></span></span></span>　<br><span class="bold">①<span class="bold-blue"><span class="bold-green">合成色</span></span>の値の割合が0.5より小さい場合…</span><br><span class="bold-red"><span class="bold-red">結果色（R）</span>＝min｛ <span class="bold-blue">基本色（R）</span>,</span>２×<span class="bold-red"><span class="bold-green">合成色（R）</span>｝<br><span class="bold-red"><span class="bold-red">結果色</span>（G）</span>＝min｛ <span class="bold-red"><span class="bold-blue">基本色（G）</span></span>,</span>２×<span class="bold-red"><span class="bold-red"><span class="bold-green">合成色（G）</span></span>｝<br><span class="bold-red"><span class="bold-red">結果色</span>（B）</span>＝min｛ <span class="bold-red"><span class="bold-blue">基本色（B）</span></span>,</span>２×<span class="bold-red"><span class="bold-red"><span class="bold-green">合成色（B）</span></span>｝</span><br><span class="bold">②<span class="bold-blue"><span class="bold-green">合成色</span></span>の値の割合が0.5より大きい場合…</span><br><span class="bold-red"><span class="bold-red"><span class="bold-red">結果色（R）</span>＝max｛ <span class="bold-blue">基本色（R）</span>,</span></span>２×(<span class="bold-red"><span class="bold-red"><span class="bold-green">合成色（R）</span></span></span>－0.5)<span class="bold-red"><span class="bold-red">｝<br><span class="bold-red"><span class="bold-red">結果色</span>（G）</span>＝max｛ <span class="bold-red"><span class="bold-blue">基本色（G）</span></span>,</span></span>２×(<span class="bold-red"><span class="bold-red"><span class="bold-red"><span class="bold-green">合成色（G）</span></span></span></span>－0.5)<span class="bold-red"><span class="bold-red">｝<br><span class="bold-red"><span class="bold-red">結果色</span>（B）</span>＝max｛ <span class="bold-red"><span class="bold-blue">基本色（B）</span></span>,</span></span>２×(<span class="bold-red"><span class="bold-red"><span class="bold-red"><span class="bold-green">合成色（B）</span></span></span></span>－0.5)<span class="bold-red"><span class="bold-red">｝</span></span></p>
</div>



<figure class="wp-block-image size-large"><img loading="lazy" decoding="async" width="800" height="450" src="https://ko-jyblog.com/wp-content/uploads/2022/05/fe10697011388ee7506f4e5827652e0f-800x450.jpg" alt="" class="wp-image-453" srcset="https://ko-jyblog.com/wp-content/uploads/2022/05/fe10697011388ee7506f4e5827652e0f-800x450.jpg 800w, https://ko-jyblog.com/wp-content/uploads/2022/05/fe10697011388ee7506f4e5827652e0f-500x281.jpg 500w, https://ko-jyblog.com/wp-content/uploads/2022/05/fe10697011388ee7506f4e5827652e0f-300x169.jpg 300w, https://ko-jyblog.com/wp-content/uploads/2022/05/fe10697011388ee7506f4e5827652e0f-768x432.jpg 768w, https://ko-jyblog.com/wp-content/uploads/2022/05/fe10697011388ee7506f4e5827652e0f-1536x864.jpg 1536w, https://ko-jyblog.com/wp-content/uploads/2022/05/fe10697011388ee7506f4e5827652e0f-120x68.jpg 120w, https://ko-jyblog.com/wp-content/uploads/2022/05/fe10697011388ee7506f4e5827652e0f-160x90.jpg 160w, https://ko-jyblog.com/wp-content/uploads/2022/05/fe10697011388ee7506f4e5827652e0f-320x180.jpg 320w, https://ko-jyblog.com/wp-content/uploads/2022/05/fe10697011388ee7506f4e5827652e0f.jpg 1920w" sizes="auto, (max-width: 800px) 100vw, 800px" /></figure>



<p><span class="bold">ピンライト</span>は合成色が0.5より小さい場合は<span class="bold">比較（暗）</span>の処理、<br>合成色が0.5より大きい場合は<span class="bold">比較（明）</span>の処理をしています。<br><span class="bold">比較（明）</span>と<span class="bold">比較（暗）</span>の処理を使い分けています。<br>なので比較系の描画モードなので、ピンライトで同じ写真を重ねても変化がありません。<br><br><span class="bold-green">合成色</span>の<span class="bold-red">白と黒は両方活かされ</span>、<span class="bold-red">中間値が無効化</span>されます。<span class="marker-under"><span class="bold">コントラストを強くする描画モード</span></span>の特徴が出ています。ピンライトは比較系の描画モードなので、合成結果を予想することが難しい描画モードです。</p>



<div class="wp-block-cocoon-blocks-info-box block-box primary-box">
<p><span class="bold-red"><span class="marker-red"><span class="bold-blue"><span class="marker-blue"><span class="marker"><span class="bold-green">ハードミックス（コントラストを強くする描画モード）</span></span></span></span></span></span>　<br><span class="bold-red"><span class="bold-red">結果色（R,G,B）</span>＝ <span class="bold-blue">基本色</span></span><span class="bold-blue">（R,G,B）</span>＋<span class="bold-red"><span class="bold-green">合成色（R,G,B）</span></span><br><span class="bold">①<span class="bold-blue"><span class="bold-green">結果色</span></span>≧255の場合、255</span><br><span class="bold">②<span class="bold-blue"><span class="bold-green">結果色</span></span>&lt;255の場合、0</span><br>なので結果色のRGBには<span class="bold">255</span>か<span class="bold">0</span>のどちらかです。</p>
</div>



<p><span class="bold-green">合成色</span>のRGB各チャンネルの値を<span class="bold-blue">基本色</span>のRGB値に足し算して<br><span class="bold-red">合計が255以上のチャンネルは、255</span>になり、<span class="bold-red">合計が 255 未満のチャンネルは、0</span>になります。</p>



<figure class="wp-block-image size-large"><img loading="lazy" decoding="async" width="800" height="450" src="https://ko-jyblog.com/wp-content/uploads/2022/05/8a8c63e95669467d570116cd705149fa-800x450.jpg" alt="" class="wp-image-455" srcset="https://ko-jyblog.com/wp-content/uploads/2022/05/8a8c63e95669467d570116cd705149fa-800x450.jpg 800w, https://ko-jyblog.com/wp-content/uploads/2022/05/8a8c63e95669467d570116cd705149fa-500x281.jpg 500w, https://ko-jyblog.com/wp-content/uploads/2022/05/8a8c63e95669467d570116cd705149fa-300x169.jpg 300w, https://ko-jyblog.com/wp-content/uploads/2022/05/8a8c63e95669467d570116cd705149fa-768x432.jpg 768w, https://ko-jyblog.com/wp-content/uploads/2022/05/8a8c63e95669467d570116cd705149fa-1536x864.jpg 1536w, https://ko-jyblog.com/wp-content/uploads/2022/05/8a8c63e95669467d570116cd705149fa-120x68.jpg 120w, https://ko-jyblog.com/wp-content/uploads/2022/05/8a8c63e95669467d570116cd705149fa-160x90.jpg 160w, https://ko-jyblog.com/wp-content/uploads/2022/05/8a8c63e95669467d570116cd705149fa-320x180.jpg 320w, https://ko-jyblog.com/wp-content/uploads/2022/05/8a8c63e95669467d570116cd705149fa.jpg 1920w" sizes="auto, (max-width: 800px) 100vw, 800px" /></figure>



<p>これにより、<br>色の種類は<span class="bold">「黒、白、赤、緑、青、黄色、マゼンタ、シアン」</span>の<span class="bold-red"><span class="marker-under">８色</span></span>に単純化されます。</p>



<figure class="wp-block-image size-large"><img loading="lazy" decoding="async" width="800" height="450" src="https://ko-jyblog.com/wp-content/uploads/2022/05/11f6b87b5012818cfd9128e247dfb9f5-800x450.jpg" alt="" class="wp-image-456" srcset="https://ko-jyblog.com/wp-content/uploads/2022/05/11f6b87b5012818cfd9128e247dfb9f5-800x450.jpg 800w, https://ko-jyblog.com/wp-content/uploads/2022/05/11f6b87b5012818cfd9128e247dfb9f5-500x281.jpg 500w, https://ko-jyblog.com/wp-content/uploads/2022/05/11f6b87b5012818cfd9128e247dfb9f5-300x169.jpg 300w, https://ko-jyblog.com/wp-content/uploads/2022/05/11f6b87b5012818cfd9128e247dfb9f5-768x432.jpg 768w, https://ko-jyblog.com/wp-content/uploads/2022/05/11f6b87b5012818cfd9128e247dfb9f5-1536x864.jpg 1536w, https://ko-jyblog.com/wp-content/uploads/2022/05/11f6b87b5012818cfd9128e247dfb9f5-2048x1152.jpg 2048w, https://ko-jyblog.com/wp-content/uploads/2022/05/11f6b87b5012818cfd9128e247dfb9f5-120x68.jpg 120w, https://ko-jyblog.com/wp-content/uploads/2022/05/11f6b87b5012818cfd9128e247dfb9f5-160x90.jpg 160w, https://ko-jyblog.com/wp-content/uploads/2022/05/11f6b87b5012818cfd9128e247dfb9f5-320x180.jpg 320w" sizes="auto, (max-width: 800px) 100vw, 800px" /></figure>



<p><span class="bold-green">合成色</span>の<span class="bold-red">黒と白は両方活かされ、コントラストを上げる効果が極端に強い</span>イメージです。</p>



<p><span class="bold">ピンライト</span>も<span class="bold">ハードミックス</span>も特殊な描画モードなので<br>なかなか使うことがないかもしれません。</p>



<p>やはり<span class="bold-red">画面に与える変化が大きいもの</span>や<span class="bold-red">特殊な計算がされて<br>結果色が予想できないような描画モードは使用頻度は低い</span>です。</p>



<p><a href="https://ko-jyblog.com/aftereffects/blendmode00/" data-type="URL" data-id="https://ko-jyblog.com/aftereffects/blendmode00/">After Effectsの全描画モードの種類と考え方</a><br><a href="https://ko-jyblog.com/aftereffects/blendmode01/" data-type="URL" data-id="https://ko-jyblog.com/aftereffects/blendmode01/">描画モード①明るくする描画モードの計算式</a><br><a href="https://ko-jyblog.com/aftereffects/blendmode02/" data-type="URL" data-id="https://ko-jyblog.com/aftereffects/blendmode02/">描画モード②暗くする描画モードの計算式</a><br><a href="https://ko-jyblog.com/aftereffects/blendmode03/" data-type="URL" data-id="https://ko-jyblog.com/aftereffects/blendmode03/">描画モード③コントラストを強くする描画モードの計算式</a><br><a href="https://ko-jyblog.com/aftereffects/blendmode04/" data-type="URL" data-id="https://ko-jyblog.com/aftereffects/blendmode04/">描画モード④色を反転させる描画モードの計算式</a><br><a href="https://ko-jyblog.com/aftereffects/blendmode05/" data-type="URL" data-id="https://ko-jyblog.com/aftereffects/blendmode05/">描画モード⑤色相・彩度・輝度を使う描画モード</a></p>



<p></p>
]]></content:encoded>
					
					<wfw:commentRss>https://ko-jyblog.com/aftereffects/blendmode03/feed/</wfw:commentRss>
			<slash:comments>2</slash:comments>
		
		<enclosure url="https://ko-jyblog.com/wp-content/uploads/2022/05/4dc582cc2a016f841f5738efdb91c1a7.mp4" length="0" type="video/mp4" />

			</item>
		<item>
		<title>描画モード②暗くする描画モードの計算式</title>
		<link>https://ko-jyblog.com/aftereffects/blendmode02/</link>
					<comments>https://ko-jyblog.com/aftereffects/blendmode02/#comments</comments>
		
		<dc:creator><![CDATA[コージー]]></dc:creator>
		<pubDate>Tue, 10 May 2022 16:45:00 +0000</pubDate>
				<category><![CDATA[After Effects]]></category>
		<guid isPermaLink="false">https://ko-jyblog.com/?p=414</guid>

					<description><![CDATA[動画で見たい方はコチラ 暗くする描画モード【乗算・焼き込みリニア・焼き込みカラー・比較（暗）・カラー比較（暗）】の計算式の紹介 上の表を見てください。よく使う描画モードをまとめた図です。縦の列が明るくする描画モード、暗く [&#8230;]]]></description>
										<content:encoded><![CDATA[
<h2 class="wp-block-heading">動画で見たい方はコチラ</h2>



<div class="iframe-wrapper"><iframe loading="lazy" width="840" height="472" src="https://www.youtube.com/embed/g2sZNsJc67M?rel=0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen=""></iframe></div>



<div class="iframe-wrapper"><iframe loading="lazy" width="840" height="472" src="https://www.youtube.com/embed/zYLa0pDCLio?rel=0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen=""></iframe></div>



<h2 class="wp-block-heading">暗くする描画モード【乗算・焼き込みリニア・焼き込みカラー・比較（暗）・カラー比較（暗）】の計算式の紹介</h2>



<figure class="wp-block-image size-large"><img loading="lazy" decoding="async" width="800" height="450" src="https://ko-jyblog.com/wp-content/uploads/2022/05/4d1ef7fffa8d744b023a43ba21243113-800x450.jpg" alt="" class="wp-image-362" srcset="https://ko-jyblog.com/wp-content/uploads/2022/05/4d1ef7fffa8d744b023a43ba21243113-800x450.jpg 800w, https://ko-jyblog.com/wp-content/uploads/2022/05/4d1ef7fffa8d744b023a43ba21243113-500x281.jpg 500w, https://ko-jyblog.com/wp-content/uploads/2022/05/4d1ef7fffa8d744b023a43ba21243113-300x169.jpg 300w, https://ko-jyblog.com/wp-content/uploads/2022/05/4d1ef7fffa8d744b023a43ba21243113-768x432.jpg 768w, https://ko-jyblog.com/wp-content/uploads/2022/05/4d1ef7fffa8d744b023a43ba21243113-1536x864.jpg 1536w, https://ko-jyblog.com/wp-content/uploads/2022/05/4d1ef7fffa8d744b023a43ba21243113-120x68.jpg 120w, https://ko-jyblog.com/wp-content/uploads/2022/05/4d1ef7fffa8d744b023a43ba21243113-160x90.jpg 160w, https://ko-jyblog.com/wp-content/uploads/2022/05/4d1ef7fffa8d744b023a43ba21243113-320x180.jpg 320w, https://ko-jyblog.com/wp-content/uploads/2022/05/4d1ef7fffa8d744b023a43ba21243113.jpg 1920w" sizes="auto, (max-width: 800px) 100vw, 800px" /></figure>



<p>上の表を見てください。よく使う描画モードをまとめた図です。<br>縦の列が<span class="marker-under-red"><span class="bold">明るくする描画モード</span></span>、<span class="marker-under-blue"><span class="bold">暗くする描画モード</span></span>、<span class="marker-under"><span class="bold">コントラストを強くする描画モード</span></span>で上にいくほど<span class="bold-red">画面に与える変化が大きい描画モード</span>です。<br>横に並んだ描画モードは<span class="bold-red">同等の強さの描画モード</span>と言えます。<br>下の6つの描画モードについては<span class="bold"><span class="bold-red">特殊な描画モード</span></span>なので、その関係性からはハズれます。<br>次は、<span class="bold"><span class="marker-under"><span class="marker-under-blue">暗くする描画モードの計算式</span></span></span>について紹介していきます！</p>



<div class="wp-block-cocoon-blocks-info-box block-box primary-box">
<p><span class="bold-red"><span class="marker-red"><span class="marker-blue"><span class="bold-blue">乗算（暗くする描画モード）</span></span></span></span>　<span class="bold-red">結果色</span>＝<span class="bold-blue">基本色</span>×<span class="bold-green">合成色</span></p>
</div>



<figure class="wp-block-image size-large"><img loading="lazy" decoding="async" width="800" height="450" src="https://ko-jyblog.com/wp-content/uploads/2022/05/heimen_jouzan-800x450.jpg" alt="" class="wp-image-427" srcset="https://ko-jyblog.com/wp-content/uploads/2022/05/heimen_jouzan-800x450.jpg 800w, https://ko-jyblog.com/wp-content/uploads/2022/05/heimen_jouzan-500x281.jpg 500w, https://ko-jyblog.com/wp-content/uploads/2022/05/heimen_jouzan-300x169.jpg 300w, https://ko-jyblog.com/wp-content/uploads/2022/05/heimen_jouzan-768x432.jpg 768w, https://ko-jyblog.com/wp-content/uploads/2022/05/heimen_jouzan-1536x864.jpg 1536w, https://ko-jyblog.com/wp-content/uploads/2022/05/heimen_jouzan-120x68.jpg 120w, https://ko-jyblog.com/wp-content/uploads/2022/05/heimen_jouzan-160x90.jpg 160w, https://ko-jyblog.com/wp-content/uploads/2022/05/heimen_jouzan-320x180.jpg 320w, https://ko-jyblog.com/wp-content/uploads/2022/05/heimen_jouzan.jpg 1920w" sizes="auto, (max-width: 800px) 100vw, 800px" /></figure>



<p><span class="bold-green"><strong><span class="bold-blue">基本色</span></strong></span>に<span class="bold-green">合成色</span>を掛け算をした数値が<span class="bold-red">結果色</span>になっているのが分かります。<br>この時計算に使うRGB値は0～255を0～1として割合で計算します。<br><span class="bold">計算に使う割合は0～1</span>なので結果色の値は必ず小さくなります。なので<span class="bold"><span class="marker-under">画像は必ず暗くなります</span></span>。<br>R）<span class="bold-blue">96</span>×<span class="bold-green">0.125</span>＝<span class="bold-red">12</span>　G)<span class="bold-blue">128</span>×<span class="bold-green">0.25</span>＝<span class="bold-red">32</span>　B)<span class="bold-blue">192</span>×<span class="bold-green">0.5</span>＝<span class="bold-red">96</span></p>



<figure class="wp-block-image size-large"><img loading="lazy" decoding="async" width="800" height="450" src="https://ko-jyblog.com/wp-content/uploads/2022/05/3a5d92a5df8595ca5ada9e3f85aa8363-800x450.jpg" alt="" class="wp-image-429" srcset="https://ko-jyblog.com/wp-content/uploads/2022/05/3a5d92a5df8595ca5ada9e3f85aa8363-800x450.jpg 800w, https://ko-jyblog.com/wp-content/uploads/2022/05/3a5d92a5df8595ca5ada9e3f85aa8363-500x281.jpg 500w, https://ko-jyblog.com/wp-content/uploads/2022/05/3a5d92a5df8595ca5ada9e3f85aa8363-300x169.jpg 300w, https://ko-jyblog.com/wp-content/uploads/2022/05/3a5d92a5df8595ca5ada9e3f85aa8363-768x432.jpg 768w, https://ko-jyblog.com/wp-content/uploads/2022/05/3a5d92a5df8595ca5ada9e3f85aa8363-1536x864.jpg 1536w, https://ko-jyblog.com/wp-content/uploads/2022/05/3a5d92a5df8595ca5ada9e3f85aa8363-2048x1152.jpg 2048w, https://ko-jyblog.com/wp-content/uploads/2022/05/3a5d92a5df8595ca5ada9e3f85aa8363-120x68.jpg 120w, https://ko-jyblog.com/wp-content/uploads/2022/05/3a5d92a5df8595ca5ada9e3f85aa8363-160x90.jpg 160w, https://ko-jyblog.com/wp-content/uploads/2022/05/3a5d92a5df8595ca5ada9e3f85aa8363-320x180.jpg 320w" sizes="auto, (max-width: 800px) 100vw, 800px" /></figure>



<p><span class="bold"><span class="marker-under-blue">暗くする描画モード</span></span>の特徴は<span class="bold-red"><span class="marker-under">白が抜けて、黒が活かされる</span></span>ということです。<br>これは<span class="bold"><span class="marker-under-red">明るくする描画モード</span></span>の逆の効果です。<span class="bold">乗算</span>は<span class="bold">スクリーン</span>の対になるモードです。</p>



<figure class="wp-block-video"><video height="1080" style="aspect-ratio: 1920 / 1080;" width="1920" controls src="https://ko-jyblog.com/wp-content/uploads/2022/05/2bf8f679c90258e942490697ecb8cfe9.mp4"></video></figure>



<p>上は描画モード：乗算の使用例です。<br>暗くする描画モードは、加算とは逆で白が無効にされるので<br>白い背景にノイズや線やよごれなどの動画素材も乗算で重ねることができます。<br>白が綺麗に抜けてますよね。<br><span class="marker-under-red"><span class="bold"><span class="marker-under-blue">暗くする描画モード</span></span></span>は<span class="bold-red">白が無効化されるのが大きな特徴</span>です。<br><span class="bold-red">暗い部分だけを強く活かしたい時に使う描画モード</span>です。</p>



<div class="wp-block-cocoon-blocks-info-box block-box primary-box">
<p><span class="bold-red"><span class="marker-red"><span class="marker-blue"><span class="bold-blue">焼き込みリニア（暗くする描画モード）</span></span></span></span>　<span class="bold-red">結果色</span>＝<span class="bold-blue">基本色</span>＋<span class="bold-green">合成色</span>－１</p>
</div>



<figure class="wp-block-image size-large"><img loading="lazy" decoding="async" width="800" height="450" src="https://ko-jyblog.com/wp-content/uploads/2022/05/a9e164c7af21ced03f7a12dcd0b422ba-800x450.jpg" alt="" class="wp-image-431" srcset="https://ko-jyblog.com/wp-content/uploads/2022/05/a9e164c7af21ced03f7a12dcd0b422ba-800x450.jpg 800w, https://ko-jyblog.com/wp-content/uploads/2022/05/a9e164c7af21ced03f7a12dcd0b422ba-500x281.jpg 500w, https://ko-jyblog.com/wp-content/uploads/2022/05/a9e164c7af21ced03f7a12dcd0b422ba-300x169.jpg 300w, https://ko-jyblog.com/wp-content/uploads/2022/05/a9e164c7af21ced03f7a12dcd0b422ba-768x432.jpg 768w, https://ko-jyblog.com/wp-content/uploads/2022/05/a9e164c7af21ced03f7a12dcd0b422ba-1536x864.jpg 1536w, https://ko-jyblog.com/wp-content/uploads/2022/05/a9e164c7af21ced03f7a12dcd0b422ba-2048x1152.jpg 2048w, https://ko-jyblog.com/wp-content/uploads/2022/05/a9e164c7af21ced03f7a12dcd0b422ba-120x68.jpg 120w, https://ko-jyblog.com/wp-content/uploads/2022/05/a9e164c7af21ced03f7a12dcd0b422ba-160x90.jpg 160w, https://ko-jyblog.com/wp-content/uploads/2022/05/a9e164c7af21ced03f7a12dcd0b422ba-320x180.jpg 320w" sizes="auto, (max-width: 800px) 100vw, 800px" /></figure>



<p><span class="bold">乗算</span>と同じ<span class="bold"><span class="marker-under-blue">暗くする描画モード</span></span>で、<span class="bold">乗算</span>より変化レベルが強い描画モードです。<br>対になる描画モードが<span class="bold">加算</span><span class="bold">（＝覆い焼きリニア）</span>なので想像できると思いますが、<br><span class="bold">加算</span>が<span class="marker-under"><span class="bold-red">白飛びしやすい描画モード</span></span>に対して、<span class="bold">焼き込みリニア</span>は<span class="marker-under"><span class="bold-red">黒潰れしやすい描画モード</span></span>です。<br><span class="bold-red">黒が活かされて白が無効化</span>されています。これは<span class="bold">乗算</span>と同じ効果で、<span class="marker-under-blue"><span class="bold">暗くする描画モード</span></span>の特徴です。</p>



<div class="wp-block-cocoon-blocks-info-box block-box primary-box">
<p><span class="bold-red"><span class="marker-red"><span class="marker-blue"><span class="bold-blue">焼き込みカラー（暗くする描画モード）</span></span></span></span>　<span class="bold-red">結果色</span>＝１－(１－<span class="bold-blue">基本色</span>)÷<span class="bold-green">合成色</span></p>
</div>



<figure class="wp-block-image size-large"><img loading="lazy" decoding="async" width="800" height="450" src="https://ko-jyblog.com/wp-content/uploads/2022/05/83a71702e16daf84da778337d2c81744-800x450.jpg" alt="" class="wp-image-432" srcset="https://ko-jyblog.com/wp-content/uploads/2022/05/83a71702e16daf84da778337d2c81744-800x450.jpg 800w, https://ko-jyblog.com/wp-content/uploads/2022/05/83a71702e16daf84da778337d2c81744-500x281.jpg 500w, https://ko-jyblog.com/wp-content/uploads/2022/05/83a71702e16daf84da778337d2c81744-300x169.jpg 300w, https://ko-jyblog.com/wp-content/uploads/2022/05/83a71702e16daf84da778337d2c81744-768x432.jpg 768w, https://ko-jyblog.com/wp-content/uploads/2022/05/83a71702e16daf84da778337d2c81744-1536x864.jpg 1536w, https://ko-jyblog.com/wp-content/uploads/2022/05/83a71702e16daf84da778337d2c81744-2048x1152.jpg 2048w, https://ko-jyblog.com/wp-content/uploads/2022/05/83a71702e16daf84da778337d2c81744-120x68.jpg 120w, https://ko-jyblog.com/wp-content/uploads/2022/05/83a71702e16daf84da778337d2c81744-160x90.jpg 160w, https://ko-jyblog.com/wp-content/uploads/2022/05/83a71702e16daf84da778337d2c81744-320x180.jpg 320w" sizes="auto, (max-width: 800px) 100vw, 800px" /></figure>



<p><span class="marker-under-blue"><span class="bold">暗くする描画モード</span></span>は<span class="marker-under"><span class="bold"><span class="bold-red">画像が暗くなるのと、白が無効化されて黒が活かされるのが特徴</span></span></span>ですが、<br>焼き込みカラーの基本色が明るい部分だけは例外で、白が無効化されずに白が活かされます。<br>対になる描画モードは<span class="bold">覆い焼きカラー</span>で画像に与える変化がとても大きい描画モードです。<br>暗くする描画モードで合成すると基本的に画面が暗くなりますが、その強さは<span class="bold-red"><span class="marker-under">「乗算&lt;焼き込みリニア&lt;焼き込みカラー」</span></span>の順番で強くなります。</p>



<div class="wp-block-cocoon-blocks-info-box block-box primary-box">
<p><span class="bold-red"><span class="marker-red"><span class="bold-blue"><span class="marker-blue">比較（暗<strong>）</strong>（暗くする描画モード）</span></span></span></span>　<br><span class="bold-red">結果色（R）</span>＝min｛ <span class="bold-blue">基本色（R）</span>,<span class="bold-green">合成色（R）</span>｝<br><span class="bold-red"><span class="bold-red">結果色</span>（G）</span>＝min｛ <span class="bold-red"><span class="bold-blue">基本色（G）</span></span>,<span class="bold-red"><span class="bold-green">合成色（G）</span></span>｝<br><span class="bold-red"><span class="bold-red">結果色</span>（B）</span>＝min｛ <span class="bold-red"><span class="bold-blue">基本色（B）</span></span>,<span class="bold-red"><span class="bold-green">合成色（B）</span></span>｝</p>
</div>



<figure class="wp-block-image size-large"><img loading="lazy" decoding="async" width="800" height="450" src="https://ko-jyblog.com/wp-content/uploads/2022/05/heimen_hikaku_a-800x450.jpg" alt="" class="wp-image-435" srcset="https://ko-jyblog.com/wp-content/uploads/2022/05/heimen_hikaku_a-800x450.jpg 800w, https://ko-jyblog.com/wp-content/uploads/2022/05/heimen_hikaku_a-500x281.jpg 500w, https://ko-jyblog.com/wp-content/uploads/2022/05/heimen_hikaku_a-300x169.jpg 300w, https://ko-jyblog.com/wp-content/uploads/2022/05/heimen_hikaku_a-768x432.jpg 768w, https://ko-jyblog.com/wp-content/uploads/2022/05/heimen_hikaku_a-1536x864.jpg 1536w, https://ko-jyblog.com/wp-content/uploads/2022/05/heimen_hikaku_a-120x68.jpg 120w, https://ko-jyblog.com/wp-content/uploads/2022/05/heimen_hikaku_a-160x90.jpg 160w, https://ko-jyblog.com/wp-content/uploads/2022/05/heimen_hikaku_a-320x180.jpg 320w, https://ko-jyblog.com/wp-content/uploads/2022/05/heimen_hikaku_a.jpg 1920w" sizes="auto, (max-width: 800px) 100vw, 800px" /></figure>



<p><span class="bold">比較（暗）</span>と<span class="bold">カラー比較（暗）</span>は暗くする描画モードの中でも少し特殊な描画モードです。<br><span class="bold">比較（暗）</span>は<span class="bold-green">合成色</span>・<span class="bold-blue">基本色</span>のRGBごとの数値を比較して、<br>それぞれ小さい数値を選ぶので<span class="bold-red"><span class="marker-under">結果色は必ず暗くなります</span></span>。<br><span class="bold">比較（明）</span>の対になる描画モードです。</p>



<div class="wp-block-cocoon-blocks-info-box block-box primary-box">
<p><span class="bold-red"><span class="marker-red"><span class="bold-blue"><span class="marker-blue">カラー比較（暗<strong>）</strong>（暗くする描画モード）</span></span></span></span>　<br><span class="bold-red">結果色（R,G,B）</span>＝min｛ <span class="bold-blue">基本色（R,G,B）</span>,<span class="bold-green">合成色（R,G,B）</span>｝</p>
</div>



<figure class="wp-block-image size-large"><img loading="lazy" decoding="async" width="800" height="450" src="https://ko-jyblog.com/wp-content/uploads/2022/05/48663e9e0860ec8a3c49c17b40beff8f-800x450.jpg" alt="" class="wp-image-434" srcset="https://ko-jyblog.com/wp-content/uploads/2022/05/48663e9e0860ec8a3c49c17b40beff8f-800x450.jpg 800w, https://ko-jyblog.com/wp-content/uploads/2022/05/48663e9e0860ec8a3c49c17b40beff8f-500x281.jpg 500w, https://ko-jyblog.com/wp-content/uploads/2022/05/48663e9e0860ec8a3c49c17b40beff8f-300x169.jpg 300w, https://ko-jyblog.com/wp-content/uploads/2022/05/48663e9e0860ec8a3c49c17b40beff8f-768x432.jpg 768w, https://ko-jyblog.com/wp-content/uploads/2022/05/48663e9e0860ec8a3c49c17b40beff8f-1536x864.jpg 1536w, https://ko-jyblog.com/wp-content/uploads/2022/05/48663e9e0860ec8a3c49c17b40beff8f-120x68.jpg 120w, https://ko-jyblog.com/wp-content/uploads/2022/05/48663e9e0860ec8a3c49c17b40beff8f-160x90.jpg 160w, https://ko-jyblog.com/wp-content/uploads/2022/05/48663e9e0860ec8a3c49c17b40beff8f-320x180.jpg 320w, https://ko-jyblog.com/wp-content/uploads/2022/05/48663e9e0860ec8a3c49c17b40beff8f.jpg 1920w" sizes="auto, (max-width: 800px) 100vw, 800px" /></figure>



<p><span class="bold-blue">基本色</span>、<span class="bold-green">合成色</span>のRGBすべての数値を足した、<span class="bold">合計が小さい方</span>、<br>つまり単純に<span class="bold-red"><span class="marker-under">基本色と合成色の暗い方の画像を使用する</span></span>という描画モードです。<br><span class="bold">カラー</span><span class="bold">比較（明）</span>の対になる描画モードです。</p>



<figure class="wp-block-image size-large"><img loading="lazy" decoding="async" width="800" height="450" src="https://ko-jyblog.com/wp-content/uploads/2022/05/543f052af53618f706d82370af1def6a-800x450.jpg" alt="" class="wp-image-436" srcset="https://ko-jyblog.com/wp-content/uploads/2022/05/543f052af53618f706d82370af1def6a-800x450.jpg 800w, https://ko-jyblog.com/wp-content/uploads/2022/05/543f052af53618f706d82370af1def6a-500x281.jpg 500w, https://ko-jyblog.com/wp-content/uploads/2022/05/543f052af53618f706d82370af1def6a-300x169.jpg 300w, https://ko-jyblog.com/wp-content/uploads/2022/05/543f052af53618f706d82370af1def6a-768x432.jpg 768w, https://ko-jyblog.com/wp-content/uploads/2022/05/543f052af53618f706d82370af1def6a-1536x864.jpg 1536w, https://ko-jyblog.com/wp-content/uploads/2022/05/543f052af53618f706d82370af1def6a-2048x1152.jpg 2048w, https://ko-jyblog.com/wp-content/uploads/2022/05/543f052af53618f706d82370af1def6a-120x68.jpg 120w, https://ko-jyblog.com/wp-content/uploads/2022/05/543f052af53618f706d82370af1def6a-160x90.jpg 160w, https://ko-jyblog.com/wp-content/uploads/2022/05/543f052af53618f706d82370af1def6a-320x180.jpg 320w" sizes="auto, (max-width: 800px) 100vw, 800px" /></figure>



<p><span class="bold-blue"><span class="bold-red">比較系の描画モード</span></span>は同じ画像を合成しても、<br>比較の対象のRGB値が同じため合成による変化はありません。<br>どちらも<span class="bold-red">白が無効化</span>され、<span class="bold-red">黒が活かされる</span>という<br><span class="marker-under-blue"><span class="bold">暗くする描画モード</span></span>の特徴を持っています。</p>



<p><a href="https://ko-jyblog.com/aftereffects/blendmode00/" data-type="URL" data-id="https://ko-jyblog.com/aftereffects/blendmode00/">After Effectsの全描画モードの種類と考え方</a><br><a href="https://ko-jyblog.com/aftereffects/blendmode01/" data-type="URL" data-id="https://ko-jyblog.com/aftereffects/blendmode01/">描画モード①明るくする描画モードの計算式</a><br><a href="https://ko-jyblog.com/aftereffects/blendmode02/" data-type="URL" data-id="https://ko-jyblog.com/aftereffects/blendmode02/">描画モード②暗くする描画モードの計算式</a><br><a href="https://ko-jyblog.com/aftereffects/blendmode03/" data-type="URL" data-id="https://ko-jyblog.com/aftereffects/blendmode03/">描画モード③コントラストを強くする描画モードの計算式</a><br><a href="https://ko-jyblog.com/aftereffects/blendmode04/" data-type="URL" data-id="https://ko-jyblog.com/aftereffects/blendmode04/">描画モード④色を反転させる描画モードの計算式</a><br><a href="https://ko-jyblog.com/aftereffects/blendmode05/" data-type="URL" data-id="https://ko-jyblog.com/aftereffects/blendmode05/">描画モード⑤色相・彩度・輝度を使う描画モード</a></p>



<p></p>
]]></content:encoded>
					
					<wfw:commentRss>https://ko-jyblog.com/aftereffects/blendmode02/feed/</wfw:commentRss>
			<slash:comments>3</slash:comments>
		
		<enclosure url="https://ko-jyblog.com/wp-content/uploads/2022/05/2bf8f679c90258e942490697ecb8cfe9.mp4" length="0" type="video/mp4" />

			</item>
		<item>
		<title>描画モード①明るくする描画モードの計算式</title>
		<link>https://ko-jyblog.com/aftereffects/blendmode01/</link>
					<comments>https://ko-jyblog.com/aftereffects/blendmode01/#comments</comments>
		
		<dc:creator><![CDATA[コージー]]></dc:creator>
		<pubDate>Tue, 10 May 2022 16:45:00 +0000</pubDate>
				<category><![CDATA[After Effects]]></category>
		<guid isPermaLink="false">https://ko-jyblog.com/?p=408</guid>

					<description><![CDATA[動画で見たい方はコチラ 明るくする描画モード【スクリーン・加算・覆い焼きリニア・覆い焼きカラー・比較（明）・カラー比較（明）】の計算式の紹介 上の表を見てください。よく使う描画モードをまとめた図です。縦の列が明るくする描 [&#8230;]]]></description>
										<content:encoded><![CDATA[
<h2 class="wp-block-heading">動画で見たい方はコチラ</h2>



<div class="iframe-wrapper"><iframe loading="lazy" width="840" height="472" src="https://www.youtube.com/embed/g2sZNsJc67M?rel=0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen=""></iframe></div>



<div class="iframe-wrapper"><iframe loading="lazy" width="840" height="472" src="https://www.youtube.com/embed/zYLa0pDCLio?rel=0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen=""></iframe></div>



<h2 class="wp-block-heading">明るくする描画モード【スクリーン・加算・覆い焼きリニア・覆い焼きカラー・比較（明）・カラー比較（明）】の計算式の紹介</h2>



<figure class="wp-block-image size-large"><img loading="lazy" decoding="async" width="800" height="450" src="https://ko-jyblog.com/wp-content/uploads/2022/05/4d1ef7fffa8d744b023a43ba21243113-800x450.jpg" alt="" class="wp-image-362" srcset="https://ko-jyblog.com/wp-content/uploads/2022/05/4d1ef7fffa8d744b023a43ba21243113-800x450.jpg 800w, https://ko-jyblog.com/wp-content/uploads/2022/05/4d1ef7fffa8d744b023a43ba21243113-500x281.jpg 500w, https://ko-jyblog.com/wp-content/uploads/2022/05/4d1ef7fffa8d744b023a43ba21243113-300x169.jpg 300w, https://ko-jyblog.com/wp-content/uploads/2022/05/4d1ef7fffa8d744b023a43ba21243113-768x432.jpg 768w, https://ko-jyblog.com/wp-content/uploads/2022/05/4d1ef7fffa8d744b023a43ba21243113-1536x864.jpg 1536w, https://ko-jyblog.com/wp-content/uploads/2022/05/4d1ef7fffa8d744b023a43ba21243113-120x68.jpg 120w, https://ko-jyblog.com/wp-content/uploads/2022/05/4d1ef7fffa8d744b023a43ba21243113-160x90.jpg 160w, https://ko-jyblog.com/wp-content/uploads/2022/05/4d1ef7fffa8d744b023a43ba21243113-320x180.jpg 320w, https://ko-jyblog.com/wp-content/uploads/2022/05/4d1ef7fffa8d744b023a43ba21243113.jpg 1920w" sizes="auto, (max-width: 800px) 100vw, 800px" /></figure>



<p>上の表を見てください。よく使う描画モードをまとめた図です。<br>縦の列が<span class="marker-under-red"><span class="bold">明るくする描画モード</span></span>、<span class="marker-under-blue"><span class="bold">暗くする描画モード</span></span>、<span class="marker-under"><span class="bold">コントラストを強くする描画モード</span></span>で<br>上にいくほど<span class="bold-red">画面に与える変化が大きい描画モード</span>です。<br>横に並んだ描画モードは<span class="bold-red">同等の強さの描画モード</span>と言えます。<br>下の6つの描画モードについては<span class="bold"><span class="bold-red">特殊な描画モード</span></span>なので、その関係性からはハズれます。</p>



<p>それでは、<span class="bold"><span class="marker-under"><span class="marker-under-red">明るくする描画モードの計算式</span></span></span>について紹介していきます！<br>描画モードは感覚的に使うものなので、計算式を理解しても意味ない…という意見もありますが、<br>各描画モードでどのような計算をされているか知りたい方も多いと思うので紹介します！</p>



<div class="wp-block-cocoon-blocks-info-box block-box primary-box">
<p><span class="bold-red"><span class="marker-red">加算（明るくする描画モード）</span></span>　<span class="bold-red">結果色</span>＝<span class="bold-blue">基本色</span>＋<span class="bold-green">合成色</span></p>
</div>



<figure class="wp-block-image size-large"><img loading="lazy" decoding="async" width="800" height="450" src="https://ko-jyblog.com/wp-content/uploads/2022/05/8caf7a64b4c3eed35eb00d45649a3472-800x450.jpg" alt="" class="wp-image-370" srcset="https://ko-jyblog.com/wp-content/uploads/2022/05/8caf7a64b4c3eed35eb00d45649a3472-800x450.jpg 800w, https://ko-jyblog.com/wp-content/uploads/2022/05/8caf7a64b4c3eed35eb00d45649a3472-500x281.jpg 500w, https://ko-jyblog.com/wp-content/uploads/2022/05/8caf7a64b4c3eed35eb00d45649a3472-300x169.jpg 300w, https://ko-jyblog.com/wp-content/uploads/2022/05/8caf7a64b4c3eed35eb00d45649a3472-768x432.jpg 768w, https://ko-jyblog.com/wp-content/uploads/2022/05/8caf7a64b4c3eed35eb00d45649a3472-1536x864.jpg 1536w, https://ko-jyblog.com/wp-content/uploads/2022/05/8caf7a64b4c3eed35eb00d45649a3472-120x68.jpg 120w, https://ko-jyblog.com/wp-content/uploads/2022/05/8caf7a64b4c3eed35eb00d45649a3472-160x90.jpg 160w, https://ko-jyblog.com/wp-content/uploads/2022/05/8caf7a64b4c3eed35eb00d45649a3472-320x180.jpg 320w, https://ko-jyblog.com/wp-content/uploads/2022/05/8caf7a64b4c3eed35eb00d45649a3472.jpg 1920w" sizes="auto, (max-width: 800px) 100vw, 800px" /></figure>



<p>RGBそれぞれの数値を見れば<span class="bold-green">合成色</span>と<span class="bold-blue">基本色</span>を足した数字が<span class="bold-red">結果色</span>になっているのが分かります。<br><span class="bold"><span class="marker-under">足し算なので数値は必ず増えるので、結果色は必ず明るくなります。</span></span>暗くなるピクセルはありません。</p>



<figure class="wp-block-image size-large"><img loading="lazy" decoding="async" width="800" height="450" src="https://ko-jyblog.com/wp-content/uploads/2022/05/9f94b2889f9190dee450e8e0e795cd10-800x450.jpg" alt="" class="wp-image-400" srcset="https://ko-jyblog.com/wp-content/uploads/2022/05/9f94b2889f9190dee450e8e0e795cd10-800x450.jpg 800w, https://ko-jyblog.com/wp-content/uploads/2022/05/9f94b2889f9190dee450e8e0e795cd10-500x281.jpg 500w, https://ko-jyblog.com/wp-content/uploads/2022/05/9f94b2889f9190dee450e8e0e795cd10-300x169.jpg 300w, https://ko-jyblog.com/wp-content/uploads/2022/05/9f94b2889f9190dee450e8e0e795cd10-768x432.jpg 768w, https://ko-jyblog.com/wp-content/uploads/2022/05/9f94b2889f9190dee450e8e0e795cd10-1536x864.jpg 1536w, https://ko-jyblog.com/wp-content/uploads/2022/05/9f94b2889f9190dee450e8e0e795cd10-2048x1152.jpg 2048w, https://ko-jyblog.com/wp-content/uploads/2022/05/9f94b2889f9190dee450e8e0e795cd10-120x68.jpg 120w, https://ko-jyblog.com/wp-content/uploads/2022/05/9f94b2889f9190dee450e8e0e795cd10-160x90.jpg 160w, https://ko-jyblog.com/wp-content/uploads/2022/05/9f94b2889f9190dee450e8e0e795cd10-320x180.jpg 320w" sizes="auto, (max-width: 800px) 100vw, 800px" /></figure>



<p><span class="bold">明るくする描画モード</span>の特徴は<span class="bold-red"><span class="marker-under">黒が抜けて、白が活かされる</span></span>ということです。</p>



<figure class="wp-block-video"><video height="1080" style="aspect-ratio: 1920 / 1080;" width="1920" controls src="https://ko-jyblog.com/wp-content/uploads/2022/05/90a67d6264a610133f9860eb8ca3ce2f.mp4"></video></figure>



<p>上は描画モード：加算の使用例です。<br>明るくする描画モードは、<br>このように背景黒のVFXなどの黒背景の素材を合成するときに使用できます。<br>黒が綺麗に抜けてますよね。<br><span class="marker-under-red"><span class="bold">明るくする描画モード</span></span>は<span class="bold-red">黒が無効化されるのが大きな特徴</span>です。<br><span class="bold-red">明るい部分だけを強く活かしたい時に使う描画モード</span>です。</p>



<div class="wp-block-cocoon-blocks-info-box block-box primary-box">
<p><span class="bold-red"><span class="marker-red">覆い焼きリニア（明るくする描画モード）</span></span>　<span class="bold-red">結果色</span>＝<span class="bold-blue">基本色</span>＋<span class="bold-green">合成色</span></p>
</div>



<p>こ<span class="bold">の覆い焼きリニア</span>の説明ですが、実は<span class="bold">覆い焼きリニア</span>と<span class="bold">加算</span>は　<span class="bold-red"><span class="marker-under">同じ処理を行う描画モード</span></span>です。<br><span class="bold"><span class="bold-red">覆い焼きリニアは加算のPhotoshop用語だと思ってください。</span></span>Photoshopとの互換性のため、用意されています。Photoshopには<span class="bold">加算</span>という描画モードがないため、Ae内で描画モード<span class="bold">加算</span>にしたレイヤーはpsdファイルとして書き出すと<span class="bold">『描画モードは最も類似したPhotoshop描画モードに変換されました。』</span>とアラートが出て、<span class="bold-red">加算は覆い焼きリニアに変換され書き出されます。</span></p>



<div class="wp-block-cocoon-blocks-info-box block-box primary-box">
<p><span class="bold-red"><span class="marker-red">スクリーン（明るくする描画モード）</span></span>　<span class="bold-red">結果色</span>＝１－(１－<span class="bold-blue">基本色</span>)×(１－<span class="bold-green">合成色</span>)</p>
</div>



<figure class="wp-block-image size-large"><img loading="lazy" decoding="async" width="800" height="450" src="https://ko-jyblog.com/wp-content/uploads/2022/05/3ad1aaaac99f2cc26f3af5185043bf28-800x450.jpg" alt="" class="wp-image-372" srcset="https://ko-jyblog.com/wp-content/uploads/2022/05/3ad1aaaac99f2cc26f3af5185043bf28-800x450.jpg 800w, https://ko-jyblog.com/wp-content/uploads/2022/05/3ad1aaaac99f2cc26f3af5185043bf28-500x281.jpg 500w, https://ko-jyblog.com/wp-content/uploads/2022/05/3ad1aaaac99f2cc26f3af5185043bf28-300x169.jpg 300w, https://ko-jyblog.com/wp-content/uploads/2022/05/3ad1aaaac99f2cc26f3af5185043bf28-768x432.jpg 768w, https://ko-jyblog.com/wp-content/uploads/2022/05/3ad1aaaac99f2cc26f3af5185043bf28-1536x864.jpg 1536w, https://ko-jyblog.com/wp-content/uploads/2022/05/3ad1aaaac99f2cc26f3af5185043bf28-120x68.jpg 120w, https://ko-jyblog.com/wp-content/uploads/2022/05/3ad1aaaac99f2cc26f3af5185043bf28-160x90.jpg 160w, https://ko-jyblog.com/wp-content/uploads/2022/05/3ad1aaaac99f2cc26f3af5185043bf28-320x180.jpg 320w, https://ko-jyblog.com/wp-content/uploads/2022/05/3ad1aaaac99f2cc26f3af5185043bf28.jpg 1920w" sizes="auto, (max-width: 800px) 100vw, 800px" /></figure>



<figure class="wp-block-image size-large"><img loading="lazy" decoding="async" width="800" height="450" src="https://ko-jyblog.com/wp-content/uploads/2022/05/74dd58e1dbc3e2c28852b092f3cd2c96-800x450.jpg" alt="" class="wp-image-402" srcset="https://ko-jyblog.com/wp-content/uploads/2022/05/74dd58e1dbc3e2c28852b092f3cd2c96-800x450.jpg 800w, https://ko-jyblog.com/wp-content/uploads/2022/05/74dd58e1dbc3e2c28852b092f3cd2c96-500x281.jpg 500w, https://ko-jyblog.com/wp-content/uploads/2022/05/74dd58e1dbc3e2c28852b092f3cd2c96-300x169.jpg 300w, https://ko-jyblog.com/wp-content/uploads/2022/05/74dd58e1dbc3e2c28852b092f3cd2c96-768x432.jpg 768w, https://ko-jyblog.com/wp-content/uploads/2022/05/74dd58e1dbc3e2c28852b092f3cd2c96-1536x864.jpg 1536w, https://ko-jyblog.com/wp-content/uploads/2022/05/74dd58e1dbc3e2c28852b092f3cd2c96-2048x1152.jpg 2048w, https://ko-jyblog.com/wp-content/uploads/2022/05/74dd58e1dbc3e2c28852b092f3cd2c96-120x68.jpg 120w, https://ko-jyblog.com/wp-content/uploads/2022/05/74dd58e1dbc3e2c28852b092f3cd2c96-160x90.jpg 160w, https://ko-jyblog.com/wp-content/uploads/2022/05/74dd58e1dbc3e2c28852b092f3cd2c96-320x180.jpg 320w" sizes="auto, (max-width: 800px) 100vw, 800px" /></figure>



<p><span class="bold">スクリーン</span>も<span class="bold">明るくする描画モード</span>の<span class="bold-red"><span class="marker-under">黒が抜けて、白が活かされる</span></span>という特徴を持っています。<br><span class="bold">スクリーン</span>は<span class="bold">加算</span>と比べて柔らかく明るくなります。加算ほど効果は強くならない。</p>



<p></p>



<div class="wp-block-cocoon-blocks-info-box block-box primary-box">
<p><span class="bold-red"><span class="marker-red">覆い焼きカラー（明るくする描画モード）</span></span>　<span class="bold-red">結果色</span>＝<span class="bold-blue">基本色</span>÷(１－<span class="bold-green">合成色</span>)</p>
</div>



<figure class="wp-block-image size-large"><img loading="lazy" decoding="async" width="800" height="450" src="https://ko-jyblog.com/wp-content/uploads/2022/05/34f6548f762cc2681f02e10b134e126b-800x450.jpg" alt="" class="wp-image-373" srcset="https://ko-jyblog.com/wp-content/uploads/2022/05/34f6548f762cc2681f02e10b134e126b-800x450.jpg 800w, https://ko-jyblog.com/wp-content/uploads/2022/05/34f6548f762cc2681f02e10b134e126b-500x281.jpg 500w, https://ko-jyblog.com/wp-content/uploads/2022/05/34f6548f762cc2681f02e10b134e126b-300x169.jpg 300w, https://ko-jyblog.com/wp-content/uploads/2022/05/34f6548f762cc2681f02e10b134e126b-768x432.jpg 768w, https://ko-jyblog.com/wp-content/uploads/2022/05/34f6548f762cc2681f02e10b134e126b-1536x864.jpg 1536w, https://ko-jyblog.com/wp-content/uploads/2022/05/34f6548f762cc2681f02e10b134e126b-120x68.jpg 120w, https://ko-jyblog.com/wp-content/uploads/2022/05/34f6548f762cc2681f02e10b134e126b-160x90.jpg 160w, https://ko-jyblog.com/wp-content/uploads/2022/05/34f6548f762cc2681f02e10b134e126b-320x180.jpg 320w, https://ko-jyblog.com/wp-content/uploads/2022/05/34f6548f762cc2681f02e10b134e126b.jpg 1920w" sizes="auto, (max-width: 800px) 100vw, 800px" /></figure>



<figure class="wp-block-image size-large"><img loading="lazy" decoding="async" width="800" height="450" src="https://ko-jyblog.com/wp-content/uploads/2022/05/58d994f513ae6178a7db60d68ad8dc60-1-800x450.jpg" alt="" class="wp-image-404" srcset="https://ko-jyblog.com/wp-content/uploads/2022/05/58d994f513ae6178a7db60d68ad8dc60-1-800x450.jpg 800w, https://ko-jyblog.com/wp-content/uploads/2022/05/58d994f513ae6178a7db60d68ad8dc60-1-500x281.jpg 500w, https://ko-jyblog.com/wp-content/uploads/2022/05/58d994f513ae6178a7db60d68ad8dc60-1-300x169.jpg 300w, https://ko-jyblog.com/wp-content/uploads/2022/05/58d994f513ae6178a7db60d68ad8dc60-1-768x432.jpg 768w, https://ko-jyblog.com/wp-content/uploads/2022/05/58d994f513ae6178a7db60d68ad8dc60-1-1536x864.jpg 1536w, https://ko-jyblog.com/wp-content/uploads/2022/05/58d994f513ae6178a7db60d68ad8dc60-1-2048x1152.jpg 2048w, https://ko-jyblog.com/wp-content/uploads/2022/05/58d994f513ae6178a7db60d68ad8dc60-1-120x68.jpg 120w, https://ko-jyblog.com/wp-content/uploads/2022/05/58d994f513ae6178a7db60d68ad8dc60-1-160x90.jpg 160w, https://ko-jyblog.com/wp-content/uploads/2022/05/58d994f513ae6178a7db60d68ad8dc60-1-320x180.jpg 320w" sizes="auto, (max-width: 800px) 100vw, 800px" /></figure>



<p><span class="bold">覆い焼きカラー</span>も<span class="bold">明るくする描画モード</span>の<span class="bold-red"><span class="marker-under">黒が抜けて、白が活かされる</span></span>という特徴を持っています。<br>ただ全てのピクセルで必ず明るくなるわけではなく、基本色が暗い部分は合成後暗くなります。<br><span class="bold">覆い焼きカラー</span>は<span class="bold-red">加算の暗い部分を締めたようなイメージ</span>になります。<br><br>明るくする描画モードで合成すると基本的に画面が明るくなりますが、その強さは<span class="bold-red"><span class="marker-under">「スクリーン&lt;加算＝覆い焼きリニア&lt;覆い焼きカラー」</span></span>の順番で強くなります。</p>



<div class="wp-block-cocoon-blocks-info-box block-box primary-box">
<p><span class="bold-red"><span class="marker-red">比較（明<strong>）</strong>（明るくする描画モード）</span></span>　<br><span class="bold-red">結果色（R）</span>＝max｛ <span class="bold-blue">基本色（R）</span>,<span class="bold-green">合成色（R）</span>｝<br><span class="bold-red"><span class="bold-red">結果色</span>（G）</span>＝max｛ <span class="bold-red"><span class="bold-blue">基本色（G）</span></span>,<span class="bold-red"><span class="bold-green">合成色（G）</span></span>｝<br><span class="bold-red"><span class="bold-red">結果色</span>（B）</span>＝max｛ <span class="bold-red"><span class="bold-blue">基本色（B）</span></span>,<span class="bold-red"><span class="bold-green">合成色（B）</span></span>｝</p>
</div>



<figure class="wp-block-image size-large"><img loading="lazy" decoding="async" width="800" height="450" src="https://ko-jyblog.com/wp-content/uploads/2022/05/2eb7509b6f31bb1181a875dbff7e3d68-800x450.jpg" alt="" class="wp-image-377" srcset="https://ko-jyblog.com/wp-content/uploads/2022/05/2eb7509b6f31bb1181a875dbff7e3d68-800x450.jpg 800w, https://ko-jyblog.com/wp-content/uploads/2022/05/2eb7509b6f31bb1181a875dbff7e3d68-500x281.jpg 500w, https://ko-jyblog.com/wp-content/uploads/2022/05/2eb7509b6f31bb1181a875dbff7e3d68-300x169.jpg 300w, https://ko-jyblog.com/wp-content/uploads/2022/05/2eb7509b6f31bb1181a875dbff7e3d68-768x432.jpg 768w, https://ko-jyblog.com/wp-content/uploads/2022/05/2eb7509b6f31bb1181a875dbff7e3d68-1536x864.jpg 1536w, https://ko-jyblog.com/wp-content/uploads/2022/05/2eb7509b6f31bb1181a875dbff7e3d68-120x68.jpg 120w, https://ko-jyblog.com/wp-content/uploads/2022/05/2eb7509b6f31bb1181a875dbff7e3d68-160x90.jpg 160w, https://ko-jyblog.com/wp-content/uploads/2022/05/2eb7509b6f31bb1181a875dbff7e3d68-320x180.jpg 320w, https://ko-jyblog.com/wp-content/uploads/2022/05/2eb7509b6f31bb1181a875dbff7e3d68.jpg 1920w" sizes="auto, (max-width: 800px) 100vw, 800px" /></figure>



<p><span class="bold">比較（明）</span>と<span class="bold">カラー比較（明）</span>は明るくする描画モードの中でも少し特殊な描画モードです。<br><span class="bold-green">合成色</span>・<span class="bold-blue">基本色</span>のRGBごとの数値を比較して、<br>それぞれ大きい数値を選ぶので<span class="bold-red"><span class="marker-under">結果色は必ず明るくなります</span></span>。<br>この場合Rは237と70を比べて、数字が大きい<span class="bold-green">合成色</span>の<span class="bold">237</span>が<span class="bold-red">結果色</span>に使用され、<br>Gの数値も137と49の大きい方、<span class="bold-green">合成色</span>の<span class="bold">137</span>が<span class="bold-red">結果色</span>に使用され、<br>Bの数値は47と160で<span class="bold-blue">基本色</span>の<span class="bold">160</span>が<span class="bold-red">結果色</span>に使われます。</p>



<p>黒はRGBの数値がすべて<span class="bold">0</span>のため、数値が使わることはないため<span class="bold-red">無効化</span>されます。<br>逆に白はRGB数値が<span class="bold">255</span>なので必ず使用されるので<span class="bold-red">白は活かされます</span>。<br><span class="bold">加算</span>や<span class="bold">スクリーン</span>と同様の<span class="bold-red">明るくする描画モードの特徴</span>が出ています。</p>



<p>RGBのバランスが大きく変更される可能性があるので、<br>画像の合成に使うには予想がつきにくく扱いにくい描画モードと言えます。</p>



<div class="wp-block-cocoon-blocks-info-box block-box primary-box">
<p><span class="bold-red"><span class="marker-red">カラー比較（明<strong>）</strong>（明るくする描画モード）</span></span>　<br><span class="bold-red">結果色（R,G,B）</span>＝max｛ <span class="bold-blue">基本色（R,G,B）</span>,<span class="bold-green">合成色（R,G,B）</span>｝</p>
</div>



<figure class="wp-block-image size-large"><img loading="lazy" decoding="async" width="800" height="450" src="https://ko-jyblog.com/wp-content/uploads/2022/05/33dc93d0e83ebcd1c6c3e7f6b2c4b6b3-800x450.jpg" alt="" class="wp-image-378" srcset="https://ko-jyblog.com/wp-content/uploads/2022/05/33dc93d0e83ebcd1c6c3e7f6b2c4b6b3-800x450.jpg 800w, https://ko-jyblog.com/wp-content/uploads/2022/05/33dc93d0e83ebcd1c6c3e7f6b2c4b6b3-500x281.jpg 500w, https://ko-jyblog.com/wp-content/uploads/2022/05/33dc93d0e83ebcd1c6c3e7f6b2c4b6b3-300x169.jpg 300w, https://ko-jyblog.com/wp-content/uploads/2022/05/33dc93d0e83ebcd1c6c3e7f6b2c4b6b3-768x432.jpg 768w, https://ko-jyblog.com/wp-content/uploads/2022/05/33dc93d0e83ebcd1c6c3e7f6b2c4b6b3-1536x864.jpg 1536w, https://ko-jyblog.com/wp-content/uploads/2022/05/33dc93d0e83ebcd1c6c3e7f6b2c4b6b3-120x68.jpg 120w, https://ko-jyblog.com/wp-content/uploads/2022/05/33dc93d0e83ebcd1c6c3e7f6b2c4b6b3-160x90.jpg 160w, https://ko-jyblog.com/wp-content/uploads/2022/05/33dc93d0e83ebcd1c6c3e7f6b2c4b6b3-320x180.jpg 320w, https://ko-jyblog.com/wp-content/uploads/2022/05/33dc93d0e83ebcd1c6c3e7f6b2c4b6b3.jpg 1920w" sizes="auto, (max-width: 800px) 100vw, 800px" /></figure>



<p><span class="bold-blue">基本色</span>、<span class="bold-green">合成色</span>のRGBすべての数値を足した、<span class="bold">合計が大きい方</span>、<br>つまり単純に<span class="bold-red"><span class="marker-under">基本色と合成色の明るい方の画像を使用する</span></span>という描画モードです。<br><br>黒は選ばれないので<span class="bold-red">無効化</span>されます。逆に<span class="bold-red">白い部分は必ず選ぶので活かされます</span>。<br>この描画モードはピクセルごとに基本色、合成色のどちらかを選択するだけであって<br>色が合成により全然別の色に変わってしまうことはないです。</p>



<figure class="wp-block-image size-large"><img loading="lazy" decoding="async" width="800" height="450" src="https://ko-jyblog.com/wp-content/uploads/2022/05/228a0b8b7f41bd9adb888c9eb7ef62d4-800x450.jpg" alt="" class="wp-image-405" srcset="https://ko-jyblog.com/wp-content/uploads/2022/05/228a0b8b7f41bd9adb888c9eb7ef62d4-800x450.jpg 800w, https://ko-jyblog.com/wp-content/uploads/2022/05/228a0b8b7f41bd9adb888c9eb7ef62d4-500x281.jpg 500w, https://ko-jyblog.com/wp-content/uploads/2022/05/228a0b8b7f41bd9adb888c9eb7ef62d4-300x169.jpg 300w, https://ko-jyblog.com/wp-content/uploads/2022/05/228a0b8b7f41bd9adb888c9eb7ef62d4-768x432.jpg 768w, https://ko-jyblog.com/wp-content/uploads/2022/05/228a0b8b7f41bd9adb888c9eb7ef62d4-1536x864.jpg 1536w, https://ko-jyblog.com/wp-content/uploads/2022/05/228a0b8b7f41bd9adb888c9eb7ef62d4-2048x1152.jpg 2048w, https://ko-jyblog.com/wp-content/uploads/2022/05/228a0b8b7f41bd9adb888c9eb7ef62d4-120x68.jpg 120w, https://ko-jyblog.com/wp-content/uploads/2022/05/228a0b8b7f41bd9adb888c9eb7ef62d4-160x90.jpg 160w, https://ko-jyblog.com/wp-content/uploads/2022/05/228a0b8b7f41bd9adb888c9eb7ef62d4-320x180.jpg 320w" sizes="auto, (max-width: 800px) 100vw, 800px" /></figure>



<p><span class="bold-red">比較系の描画モード</span>は同じ画像を合成しても、<br>比較の対象のRGB値が同じため合成による変化はありません。<br>どちらも<span class="bold-red">黒が無効化</span>され、<span class="bold-red">白が活かされる</span>という<br>明るくする描画モードの特徴を持っています。</p>



<p><a href="https://ko-jyblog.com/aftereffects/blendmode00/" data-type="URL" data-id="https://ko-jyblog.com/aftereffects/blendmode00/">After Effectsの全描画モードの種類と考え方</a><br><a href="https://ko-jyblog.com/aftereffects/blendmode01/" data-type="URL" data-id="https://ko-jyblog.com/aftereffects/blendmode01/">描画モード①明るくする描画モードの計算式</a><br><a href="https://ko-jyblog.com/aftereffects/blendmode02/" data-type="URL" data-id="https://ko-jyblog.com/aftereffects/blendmode02/">描画モード②暗くする描画モードの計算式</a><br><a href="https://ko-jyblog.com/aftereffects/blendmode03/" data-type="URL" data-id="https://ko-jyblog.com/aftereffects/blendmode03/">描画モード③コントラストを強くする描画モードの計算式</a><br><a href="https://ko-jyblog.com/aftereffects/blendmode04/" data-type="URL" data-id="https://ko-jyblog.com/aftereffects/blendmode04/">描画モード④色を反転させる描画モードの計算式</a><br><a href="https://ko-jyblog.com/aftereffects/blendmode05/" data-type="URL" data-id="https://ko-jyblog.com/aftereffects/blendmode05/">描画モード⑤色相・彩度・輝度を使う描画モード</a></p>
]]></content:encoded>
					
					<wfw:commentRss>https://ko-jyblog.com/aftereffects/blendmode01/feed/</wfw:commentRss>
			<slash:comments>1</slash:comments>
		
		<enclosure url="https://ko-jyblog.com/wp-content/uploads/2022/05/90a67d6264a610133f9860eb8ca3ce2f.mp4" length="0" type="video/mp4" />

			</item>
	</channel>
</rss>
