<?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>Блог одиноко стоящего игрока вспышки &#187; fx</title>
	<atom:link href="http://murejib.com/category/fx/feed/" rel="self" type="application/rss+xml" />
	<link>http://murejib.com</link>
	<description>flash, actionscript, animation, анимация</description>
	<lastBuildDate>Sat, 10 Dec 2011 07:58:26 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.3.1</generator>
		<item>
		<title>Имитация изометрии.</title>
		<link>http://murejib.com/2008/05/15/pseudoiso/</link>
		<comments>http://murejib.com/2008/05/15/pseudoiso/#comments</comments>
		<pubDate>Thu, 15 May 2008 08:52:06 +0000</pubDate>
		<dc:creator>murejib</dc:creator>
				<category><![CDATA[3D]]></category>
		<category><![CDATA[ActionScript]]></category>
		<category><![CDATA[draw]]></category>
		<category><![CDATA[fx]]></category>
		<category><![CDATA[Uncategorized]]></category>
		<category><![CDATA[анимация]]></category>
		<category><![CDATA[Полезное]]></category>
		<category><![CDATA[Flash]]></category>

		<guid isPermaLink="false">http://murejib.com/?p=53</guid>
		<description><![CDATA[Старый, но приятный трюк: анимация изометрического изображения. 
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"
			id="fm_iso_slicer_1433964297"
			class="flashmovie"
			width="300"
			height="300">
	<param name="movie" value="/flash/iso_slicer.swf" />
	<!--[if !IE]>-->
	<object	type="application/x-shockwave-flash"
			data="/flash/iso_slicer.swf"
			name="fm_iso_slicer_1433964297"
			width="300"
			height="300">
	<!--<![endif]-->
		
	<!--[if !IE]>-->
	</object>
	<!--<![endif]-->
</object> Такая штуковина очень проста в изготовлении. Надо только сообразить, что мувиклипы с двойным дном таят в себе скрытые возможности )) Если к примеру клип, который вращается вокруг своей оси, поместить в клип, который сжат по вертикали (_yscale = 75) то мы получим имитацию [...]]]></description>
			<content:encoded><![CDATA[<p>Старый, но приятный трюк: анимация изометрического изображения.</p>

<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"
			id="fm_iso_slicer_1345510587"
			class="flashmovie"
			width="300"
			height="300">
	<param name="movie" value="/flash/iso_slicer.swf" />
	<!--[if !IE]>-->
	<object	type="application/x-shockwave-flash"
			data="/flash/iso_slicer.swf"
			name="fm_iso_slicer_1345510587"
			width="300"
			height="300">
	<!--<![endif]-->
		
	<!--[if !IE]>-->
	</object>
	<!--<![endif]-->
</object>
<p><span id="more-46"></span></p>
<p>Такая штуковина очень проста в изготовлении.<br />
Надо только сообразить, что мувиклипы с двойным дном таят в себе скрытые возможности ))<br />
Если к примеру клип, который вращается вокруг своей оси, поместить в клип, который сжат по вертикали (_yscale = 75) то мы получим имитацию вращения изометрического изображения.<br />
А если несколько изображений положить друг на другом как блины &#8211; получится объемное изометрическое изображение которое можно крутить, как душе угодно )</p>
<p>Самое забавное в этом методе &#8211; это моделирование модели.<br />
Делается это на таймлайне. 1 кадр &#8211; это дно, последний кадр &#8211; вершина нашей блинной скульптуры.<br />
Вот, к примеру &#8211; как выглядит клип из которого нарезается приведенная выше анимация:</p>

<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"
			id="fm_iso_clip_1521310911"
			class="flashmovie"
			width="300"
			height="300">
	<param name="movie" value="/flash/iso_clip.swf" />
	<!--[if !IE]>-->
	<object	type="application/x-shockwave-flash"
			data="/flash/iso_clip.swf"
			name="fm_iso_clip_1521310911"
			width="300"
			height="300">
	<!--<![endif]-->
		
	<!--[if !IE]>-->
	</object>
	<!--<![endif]-->
</object><br />
Алгоритм построения прост:</p>
<ol>
<li>Создать общий контейнер для всей фигуры;</li>
<li>Создать в нем N  пустых контейнеров(N=_totalframes клипа, составляющего фигуру) с _yscale = 75 (варируется) ;</li>
<li>В пустой контейнер N аттачится клип-фигура и останавливается на кадре N+1;</li>
</ol>
<p>А вот собственно совершенно простой код:</p>

<div class="wp_syntax"><div class="code"><pre class="actionscript" style="font-family:monospace;"><span style="color: #808080; font-style: italic;">// на сцену нужно в нужном месте положить клип под именем holder</span>
<span style="color: #000000; font-weight: bold;">var</span> distance:<span style="color: #0066CC;">Number</span> = <span style="color: #cc66cc;">1</span>; <span style="color: #808080; font-style: italic;">// дистанция между &quot;кусками&quot;</span>
<span style="color: #000000; font-weight: bold;">var</span> speed:<span style="color: #0066CC;">Number</span> = <span style="color: #cc66cc;">5</span>; <span style="color: #808080; font-style: italic;">// скорость вращения</span>
<span style="color: #000000; font-weight: bold;">var</span> scaleFactor:<span style="color: #0066CC;">Number</span> = <span style="color: #cc66cc;">75</span>; <span style="color: #808080; font-style: italic;">// масштабирование по Y</span>
&nbsp;
<span style="color: #000000; font-weight: bold;">var</span> slices:<span style="color: #0066CC;">Number</span>; <span style="color: #808080; font-style: italic;">//  количество кусков (определим позже)</span>
&nbsp;
<span style="color: #808080; font-style: italic;">// функция, создает контейнер для куска, и вставляет в него</span>
<span style="color: #808080; font-style: italic;">// клип-фигуру с установкой нужного кадра.</span>
<span style="color: #808080; font-style: italic;">// n = порядковый номер куска</span>
<span style="color: #000000; font-weight: bold;">function</span> attachSlice<span style="color: #66cc66;">&#40;</span>n:<span style="color: #0066CC;">Number</span><span style="color: #66cc66;">&#41;</span>:<span style="color: #0066CC;">Void</span>
<span style="color: #66cc66;">&#123;</span>
     <span style="color: #000000; font-weight: bold;">var</span> <span style="color: #0066CC;">slice</span>:<span style="color: #0066CC;">MovieClip</span> = holder.<span style="color: #0066CC;">createEmptyMovieClip</span><span style="color: #66cc66;">&#40;</span><span style="color: #ff0000;">&quot;slice&quot;</span>+n,n<span style="color: #66cc66;">&#41;</span>;
     <span style="color: #808080; font-style: italic;">// в библиотеке символ, из которого делим фигуру снабдить linkage=sculpture</span>
     <span style="color: #0066CC;">slice</span>.<span style="color: #0066CC;">attachMovie</span><span style="color: #66cc66;">&#40;</span><span style="color: #ff0000;">&quot;sculpture&quot;</span>,<span style="color: #ff0000;">&quot;gfx&quot;</span>,<span style="color: #cc66cc;">0</span><span style="color: #66cc66;">&#41;</span>;
     <span style="color: #0066CC;">slice</span>.<span style="color: #006600;">gfx</span>.<span style="color: #0066CC;">gotoAndStop</span><span style="color: #66cc66;">&#40;</span>n+<span style="color: #cc66cc;">1</span><span style="color: #66cc66;">&#41;</span>;
     <span style="color: #0066CC;">slice</span>.<span style="color: #0066CC;">_yscale</span> = scaleFactor;
     <span style="color: #0066CC;">slice</span>.<span style="color: #0066CC;">_y</span> = -n<span style="color: #66cc66;">*</span>distance;
