<p>SafariやGoogle Chromeなど、webkitを使ったブラウザではCCS3のfilterを使って、コンテンツをぼかすことができます。</p>
<p>しかし、上に重ねたコンテンツのところだけをぼかすように、部分的にぼかすことはできません。</p>
<p>SVGを使った方法もありますが、CSS3のfilterとjQueryを使ってなんとかできないかやってみました。</p>
<p>&nbsp;</p>
<p>↓こちらが作ってみたものです(ChromeもしくはSafariでご覧下さい)。</p>
<p><a class="demo" href="/demo/ninomiya/41/" target="_blank">DEMO</a></p>
<p>&nbsp;</p>
<h2>方法</h3>
<p>今回は、body内の要素を丸々コピーして要素の上に被せ、</p>
<p>被せた要素にfilterをかけてcssのclipで一部だけ表示するという方法を使いました。</p>
<p>&nbsp;</p>
<p>HTML</p>

		<div id="crayon-64953fd597e37519460867" class="crayon-syntax crayon-theme-monokai crayon-font-monaco crayon-os-mac print-yes notranslate" data-settings=" minimize scroll-mouseover wrap" style=" margin-top: 12px; margin-bottom: 12px; font-size: 13px !important; line-height: 18px !important;">
		
			<div class="crayon-toolbar" data-settings=" mouseover overlay hide delay" style="font-size: 13px !important;height: 19.5px !important; line-height: 19.5px !important;"><span class="crayon-title">HTML</span>
			<div class="crayon-tools" style="font-size: 13px !important;height: 19.5px !important; line-height: 19.5px !important;"><div class="crayon-button crayon-nums-button" title="Toggle Line Numbers"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-plain-button" title="Toggle Plain Code"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-wrap-button" title="Toggle Line Wrap"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-expand-button" title="Expand Code"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-copy-button" title="Copy"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-popup-button" title="Open Code In New Window"><div class="crayon-button-icon"></div></div><span class="crayon-language">XHTML</span></div></div>
			<div class="crayon-info" style="min-height: 19.5px !important; line-height: 19.5px !important;"></div>
			<div class="crayon-plain-wrap"><textarea  class="crayon-plain print-no" data-settings="dblclick" readonly style="-moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4; font-size: 13px !important; line-height: 18px !important;">
&lt;body&gt;
&lt;div class="contents"&gt;
	：
	(コンテンツ)
	：
&lt;/div&gt;
&lt;/body&gt;</textarea></div>
			<div class="crayon-main" style="">
				<table class="crayon-table">
					<tr class="crayon-row">
				<td class="crayon-nums " data-settings="show">
					<div class="crayon-nums-content" style="font-size: 13px !important; line-height: 18px !important;"><div class="crayon-num" data-line="crayon-64953fd597e37519460867-1">1</div><div class="crayon-num crayon-striped-num" data-line="crayon-64953fd597e37519460867-2">2</div><div class="crayon-num" data-line="crayon-64953fd597e37519460867-3">3</div><div class="crayon-num crayon-striped-num" data-line="crayon-64953fd597e37519460867-4">4</div><div class="crayon-num" data-line="crayon-64953fd597e37519460867-5">5</div><div class="crayon-num crayon-striped-num" data-line="crayon-64953fd597e37519460867-6">6</div><div class="crayon-num" data-line="crayon-64953fd597e37519460867-7">7</div></div>
				</td>
						<td class="crayon-code"><div class="crayon-pre" style="font-size: 13px !important; line-height: 18px !important; -moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4;"><div class="crayon-line" id="crayon-64953fd597e37519460867-1"><span class="crayon-r ">&lt;body&gt;</span></div><div class="crayon-line crayon-striped-line" id="crayon-64953fd597e37519460867-2"><span class="crayon-r ">&lt;div </span><span class="crayon-e ">class</span>=<span class="crayon-s ">"contents"</span><span class="crayon-r ">&gt;</span></div><div class="crayon-line" id="crayon-64953fd597e37519460867-3"><span class="crayon-i ">	：</span></div><div class="crayon-line crayon-striped-line" id="crayon-64953fd597e37519460867-4"><span class="crayon-i ">	(コンテンツ)</span></div><div class="crayon-line" id="crayon-64953fd597e37519460867-5"><span class="crayon-i ">	：</span></div><div class="crayon-line crayon-striped-line" id="crayon-64953fd597e37519460867-6"><span class="crayon-r ">&lt;/div&gt;</span></div><div class="crayon-line" id="crayon-64953fd597e37519460867-7"><span class="crayon-r ">&lt;/body&gt;</span></div></div></td>
					</tr>
				</table>
			</div>
		</div>

<p>&nbsp;</p>
<p>JavaScript</p>

		<div id="crayon-64953fd597e3b848665737" class="crayon-syntax crayon-theme-monokai crayon-font-monaco crayon-os-mac print-yes notranslate" data-settings=" minimize scroll-mouseover wrap" style=" margin-top: 12px; margin-bottom: 12px; font-size: 13px !important; line-height: 18px !important;">
		
			<div class="crayon-toolbar" data-settings=" mouseover overlay hide delay" style="font-size: 13px !important;height: 19.5px !important; line-height: 19.5px !important;"><span class="crayon-title">JavaScript</span>
			<div class="crayon-tools" style="font-size: 13px !important;height: 19.5px !important; line-height: 19.5px !important;"><div class="crayon-button crayon-nums-button" title="Toggle Line Numbers"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-plain-button" title="Toggle Plain Code"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-wrap-button" title="Toggle Line Wrap"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-expand-button" title="Expand Code"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-copy-button" title="Copy"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-popup-button" title="Open Code In New Window"><div class="crayon-button-icon"></div></div><span class="crayon-language">JavaScript</span></div></div>
			<div class="crayon-info" style="min-height: 19.5px !important; line-height: 19.5px !important;"></div>
			<div class="crayon-plain-wrap"><textarea  class="crayon-plain print-no" data-settings="dblclick" readonly style="-moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4; font-size: 13px !important; line-height: 18px !important;">
$(function(){
	 //body内のコンテンツをコピーしてコンテンツの後ろに挿入する
	$("body").append($(".contents").clone());

	$(".contents:last").css({
		"width" : "100%",
		"position" : "absolute",
		"top" : "0",
		"left" : "0",
		"-webkit-filter" : "blur(10px)", //ぼかしをかける
		"clip" : "rect(540px 600px 900px 240px)" //クリッピングして一部だけ表示する
	});
});</textarea></div>
			<div class="crayon-main" style="">
				<table class="crayon-table">
					<tr class="crayon-row">
				<td class="crayon-nums " data-settings="show">
					<div class="crayon-nums-content" style="font-size: 13px !important; line-height: 18px !important;"><div class="crayon-num" data-line="crayon-64953fd597e3b848665737-1">1</div><div class="crayon-num crayon-striped-num" data-line="crayon-64953fd597e3b848665737-2">2</div><div class="crayon-num" data-line="crayon-64953fd597e3b848665737-3">3</div><div class="crayon-num crayon-striped-num" data-line="crayon-64953fd597e3b848665737-4">4</div><div class="crayon-num" data-line="crayon-64953fd597e3b848665737-5">5</div><div class="crayon-num crayon-striped-num" data-line="crayon-64953fd597e3b848665737-6">6</div><div class="crayon-num" data-line="crayon-64953fd597e3b848665737-7">7</div><div class="crayon-num crayon-striped-num" data-line="crayon-64953fd597e3b848665737-8">8</div><div class="crayon-num" data-line="crayon-64953fd597e3b848665737-9">9</div><div class="crayon-num crayon-striped-num" data-line="crayon-64953fd597e3b848665737-10">10</div><div class="crayon-num" data-line="crayon-64953fd597e3b848665737-11">11</div><div class="crayon-num crayon-striped-num" data-line="crayon-64953fd597e3b848665737-12">12</div><div class="crayon-num" data-line="crayon-64953fd597e3b848665737-13">13</div></div>
				</td>
						<td class="crayon-code"><div class="crayon-pre" style="font-size: 13px !important; line-height: 18px !important; -moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4;"><div class="crayon-line" id="crayon-64953fd597e3b848665737-1"><span class="crayon-sy">$</span><span class="crayon-sy">(</span><span class="crayon-t">function</span><span class="crayon-sy">(</span><span class="crayon-sy">)</span><span class="crayon-sy">{</span></div><div class="crayon-line crayon-striped-line" id="crayon-64953fd597e3b848665737-2"><span class="crayon-h">	 </span><span class="crayon-c">//body内のコンテンツをコピーしてコンテンツの後ろに挿入する</span></div><div class="crayon-line" id="crayon-64953fd597e3b848665737-3"><span class="crayon-h">	</span><span class="crayon-sy">$</span><span class="crayon-sy">(</span><span class="crayon-s">"body"</span><span class="crayon-sy">)</span><span class="crayon-sy">.</span><span class="crayon-e">append</span><span class="crayon-sy">(</span><span class="crayon-sy">$</span><span class="crayon-sy">(</span><span class="crayon-s">".contents"</span><span class="crayon-sy">)</span><span class="crayon-sy">.</span><span class="crayon-e">clone</span><span class="crayon-sy">(</span><span class="crayon-sy">)</span><span class="crayon-sy">)</span><span class="crayon-sy">;</span></div><div class="crayon-line crayon-striped-line" id="crayon-64953fd597e3b848665737-4">&nbsp;</div><div class="crayon-line" id="crayon-64953fd597e3b848665737-5"><span class="crayon-h">	</span><span class="crayon-sy">$</span><span class="crayon-sy">(</span><span class="crayon-s">".contents:last"</span><span class="crayon-sy">)</span><span class="crayon-sy">.</span><span class="crayon-e">css</span><span class="crayon-sy">(</span><span class="crayon-sy">{</span></div><div class="crayon-line crayon-striped-line" id="crayon-64953fd597e3b848665737-6"><span class="crayon-h">		</span><span class="crayon-s">"width"</span><span class="crayon-h"> </span><span class="crayon-sy">:</span><span class="crayon-h"> </span><span class="crayon-s">"100%"</span><span class="crayon-sy">,</span></div><div class="crayon-line" id="crayon-64953fd597e3b848665737-7"><span class="crayon-h">		</span><span class="crayon-s">"position"</span><span class="crayon-h"> </span><span class="crayon-sy">:</span><span class="crayon-h"> </span><span class="crayon-s">"absolute"</span><span class="crayon-sy">,</span></div><div class="crayon-line crayon-striped-line" id="crayon-64953fd597e3b848665737-8"><span class="crayon-h">		</span><span class="crayon-s">"top"</span><span class="crayon-h"> </span><span class="crayon-sy">:</span><span class="crayon-h"> </span><span class="crayon-s">"0"</span><span class="crayon-sy">,</span></div><div class="crayon-line" id="crayon-64953fd597e3b848665737-9"><span class="crayon-h">		</span><span class="crayon-s">"left"</span><span class="crayon-h"> </span><span class="crayon-sy">:</span><span class="crayon-h"> </span><span class="crayon-s">"0"</span><span class="crayon-sy">,</span></div><div class="crayon-line crayon-striped-line" id="crayon-64953fd597e3b848665737-10"><span class="crayon-h">		</span><span class="crayon-s">"-webkit-filter"</span><span class="crayon-h"> </span><span class="crayon-sy">:</span><span class="crayon-h"> </span><span class="crayon-s">"blur(10px)"</span><span class="crayon-sy">,</span><span class="crayon-h"> </span><span class="crayon-c">//ぼかしをかける</span></div><div class="crayon-line" id="crayon-64953fd597e3b848665737-11"><span class="crayon-h">		</span><span class="crayon-s">"clip"</span><span class="crayon-h"> </span><span class="crayon-sy">:</span><span class="crayon-h"> </span><span class="crayon-s">"rect(540px 600px 900px 240px)"</span><span class="crayon-h"> </span><span class="crayon-c">//クリッピングして一部だけ表示する</span></div><div class="crayon-line crayon-striped-line" id="crayon-64953fd597e3b848665737-12"><span class="crayon-h">	</span><span class="crayon-sy">}</span><span class="crayon-sy">)</span><span class="crayon-sy">;</span></div><div class="crayon-line" id="crayon-64953fd597e3b848665737-13"><span class="crayon-sy">}</span><span class="crayon-sy">)</span><span class="crayon-sy">;</span></div></div></td>
					</tr>
				</table>
			</div>
		</div>

<p>&nbsp;</p>
<p>今回作ったものは、現在のところChrome, Safariだけで使える方法なので、</p>
<p>実用にはまだまだ遠いですが、SVGを使った方法（参考→「<a href="http://unformedbuilding.com/articles/frosted-glass-effect-with-css-and-svg/" target="_blank">CSS と SVG で曇りガラスのような効果を作る</a>」）と合わせ、</p>
<p>効果の出し分けをするなどすれば、少しでも実用化に近づけることができるかもしれません。</p>
<p>&nbsp;</p>
<p>いずれにしても、Android2.3系でもぼかし効果を使うことはあきらめなければならなそうです。<br />
Android2.3系は、Androidの中でも2014年2月時点でも2割のシェアがあり（<a href="http://developer.android.com/about/dashboards/index.html" target="_blank">参考</a>）、無視することもできないため、</p>
<p>もしぼかし効果を使う場合は、Android2.3系において、ぼかし無しで問題無いようなデザインにしておく必要がありそうです。</p>

jQueryやCSS3を使って画面の一部をぼかす方法を考える

<p><a href="http://ifttt.com" target="_blank">ifttt（イフト）</a>とは、「if this then that」の略で、各種サービスを連結して活用するサービスです。</p>
<h2>できること</h3>
<ul>
<li>特定メールアドレスにからメールが来たら、iphoneにそれをpushする（テストした結果、リアルタイムではなく、文字化けもするが）</li>
<li>天気予報で明日雨降りそうなら、傘を持つというタスクをtoodledoに追加</li>
<li>ブログを更新したら、それをtweetする</li>
<li>iphoneで写真を取ったら、dropboxにアップする</li>
<li>facebookで「誰かと一緒」の写真が現れたら、それをiphoneにダウンロードする。</li>
</ul>
<p>などなど。もちろん設定したら、自動でやってくれます。</p>
<h2>連携サービス（channels）</h3>
<p>現時点（2014年2月）の連携サービスは、下記になります。<br />
<a href="/uploads-archive/2014/02/2d764551702075bafac3f437262c9600.png"><img decoding="async" loading="lazy" class="aligncenter size-medium wp-image-4307" alt="連携サービス１" src="/uploads-archive/2014/02/2d764551702075bafac3f437262c9600-300x219.png" width="300" height="219" srcset="/uploads-archive/2014/02/2d764551702075bafac3f437262c9600-300x219.png 300w, /uploads-archive/2014/02/2d764551702075bafac3f437262c9600-228x167.png 228w, /uploads-archive/2014/02/2d764551702075bafac3f437262c9600.png 977w" sizes="(max-width: 300px) 100vw, 300px" /></a><br />
<a href="/uploads-archive/2014/02/afab028b41811f69fd16c4a97b23056f.png"><img decoding="async" loading="lazy" class="aligncenter size-medium wp-image-4306" alt="連携サービス２" src="/uploads-archive/2014/02/afab028b41811f69fd16c4a97b23056f-300x218.png" width="300" height="218" srcset="/uploads-archive/2014/02/afab028b41811f69fd16c4a97b23056f-300x218.png 300w, /uploads-archive/2014/02/afab028b41811f69fd16c4a97b23056f-228x166.png 228w, /uploads-archive/2014/02/afab028b41811f69fd16c4a97b23056f.png 982w" sizes="(max-width: 300px) 100vw, 300px" /></a><br />
<a href="/uploads-archive/2014/02/bb9cba283a0ac1a9bbaed3a378ee2540.png"><br />
<img decoding="async" loading="lazy" class="aligncenter size-medium wp-image-4309" alt="連携サービス３" src="/uploads-archive/2014/02/bb9cba283a0ac1a9bbaed3a378ee2540-300x219.png" width="300" height="219" srcset="/uploads-archive/2014/02/bb9cba283a0ac1a9bbaed3a378ee2540-300x219.png 300w, /uploads-archive/2014/02/bb9cba283a0ac1a9bbaed3a378ee2540-228x166.png 228w, /uploads-archive/2014/02/bb9cba283a0ac1a9bbaed3a378ee2540.png 992w" sizes="(max-width: 300px) 100vw, 300px" /></a><br />
<a href="/uploads-archive/2014/02/21a22be13858130599efc52071ac87fb.png"><img decoding="async" loading="lazy" class="aligncenter size-medium wp-image-4308" alt="連携サービス４" src="/uploads-archive/2014/02/21a22be13858130599efc52071ac87fb-300x119.png" width="300" height="119" srcset="/uploads-archive/2014/02/21a22be13858130599efc52071ac87fb-300x119.png 300w, /uploads-archive/2014/02/21a22be13858130599efc52071ac87fb-1024x407.png 1024w, /uploads-archive/2014/02/21a22be13858130599efc52071ac87fb-228x90.png 228w, /uploads-archive/2014/02/21a22be13858130599efc52071ac87fb.png 1027w" sizes="(max-width: 300px) 100vw, 300px" /></a></p>
<h2>レシピ（recipe）の作成方法</h3>
<p><a href="http://hoomey.net/ifttt_study_1/" target="_blank">ここ</a>が参考になったから、見てみてください。</p>


ifttt

<p>お客様からのご招待で2月14日15日に開催されたジャパンアミューズメントエキスポ2014通称JAEPOに行ってきました。</p>
<p>お客様のサービスの理解を深めることは、大変大事なことですが、ITの仕事をしているとお客様の業種、業界というのは本当に様々です。こういった見本市（業者市）のようなものは、一挙に情報を取得することが出来ます。JAEPOに関しては、14日をビジネスデイ、15日を一般デイとされており、私が行った15日は一般デイであったため、家族連れの方や、学生のような方々もたくさんいました。アミューズメント施設、いわゆるゲームセンターの見本市ですので、様々な最新ゲームが展示されており、実際に遊ぶことが出来るので楽しめます。</p>
<p>大手企業が大変大きなブースを構え、最新の格闘ゲームやUFOキャッチャー、カードゲームといったものを展示する横で、格闘ゲームのコントローラーのボタンが一つ100円で売られていたりと業界でも様々な商売があるということを一人で哀愁感じておりました。</p>
<p>そこで頂いたゲームセンターの経営者をターゲットにしていると思われるアミューズメント産業の業界誌から著作権に抵触しない程度に少し紹介したいと思います。</p>
<h2>大型ビデオゲームの一日あたりの売上</h3>
<p>データを見るまでは、全く想像も付きませんでした。</p>
<p><a href="/uploads-archive/2014/02/intro-pic.jpg"><img decoding="async" loading="lazy" class="alignnone size-medium wp-image-4302" alt="intro-pic" src="/uploads-archive/2014/02/intro-pic-300x124.jpg" width="300" height="124" srcset="/uploads-archive/2014/02/intro-pic-300x124.jpg 300w, /uploads-archive/2014/02/intro-pic-228x94.jpg 228w, /uploads-archive/2014/02/intro-pic.jpg 840w" sizes="(max-width: 300px) 100vw, 300px" /></a></p>
<p>&nbsp;</p>
<p>売上げトップは上記のガンダムのゲームで1日2万円以上になるようです。</p>
<p><a href="/uploads-archive/2014/02/photo_01.jpg"><img decoding="async" loading="lazy" class="alignnone size-medium wp-image-4303" alt="photo_01" src="/uploads-archive/2014/02/photo_01-300x300.jpg" width="300" height="300" srcset="/uploads-archive/2014/02/photo_01-300x300.jpg 300w, /uploads-archive/2014/02/photo_01-150x150.jpg 150w, /uploads-archive/2014/02/photo_01-228x228.jpg 228w, /uploads-archive/2014/02/photo_01-120x120.jpg 120w, /uploads-archive/2014/02/photo_01.jpg 360w" sizes="(max-width: 300px) 100vw, 300px" /></a></p>
<p>次点は麻雀ゲームでほぼ同じような売上があり、麻雀というのはどの時代でも強力なコンテンツであることが分かります。</p>
<p><a href="/uploads-archive/2014/02/imgres5.jpg"><img decoding="async" loading="lazy" class="alignnone size-full wp-image-4304" alt="imgres" src="/uploads-archive/2014/02/imgres5.jpg" width="264" height="191" srcset="/uploads-archive/2014/02/imgres5.jpg 264w, /uploads-archive/2014/02/imgres5-228x164.jpg 228w" sizes="(max-width: 264px) 100vw, 264px" /></a></p>
<p>音ゲーのトップでは、定番ともいえる「太鼓の達人」ですが、上記のゲームに比べると1/4程度の売上のようです。</p>
<p>他にも、ビデオゲーム部門でもガンダムが強く、ドラゴンボールや鉄拳といった当たりが続いていきます。</p>
<p>&nbsp;</p>
<p>&nbsp;</p>


アミューズメント産業について

<p><em><strong><span><span>Starting Android Studio</span></span></strong></em></p>
<p><span><span><span><span><span><span>Path: /home /mon /android-studio</span></span></span></span></span></span></p>
<p><span><span><span><span><span><span>$ pwd (Print working directory)</span></span></span></span></span></span></p>
<p><span><span><span><span><span><span>/Home/mon</span></span></span></span></span></span></p>
<p><span><span><span><span><span><span>$ cd android-studio/bin (Change directory)</span></span></span></span></span></span></p>
<p><span><span><span><span><span><span>$ ./studio.sh</span></span></span></span></span></span></p>
<p><em><strong><span><span>Creating New Project</span></span></strong></em></p>
<p><span><span><span><span><span><span>(1) New Project</span></span></span></span></span></span></p>
<p><img decoding="async" loading="lazy" alt="createnewproject" src="/uploads-archive/2014/02/new_android.png" width="300" height="250" /></p>
<p><span><span><span><span>(2) Setting up application, module and package names<br />
</span></span></span></span></p>
<p><img decoding="async" loading="lazy" alt="settingappname" src="/uploads-archive/2014/02/create_android.png" width="300" height="250" /></p>
<p><span><span><span><span>(3) App logo image<br />
</span></span></span></span></p>
<p><img decoding="async" loading="lazy" alt="chooseapplogo" src="/uploads-archive/2014/02/logo_android.png" width="300" height="250" /></p>
<p><span><span><span><span>(4) Setting up activity and layout names<br />
</span></span></span></span></p>
<p><img decoding="async" loading="lazy" alt="settingactivityname" src="/uploads-archive/2014/02/main_activity_android.png" width="300" height="250" /></p>
<p><span><span><span><span>(5) Building app<br />
</span></span></span></span></p>
<p><img decoding="async" loading="lazy" alt="buildingapp" src="/uploads-archive/2014/02/building_android.png" width="300" height="150" /></p>
<p><em><strong>Developing</strong></em></p>
<p><span><span>(1) activity_mail.xml<br />
</span></span></p>
<p><img decoding="async" loading="lazy" alt="devapp" src="/uploads-archive/2014/02/dev_app.png" width="300" height="250" /></p>
<p><span><span>(2) MainActivity.java<br />
</span></span></p>
<p><img decoding="async" loading="lazy" alt="devapp1" src="/uploads-archive/2014/02/dev1.png" width="300" height="250" /></p>
<p><span><span>(3) fragment_main.xml<br />
</span></span></p>
<p><img decoding="async" loading="lazy" alt="devapp2" src="/uploads-archive/2014/02/dev2.png" width="300" height="250" /></p>
<p><em><strong>Running the project</strong></em></p>
<p><span><span><span><span>(1) Adding Android Virtual Device Manager(Emulator for testing app)<br />
</span></span></span></span></p>
<p><img decoding="async" loading="lazy" alt="settingemulator" src="/uploads-archive/2014/02/emulator_android.png" width="300" height="250" /></p>
<p><span><span>(2) App on Device<br />
</span></span></p>
<p><img decoding="async" loading="lazy" alt="apponhome" src="/uploads-archive/2014/02/apponhome.png" width="200" height="250" /></p>
<p>(3) I&#8217;m now successfully running 🙂</p>
<p><img decoding="async" loading="lazy" alt="runningapp" src="/uploads-archive/2014/02/helloworld_android.png" width="220" height="250" /></p>
<p><span><span><span><span>Enjoy!!!</span></span></span></span></p>


Android Hello World

<p>最近ビジネスにおいて脱IT的な記事や成功れをたびたび目にする。</p>
<p>最近のもので印象に残っているのはこれ。<br />
<a href="http://dot.asahi.com/aera/2014020500043.html" target="_blank">http://dot.asahi.com/aera/2014020500043.html</a></p>
<p>・メールをさばいたり、装飾に凝った資料を作ったりすることで逆に時間が奪われ、仕事の質も下がっている<br />
・デスクは頭で考える仕事をする場、パソコン島はデスクでまとめた内容をアウトプットする作業の場<br />
・パソコン使用中には脳があまり働かない</p>
<p>と興味深い実例と意見が幾つかある。</p>
<p>上記を含めてITのデメリットとはまとめると以下の2点に集約されると思う。</p>
<p>・手軽な情報伝達により情報の重みが減っている<br />
・調べてるだけで考えてると思ってしまっている</p>
<p>前者はスピードが重要視される上ではある程度仕方がないことかとも思う。<br />
だが逆に重要な情報を絞って注力したら結果が出た、というのが成功例なのだろうと思う。<br />
例えば企業であれば、複数のお客さんの中で利益を生んでくれる上客をピックアップし、それ以外のお客との接点を減らす。<br />
減った時間を上客のために使ったほうが数字が上がった、というようなことだろう。<br />
少し話はそれるが、この問題は色々なシチュエーションで言えることだと思う。<br />
例えば就活生の進路について、情報がありすぎて決めきれず中途半端になってしまったり<br />
装飾された情報におどらされて誤った選択をしてしまうなど。<br />
要は情報の選択と精査ができるスキルを持っていない人にとってITはデメリットになるということだ。</p>
<p>後者は資料を作ったり問題を解決する時ググった情報を寄せ集めたことで完了させてしまうことだ。<br />
人からの情報はヒントにはなるが結果にはならない。<br />
これはかなりの人がやってしまっていると思う。むしろ80%以上の人が該当するのでは?と個人的に思ってしまう。<br />
我々の業界でプログラマーという職種で、ベースは専門学校などで学んでツールの使い方やプログラムの実行の仕方はしっている。<br />
後はググって出てきたソースを順番にコピペして正常に動いたら完了。<br />
というプログラマーをたまに見かけるが、こうゆう人がプログラマーとして成長する可能性は低い。<br />
どうして動く・動かないのかを考えていないからだ。<br />
本来であれば考えて実行して、動かないところのヒントを得るか、<br />
若しくはコピペで動いたとしてもその情報をくまなく読んで理解したほうが良い。</p>
<p>前置きが長かったが、本ブログは特に後者を解消し、更に資料作成と問題解決を高めてくれそうな情報を見つけたのでその紹介。</p>
<p><a href="http://p.tl/BKt6" target="_blank">http://p.tl/BKt6</a><br />
こちらの本で紹介されていたもので、通称マッキンノートと言われるものとのこと。</p>
<p>書いてあることと自分が思ったことをまとめると</p>
<p>・ネットから離れることで考えることに集中できる<br />
→ 紙を埋めることに集中することで調べるという裏ワザを遮断できる。結果としてオリジナリティと説得力が増す</p>
<p>・装飾にとらわれず成果を追求できる<br />
→ パワポなどで提出用の資料をつくろうとするのではなく、考えをまとめたり<br />
相手を説得するロジックを組み立てるといった本質に集中できるため、高い成果が期待できる<br />
尚、この本の筆者はこれは下書きなので時間がかかりそうだが実はこの方が早く、さらに何度も書き直すために鉛筆で書いたほうがいいと行っている</p>
<p><a href="/uploads-archive/2014/02/a.jpg"><img decoding="async" loading="lazy" class="aligncenter size-full wp-image-4266" alt="a" src="/uploads-archive/2014/02/a.jpg" width="556" height="441" srcset="/uploads-archive/2014/02/a.jpg 556w, /uploads-archive/2014/02/a-300x237.jpg 300w, /uploads-archive/2014/02/a-228x180.jpg 228w" sizes="(max-width: 556px) 100vw, 556px" /></a></p>
<p>1：タイトル欄<br />
2：ページメッセージ欄　→ 必ず意味合いを書き出す癖をつける<br />
3：図表の縦軸横軸を正確に書けるように升目状になっている<br />
4：注意、出所欄 → 必ず情報ソースを明記する癖をつける</p>
<p>個人的に説明資料は紙で作ってからパワポ等にしているが、<br />
戦略を考えたりする時もこのようにしたほうが良いのではと思った。<br />
考えなければ成長しないし結果も出にくいと思う。</p>


マッキンゼーノート

<div class="booklink-box" style="text-align:left;padding-bottom:20px;font-size:small;/zoom: 1;overflow: hidden;">
<div class="booklink-image" style="float:left;margin:0 15px 10px 0;"><a href="http://www.amazon.co.jp/exec/obidos/asin/4062124963/sackoh71-22/" target="_blank" ><img decoding="async" src="http://ecx.images-amazon.com/images/I/41VAQSZE03L._SL160_.jpg" style="border: none;" /></a></div>
<div class="booklink-info" style="line-height:120%;/zoom: 1;overflow: hidden;">
<div class="booklink-name" style="margin-bottom:10px;line-height:120%"><a href="http://www.amazon.co.jp/exec/obidos/asin/4062124963/sackoh71-22/" target="_blank" >魔法の発音 カタカナ英語</a></p>
<div class="booklink-powered-date" style="font-size:8pt;margin-top:5px;font-family:verdana;line-height:120%">posted with <a href="http://yomereba.com" rel="nofollow" target="_blank">ヨメレバ</a></div>
</div>
<div class="booklink-detail" style="margin-bottom:5px;">池谷 裕二 講談社 2004-10-23    </div>
<div class="booklink-link" style="margin-top: 5px"><a href="http://www.amazon.co.jp/exec/obidos/ASIN/4062124963/sackoh71-22/" name="booklink" rel="nofollow" target="_blank">Amazon.co.jp で詳細を見る</a></div>
</div>
<div class="booklink-footer" style="clear: left"></div>
</div>
<p>脳科学者として有名な池谷裕二さんが脳科学の延長で何故日本人は英語が苦手なのか？に対する回答です。</p>
<p>他の著作も非常に面白く、守備範囲の広さに脱帽です。</p>
<p>社内で英語が飛び交うようになり、お恥ずかしながら本の紹介です。</p>
<h2>抜粋</h3>
<ul>
<li>推理の言語の日本語。同音異義語がたくさんある。</li>
<li><span style="line-height: 1.5em;">そもそも発音の数が少ない。</span></li>
</ul>
<p>この2つが日本人が英語を不得意とする理由。</p>
<p>日本語の発音の数が少ないので、もう英語のようにたくさんの発音を使い分けることは難しい。</p>
<p>逆に発音の数が少ない＝パターンが少ないため、同音で異なる意味の言葉が多いのが特徴だ。</p>
<p>それを推理しながら、的確に文脈を捉えることが出来るのは日本人独特の能力である。</p>
<p>以上のことを踏まえて、正しいカタカナ英語を覚えようというのが趣旨である。</p>
<ul>
<li>Can I have&#8230;? （～をください） は「ケナヤブ」</li>
<li>Do you have&#8230;? （～はありますか？） は「ジュヤブ」</li>
<li>Do you want to&#8230;? （～したいですか？） は「ジュワナ」</li>
<li>I want you to&#8230; （～してください） は「アイワニュル」</li>
<li>Do you mind if I&#8230;? （～してもよいですか？） は「ジュマインデファイ」</li>
<li>Can you take our picture? （シャッターを押してください？） は「ケニュテイカワペクチョ」</li>
</ul>


魔法の発音 カタカナ英語 &#8211; 池谷裕二

<p>少し前から流行っているフラットデザインですが、最近は日本のサイトでも多く見かけるようになりました。</p>
<p>勉強のために、いろいろ見てきたものをここでは７つ紹介したいと思います。</p>
<h2>フラットデザインのサイト7選</h3>
<h3>株式会社ユニオンネット</h4>
<p>大阪の制作会社さんのサイトです。<br />
横幅いっぱいの写真を使用し、ちょっとした動きもありいい感じです。</p>
<p>&nbsp;</p>
<p><a href="/uploads-archive/2014/02/d416efe8d5de2b80300be706e602d1bb.jpg"><img decoding="async" loading="lazy" class="alignnone  wp-image-4255" alt="ホームページ制作│大阪│株式会社ユニオンネット" src="/uploads-archive/2014/02/d416efe8d5de2b80300be706e602d1bb.jpg" width="650" height="488" srcset="/uploads-archive/2014/02/d416efe8d5de2b80300be706e602d1bb.jpg 1007w, /uploads-archive/2014/02/d416efe8d5de2b80300be706e602d1bb-300x225.jpg 300w, /uploads-archive/2014/02/d416efe8d5de2b80300be706e602d1bb-228x171.jpg 228w" sizes="(max-width: 650px) 100vw, 650px" /></a></p>
<p>&nbsp;</p>
<p><a class="link" href="http://www.unionnet.jp/" target="_blank">ホームページ制作│大阪│株式会社ユニオンネット</a></p>
<p>&nbsp;</p>
<h3>DEMONO（デモノ）体験をモノに。</h4>
<p>ECサイトのツールを手がけている会社さんで、色合いがいい感じですね！<br />
スクロールと連動した動きもつけられています。</p>
<p><a href="/uploads-archive/2014/02/0095e64a6ea4d783f9175e6fe7b0b000.jpg"><img decoding="async" loading="lazy" class="alignnone  wp-image-4250" alt="DEMONO（デモノ）体験をモノに。" src="/uploads-archive/2014/02/0095e64a6ea4d783f9175e6fe7b0b000.jpg" width="650" height="488" srcset="/uploads-archive/2014/02/0095e64a6ea4d783f9175e6fe7b0b000.jpg 1007w, /uploads-archive/2014/02/0095e64a6ea4d783f9175e6fe7b0b000-300x225.jpg 300w, /uploads-archive/2014/02/0095e64a6ea4d783f9175e6fe7b0b000-228x171.jpg 228w" sizes="(max-width: 650px) 100vw, 650px" /></a></p>
<p>&nbsp;</p>
<p><a class="link" href="http://demono.co.jp/" target="_blank">DEMONO（デモノ）体験をモノに。</a></p>
<p>&nbsp;</p>
<h3>みんなのマーケット株式会社</h4>
<p>まだ創立3年程の会社です。<br />
くらしのマーケットというサイトを運営しています。<br />
シンプルな形で、円形の写真を使い人物を紹介しています。</p>
<p><a href="/uploads-archive/2014/02/7a1d52a1a1321362d9f08c035a6dabb3.jpg"><img decoding="async" loading="lazy" class="alignnone  wp-image-4256" alt="みんなのマーケット株式会社 - みんなのマーケット株式会社" src="/uploads-archive/2014/02/7a1d52a1a1321362d9f08c035a6dabb3.jpg" width="650" height="488" srcset="/uploads-archive/2014/02/7a1d52a1a1321362d9f08c035a6dabb3.jpg 1007w, /uploads-archive/2014/02/7a1d52a1a1321362d9f08c035a6dabb3-300x225.jpg 300w, /uploads-archive/2014/02/7a1d52a1a1321362d9f08c035a6dabb3-228x171.jpg 228w" sizes="(max-width: 650px) 100vw, 650px" /></a></p>
<p>&nbsp;</p>
<p><a class="link" href="http://www.minma.jp/" target="_blank">みんなのマーケット株式会社</a></p>
<p>&nbsp;</p>
<h3>株式会社ワノコト</h4>
<p>埼玉にあるweb制作会社さんです。<br />
ブルーとオレンジを基調にしたサイトで、いいフラット感です。</p>
<p><a href="/uploads-archive/2014/02/851e1f12c68500da5a4bc38efe98633d.jpg"><img decoding="async" loading="lazy" class="alignnone  wp-image-4254" alt="ホームページ制作・システム開発 埼玉県（入間市・所沢市・飯能市・川越市）・東京中心のサイト制作 - 株式会社ワノコト" src="/uploads-archive/2014/02/851e1f12c68500da5a4bc38efe98633d.jpg" width="650" height="488" srcset="/uploads-archive/2014/02/851e1f12c68500da5a4bc38efe98633d.jpg 1007w, /uploads-archive/2014/02/851e1f12c68500da5a4bc38efe98633d-300x225.jpg 300w, /uploads-archive/2014/02/851e1f12c68500da5a4bc38efe98633d-228x171.jpg 228w" sizes="(max-width: 650px) 100vw, 650px" /></a></p>
<p>&nbsp;</p>
<p><a class="link" href="http://www.wanokoto.jp/" target="_blank">ホームページ制作・システム開発 埼玉県（入間市・所沢市・飯能市・川越市）・東京中心のサイト制作 &#8211; 株式会社ワノコト</a></p>
<p>&nbsp;</p>
<h3>サイバーエージェント・クラウドファンディング</h4>
<p>クラウドファウンディングを運営しているサイバー系の会社さんです。<br />
カラフルで大きな写真を使用しています。こちらも人物紹介が円形の写真を使用していますね。</p>
<p><a href="/uploads-archive/2014/02/9d1a3bcfbd099922d2f84023f0268c33.jpg"><img decoding="async" loading="lazy" class="alignnone  wp-image-4253" alt="サイバーエージェント・クラウドファンディング" src="/uploads-archive/2014/02/9d1a3bcfbd099922d2f84023f0268c33-1024x731.jpg" width="650" height="464" srcset="/uploads-archive/2014/02/9d1a3bcfbd099922d2f84023f0268c33-1024x731.jpg 1024w, /uploads-archive/2014/02/9d1a3bcfbd099922d2f84023f0268c33-300x214.jpg 300w, /uploads-archive/2014/02/9d1a3bcfbd099922d2f84023f0268c33-228x162.jpg 228w, /uploads-archive/2014/02/9d1a3bcfbd099922d2f84023f0268c33.jpg 1162w" sizes="(max-width: 650px) 100vw, 650px" /></a></p>
<p>&nbsp;</p>
<p><a class="link" href="http://www.ca-crowdfunding.com/" target="_blank">サイバーエージェント・クラウドファンディング</a></p>
<p>&nbsp;</p>
<h3>株式会社フォーデジットデザイン</h4>
<p>都内にあるweb制作会社さんです。<br />
横幅いっぱいの写真を使っていますが、フラットというよりミニマルに近いでしょうか？<br />
ホワイトを基調としておりキレイにできています。<br />
ページの切り替わりもオシャレです。</p>
<p><a href="/uploads-archive/2014/02/12546e8883696b2ec72adfb01082e9a4.jpg"><img decoding="async" loading="lazy" class="alignnone  wp-image-4251" alt="FOURDIGIT DESIGN Inc.  株式会社フォーデジットデザイン" src="/uploads-archive/2014/02/12546e8883696b2ec72adfb01082e9a4-1024x731.jpg" width="650" height="464" srcset="/uploads-archive/2014/02/12546e8883696b2ec72adfb01082e9a4-1024x731.jpg 1024w, /uploads-archive/2014/02/12546e8883696b2ec72adfb01082e9a4-300x214.jpg 300w, /uploads-archive/2014/02/12546e8883696b2ec72adfb01082e9a4-228x162.jpg 228w, /uploads-archive/2014/02/12546e8883696b2ec72adfb01082e9a4.jpg 1162w" sizes="(max-width: 650px) 100vw, 650px" /></a></p>
<p>&nbsp;</p>
<p><a class="link" href="http://4dd.jp/" target="_blank">FOURDIGIT DESIGN Inc. | 株式会社フォーデジットデザイン</a></p>
<p>&nbsp;</p>
<h3>LIVESENSE made*</h4>
<p>リブセンスさんの採用専用サイトです。<br />
大きな写真をメインにしようし、アクセントがブルー、グレーを基調としています。<br />
スッキリしていてみやすいですね。<br />
こちらも人物紹介に円形の写真を使用しています。</p>
<p><a href="/uploads-archive/2014/02/LIVESENSE-made.jpg"><img decoding="async" loading="lazy" class="alignnone  wp-image-4252" alt="LIVESENSE made" src="/uploads-archive/2014/02/LIVESENSE-made-1024x731.jpg" width="651" height="464" srcset="/uploads-archive/2014/02/LIVESENSE-made-1024x731.jpg 1024w, /uploads-archive/2014/02/LIVESENSE-made-300x214.jpg 300w, /uploads-archive/2014/02/LIVESENSE-made-228x162.jpg 228w, /uploads-archive/2014/02/LIVESENSE-made.jpg 1162w" sizes="(max-width: 651px) 100vw, 651px" /></a></p>
<p>&nbsp;</p>
<p><a class="link" href="http://made.livesense.co.jp/" target="_blank">LIVESENSE made*</a></p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>上記のサイトを見て思ったのが、<br />
サイトの横幅はブラウザいっぱいで枠を設けてなく、<br />
コンテンツ毎の区切りで色を変更したり、<br />
写真を横幅いっぱいで使用したりしていますね。</p>
<p>基本的には縦長で、余白を十分にとり、<br />
スクロールと連動させた動きをつけているサイトも多くありました。</p>
<p>人物紹介で写真を円形にしているサイトが多くあったのがちょっと気になりました。</p>


フラットデザインで制作されたワンカラムの縦長ページサイト7選

<p>地味だけどありがたい機能を提供してくれるプラグイン。</p>
<p>今でも印刷を想定してほしいとの依頼は時々あり、昔は印刷用に別ページを作ってポップアップさせたこともあった。</p>
<p><a class="demo" href="/demo/hoshino/51/">デモ</a></p>
<p>設定は簡単で、まずはこちらからjsファイルをダウンロード。</p>
<p><a href="/demo/hoshino/51/js/jquery.jPrintArea.js" target="_blank">/demo/hoshino/51/js/jquery.jPrintArea.js</a></p>
<p>あとはHTMLに対し</p>

		<div id="crayon-64953fd597c57071736409" class="crayon-syntax crayon-theme-monokai crayon-font-monaco crayon-os-mac print-yes notranslate" data-settings=" minimize scroll-mouseover wrap" style=" margin-top: 12px; margin-bottom: 12px; font-size: 13px !important; line-height: 18px !important;">
		
			<div class="crayon-toolbar" data-settings=" mouseover overlay hide delay" style="font-size: 13px !important;height: 19.5px !important; line-height: 19.5px !important;"><span class="crayon-title"></span>
			<div class="crayon-tools" style="font-size: 13px !important;height: 19.5px !important; line-height: 19.5px !important;"><div class="crayon-button crayon-nums-button" title="Toggle Line Numbers"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-plain-button" title="Toggle Plain Code"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-wrap-button" title="Toggle Line Wrap"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-expand-button" title="Expand Code"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-copy-button" title="Copy"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-popup-button" title="Open Code In New Window"><div class="crayon-button-icon"></div></div><span class="crayon-language">XHTML</span></div></div>
			<div class="crayon-info" style="min-height: 19.5px !important; line-height: 19.5px !important;"></div>
			<div class="crayon-plain-wrap"><textarea  class="crayon-plain print-no" data-settings="dblclick" readonly style="-moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4; font-size: 13px !important; line-height: 18px !important;">
&lt;div id="area1"&gt;
    &lt;img src="images/1.jpg"&gt;
hogehogehogehogehogehogehogehoge
    &lt;p&gt;&lt;input type="button" value="ここまでを印刷" id="btn1"&gt;&lt;/p&gt;
&lt;/div&gt;</textarea></div>
			<div class="crayon-main" style="">
				<table class="crayon-table">
					<tr class="crayon-row">
				<td class="crayon-nums " data-settings="show">
					<div class="crayon-nums-content" style="font-size: 13px !important; line-height: 18px !important;"><div class="crayon-num" data-line="crayon-64953fd597c57071736409-1">1</div><div class="crayon-num crayon-striped-num" data-line="crayon-64953fd597c57071736409-2">2</div><div class="crayon-num" data-line="crayon-64953fd597c57071736409-3">3</div><div class="crayon-num crayon-striped-num" data-line="crayon-64953fd597c57071736409-4">4</div><div class="crayon-num" data-line="crayon-64953fd597c57071736409-5">5</div></div>
				</td>
						<td class="crayon-code"><div class="crayon-pre" style="font-size: 13px !important; line-height: 18px !important; -moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4;"><div class="crayon-line" id="crayon-64953fd597c57071736409-1"><span class="crayon-r ">&lt;div </span><span class="crayon-e ">id</span>=<span class="crayon-s ">"area1"</span><span class="crayon-r ">&gt;</span></div><div class="crayon-line crayon-striped-line" id="crayon-64953fd597c57071736409-2"><span class="crayon-i ">&nbsp;&nbsp;&nbsp;&nbsp;</span><span class="crayon-r ">&lt;img </span><span class="crayon-e ">src</span>=<span class="crayon-s ">"images/1.jpg"</span><span class="crayon-r ">&gt;</span></div><div class="crayon-line" id="crayon-64953fd597c57071736409-3"><span class="crayon-i ">hogehogehogehogehogehogehogehoge</span></div><div class="crayon-line crayon-striped-line" id="crayon-64953fd597c57071736409-4"><span class="crayon-i ">&nbsp;&nbsp;&nbsp;&nbsp;</span><span class="crayon-r ">&lt;p&gt;</span><span class="crayon-r ">&lt;input </span><span class="crayon-e ">type</span>=<span class="crayon-s ">"button"</span><span class="crayon-h"> </span><span class="crayon-e ">value</span>=<span class="crayon-s ">"ここまでを印刷"</span><span class="crayon-h"> </span><span class="crayon-e ">id</span>=<span class="crayon-s ">"btn1"</span><span class="crayon-r ">&gt;</span><span class="crayon-r ">&lt;/p&gt;</span></div><div class="crayon-line" id="crayon-64953fd597c57071736409-5"><span class="crayon-r ">&lt;/div&gt;</span></div></div></td>
					</tr>
				</table>
			</div>
		</div>

<p>JSはこのように実行する。</p>

		<div id="crayon-64953fd597c5b218972402" class="crayon-syntax crayon-theme-monokai crayon-font-monaco crayon-os-mac print-yes notranslate" data-settings=" minimize scroll-mouseover wrap" style=" margin-top: 12px; margin-bottom: 12px; font-size: 13px !important; line-height: 18px !important;">
		
			<div class="crayon-toolbar" data-settings=" mouseover overlay hide delay" style="font-size: 13px !important;height: 19.5px !important; line-height: 19.5px !important;"><span class="crayon-title"></span>
			<div class="crayon-tools" style="font-size: 13px !important;height: 19.5px !important; line-height: 19.5px !important;"><div class="crayon-button crayon-nums-button" title="Toggle Line Numbers"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-plain-button" title="Toggle Plain Code"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-wrap-button" title="Toggle Line Wrap"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-expand-button" title="Expand Code"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-copy-button" title="Copy"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-popup-button" title="Open Code In New Window"><div class="crayon-button-icon"></div></div><span class="crayon-language">JavaScript</span></div></div>
			<div class="crayon-info" style="min-height: 19.5px !important; line-height: 19.5px !important;"></div>
			<div class="crayon-plain-wrap"><textarea  class="crayon-plain print-no" data-settings="dblclick" readonly style="-moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4; font-size: 13px !important; line-height: 18px !important;">
$( '#btn1' ).click( function()
{
	$.jPrintArea( '#area1' );
});</textarea></div>
			<div class="crayon-main" style="">
				<table class="crayon-table">
					<tr class="crayon-row">
				<td class="crayon-nums " data-settings="show">
					<div class="crayon-nums-content" style="font-size: 13px !important; line-height: 18px !important;"><div class="crayon-num" data-line="crayon-64953fd597c5b218972402-1">1</div><div class="crayon-num crayon-striped-num" data-line="crayon-64953fd597c5b218972402-2">2</div><div class="crayon-num" data-line="crayon-64953fd597c5b218972402-3">3</div><div class="crayon-num crayon-striped-num" data-line="crayon-64953fd597c5b218972402-4">4</div></div>
				</td>
						<td class="crayon-code"><div class="crayon-pre" style="font-size: 13px !important; line-height: 18px !important; -moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4;"><div class="crayon-line" id="crayon-64953fd597c5b218972402-1"><span class="crayon-sy">$</span><span class="crayon-sy">(</span><span class="crayon-h"> </span><span class="crayon-s">'#btn1'</span><span class="crayon-h"> </span><span class="crayon-sy">)</span><span class="crayon-sy">.</span><span class="crayon-e">click</span><span class="crayon-sy">(</span><span class="crayon-h"> </span><span class="crayon-t">function</span><span class="crayon-sy">(</span><span class="crayon-sy">)</span></div><div class="crayon-line crayon-striped-line" id="crayon-64953fd597c5b218972402-2"><span class="crayon-sy">{</span></div><div class="crayon-line" id="crayon-64953fd597c5b218972402-3"><span class="crayon-h">	</span><span class="crayon-sy">$</span><span class="crayon-sy">.</span><span class="crayon-e">jPrintArea</span><span class="crayon-sy">(</span><span class="crayon-h"> </span><span class="crayon-s">'#area1'</span><span class="crayon-h"> </span><span class="crayon-sy">)</span><span class="crayon-sy">;</span></div><div class="crayon-line crayon-striped-line" id="crayon-64953fd597c5b218972402-4"><span class="crayon-sy">}</span><span class="crayon-sy">)</span><span class="crayon-sy">;</span></div></div></td>
					</tr>
				</table>
			</div>
		</div>

<p>&nbsp;</p>
<p>製品一覧とかマニュアルとかスペック表などでわざわざPDFにしていた場合も使えそう。</p>
<p>&nbsp;</p>
<p>&nbsp;</p>

印刷範囲を指定できるjQueryプラグイン

<h2>ミャンマーへの国別入国者数</h3>
<p><img decoding="async" src="/uploads-archive/2014/02/yangon.png" alt="" width="650"></p>
<p>日本人の数は一年間で倍以上増えて2位まで登りました。</p>
<h2>ヤンゴン日本人商工会議所の会員数推移</h3>
<p><img decoding="async" src="/uploads-archive/2014/02/yangon_nihon.png" alt="" width="650"></p>
<h2>外国投資の国別認可額(1989年~2013年10月末)</h3>
<p><img decoding="async" src="/uploads-archive/2014/02/bunya1.png" alt="" width="350"></p>
<h2>外国投資の分野別認可額(1989年~2013年10月末)</h3>
<p><img decoding="async" src="/uploads-archive/2014/02/bunya2.png" alt="" width="350"></p>


ミャンマービジネス変化の調査

<p>There are many ways to set up a Android mobile development environment.</p>
<p><strong>1) Android Studio(based on IntelliJ IDEA IDE)</strong></p>
<p>http://developer.android.com/sdk/installing/studio.html</p>
<p>This is the easiest way to start an Android dev env as a beginner. Please just download:</p>
<p><em>For window,</em></p>
<p><span style="font-family: Arial, Helvetica, sans-serif; font-size: small;"> android-studio-bundle-&lt;version&gt;.exe</span></p>
<p><em>For Mac,</em></p>
<p>android-studio-bundle-&lt;version&gt;.dmg</p>
<p><em>For Linux,</em></p>
<p>android-studio-bundle-&lt;version&gt;.tgz</p>
<ol>
<li>Unpack the downloaded Tar file</li>
<li>To launch Android Studio, navigate to the <code>android-studio/bin/</code> directory in a terminal and execute <code>studio.sh</code>. [Ref: http://developer.android.com/sdk/installing/studio.html]</li>
</ol>
<p><strong>2) Android Developer Tools (ADT Bundle &#8211; Eclipse with the ADT Plugin)</strong></p>
<p>http://developer.android.com/sdk/index.html</p>
<p>Please just download respective .zip file for selected OS.</p>
<p><strong>3) Eclipse (IDE) + Android SDK</strong></p>
<p>You need to install Eclipse IDE. Assume that you have already install JAVA SDK (http://www.oracle.com/technetwork/java/javase/downloads/index.html).</p>
<p>You need to download Android SDK from &#8220;<strong>SDK Tools Only</strong>&#8221; sections of http://developer.android.com/sdk/index.html.</p>
<p>When you set up Eclipse for android development, you need to link Eclipse with respective JAVA SDK and android SDK manually.</p>
<p><strong>4) IntelliJ (IDE) + Android SDK</strong></p>
<p>Download IntelliJ IDE from this link: http://www.jetbrains.com/idea/</p>
<p>You are assumed that you&#8217;ve already installed JAVA SDK.</p>
<p>Download Android SDK from &#8220;<strong>SDK Tools Only</strong>&#8221; section of http://developer.android.com/sdk/index.html</p>
<p>When you set up IntelliJ for android development, you need to link IntelliJ with respective JAVA SDK and android SDK manually.</p>
<p>Enjoy!!!</p>


Easy ways to setting up an Android Dev

<p>日本語フォントでは、基本一つ一つの文字が等幅で作られていることがほとんどで、</p>
<p>ウェブサイト上でテキストによって文字組をした場合に、不自然な文字間隔になってしまう場所が出てきます。</p>
<p>フラットデザインやレスポンシブデザインが標準化傾向にある今、</p>
<p>ウェブサイトでの文字は文章はもちろんのこと、テキストにおいても画像を使わずテキストを使う必要性が高まってきており、</p>
<p>日本語フォント独特の文字間隔の不自然さが、ウェブデザインでの障害となることもあります。</p>
<p>&nbsp;</p>
<p>そんな中、ウェブページのテキストの文字詰めを自動でしてくれるJSが公開されていましたので、</p>
<p>こちらをご紹介いたします。</p>
<p><a class="link" href="http://fladdict.net/blog/2011/02/auto-kerning.html" target="_blank">HTMLで文字詰めするタイポグラフィー用JS</a></p>
<p>ファイルはこちらのサイトよりダウンロードください。</p>
<p>&nbsp;</p>
<p>↓DEMO作ってみました。</p>
<p><a class="demo" title="DEMO" href="/demo/ninomiya/40/" target="_blank">DEMO</a></p>
<p>&nbsp;</p>
<h2>使い方</h3>
<p>まず、jQueryとダウンロードした文字詰めのJSファイルを読み込みます。</p>

		<div id="crayon-64953fd597a64243774703" class="crayon-syntax crayon-theme-monokai crayon-font-monaco crayon-os-mac print-yes notranslate" data-settings=" minimize scroll-mouseover wrap" style=" margin-top: 12px; margin-bottom: 12px; font-size: 13px !important; line-height: 18px !important;">
		
			<div class="crayon-toolbar" data-settings=" mouseover overlay hide delay" style="font-size: 13px !important;height: 19.5px !important; line-height: 19.5px !important;"><span class="crayon-title">HTML</span>
			<div class="crayon-tools" style="font-size: 13px !important;height: 19.5px !important; line-height: 19.5px !important;"><div class="crayon-button crayon-nums-button" title="Toggle Line Numbers"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-plain-button" title="Toggle Plain Code"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-wrap-button" title="Toggle Line Wrap"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-expand-button" title="Expand Code"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-copy-button" title="Copy"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-popup-button" title="Open Code In New Window"><div class="crayon-button-icon"></div></div><span class="crayon-language">XHTML</span></div></div>
			<div class="crayon-info" style="min-height: 19.5px !important; line-height: 19.5px !important;"></div>
			<div class="crayon-plain-wrap"><textarea  class="crayon-plain print-no" data-settings="dblclick" readonly style="-moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4; font-size: 13px !important; line-height: 18px !important;">
&lt;script type="text/javascript" src="js/jquery-1.9.1.min.js"&gt;&lt;/script&gt;
&lt;script type="text/javascript" src="js/FLAutoKerning.js"&gt;&lt;/script&gt;</textarea></div>
			<div class="crayon-main" style="">
				<table class="crayon-table">
					<tr class="crayon-row">
				<td class="crayon-nums " data-settings="show">
					<div class="crayon-nums-content" style="font-size: 13px !important; line-height: 18px !important;"><div class="crayon-num" data-line="crayon-64953fd597a64243774703-1">1</div><div class="crayon-num crayon-striped-num" data-line="crayon-64953fd597a64243774703-2">2</div></div>
				</td>
						<td class="crayon-code"><div class="crayon-pre" style="font-size: 13px !important; line-height: 18px !important; -moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4;"><div class="crayon-line" id="crayon-64953fd597a64243774703-1"><span class="crayon-ta">&lt;script </span><span class="crayon-e ">type</span>=<span class="crayon-s">"text/javascript"</span><span class="crayon-h"> </span><span class="crayon-e ">src</span>=<span class="crayon-s">"js/jquery-1.9.1.min.js"</span><span class="crayon-h">&gt;</span><span class="crayon-ta">&lt;/script&gt;</span></div><div class="crayon-line crayon-striped-line" id="crayon-64953fd597a64243774703-2"><span class="crayon-ta">&lt;script </span><span class="crayon-e ">type</span>=<span class="crayon-s">"text/javascript"</span><span class="crayon-h"> </span><span class="crayon-e ">src</span>=<span class="crayon-s">"js/FLAutoKerning.js"</span><span class="crayon-h">&gt;</span><span class="crayon-ta">&lt;/script&gt;</span></div></div></td>
					</tr>
				</table>
			</div>
		</div>

<p>&nbsp;</p>
<p>次に、文字詰めを行うHTML要素に、</p>
<p>FLAutoKerning.process($(&#8216;対象の要素&#8217;));</p>
<p>と行った形でスクリプトをあてます。</p>

		<div id="crayon-64953fd597a68292024937" class="crayon-syntax crayon-theme-monokai crayon-font-monaco crayon-os-mac print-yes notranslate" data-settings=" minimize scroll-mouseover wrap" style=" margin-top: 12px; margin-bottom: 12px; font-size: 13px !important; line-height: 18px !important;">
		
			<div class="crayon-toolbar" data-settings=" mouseover overlay hide delay" style="font-size: 13px !important;height: 19.5px !important; line-height: 19.5px !important;"><span class="crayon-title"></span>
			<div class="crayon-tools" style="font-size: 13px !important;height: 19.5px !important; line-height: 19.5px !important;"><div class="crayon-button crayon-nums-button" title="Toggle Line Numbers"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-plain-button" title="Toggle Plain Code"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-wrap-button" title="Toggle Line Wrap"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-expand-button" title="Expand Code"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-copy-button" title="Copy"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-popup-button" title="Open Code In New Window"><div class="crayon-button-icon"></div></div><span class="crayon-language">JavaScript</span></div></div>
			<div class="crayon-info" style="min-height: 19.5px !important; line-height: 19.5px !important;"></div>
			<div class="crayon-plain-wrap"><textarea  class="crayon-plain print-no" data-settings="dblclick" readonly style="-moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4; font-size: 13px !important; line-height: 18px !important;">
$(function(){
	FLAutoKerning.process($('.group2 h1'));
	FLAutoKerning.process($('.group2 nav li a'));
	FLAutoKerning.process($('.group2 h2'));
	FLAutoKerning.process($('.group2 section .text'));
});</textarea></div>
			<div class="crayon-main" style="">
				<table class="crayon-table">
					<tr class="crayon-row">
				<td class="crayon-nums " data-settings="show">
					<div class="crayon-nums-content" style="font-size: 13px !important; line-height: 18px !important;"><div class="crayon-num" data-line="crayon-64953fd597a68292024937-1">1</div><div class="crayon-num crayon-striped-num" data-line="crayon-64953fd597a68292024937-2">2</div><div class="crayon-num" data-line="crayon-64953fd597a68292024937-3">3</div><div class="crayon-num crayon-striped-num" data-line="crayon-64953fd597a68292024937-4">4</div><div class="crayon-num" data-line="crayon-64953fd597a68292024937-5">5</div><div class="crayon-num crayon-striped-num" data-line="crayon-64953fd597a68292024937-6">6</div></div>
				</td>
						<td class="crayon-code"><div class="crayon-pre" style="font-size: 13px !important; line-height: 18px !important; -moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4;"><div class="crayon-line" id="crayon-64953fd597a68292024937-1"><span class="crayon-sy">$</span><span class="crayon-sy">(</span><span class="crayon-t">function</span><span class="crayon-sy">(</span><span class="crayon-sy">)</span><span class="crayon-sy">{</span></div><div class="crayon-line crayon-striped-line" id="crayon-64953fd597a68292024937-2"><span class="crayon-h">	</span><span class="crayon-i">FLAutoKerning</span><span class="crayon-sy">.</span><span class="crayon-e">process</span><span class="crayon-sy">(</span><span class="crayon-sy">$</span><span class="crayon-sy">(</span><span class="crayon-s">'.group2 h1'</span><span class="crayon-sy">)</span><span class="crayon-sy">)</span><span class="crayon-sy">;</span></div><div class="crayon-line" id="crayon-64953fd597a68292024937-3"><span class="crayon-h">	</span><span class="crayon-i">FLAutoKerning</span><span class="crayon-sy">.</span><span class="crayon-e">process</span><span class="crayon-sy">(</span><span class="crayon-sy">$</span><span class="crayon-sy">(</span><span class="crayon-s">'.group2 nav li a'</span><span class="crayon-sy">)</span><span class="crayon-sy">)</span><span class="crayon-sy">;</span></div><div class="crayon-line crayon-striped-line" id="crayon-64953fd597a68292024937-4"><span class="crayon-h">	</span><span class="crayon-i">FLAutoKerning</span><span class="crayon-sy">.</span><span class="crayon-e">process</span><span class="crayon-sy">(</span><span class="crayon-sy">$</span><span class="crayon-sy">(</span><span class="crayon-s">'.group2 h2'</span><span class="crayon-sy">)</span><span class="crayon-sy">)</span><span class="crayon-sy">;</span></div><div class="crayon-line" id="crayon-64953fd597a68292024937-5"><span class="crayon-h">	</span><span class="crayon-i">FLAutoKerning</span><span class="crayon-sy">.</span><span class="crayon-e">process</span><span class="crayon-sy">(</span><span class="crayon-sy">$</span><span class="crayon-sy">(</span><span class="crayon-s">'.group2 section .text'</span><span class="crayon-sy">)</span><span class="crayon-sy">)</span><span class="crayon-sy">;</span></div><div class="crayon-line crayon-striped-line" id="crayon-64953fd597a68292024937-6"><span class="crayon-sy">}</span><span class="crayon-sy">)</span><span class="crayon-sy">;</span></div></div></td>
					</tr>
				</table>
			</div>
		</div>

<p>これで文字詰めが行われます。</p>
<p>文字詰めを行う文字一つ一つが&lt;span&gt;で囲まれますので、&lt;span&gt;で文字の大きさや色などを指定していたりする場合は注意が必要です。</p>
<p>&nbsp;</p>
<p>全体として文字の間にできる不自然な空白が抑えられ、</p>
<p>特に句読点や括弧などの前後にできる大きな空白が抑えられているので、</p>
<p>まとまった感じがします。</p>
<p>&nbsp;</p>
<p>等幅でなくなるため、行の終わりが揃わなくなるという問題が出てくるため、</p>
<p>タイトルやキャッチコピーなどでの利用に抑えたり、</p>
<p>センタリングや右寄せした文章のような、行の終わりをそろえる必要がないような箇所に使うなどの利用法がいいかもしれません。</p>

日本語の文字詰め(カーニング)を自動で調整してくれるjQuery

vagrant

<p>wordpressでお問い合わせを設置するとなれば、高い確率でこのプラグインが導入されますが、</p>
<p>ちょっといろいろ問題とまでは言いませんが、引っかかるポイントがあります。</p>
<p>&nbsp;</p>
<p>・確認画面がでない</p>
<p>・スパムがけっこうくる</p>
<p>・メール返信がなんか変</p>
<p>&nbsp;</p>
<p>地味に困ることがありますね笑</p>
<p>&nbsp;</p>
<p>その対策をすることがあるので、その解決で参考になったブログを紹介したいと思います。</p>
<p>&nbsp;</p>
<h2>確認画面がでない</h3>
<p>まずこちらですが、確認画面を出すようにすることができるという噂を聞いたことがあるのですが、<br />
まだ試してことはありません。</p>
<p>確認画面が出るプラグインもあるみたいので、<br />
どうしても確認画面が欲しい人は以下のプラグインを使ってみてはいかがでしょうか。</p>
<p><a href="http://hinagata.biz/plugin/inquiry-form-creator/">【inquiry form creator】簡単３ステップで確認画面付きの問い合わせフォームが設置できるWordPressプラグイン &#8211; ひなログ</a></p>
<p>次の項目とかぶるのですが、<br />
確認画面を表示しなくても以下のブログのようにすれば十分な気がします。</p>
<p><a href="http://bizvektor.com/plugins/contactform7/" target="_blank">意外と知らない !? お問い合わせフォーム「Contact Form 7」をもっと便利に使いこなすための3つのポイント | プラグイン紹介 | BizVektor [ ビズベクトル ] スマホ対応無料WordPressテーマ（テンプレート）</a></p>
<h2>スパムがけっこうくる</h3>
<p>こちらも少々やっかいで、通常通り設置すると、<br />
スパムがどんどん来ます。</p>
<p>うちのサイトもよく来ていたので、画像認証的なものを導入しました。<br />
ただ、これはもうひとつ別のプラグインを入れないといけないし、<br />
ユーザーもめんどくさいかと思います。</p>
<p>こちらのブログのようにすれば僕が行った対策より簡単です！</p>
<p><a href="http://curious-everything.com/1089-entry.html">Contact Form 7 に追加すればスパムが届かなくなる魔法の1行 | 毎日興味津々</a></p>
<h2>メール返信がなんか変</h3>
<p>これはお問い合わせからくるメールのfromがおかしかったり、<br />
迷惑メールに届いちゃったりということが起こってしまう件です。</p>
<p>これはこのプラグインの設定でサーバーを経由してしまうからうんぬんかんぬんらしいですが、<br />
そこらへんのことはよくわからないので、完璧に理解していませんが、そちらを解決するためのブログが以下になります。</p>
<p><a href="http://www.ssw2005.net/968" target="_blank">ContactForm7から送信すると迷惑メールと判別される場合の対応方法 | えびす商売繁盛マーケティング</a></p>
<p><a href="http://coneta.jp/2579.html" target="_blank">WordPress(ワードプレス) SMTPサーバを変更できるプラグイン「WP Mail SMTP」 | CONETA.JP</a></p>
<p>もっといいプラグインが現れるようなそんな気がします。。。</p>


wordpressの『contact form 7』プラグインをもっと使いこなすためのTIPS

<p>前回、リストバンド型のウェアラブルデバイスを紹介しましたので、今回は、Googleグラスといったデバイスが話題沸騰しているメガネ型ウェアラブルデバイスをまとめてみました。</p>
<article>
<h2>Googleグラス</h3>
<p><a href="/uploads-archive/2014/02/imgres1.jpg"><img decoding="async" loading="lazy" alt="imgres" src="/uploads-archive/2014/02/imgres1.jpg" width="300" height="168" /></a></p>
<p>言わずとしれたGoogleのスマートグラス</p>
<p>網膜に映像を映しだすバーチャルディスプレイ</p>
<p><a href="http://www.google.com/glass/start/ " target="_blank">http://www.google.com/glass/start/ </a></p>
<h2>Telepathy One</h3>
<p><a href="/uploads-archive/2014/02/imgres2.jpg"><img decoding="async" loading="lazy" alt="imgres" src="/uploads-archive/2014/02/imgres2-300x157.jpg" width="300" height="157" /></a></p>
<p>セカイカメラで知られた頓智ドットの元代表が新たに手がける国産のスマートグラス</p>
<p>コミュニケーションツールとしての映像を残すといったところを売りに出している。GoogleGlass同様にバーチャルディスプレイ</p>
<p><a href="http://tele-pathy.org/" target="_blank">http://tele-pathy.org/</a></p>
<h2>MOVERIO BT-200</h3>
<p><a href="/uploads-archive/2014/02/imgres4.jpg"><img decoding="async" loading="lazy" alt="imgres" src="/uploads-archive/2014/02/imgres4.jpg" width="275" height="183" /></a></p>
<p>日本のメーカーEPSONもスマートグラスに参戦</p>
<p>映像が投影されるパーソナルシアターを強調しています。</p>
<p><a href="http://www.epson.jp/products/moverio/bt200/" target="_blank">http://www.epson.jp/products/moverio/bt200/</a></p>
<p>&nbsp;</p>
<h2>M100スマートグラス</h3>
<p><a href="/uploads-archive/2014/02/imgres3.jpg"><img decoding="async" loading="lazy" alt="imgres" src="/uploads-archive/2014/02/imgres3.jpg" width="286" height="176" /></a></p>
<p>こちらもどちらかというと、Android端末でできることを強調しているスマートグラス</p>
<p><a href="http://www.vuzix.co.jp/shop/item_detail?category_id=0&amp;item_id=925952" target="_blank">http://www.vuzix.co.jp/shop/item_detail?category_id=0&amp;item_id=925952</a></p>
<h2>まとめ</h3>
<p>やはり本命はGoogleGlassといったところでしょうか？</p>
<p>こうしてみると前者の２つがコミュニケーションを売りにしているのに対し、後者の２つは映像を目の前に投影する、メガネ型のAndroid機といったところを強調しており、目指すべきところが全く異なることが分かった。</p>
</article>
<div></div>


メガネ型ウェアラブルデバイスもいよいよ流行の兆し

<p>ZNAPとはQRを使った決済プラットフォーム。</p>
<p><a href="http://consumer.znap.com/" target="_blank">http://consumer.znap.com/</a></p>
<p>香港に拠点を置くMPayMe社が展開するサービスで、実は昨年から日本版が公開されていたとのことだが</p>
<p>知らなかったので使ってみた。</p>
<p>&nbsp;</p>
<p>まずはアプリをダウンロードする。</p>
<p><a href="/uploads-archive/2014/02/36c8c9261c98e7c1b7d7d5e14410cdda.png"><img decoding="async" loading="lazy" class="aligncenter size-medium wp-image-4183" alt="写真 1" src="/uploads-archive/2014/02/36c8c9261c98e7c1b7d7d5e14410cdda-200x300.png" width="200" height="300" srcset="/uploads-archive/2014/02/36c8c9261c98e7c1b7d7d5e14410cdda-200x300.png 200w, /uploads-archive/2014/02/36c8c9261c98e7c1b7d7d5e14410cdda-228x342.png 228w, /uploads-archive/2014/02/36c8c9261c98e7c1b7d7d5e14410cdda.png 640w" sizes="(max-width: 200px) 100vw, 200px" /></a></p>
<p>&nbsp;</p>
<p>個人情報を登録して会員登録。</p>
<p>登録後クレジットカード情報を予め登録しておくとすぐに使える模様。</p>
<p>ただし現在はVISAとMasterのみ対応しているらしい。(今後はその他カードと銀行引き落としも対応するとのこと)</p>
<p><a href="/uploads-archive/2014/02/d97c50263c64191b4a87e849b78211fe.png"><img decoding="async" loading="lazy" class="aligncenter size-medium wp-image-4185" alt="写真 2" src="/uploads-archive/2014/02/d97c50263c64191b4a87e849b78211fe-200x300.png" width="200" height="300" srcset="/uploads-archive/2014/02/d97c50263c64191b4a87e849b78211fe-200x300.png 200w, /uploads-archive/2014/02/d97c50263c64191b4a87e849b78211fe-228x342.png 228w, /uploads-archive/2014/02/d97c50263c64191b4a87e849b78211fe.png 640w" sizes="(max-width: 200px) 100vw, 200px" /></a></p>
<p>&nbsp;</p>
<p>QRを読み込む画面はこんな感じ</p>
<p><a href="/uploads-archive/2014/02/cb21c53e01edf9fb25f6ab527a681e99.png"><img decoding="async" loading="lazy" class="aligncenter size-medium wp-image-4186" alt="写真 3" src="/uploads-archive/2014/02/cb21c53e01edf9fb25f6ab527a681e99-200x300.png" width="200" height="300" srcset="/uploads-archive/2014/02/cb21c53e01edf9fb25f6ab527a681e99-200x300.png 200w, /uploads-archive/2014/02/cb21c53e01edf9fb25f6ab527a681e99-228x342.png 228w, /uploads-archive/2014/02/cb21c53e01edf9fb25f6ab527a681e99.png 640w" sizes="(max-width: 200px) 100vw, 200px" /></a>デモ用のQRがなかったのでキャプチャはここまで。</p>
<p>&nbsp;</p>
<p>買う方としては簡単に取り出して決済ができて、なおかつポイントがたまるので便利。</p>
<p>何がすごいかというのを以下自分なりにまとめてみた。</p>
<p>&nbsp;</p>
<h2> ポスターから直購入</h3>
<p>電車の待ち時間に目の前のポスターから直接購入できる。</p>
<p>また、これはポスターだけではなくカタログやフライヤーなど全ての紙媒体に言えることだ。</p>
<p>今まで成果が見えづらかった屋外広告がトレースできるだけでなく直接売上につながるのは新しい感覚だ。</p>
<p>&nbsp;</p>
<h2>小規模小売店で</h3>
<p>SquareやCoineyは結局設備投資を抑えたい小さな小売店に強いニーズがあるが<br />
ZNAPはそれらに必要な一切の端末が不要。</p>
<p>お品書きにQRをそれぞれ記載しておくこともできるし、<br />
合計金額を計算後画面にQRが出るようにすればトータルでの会計もきる。</p>
<p>むしろクレジットカードを持っている必要はない。</p>
<p>実は飲食店バージョンはZNAP自らコンセプトショップをやっているとのこと。</p>
<p><a href="http://consumer.znap.com/ja_JP/znap-news-press.html#znap-qrbar_16" target="_blank"> http://consumer.znap.com/ja_JP/znap-news-press.html#znap-qrbar_16</a></p>
<p>手数料も安く、3.24％とのこと。</p>
<p>&nbsp;</p>
<h2>販促</h3>
<p>提携店舗のクーポン情報を受け取れる。(使い込んでいないがおそらく位置情報でクーポンを受け取れる)</p>
<p>また、購入履歴には商品情報の他に位置情報も記憶されており、ニーズを抽出してクーポンをレコメンドできる。</p>
<p>あとはポイントがたまるので利用価値も高くなる。</p>
<p>&nbsp;</p>
<h2>まとめ</h3>
<p>非常によく出来た良い仕組みと思うが、最終的には対応店舗がネックになると思うので</p>
<p>これからはマーケティングが最も重要と感じた。</p>
<p>過去記事などを見ると計画的にマーケティングをしているようで、トータルで期待できる気がする。</p>
<p>あとはどこか大規模な超有名店が対応するなどして一気に広がるかもしれない。</p>
<p>ジャンルはわからないが、動きやすく競争過多である飲食店などで導入されるかもしれない。</p>


あらゆる場所が店になるZNAP

jQueryとWebフォントでスマホの傾きで色の変わるアイコンを作ってみる

<p>PHPには、関数の引数の対象が変数のみになるものがあります。<br />
一番よく使うのは多分issetやemptyになります。<br />
ありがちかつ訳分からないミスは、関数を引数として、issetやemptyに渡すことです。<br />
サンプルコードを見てみましょう。</p>
<p></p>

		<div id="crayon-64953fd597400981650628" class="crayon-syntax crayon-theme-monokai crayon-font-monaco crayon-os-mac print-yes notranslate" data-settings=" minimize scroll-mouseover wrap" style=" margin-top: 12px; margin-bottom: 12px; font-size: 13px !important; line-height: 18px !important;">
		
			<div class="crayon-toolbar" data-settings=" mouseover overlay hide delay" style="font-size: 13px !important;height: 19.5px !important; line-height: 19.5px !important;"><span class="crayon-title"></span>
			<div class="crayon-tools" style="font-size: 13px !important;height: 19.5px !important; line-height: 19.5px !important;"><div class="crayon-button crayon-nums-button" title="Toggle Line Numbers"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-plain-button" title="Toggle Plain Code"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-wrap-button" title="Toggle Line Wrap"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-expand-button" title="Expand Code"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-copy-button" title="Copy"><div class="crayon-button-icon"></div></div><div class="crayon-button crayon-popup-button" title="Open Code In New Window"><div class="crayon-button-icon"></div></div><span class="crayon-language">PHP</span></div></div>
			<div class="crayon-info" style="min-height: 19.5px !important; line-height: 19.5px !important;"></div>
			<div class="crayon-plain-wrap"><textarea  class="crayon-plain print-no" data-settings="dblclick" readonly style="-moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4; font-size: 13px !important; line-height: 18px !important;">
&lt;?php
$user = new User();
// 正
if (isset($user-&gt;name) &amp;&amp; !empty($user-&gt;name)) {
	// 直接属性(変数)を使うならOK→nameはpublicだから外部からもアクセスできる
}
// 誤
if (isset($user-&gt;getAge()) &amp;&amp; !empty($user-&gt;getAge())) {
	// issetやemptyに関数（メソッド）は使えない→syntax errorになる
	// Fatal error: Can't use function return value in write context 
}
// これならOK
$age = $user-&gt;getAge();
if (isset($age) &amp;&amp; !empty($age)) {

}

class User
{
	public $name;

	private $age;

    public function getName()
    {
        return $this-&gt;name;
    }

    public function setName($name)
    {
        $this-&gt;name = $name;
    }


    public function getAge()
    {
        return $this-&gt;age;
    }

    public function setAge($age)
    {
        $this-&gt;age = $age;
    }

}</textarea></div>
			<div class="crayon-main" style="">
				<table class="crayon-table">
					<tr class="crayon-row">
				<td class="crayon-nums " data-settings="show">
					<div class="crayon-nums-content" style="font-size: 13px !important; line-height: 18px !important;"><div class="crayon-num" data-line="crayon-64953fd597400981650628-1">1</div><div class="crayon-num crayon-striped-num" data-line="crayon-64953fd597400981650628-2">2</div><div class="crayon-num" data-line="crayon-64953fd597400981650628-3">3</div><div class="crayon-num crayon-striped-num" data-line="crayon-64953fd597400981650628-4">4</div><div class="crayon-num" data-line="crayon-64953fd597400981650628-5">5</div><div class="crayon-num crayon-striped-num" data-line="crayon-64953fd597400981650628-6">6</div><div class="crayon-num" data-line="crayon-64953fd597400981650628-7">7</div><div class="crayon-num crayon-striped-num" data-line="crayon-64953fd597400981650628-8">8</div><div class="crayon-num" data-line="crayon-64953fd597400981650628-9">9</div><div class="crayon-num crayon-striped-num" data-line="crayon-64953fd597400981650628-10">10</div><div class="crayon-num" data-line="crayon-64953fd597400981650628-11">11</div><div class="crayon-num crayon-striped-num" data-line="crayon-64953fd597400981650628-12">12</div><div class="crayon-num" data-line="crayon-64953fd597400981650628-13">13</div><div class="crayon-num crayon-striped-num" data-line="crayon-64953fd597400981650628-14">14</div><div class="crayon-num" data-line="crayon-64953fd597400981650628-15">15</div><div class="crayon-num crayon-striped-num" data-line="crayon-64953fd597400981650628-16">16</div><div class="crayon-num" data-line="crayon-64953fd597400981650628-17">17</div><div class="crayon-num crayon-striped-num" data-line="crayon-64953fd597400981650628-18">18</div><div class="crayon-num" data-line="crayon-64953fd597400981650628-19">19</div><div class="crayon-num crayon-striped-num" data-line="crayon-64953fd597400981650628-20">20</div><div class="crayon-num" data-line="crayon-64953fd597400981650628-21">21</div><div class="crayon-num crayon-striped-num" data-line="crayon-64953fd597400981650628-22">22</div><div class="crayon-num" data-line="crayon-64953fd597400981650628-23">23</div><div class="crayon-num crayon-striped-num" data-line="crayon-64953fd597400981650628-24">24</div><div class="crayon-num" data-line="crayon-64953fd597400981650628-25">25</div><div class="crayon-num crayon-striped-num" data-line="crayon-64953fd597400981650628-26">26</div><div class="crayon-num" data-line="crayon-64953fd597400981650628-27">27</div><div class="crayon-num crayon-striped-num" data-line="crayon-64953fd597400981650628-28">28</div><div class="crayon-num" data-line="crayon-64953fd597400981650628-29">29</div><div class="crayon-num crayon-striped-num" data-line="crayon-64953fd597400981650628-30">30</div><div class="crayon-num" data-line="crayon-64953fd597400981650628-31">31</div><div class="crayon-num crayon-striped-num" data-line="crayon-64953fd597400981650628-32">32</div><div class="crayon-num" data-line="crayon-64953fd597400981650628-33">33</div><div class="crayon-num crayon-striped-num" data-line="crayon-64953fd597400981650628-34">34</div><div class="crayon-num" data-line="crayon-64953fd597400981650628-35">35</div><div class="crayon-num crayon-striped-num" data-line="crayon-64953fd597400981650628-36">36</div><div class="crayon-num" data-line="crayon-64953fd597400981650628-37">37</div><div class="crayon-num crayon-striped-num" data-line="crayon-64953fd597400981650628-38">38</div><div class="crayon-num" data-line="crayon-64953fd597400981650628-39">39</div><div class="crayon-num crayon-striped-num" data-line="crayon-64953fd597400981650628-40">40</div><div class="crayon-num" data-line="crayon-64953fd597400981650628-41">41</div><div class="crayon-num crayon-striped-num" data-line="crayon-64953fd597400981650628-42">42</div><div class="crayon-num" data-line="crayon-64953fd597400981650628-43">43</div><div class="crayon-num crayon-striped-num" data-line="crayon-64953fd597400981650628-44">44</div><div class="crayon-num" data-line="crayon-64953fd597400981650628-45">45</div></div>
				</td>
						<td class="crayon-code"><div class="crayon-pre" style="font-size: 13px !important; line-height: 18px !important; -moz-tab-size:4; -o-tab-size:4; -webkit-tab-size:4; tab-size:4;"><div class="crayon-line" id="crayon-64953fd597400981650628-1"><span class="crayon-ta">&lt;?php</span></div><div class="crayon-line crayon-striped-line" id="crayon-64953fd597400981650628-2"><span class="crayon-v">$user</span><span class="crayon-h"> </span>=<span class="crayon-h"> </span><span class="crayon-r">new</span><span class="crayon-h"> </span><span class="crayon-e">User</span><span class="crayon-sy">(</span><span class="crayon-sy">)</span><span class="crayon-sy">;</span></div><div class="crayon-line" id="crayon-64953fd597400981650628-3"><span class="crayon-c">// 正</span></div><div class="crayon-line crayon-striped-line" id="crayon-64953fd597400981650628-4"><span class="crayon-st">if</span><span class="crayon-h"> </span><span class="crayon-sy">(</span><span class="crayon-k ">isset</span><span class="crayon-sy">(</span><span class="crayon-v">$user</span>-<span class="crayon-h">&gt;</span><span class="crayon-i">name</span><span class="crayon-sy">)</span><span class="crayon-h"> </span><span class="crayon-sy">&amp;&amp; !empty($user-&gt;name)) {</span></div><div class="crayon-line" id="crayon-64953fd597400981650628-5"><span class="crayon-sy">	// 直接属性(変数)を使うならOK→nameはpublicだから外部からもアクセスできる</span></div><div class="crayon-line crayon-striped-line" id="crayon-64953fd597400981650628-6"><span class="crayon-sy">}</span></div><div class="crayon-line" id="crayon-64953fd597400981650628-7"><span class="crayon-sy">// 誤</span></div><div class="crayon-line crayon-striped-line" id="crayon-64953fd597400981650628-8"><span class="crayon-sy">if (isset($user-&gt;getAge()) &amp;&amp; !empty($user-&gt;getAge())) {</span></div><div class="crayon-line" id="crayon-64953fd597400981650628-9"><span class="crayon-sy">	// issetやemptyに関数（メソッド）は使えない→syntax errorになる</span></div><div class="crayon-line crayon-striped-line" id="crayon-64953fd597400981650628-10"><span class="crayon-sy">	// Fatal error: Can't use function return value in write context </span></div><div class="crayon-line" id="crayon-64953fd597400981650628-11"><span class="crayon-sy">}</span></div><div class="crayon-line crayon-striped-line" id="crayon-64953fd597400981650628-12"><span class="crayon-sy">// これならOK</span></div><div class="crayon-line" id="crayon-64953fd597400981650628-13"><span class="crayon-sy">$age = $user-&gt;getAge();</span></div><div class="crayon-line crayon-striped-line" id="crayon-64953fd597400981650628-14"><span class="crayon-st">if</span><span class="crayon-h"> </span><span class="crayon-sy">(</span><span class="crayon-k ">isset</span><span class="crayon-sy">(</span><span class="crayon-v">$age</span><span class="crayon-sy">)</span><span class="crayon-h"> </span><span class="crayon-sy">&amp;&amp; !empty($age)) {</span></div><div class="crayon-line" id="crayon-64953fd597400981650628-15">&nbsp;</div><div class="crayon-line crayon-striped-line" id="crayon-64953fd597400981650628-16"><span class="crayon-sy">}</span></div><div class="crayon-line" id="crayon-64953fd597400981650628-17">&nbsp;</div><div class="crayon-line crayon-striped-line" id="crayon-64953fd597400981650628-18"><span class="crayon-sy">class User</span></div><div class="crayon-line" id="crayon-64953fd597400981650628-19"><span class="crayon-sy">{</span></div><div class="crayon-line crayon-striped-line" id="crayon-64953fd597400981650628-20"><span class="crayon-sy">	public $name;</span></div><div class="crayon-line" id="crayon-64953fd597400981650628-21">&nbsp;</div><div class="crayon-line crayon-striped-line" id="crayon-64953fd597400981650628-22"><span class="crayon-h">	</span><span class="crayon-m">private</span><span class="crayon-h"> </span><span class="crayon-v">$age</span><span class="crayon-sy">;</span></div><div class="crayon-line" id="crayon-64953fd597400981650628-23">&nbsp;</div><div class="crayon-line crayon-striped-line" id="crayon-64953fd597400981650628-24"><span class="crayon-h">&nbsp;&nbsp;&nbsp;&nbsp;</span><span class="crayon-m">public</span><span class="crayon-h"> </span><span class="crayon-t">function</span><span class="crayon-h"> </span><span class="crayon-e">getName</span><span class="crayon-sy">(</span><span class="crayon-sy">)</span></div><div class="crayon-line" id="crayon-64953fd597400981650628-25"><span class="crayon-h">&nbsp;&nbsp;&nbsp;&nbsp;</span><span class="crayon-sy">{</span></div><div class="crayon-line crayon-striped-line" id="crayon-64953fd597400981650628-26"><span class="crayon-h">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span><span class="crayon-k ">return</span><span class="crayon-h"> </span><span class="crayon-v">$this</span>-<span class="crayon-h">&gt;</span><span class="crayon-i">name</span><span class="crayon-sy">;</span></div><div class="crayon-line" id="crayon-64953fd597400981650628-27"><span class="crayon-h">&nbsp;&nbsp;&nbsp;&nbsp;</span><span class="crayon-sy">}</span></div><div class="crayon-line crayon-striped-line" id="crayon-64953fd597400981650628-28">&nbsp;</div><div class="crayon-line" id="crayon-64953fd597400981650628-29"><span class="crayon-h">&nbsp;&nbsp;&nbsp;&nbsp;</span><span class="crayon-m">public</span><span class="crayon-h"> </span><span class="crayon-t">function</span><span class="crayon-h"> </span><span class="crayon-e">setName</span><span class="crayon-sy">(</span><span class="crayon-v">$name</span><span class="crayon-sy">)</span></div><div class="crayon-line crayon-striped-line" id="crayon-64953fd597400981650628-30"><span class="crayon-h">&nbsp;&nbsp;&nbsp;&nbsp;</span><span class="crayon-sy">{</span></div><div class="crayon-line" id="crayon-64953fd597400981650628-31"><span class="crayon-h">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span><span class="crayon-v">$this</span>-<span class="crayon-h">&gt;</span><span class="crayon-i">name</span><span class="crayon-h"> </span>=<span class="crayon-h"> </span><span class="crayon-v">$name</span><span class="crayon-sy">;</span></div><div class="crayon-line crayon-striped-line" id="crayon-64953fd597400981650628-32"><span class="crayon-h">&nbsp;&nbsp;&nbsp;&nbsp;</span><span class="crayon-sy">}</span></div><div class="crayon-line" id="crayon-64953fd597400981650628-33">&nbsp;</div><div class="crayon-line crayon-striped-line" id="crayon-64953fd597400981650628-34">&nbsp;</div><div class="crayon-line" id="crayon-64953fd597400981650628-35"><span class="crayon-h">&nbsp;&nbsp;&nbsp;&nbsp;</span><span class="crayon-m">public</span><span class="crayon-h"> </span><span class="crayon-t">function</span><span class="crayon-h"> </span><span class="crayon-e">getAge</span><span class="crayon-sy">(</span><span class="crayon-sy">)</span></div><div class="crayon-line crayon-striped-line" id="crayon-64953fd597400981650628-36"><span class="crayon-h">&nbsp;&nbsp;&nbsp;&nbsp;</span><span class="crayon-sy">{</span></div><div class="crayon-line" id="crayon-64953fd597400981650628-37"><span class="crayon-h">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span><span class="crayon-k ">return</span><span class="crayon-h"> </span><span class="crayon-v">$this</span>-<span class="crayon-h">&gt;</span><span class="crayon-i">age</span><span class="crayon-sy">;</span></div><div class="crayon-line crayon-striped-line" id="crayon-64953fd597400981650628-38"><span class="crayon-h">&nbsp;&nbsp;&nbsp;&nbsp;</span><span class="crayon-sy">}</span></div><div class="crayon-line" id="crayon-64953fd597400981650628-39">&nbsp;</div><div class="crayon-line crayon-striped-line" id="crayon-64953fd597400981650628-40"><span class="crayon-h">&nbsp;&nbsp;&nbsp;&nbsp;</span><span class="crayon-m">public</span><span class="crayon-h"> </span><span class="crayon-t">function</span><span class="crayon-h"> </span><span class="crayon-e">setAge</span><span class="crayon-sy">(</span><span class="crayon-v">$age</span><span class="crayon-sy">)</span></div><div class="crayon-line" id="crayon-64953fd597400981650628-41"><span class="crayon-h">&nbsp;&nbsp;&nbsp;&nbsp;</span><span class="crayon-sy">{</span></div><div class="crayon-line crayon-striped-line" id="crayon-64953fd597400981650628-42"><span class="crayon-h">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span><span class="crayon-v">$this</span>-<span class="crayon-h">&gt;</span><span class="crayon-i">age</span><span class="crayon-h"> </span>=<span class="crayon-h"> </span><span class="crayon-v">$age</span><span class="crayon-sy">;</span></div><div class="crayon-line" id="crayon-64953fd597400981650628-43"><span class="crayon-h">&nbsp;&nbsp;&nbsp;&nbsp;</span><span class="crayon-sy">}</span></div><div class="crayon-line crayon-striped-line" id="crayon-64953fd597400981650628-44">&nbsp;</div><div class="crayon-line" id="crayon-64953fd597400981650628-45"><span class="crayon-sy">}</span></div></div></td>
					</tr>
				</table>
			</div>
		</div>

<p> </p>
<p>これらの関数の一覧は<a href="http://www.php.net/manual/ja/ref.var.php" target="_blank">ここ</a>です。</p>

【PHP】変数操作関数

<p>サーバ監視の観点でツール調べてみましたが、<br />
需要がクライアントごと違いますので、カスタマイズせずに直接使うのは難しいかと思います。<br />
Linuxサーバが付いている無料のツールlogwatchを使って、レポートの内容をカスタマイズするやり方がいいかと思います。<br />
※ただし、レポートは英語と、たまにログの内容そのままが出てくるのは難点です。</p>
<h2>インストールおよび設定</h3>
<p><a href="http://blog.thingslabo.com/archives/000054.html">こちら</a>が分かりやすいかと思います。<br />
設定項目が多いので、また調査中です。</p>
<h2>レポートの内容</h3>
<p>レポートが指定されたメールアドレスに送信されますので、下記はその内容の抜粋です。</p>
<h3>cron</h4>
<p>実行のスクリプトとその回数</p>
<h3>mail（dovecot→受信、postfix→送信）</h4>
<p>１、受信をするため、ユーザごとのログイン回数（IP付き）<br />
２、送信メールの数、および拒否したRelay（こちらのサーバを使ってメールを転送すること）</p>
<h3>httpd</h4>
<p>１、転送総量とタイプ別（Image/Document/Archive/Sound file/Content page/Redirect/Font/Other）の転送量<br />
２、検知したハッキング（回数、IP付き）<br />
３、レスポンスエラー（エラーコード別でurlと回数がでてくる）<br />
４、robotの訪問回数（UA付き）</p>
<h3>sshd</h4>
<p>不正ログインしようとしていたIPと回数（アカウント別、使ったパスワードまで分かる）</p>
<h3>disk space</h4>
<p>どれぐらい残っているかが分かる</p>
<h2>レポートを見た感想</h3>
<p>・文字だけで少々分かりにくい<br />
・ハッキングが多いからセキュリティを許可すべく</p>


Company

Our Solutions

Support

News

Blog

Blogブログ

カテゴリーから探す

年別から見る

記事一覧

2014/02/19

2014/02/18

2014/02/18

2014/02/18

2014/02/18

2014/02/14

2014/02/14

2014/02/14

2014/02/13

2014/02/13

2014/02/13

2014/02/13

2014/02/05

2014/02/05

2014/02/05

2014/02/05

2014/02/04

2014/01/29