<span style="color: #66cc66;">&#125;</span>
&nbsp;
<span style="color: #808080; font-style: italic;">// В начале, создадим первый кусок (дно) и заодно узнаем,</span>
<span style="color: #808080; font-style: italic;">// сколько в нем кадров, чтобы установить значение slices</span>
attachSlice<span style="color: #66cc66;">&#40;</span><span style="color: #cc66cc;">0</span><span style="color: #66cc66;">&#41;</span>;
slices = holder.<span style="color: #006600;">slice0</span>.<span style="color: #006600;">gfx</span>.<span style="color: #0066CC;">_totalframes</span>;
&nbsp;
<span style="color: #808080; font-style: italic;">// выкладываем все остальные куски</span>
     <span style="color: #b1b100;">for</span><span style="color: #66cc66;">&#40;</span><span style="color: #000000; font-weight: bold;">var</span> i=<span style="color: #cc66cc;">1</span>; i <span style="color: #66cc66;">&lt;</span> slices; i++<span style="color: #66cc66;">&#41;</span>
<span style="color: #66cc66;">&#123;</span>
attachSlice<span style="color: #66cc66;">&#40;</span>i<span style="color: #66cc66;">&#41;</span>;
<span style="color: #66cc66;">&#125;</span>
&nbsp;
<span style="color: #808080; font-style: italic;">// вращение фигуры</span>
<span style="color: #808080; font-style: italic;">// (тут можно определить и другое поведение - вращение от клавиатуры, мыши и т.д.)</span>
holder.<span style="color: #0066CC;">onEnterFrame</span> = <span style="color: #000000; font-weight: bold;">function</span><span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>:<span style="color: #0066CC;">Void</span>
<span style="color: #66cc66;">&#123;</span>
     <span style="color: #b1b100;">for</span><span style="color: #66cc66;">&#40;</span><span style="color: #000000; font-weight: bold;">var</span> i=<span style="color: #cc66cc;">0</span>; i <span style="color: #66cc66;">&lt;</span> slices; i++<span style="color: #66cc66;">&#41;</span>
     <span style="color: #66cc66;">&#123;</span>
          <span style="color: #0066CC;">this</span><span style="color: #66cc66;">&#91;</span><span style="color: #ff0000;">&quot;slice&quot;</span>+i<span style="color: #66cc66;">&#93;</span>.<span style="color: #006600;">gfx</span>.<span style="color: #0066CC;">_rotation</span> += speed;
     <span style="color: #66cc66;">&#125;</span>
<span style="color: #66cc66;">&#125;</span></pre></div></div>

<p>Можно получить вполне грациозную табуретку</p>

<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"
			id="fm_iso_taburet_2042193149"
			class="flashmovie"
			width="300"
			height="300">
	<param name="movie" value="/flash/iso_taburet.swf" />
	<!--[if !IE]>-->
	<object	type="application/x-shockwave-flash"
			data="/flash/iso_taburet.swf"
			name="fm_iso_taburet_2042193149"
			width="300"
			height="300">
	<!--<![endif]-->
		
	<!--[if !IE]>-->
	</object>
	<!--<![endif]-->
</object>
<p>Или вот такое подобие сканирования человека ))</p>

<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"
			id="fm_iso_man_1148795605"
			class="flashmovie"
			width="300"
			height="300">
	<param name="movie" value="/flash/iso_man.swf" />
	<!--[if !IE]>-->
	<object	type="application/x-shockwave-flash"
			data="/flash/iso_man.swf"
			name="fm_iso_man_1148795605"
			width="300"
			height="300">
	<!--<![endif]-->
		
	<!--[if !IE]>-->
	</object>
	<!--<![endif]-->
</object>
<img src="http://murejib.com/?ak_action=api_record_view&id=46&type=feed" alt="" />]]></content:encoded>
			<wfw:commentRss>http://murejib.com/2008/05/15/pseudoiso/feed/</wfw:commentRss>
		<slash:comments>5</slash:comments>
		</item>
		<item>
		<title>Имитируем Blend Path.</title>
		<link>http://murejib.com/2008/04/29/blend-path/</link>
		<comments>http://murejib.com/2008/04/29/blend-path/#comments</comments>
		<pubDate>Tue, 29 Apr 2008 08:57:51 +0000</pubDate>
		<dc:creator>murejib</dc:creator>
				<category><![CDATA[draw]]></category>
		<category><![CDATA[fx]]></category>
		<category><![CDATA[Полезное]]></category>
		<category><![CDATA[drawing]]></category>
		<category><![CDATA[Flash]]></category>

		<guid isPermaLink="false">http://murejib.com/?p=51</guid>
		<description><![CDATA[Набор графических инструментов Flash скуден, как небезосновательно считает огромное число дизайнеров, привыкших к Corel, Illustrator и FireWorks. Да скуден. Но нам дан таймлайн и мозг. Сегодня мы сымитируем известный эффект (даже не знаю как он правильно называется)) Вот такой. Все это нарисовано исключительно на flash. Никаких импортов и копипейстов. Ни один редактор векторной графики, кроме [...]]]></description>
			<content:encoded><![CDATA[<p>Набор графических инструментов Flash скуден, как небезосновательно считает огромное число дизайнеров, привыкших к Corel, Illustrator и FireWorks.<br />
Да скуден. Но нам дан таймлайн и мозг. Сегодня мы сымитируем известный эффект (даже не знаю как он правильно называется)) Вот такой.</p>
<p><img src="/images/blendpath/result.jpg" border="0" alt="" /></p>
<p>Все это нарисовано исключительно на flash. Никаких импортов и копипейстов. Ни один редактор векторной  графики, кроме Flash, использован не был.</p>
<p><span id="more-45"></span><br />
1. Рисуем кривую с помощью <strong>PenTool </strong>(P).Рисуем аккуратно, чтобы не было ни одной лишней опорной точки.</p>
<p>2. Ставим ключевой кадр (в моем примере 20) и задаем между первым и последним Shape Tween (можно с easing для пущего эффекта).<br />
<img src="/images/blendpath/stage1.gif" border="1" alt="" hspace="3" vspace="3" /></p>
<p>3. Включаем режим OnionSkinOutlines, выделяем все 20 кадров и переходим на 20 кадр. Выбираем <strong>Subselection Tool </strong>(A) и начинаем двигать наши опорные точки. Преимущество метода на лицо &#8211; редактируя положение точек мы сразу видим конечный результат &#8211; это очень удобно. Если где то что то перекутили не так &#8211; сразу видно, что шейптвин сбивается.</p>
<p><img src="/images/blendpath/stage2.gif" border="1" alt="" hspace="3" vspace="3" /><br />
4. Теперь Разбиваем анимацию на ключевые кадры. Включаем режим <strong>EditMultipleFrame</strong>, вырезаем всю графику (сначала выделить все <em>control+A</em>, потом вырезать <em>cоntrоl+X</em>), удаляем кадры анимации и вставляем вырезанное на место.<br />
<img src="/images/blendpath/stage3.gif" border="1" alt="" hspace="3" vspace="3" /><br />
Можно было, кстати, к шейпу формы применить и шейп цвета. Но мы раскрасим нашу абстракцию по другому.</p>
<p>5. Положите под кривые полностью прозрачный прямоугольник и сконвертируйте все это в MovieClip. На  панели PropertyInspector назначьте BlendMode = alpha.</p>
<p>6. Нарисуйте прямоугольник с потрясающей воображение градиентной заливкой и также сконвертируйте ее в MovieClip, но положите этот клип под клип с линиями.</p>
<p>7. Теперь выделите оба клипа &#8211; и снова &#8211; в муви клип. Этому мувиклипу задайте режим blend Mode = Layer (или любой другой режим, если хотите. В самой первой картинке статьи, к примеру, использован Add).<br />
<img src="/images/blendpath/rainbow.jpg" alt="" hspace="3" vspace="3" width="311" height="206" /><br />
8. Вернувшись на сцену вы увидите  результат. Осталось навести под этой красотой тематический восторг и вы &#8211; народный умелец, доказавший, что классические дизайнерские абстракции можно с легкостью творить и в Flash IDE.</p>
<img src="http://murejib.com/?ak_action=api_record_view&id=45&type=feed" alt="" />]]></content:encoded>
			<wfw:commentRss>http://murejib.com/2008/04/29/blend-path/feed/</wfw:commentRss>
		<slash:comments>4</slash:comments>
		</item>
		<item>
		<title>Баннер, хочешь похудеть? Спроси меня &#8211; как.</title>
		<link>http://murejib.com/2008/04/28/banner_optimised/</link>
		<comments>http://murejib.com/2008/04/28/banner_optimised/#comments</comments>
		<pubDate>Mon, 28 Apr 2008 14:15:10 +0000</pubDate>
		<dc:creator>murejib</dc:creator>
				<category><![CDATA[ActionScript]]></category>
		<category><![CDATA[fx]]></category>
		<category><![CDATA[анимация]]></category>
		<category><![CDATA[Полезное]]></category>
		<category><![CDATA[animation]]></category>
		<category><![CDATA[Flash]]></category>

		<guid isPermaLink="false">http://murejib.com/?p=50</guid>
		<description><![CDATA[В баннеростроении есть особая прелесть — оптимизация. Для меня эта задача сродни с хорошей логической игрушкой. Сегодня в очередной раз меня спросили об изготовлении баннеров, — редкий случай, когда заказчик интересуется заранее &#8211; а разве вообще можно в такие размеры вписать что то приемлемое. Низкий поклон и моя благодарность. Такой интерес &#8211; это редкость. Написал [...]]]></description>
			<content:encoded><![CDATA[<p>В баннеростроении есть особая  прелесть — оптимизация. Для меня эта задача сродни с хорошей логической игрушкой.<br />
Сегодня в очередной раз меня спросили об изготовлении баннеров, — редкий случай, когда заказчик интересуется заранее &#8211; а разве вообще можно в такие размеры вписать что то приемлемое. Низкий поклон и моя благодарность. Такой интерес &#8211; это редкость.</p>
<p>Написал в ответ письмо, и подумал &#8211; хорошо бы это письмо прочитало как можно большее количество заказчиков.<br />
Поэтому, публикую свои мысли о баннерах.</p>
<p><span id="more-44"></span></p>
<p><a href="http://ru.wikipedia.org/wiki/%D0%91%D0%B0%D0%BD%D0%BD%D0%B5%D1%80">Баннер</a> &#8211; особый жанр. Его основа &#8211; лаконичность и эффектность (с посылом в эффективность) И горе флеш-разработчику, если о лаконичности не позаботилась ни креативная команда, ни дизайнер. Зачастую заказчик не знает, да и не должен знать с какими трудностями и ограничениями приходится сталкиваться, ему нужен результат. Но задача исполнителя проекта (креативная кманда/дизайнер/менеджер/флешер в конце концов) &#8211; зная подводные камни предложить заказчику такое решение задачи, при котором все будут довольны &#8211; будет красиво  блестеть и прыгать, продажи клиента вырастут до небесных чертогов, а количество матерных слов сказанных флеш-разрабочиком сведется к нулю.</p>
<p>Из чего состоит флеш-баннер? Из картинок и буковок. И все это движется и меняет свои размеры и цвет.<br />
Исходя из этих нехитрых нужд выводим основных потребителей драгоценных килобайт:</p>
<ol>
<li><strong>Растры. </strong><br />
Не стоит думать, что если растр большой (я имею в виду геометрические размеры &#8211; ширину и высоту), то он заранее плох для баннера. Конечно это важно, но не стоит и забывать о том, что сложный растр, с большим количеством мелких деталей также опасен непомерным весом. А при оптимизации (компрессии) эти детали все равно теряются или искажаются до безобразия. Лично я не люблю жестко скомпрессированый грязный растр. Он портит картинку, дешевит ее. Растр должен присутствовать в разумных количествах.  Логично  использовать небольшие растры  в тех местах, где нельзя обойтись  вектором, или когда аналогичный вектор весит больше растра.<br />
<em>ХИТРОСТИ ДЛЯ РАЗРАБОТЧИКОВ: </em><br />
- для облаков можно использовать небольшие растры, увеличивать их в баннере (облако все равно расплывчатое, лишний блюр не повредит), и можно компрессировать такой растр достаточно жестко (вплоть до 15 &#8211; 20%) после чего не забыть на клип с таким облаком повесить эффект brightness = 100. Все погрешности компрессии скроются и мы получим милое растровое облако при минимуме веса <img src='http://murejib.com/wp-includes/images/smilies/icon_smile.gif' alt=':)' class='wp-smiley' /><br />
- если какой-то большой кусок растра кадрируется (обрезается) и при любых движениях никогда целиком не входит в кадр &#8211; смело режьте те участки, которых никогда не будет видно. Нам не нужны лишние килобайты, не участвующие в процессе.</li>
<li><strong>Векторные картинки.<br />
</strong> Они тоже имеют свой вес &#8211; каждая ключевая точка &#8211;  плюс к общему весу.  Кривая весит больше прямой &#8211; обычная математика. Для описания одного отрезка используется две точки, для описания одной кривой &#8211; три, как минимум. Сложный,  неоптимизированый вектор часто бывает даже  тяжелее растра. Учитывая рендер флешовой картинки некоторые мелкие  детали стоит сразу исключать или упрощать, ибо они все равно будут  смазаны, вес увеличится, а красоты и гармонии не прибавит. Если борьба с весом идет не на жизнь, а на смерть — в ход идет все, убираем все лишние опорные точки, где можно меняем кривые на прямые, участки близкие по цвету упрощаем или вообще объединяем, градиенты сбрасываем на свалку истории. Не забывайте, зачастую картинка находится в кадре очень мало, и на мелкие детали зритель просто не успевает обратить внимание.<br />
Вот перед вами весы. Слева &#8211; красивые, детально отрисованные &#8211; их вес 4 килобайта. Справа &#8211; давайте без придирок, ни чуть не хуже. Немного не такие, но не хуже. 1,8 килобайт.<br />

<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"
			id="fm_banners_2139713234"
			class="flashmovie"
			width="400"
			height="400">
	<param name="movie" value="/flash/banners/banners.swf" />
	<!--[if !IE]>-->
	<object	type="application/x-shockwave-flash"
			data="/flash/banners/banners.swf"
			name="fm_banners_2139713234"
			width="400"
			height="400">
	<!--<![endif]-->
		
	<!--[if !IE]>-->
	</object>
	<!--<![endif]-->
</object><br />
Теперь прокликайте по сцене и сравните их в увеличенном состоянии. Ужасающее зрелище. Но во время ролика, эти весы присутствуют на сцене менее секунды, при этом треть времени фейдятся из белого. И зачем мне более 2-х лишних килобайт когда лимит &#8211; 15?<br />
<em>ХИТРОСТИ ДЛЯ РАЗРАБОТЧИКОВ<br />
-</em> Используйте символы. Два одинаковых рисунка отнимут больше килобайт, чем два символа.</li>
<li><strong>Тексты.<br />
</strong>Тексты бывают сглаженные и не сглаженные. С последними очень просто иметь дело &#8211; с ними ничего нельзя сделать, да и не нужно. Весь вес уходит только на строку, которую вы пишете. Сглаженные шрифты требуют внедрения глифов (это, кто не в курсе &#8211; векторное изображение буквы). К счастью, внедряются не все буквы по отдельности, а только те, которые участвуют в ролике. Для слова МАМА нужно всего два глифа. Конечно, если вы создали динамическое поле и внедрили в него все буквы русского алфавита, то тут уже сами виноваты. Для слова МАМА весь алфавит и не нужен.<br />
<em>ХИТРОСТИ ДЛЯ РАЗРАБОТЧИКОВ:</em><br />
- Если уже совсем невмоготу и вы не знаете откуда брать эти несчастные десятые килобайта &#8211; вспомните, что некоторые латинские буквы равны русским.<br />
- В некоторых случаях помогает  злобный ход. Допустим тексты использованы в графике как элемент. Причем элемент достаточно мелкий. Такой, что в общем то детально буквы нельзя разобрать. Я в этих случаях выбираю три четыре буквы, которые наиболее обобщенно представляют весь алфавит и заменяю ими текст. Белиберда получается страшная, но в итоге этого никто не видит.<br />
Вот посмотрите. Страница слева весит 5.8 кб, справа 3.1 кб<br />

<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"
			id="fm_banners_text_1948198165"
			class="flashmovie"
			width="400"
			height="400">
	<param name="movie" value="/flash/banners/banners_text.swf" />
	<!--[if !IE]>-->
	<object	type="application/x-shockwave-flash"
			data="/flash/banners/banners_text.swf"
			name="fm_banners_text_1948198165"
			width="400"
			height="400">
	<!--<![endif]-->
		
	<!--[if !IE]>-->
	</object>
	<!--<![endif]-->
</object></li>
<li><strong>Анимация.<br />
</strong>Основные пожиратели драгоценных килобайт &#8230;. ключевые кадры и твины. Парадоксально, но именно с удаления лишних твинов и ключевых кадров нужно  начинать оптимизацию. Почему? Потому что это результат труда флеш-разработчика, о котором никто не знает и не должен знать &#8211; мы видим анимацию а не количество кадров. И именно ляпы с лишними кадрами могут отнять драгоценные пару килобайт от качества картинки, кропотливо созданной дизайнером.<br />
За годы борьбы с баннерами я разработал тактику максимального уменьшения  веса анимации и эта тактика &#8211; программная анимация. В самом страшном случае, можно свалить все символы на сцену и завести всего два слоя &#8211; для графики &#8211; один большой кадр, и для кода, на ключевых кадрах которого мы и будет прописывать когда показать или спрятать, и куда привести клип. Конечно это затрудняет разработку, но увы &#8211; таковы правила игры &#8211; баннер должен вписаться в лимиты размеров.<br />
Более того. Сейчас я сдам вам нехитрый кусок кода, на котором я строю все свои баннеры. Он, конечно, неоптимален. В нем не реализованы анимации цвета (пока было без надобности), но это работает и спасает мне килобайты. Если вам по душе такая идея &#8211; модифицируйте скрипт, пишите свой собственный &#8211; боритесь за свои килобайты !!! </p>

<div class="wp_syntax"><div class="code"><pre class="actionscript" style="font-family:monospace;"><span style="color: #808080; font-style: italic;">//всего три функции для анимации.</span>
<span style="color: #808080; font-style: italic;">// animate - линейное движение от знаения к значению</span>
<span style="color: #808080; font-style: italic;">// easeOut - плавное прибытие в точку</span>
<span style="color: #808080; font-style: italic;">// easeIn - плавный уход со сцены</span>
<span style="color: #808080; font-style: italic;">// испольование:</span>
<span style="color: #808080; font-style: italic;">// Перед тем как применить одну из функций к клипу,</span>
<span style="color: #808080; font-style: italic;">// создается соответсвующий объект, в котором указывается</span>
<span style="color: #808080; font-style: italic;">// какие свойства клипа надо анимировать -</span>
<span style="color: #808080; font-style: italic;">// альфу, _x или _y, _xscale и т.д</span>
<span style="color: #808080; font-style: italic;">// animate. Пример использования</span>
<span style="color: #808080; font-style: italic;">//анимация _x с шагом 0.3</span>
<span style="color: #808080; font-style: italic;">// анимация _alpha с шагом 1</span>
<span style="color: #808080; font-style: italic;">// mc.animate = {_x:0.3,_alpha:1};</span>
<span style="color: #808080; font-style: italic;">// animate(mc);</span>
&nbsp;
<span style="color: #000000; font-weight: bold;">function</span> animate<span style="color: #66cc66;">&#40;</span>mc<span style="color: #66cc66;">&#41;</span>
<span style="color: #66cc66;">&#123;</span>
	mc.<span style="color: #0066CC;">onEnterFrame</span> = <span style="color: #000000; font-weight: bold;">function</span> <span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>
	<span style="color: #66cc66;">&#123;</span>
		<span style="color: #b1b100;">if</span><span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">!</span>_paused<span style="color: #66cc66;">&#41;</span>
		<span style="color: #66cc66;">&#123;</span>
			<span style="color: #b1b100;">for</span> <span style="color: #66cc66;">&#40;</span><span style="color: #000000; font-weight: bold;">var</span> props <span style="color: #b1b100;">in</span> <span style="color: #0066CC;">this</span>.<span style="color: #006600;">animate</span><span style="color: #66cc66;">&#41;</span>
			<span style="color: #66cc66;">&#123;</span>
				<span style="color: #0066CC;">this</span><span style="color: #66cc66;">&#91;</span>props<span style="color: #66cc66;">&#93;</span> += <span style="color: #0066CC;">this</span>.<span style="color: #006600;">animate</span><span style="color: #66cc66;">&#91;</span>props<span style="color: #66cc66;">&#93;</span>;
			<span style="color: #66cc66;">&#125;</span>
		<span style="color: #66cc66;">&#125;</span>
	<span style="color: #66cc66;">&#125;</span>
<span style="color: #66cc66;">&#125;</span>
&nbsp;
<span style="color: #808080; font-style: italic;">// обычно используется для того чтобы клип плавно</span>
<span style="color: #808080; font-style: italic;">// приехал в нужную точку. Начально положение задается</span>
<span style="color: #808080; font-style: italic;">// или скриптом, или в среде разработки - куда положим</span>
<span style="color: #808080; font-style: italic;">// оттуда и приедет.</span>
<span style="color: #808080; font-style: italic;">//mc.easeout = {_x: 20,_y:20};</span>
<span style="color: #808080; font-style: italic;">//easeOut(mc);</span>
&nbsp;
easeOut<span style="color: #66cc66;">&#40;</span>prize0<span style="color: #66cc66;">&#41;</span>;
&nbsp;
<span style="color: #000000; font-weight: bold;">function</span> easeOut<span style="color: #66cc66;">&#40;</span>mc<span style="color: #66cc66;">&#41;</span>
<span style="color: #66cc66;">&#123;</span>
	mc.<span style="color: #0066CC;">onEnterFrame</span> = <span style="color: #000000; font-weight: bold;">function</span> <span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>
	<span style="color: #66cc66;">&#123;</span>
		<span style="color: #b1b100;">if</span><span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">!</span>_paused<span style="color: #66cc66;">&#41;</span>
		<span style="color: #66cc66;">&#123;</span>
			<span style="color: #b1b100;">for</span> <span style="color: #66cc66;">&#40;</span><span style="color: #000000; font-weight: bold;">var</span> props <span style="color: #b1b100;">in</span> <span style="color: #0066CC;">this</span>.<span style="color: #006600;">easeout</span><span style="color: #66cc66;">&#41;</span>
			<span style="color: #66cc66;">&#123;</span>
				<span style="color: #000000; font-weight: bold;">var</span> delta = <span style="color: #0066CC;">this</span>.<span style="color: #006600;">easeout</span><span style="color: #66cc66;">&#91;</span>props<span style="color: #66cc66;">&#93;</span> - <span style="color: #0066CC;">this</span><span style="color: #66cc66;">&#91;</span>props<span style="color: #66cc66;">&#93;</span>;
&nbsp;
				<span style="color: #0066CC;">this</span><span style="color: #66cc66;">&#91;</span>props<span style="color: #66cc66;">&#93;</span> += delta<span style="color: #66cc66;">/</span><span style="color: #cc66cc;">3</span>;<span style="color: #808080; font-style: italic;">// 3 - скорость передвижения</span>
			<span style="color: #66cc66;">&#125;</span>
		<span style="color: #66cc66;">&#125;</span>
	<span style="color: #66cc66;">&#125;</span>
<span style="color: #66cc66;">&#125;</span>
&nbsp;
<span style="color: #808080; font-style: italic;">//эту функцию я использую чтобы плавно выкинуть клип со сцены</span>
<span style="color: #808080; font-style: italic;">// поэтому обекту easein я передаю начальный шаг,</span>
<span style="color: #808080; font-style: italic;">// а не конечную точку.</span>
<span style="color: #808080; font-style: italic;">// с каждым кадром шаг перемножается на 2, что дает</span>
<span style="color: #808080; font-style: italic;">// прирост в скорости. Когда значения выходит за рамки</span>
<span style="color: #808080; font-style: italic;">// -3000 3000, анимация останавливается.</span>
<span style="color: #808080; font-style: italic;">// ПРИМЕР:</span>
<span style="color: #808080; font-style: italic;">// mc.easein = {_x:0.5,_alpha:-1};</span>
<span style="color: #808080; font-style: italic;">// easeIn(mc);</span>
<span style="color: #000000; font-weight: bold;">function</span> easeIn<span style="color: #66cc66;">&#40;</span>mc<span style="color: #66cc66;">&#41;</span>
<span style="color: #66cc66;">&#123;</span>
&nbsp;
	mc.<span style="color: #0066CC;">onEnterFrame</span> = <span style="color: #000000; font-weight: bold;">function</span> <span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>
	<span style="color: #66cc66;">&#123;</span>
		<span style="color: #b1b100;">if</span><span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">!</span>_paused<span style="color: #66cc66;">&#41;</span>
		<span style="color: #66cc66;">&#123;</span>
			<span style="color: #b1b100;">for</span> <span style="color: #66cc66;">&#40;</span><span style="color: #000000; font-weight: bold;">var</span> props <span style="color: #b1b100;">in</span> <span style="color: #0066CC;">this</span>.<span style="color: #006600;">easein</span><span style="color: #66cc66;">&#41;</span>
			<span style="color: #66cc66;">&#123;</span>
&nbsp;
				<span style="color: #0066CC;">this</span><span style="color: #66cc66;">&#91;</span>props<span style="color: #66cc66;">&#93;</span> += <span style="color: #0066CC;">this</span>.<span style="color: #006600;">easein</span><span style="color: #66cc66;">&#91;</span>props<span style="color: #66cc66;">&#93;</span>;
				<span style="color: #0066CC;">this</span>.<span style="color: #006600;">easein</span><span style="color: #66cc66;">&#91;</span>props<span style="color: #66cc66;">&#93;</span> <span style="color: #66cc66;">*</span>= <span style="color: #cc66cc;">2</span>;
				<span style="color: #b1b100;">if</span><span style="color: #66cc66;">&#40;</span><span style="color: #0066CC;">Math</span>.<span style="color: #0066CC;">abs</span><span style="color: #66cc66;">&#40;</span><span style="color: #0066CC;">this</span><span style="color: #66cc66;">&#91;</span>props<span style="color: #66cc66;">&#93;</span><span style="color: #66cc66;">&#41;</span><span style="color: #66cc66;">&amp;</span>gt;<span style="color: #cc66cc;">3000</span><span style="color: #66cc66;">&#41;</span> <span style="color: #0066CC;">this</span>.<span style="color: #006600;">easein</span><span style="color: #66cc66;">&#91;</span>props<span style="color: #66cc66;">&#93;</span> = <span style="color: #cc66cc;">0</span>;
			<span style="color: #66cc66;">&#125;</span>
		<span style="color: #66cc66;">&#125;</span>
	<span style="color: #66cc66;">&#125;</span>
<span style="color: #66cc66;">&#125;</span>
&nbsp;
<span style="color: #808080; font-style: italic;">//// А ВОТ ТУТ ВНИМАНИЕ!</span>
<span style="color: #808080; font-style: italic;">// Существет плавило, по которому пользователь имеет право</span>
<span style="color: #808080; font-style: italic;">// остановить баннер кликнув на stop в контекстном меню.</span>
<span style="color: #808080; font-style: italic;">// Чтобы наша программная анимация соображала когда ее</span>
<span style="color: #808080; font-style: italic;">// остановили - существует постоянная проверка на равенство</span>
<span style="color: #808080; font-style: italic;">// текущего кадра предидущему.</span>
<span style="color: #000000; font-weight: bold;">var</span> _paused = <span style="color: #000000; font-weight: bold;">false</span>;
<span style="color: #000000; font-weight: bold;">var</span> cf;
<span style="color: #0066CC;">onEnterFrame</span> = <span style="color: #000000; font-weight: bold;">function</span><span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span>
<span style="color: #66cc66;">&#123;</span>
	<span style="color: #b1b100;">if</span><span style="color: #66cc66;">&#40;</span><span style="color: #0066CC;">_currentframe</span> == cf<span style="color: #66cc66;">&#41;</span> _paused = <span style="color: #000000; font-weight: bold;">true</span>; <span style="color: #b1b100;">else</span> _paused= <span style="color: #000000; font-weight: bold;">false</span>;
&nbsp;
	cf = <span style="color: #0066CC;">_currentframe</span>;
<span style="color: #66cc66;">&#125;</span></pre></div></div>

</li>
</ol>
<p>Вот пожалуй и все, что я пока хотел сказать о баннерах.<br />
Если вам известны какие-то хитрости и способы по борьбе с лишним весом &#8211; комментируйте, делитесь )))</p>
<img src="http://murejib.com/?ak_action=api_record_view&id=44&type=feed" alt="" />]]></content:encoded>
			<wfw:commentRss>http://murejib.com/2008/04/28/banner_optimised/feed/</wfw:commentRss>
		<slash:comments>9</slash:comments>
		</item>
		<item>
		<title>Blend Modes.</title>
		<link>http://murejib.com/2008/04/25/blend-modes/</link>
		<comments>http://murejib.com/2008/04/25/blend-modes/#comments</comments>
		<pubDate>Fri, 25 Apr 2008 11:06:15 +0000</pubDate>
		<dc:creator>murejib</dc:creator>
				<category><![CDATA[ActionScript]]></category>
		<category><![CDATA[fx]]></category>
		<category><![CDATA[Полезное]]></category>
		<category><![CDATA[NB]]></category>

		<guid isPermaLink="false">http://murejib.com/?p=49</guid>
		<description><![CDATA[Давно хотел написать небольшую статейку по режимам наложения (blend modes), но некий пробел в знании вопроса останавливал меня. Сегодня я наконец узнал, как использовать режимы alpha, layer и erase, поэтому срочно выкладываю всю пачку знаний по вопросу режимы наложения. Итак. Что это такое? Для тех кто не в курсе &#8211; в восьмой версии флеш плеера [...]]]></description>
			<content:encoded><![CDATA[<p>Давно хотел написать небольшую статейку по режимам наложения (blend modes), но некий пробел в знании вопроса останавливал меня. Сегодня я наконец узнал, как использовать режимы alpha, layer и erase, поэтому срочно выкладываю всю пачку знаний по вопросу <strong>режимы наложения.</strong></p>
<p><span id="more-43"></span> Итак. Что это такое? Для тех кто не в курсе &#8211; в восьмой версии флеш плеера к обычному наложению клипов по альфа каналу добавилось несколько режимов (как в фотошопе). Говоря проще &#8211; режим наложения &#8211; это правило:  как пиксели верхнего изображения будут накладываться на пиксели нижнего изображения. Что мы имели раньше. Если <font color="#008000">зеленый</font> квадрат перекрыть <font color="#ff0000">красным</font> квадратом &#8211; то мы видим <font color="#ff0000">красный</font> квадрат. Если последнему задать альфа=50, мы увидим  квадрат цвета, напоминающего <font color="#808000">переспелую оливку на фоне стираного солдатского кителя</font> — это сквозь <font color="#ff0000">красный</font> квадрат просвечивет <font color="#008000">зеленый.</font></p>
<p>Теперь есть несколько новых правил.<br />
У MovieClip появилось новое свойство &#8211; blendMode, достаточно просто присвоить одно из допустимых значений &#8211; и  результат на лицо (Так же эти режимы можно задавать через Property Inspector в среде разработки). Однако не все так просто. Некоторые режимы очевидны (по крайней мере для тех, кто знаком с photoshop), а некоторые (layer, alpha, erase) весьма загадочны. А разгадка проста &#8211; последние три режима имеет смысл использовать только в комплексе. Если вам неитересно знать, как устроены эти режимы &#8211; крутите вниз &#8211; там есть флешка, где можно все потрогать руками. Если небольшая теоретическая часть вас не пугает &#8211; читайте дальше. Глубоко в математику вдаваться не буду, зачастую этого знать и не нужно.</p>
<p>Итак, по порядку.  Простые режимы. Для удобства пиксель верхнего изображения  обозначим <font color="#ff0000"><strong>В</strong></font>, нижнего &#8211; <font color="#0000ff"><strong>Н</strong></font>.</p>
<ul>
<li><em><strong>normal </strong>-</em>как следует из названия &#8211; обычный режим наложения. <font color="#ff0000"><strong>В</strong></font>  перекрывает <font color="#0000ff"><strong>Н</strong></font>.</li>
</ul>
<ul>
<li><em><strong>multiply  </strong>-</em> математика такая: Каждая составляющая <font color="#ff0000">RR</font><font color="#008000">GG</font><font color="#0000ff">BB</font> <font color="#ff0000"><strong>B</strong></font> умножается на соответсвующую составляющую <font color="#0000ff"><strong>Н</strong></font>, затем нормализуется  делением  на OxFF (<font color="#ff0000">RR<strong>B</strong></font> *<font color="#ff0000"> RR</font><strong><font color="#0000ff">H</font> / </strong>OxFF, <font color="#008000">GG</font><strong><font color="#ff0000">В</font> </strong> * <font color="#008000">GG</font><strong><font color="#0000ff">Н</font> </strong><strong>/ </strong>OxFF, <font color="#0000ff">BB</font><font color="#ff0000"><strong>B</strong></font> * <font color="#0000ff">BB</font><strong><font color="#0000ff">H</font> / </strong>OxFF). При этом режиме изображение всегда получается темнее, поэтому используется в основном для затемнений.</li>
<li><em><strong>screen </strong>- </em>Для этого режима берутся инверсные цвета пикселей <font color="#ff0000"><strong>В</strong></font> и <font color="#0000ff"><strong>Н</strong></font>, и затем перемножаются.  Режим используется для высветления.</li>
<li><em><strong>lighten </strong>- </em>При этом режиме сопоставляются составляющие <font color="#ff0000">RR</font><font color="#008000">GG</font><font color="#0000ff">BB</font> и выбирается та, значение которой больше. То есть: <font color="#ff0000">newR</font> = Math.max(<font color="#ff0000">RR<strong>B</strong></font>,<font color="#ff0000">RR</font><font color="#0000ff"><strong>H</strong></font>),<font color="#008000"> newG</font> = Math.max(<font color="#008000">GG</font><font color="#ff0000"><strong>B</strong></font>,<font color="#008000">GG</font><font color="#0000ff"><strong>H</strong></font>), <font color="#0000ff">newB</font> = Math.max(<font color="#0000ff">BB</font><font color="#ff0000"><strong>B</strong></font>,<font color="#0000ff">BB<strong>H</strong></font>).</li>
<li><strong><em>darken </em></strong>- обратный предидущему &#8211; в результирующий цвет попадают составляющие с меньшим значением.</li>
<li><em><strong>difference </strong>-  </em>Из двух составляющих выбирается большая, и из нее вычитается значение меньшей.</li>
<li><em><strong>add </strong>- </em>поканальное сложение, с потолком в OxFF для каждой составляющей.</li>
<li><em><strong>subtract </strong>- </em>Поканальное вычитание <font color="#0000ff"><strong>H</strong></font> из <font color="#ff0000"><strong>В</strong></font>, с ограничением до 0, для каждой составляющей.</li>
<li><em><strong>invert </strong>- </em>независимо от цвета <font color="#ff0000"><strong>В</strong></font>  инвертирует цвет <font color="#0000ff"><strong>Н</strong></font>. Если значение альфа канала пикселя<font color="#ff0000"><strong> В</strong></font> меньше 0хFF &#8211; то результрующий пиксель будет иметь то же значение, соответсвенно накладываться на  <font color="#0000ff"><strong>Н</strong></font>  как при обычном альфа наложении.</li>
<li> <em><strong>overlay </strong>-</em> Изменяет цвет в зависимости от  яркости <font color="#0000ff"><strong>Н</strong></font>. Если яркость <font color="#0000ff"><strong>Н</strong></font> больше 50%, к пикселю применяется screen, иначе &#8211; multiply.</li>
<li><strong><em>hardlight</em> </strong><em>-</em> то же, но в основу берется яркость <font color="#ff0000"><strong>В</strong></font>.</li>
</ul>
<p>Теперь о комплексных режимах. Все описанные выше режимы, могут применяться к клипу самостоятельно. Все режимы, описанные ниже, должны применятся так &#8211; клип с комплексным режимом  должен содержаться в клипе, к которому применен режим <strong>layer. </strong>Фактически, этот режим автоматически применяется к клипу, в котором содержиться более одного клипа, и хотя бы к одному из них применен режим, отличный от normal.<strong><br />
</strong></p>
<ul>
<li><strong><em>erase</em> </strong><em>- </em>стирает пиксели <font color="#0000ff"><strong>Н</strong></font> в соответсвии со значением альфа канала <font color="#ff0000"><strong>В</strong></font>.</li>
<li><strong><em>alpha</em> </strong>- заменяет значение альфа канала <font color="#0000ff"><strong>Н</strong></font> значением альфа канала <font color="#ff0000"><strong>В</strong></font>.</li>
</ul>
<p>Если вас глубоко заинтересовала математика каждого из процессов &#8211; почитайте вот эту статью: <a href="http://www.simpelfilter.de/en/grundlagen/mixmods.html">Blend Modes of Photoshop &amp; Co.</a></p>
<p>В следующей флешке также можно понаблюдать работу всех режимов. Большая улитка и радужный градиент содержатся в клипе, к которому применен режим layer. Режимы наложения применяются к клипу с улиткой. маленькая улитка лежит сама по себе, к ней также применяются выбранные режимы.</p>

<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"
			id="fm_blendModes_144650821"
			class="flashmovie"
			width="450"
			height="400">
	<param name="movie" value="/flash/blend/blendModes.swf" />
	<!--[if !IE]>-->
	<object	type="application/x-shockwave-flash"
			data="/flash/blend/blendModes.swf"
			name="fm_blendModes_144650821"
			width="450"
			height="400">
	<!--<![endif]-->
		
	<!--[if !IE]>-->
	</object>
	<!--<![endif]-->
</object>
<img src="http://murejib.com/?ak_action=api_record_view&id=43&type=feed" alt="" />]]></content:encoded>
			<wfw:commentRss>http://murejib.com/2008/04/25/blend-modes/feed/</wfw:commentRss>
		<slash:comments>3</slash:comments>
		</item>
		<item>
		<title>expRandom.</title>
		<link>http://murejib.com/2007/12/12/exprandom/</link>
		<comments>http://murejib.com/2007/12/12/exprandom/#comments</comments>
		<pubDate>Wed, 12 Dec 2007 16:04:15 +0000</pubDate>
		<dc:creator>murejib</dc:creator>
				<category><![CDATA[ActionScript]]></category>
		<category><![CDATA[fx]]></category>
		<category><![CDATA[Math]]></category>

		<guid isPermaLink="false">http://murejib.com/?p=25</guid>
		<description><![CDATA[Иногда бывает нужно, чтобы случайное число с большей вероятностью выпадало ближе к минимальным, или максимальным значениям. Простой пример &#8211; Слот машина. Бонусные символы должны выпадать гораздо реже обычных символов. Существует масса способов реализовать такой рандом, о них, к примеру была речь на форуме flash-mx Вот и мне тут понадобилась такая функция. Некогда мною было написано [...]]]></description>
			<content:encoded><![CDATA[<p>Иногда бывает нужно, чтобы случайное число с большей вероятностью выпадало ближе к минимальным, или максимальным значениям.</p>
<p><span id="more-23"></span></p>
<p>Простой пример &#8211; Слот машина.<br />
Бонусные символы должны выпадать гораздо реже обычных  символов.<br />
Существует масса способов реализовать такой рандом, о них, к примеру была речь на форуме <a href="http://flash-mx.ru/forum/topic_show.pl?tid=223">flash-mx</a></p>
<p>Вот и мне тут понадобилась такая функция.</p>
<p>Некогда мною  было написано некоторое количество игр для казино, все они быи завязаны на сервер, который нынче мертв.  Жалко мне стало игрушек &#8211; красивые были, вот я сейчас и пишу аля-эмулятор сервера со всей логикой игры. Как раз тут вопрос и возник.<br />
Более того мне необходимо, что бы числа возвращались в жестко заданном диапазоне.<br />
Немного мозгового скрипа дало мне вот такую функцию.</p>

<div class="wp_syntax"><table><tr><td class="line_numbers"><pre>1
2
3
4
5
6
</pre></td><td class="code"><pre class="actionscript" style="font-family:monospace;"><span style="color: #000000; font-weight: bold;">function</span> expoRandom<span style="color: #66cc66;">&#40;</span>range:<span style="color: #0066CC;">Number</span>,w:<span style="color: #0066CC;">Number</span><span style="color: #66cc66;">&#41;</span>:<span style="color: #0066CC;">Number</span>
<span style="color: #66cc66;">&#123;</span>
   w = <span style="color: #0066CC;">Math</span>.<span style="color: #0066CC;">max</span><span style="color: #66cc66;">&#40;</span>w,<span style="color: #cc66cc;">1</span><span style="color: #66cc66;">&#41;</span>;
   w = <span style="color: #0066CC;">Math</span>.<span style="color: #0066CC;">min</span><span style="color: #66cc66;">&#40;</span>w,<span style="color: #cc66cc;">709</span><span style="color: #66cc66;">&#41;</span>;
   <span style="color: #b1b100;">return</span> <span style="color: #0066CC;">Math</span>.<span style="color: #0066CC;">log</span><span style="color: #66cc66;">&#40;</span><span style="color: #cc66cc;">1</span>+<span style="color: #0066CC;">Math</span>.<span style="color: #0066CC;">random</span><span style="color: #66cc66;">&#40;</span><span style="color: #66cc66;">&#41;</span><span style="color: #66cc66;">*</span><span style="color: #66cc66;">&#40;</span><span style="color: #0066CC;">Math</span>.<span style="color: #0066CC;">exp</span><span style="color: #66cc66;">&#40;</span>w<span style="color: #66cc66;">&#41;</span>-<span style="color: #cc66cc;">1</span><span style="color: #66cc66;">&#41;</span><span style="color: #66cc66;">&#41;</span><span style="color: #66cc66;">*</span><span style="color: #66cc66;">&#40;</span>range<span style="color: #66cc66;">/</span>w<span style="color: #66cc66;">&#41;</span>;
<span style="color: #66cc66;">&#125;</span></pre></td></tr></table></div>

<p>В функцию передается два параметра &#8211; собственно диапазон, и, не знаю как это правильно обозвать, степень разброса. От это степени зависит насколько сильно выпадающие значения будут тесниться к максимальному краю. Чем больше степень, тем ближе к краю.</p>
<p>В функцию вставлена небольшая проверка &#8211; чтобы ширина не была меньше 1 (в этом случае мы получим обычный рандом) и не была больше 709 (в этом случае выражение Math.exp(w) даст нам infinity). Их собсвенно можно убрать, дабы не забивать процессор лишней работой.</p>
<p>Вся магия тут завязана на простой принцип &#8211; есть график логарифма. Мы берем случайное число по оси X и находим его логарифм по оси Y. Немного корректируем под наш диапазон &#8211; и результат на лице.</p>
<p>Вот к примеру такой:<br />
<a href="http://bbexp.ru/blog/_stuff/random.html"> http://bbexp.ru/blog/_stuff/random.html</a></p>
<img src="http://murejib.com/?ak_action=api_record_view&id=23&type=feed" alt="" />]]></content:encoded>
			<wfw:commentRss>http://murejib.com/2007/12/12/exprandom/feed/</wfw:commentRss>
		<slash:comments>3</slash:comments>
		</item>
		<item>
		<title>Перекур.</title>
		<link>http://murejib.com/2007/12/07/smokebreak/</link>
		<comments>http://murejib.com/2007/12/07/smokebreak/#comments</comments>
		<pubDate>Fri, 07 Dec 2007 12:59:04 +0000</pubDate>
		<dc:creator>murejib</dc:creator>
				<category><![CDATA[ActionScript]]></category>
		<category><![CDATA[fx]]></category>
		<category><![CDATA[поток сознания]]></category>

		<guid isPermaLink="false">http://murejib.com/?p=18</guid>
		<description><![CDATA[Все таки perlinNoise &#8211; многофункциональная субстанция. С его помощью можно имитровать все земные материи. Воздух (в виде облаков или дыма) Воду. Огонь. Землю. Если траву им шевелить. Перекур.]]></description>
			<content:encoded><![CDATA[<p>Все таки perlinNoise &#8211; многофункциональная субстанция.</p>
<p>С его помощью можно имитровать все земные материи.</p>
<ul>
<li>Воздух (в виде облаков или дыма)</li>
<li>Воду.</li>
<li>Огонь.</li>
<li>Землю. Если траву им шевелить.</li>
</ul>
<p><a href="http://bbexp.ru/blog/_stuff/havana.html">Перекур.</a></p>
<img src="http://murejib.com/?ak_action=api_record_view&id=16&type=feed" alt="" />]]></content:encoded>
			<wfw:commentRss>http://murejib.com/2007/12/07/smokebreak/feed/</wfw:commentRss>
		<slash:comments>2</slash:comments>
		</item>
		<item>
		<title>Ветвистые эксперименты Гранта Скиннера</title>
		<link>http://murejib.com/2007/12/07/grant-skinner-branches/</link>
		<comments>http://murejib.com/2007/12/07/grant-skinner-branches/#comments</comments>
		<pubDate>Fri, 07 Dec 2007 07:37:07 +0000</pubDate>
		<dc:creator>murejib</dc:creator>
				<category><![CDATA[fx]]></category>

		<guid isPermaLink="false">http://murejib.com/?p=17</guid>
		<description><![CDATA[Очень интересные визуальные эксперименты гуру флеш-движения Гранта Скиннера, основанные на рекурсии и &#8220;старых добрых деревьях&#8221;. Судя по всему широко использован BitmapData (иначе такой пучок волос убил бы на смерть процессор).]]></description>
			<content:encoded><![CDATA[<p><a href="http://www.gskinner.com/blog/archives/2007/12/branching_exper.html"><img style="float:left;" src="http://bbexp.ru/blog/_stuff/gshair.gif" border="0" alt="Grant's hairball" hspace="10" vspace="10" align="left" /></a><br />
Очень интересные визуальные эксперименты гуру флеш-движения Гранта Скиннера, основанные на рекурсии и &#8220;старых добрых деревьях&#8221;.</p>
<p>Судя по всему широко использован BitmapData (иначе такой пучок волос убил бы на смерть процессор).</p>
<img src="http://murejib.com/?ak_action=api_record_view&id=15&type=feed" alt="" />]]></content:encoded>
			<wfw:commentRss>http://murejib.com/2007/12/07/grant-skinner-branches/feed/</wfw:commentRss>
		<slash:comments>1</slash:comments>
		</item>
	</channel>
</rss>

