<?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>NASKIT &#187; Inkscape</title>
	<atom:link href="http://naskit.com/category/inkscape/feed/" rel="self" type="application/rss+xml" />
	<link>http://naskit.com</link>
	<description>AndroidとかUnityとか</description>
	<lastBuildDate>Sun, 29 Jan 2012 16:57:20 +0000</lastBuildDate>
	<language>ja</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.3.1</generator>
		<item>
		<title>InkscapeでAndroidアプリのアイコンを作成する</title>
		<link>http://naskit.com/2010/04/22/inkscape%e3%81%a7android%e3%82%a2%e3%83%97%e3%83%aa%e3%81%ae%e3%82%a2%e3%82%a4%e3%82%b3%e3%83%b3%e3%82%92%e4%bd%9c%e6%88%90%e3%81%99%e3%82%8b/</link>
		<comments>http://naskit.com/2010/04/22/inkscape%e3%81%a7android%e3%82%a2%e3%83%97%e3%83%aa%e3%81%ae%e3%82%a2%e3%82%a4%e3%82%b3%e3%83%b3%e3%82%92%e4%bd%9c%e6%88%90%e3%81%99%e3%82%8b/#comments</comments>
		<pubDate>Wed, 21 Apr 2010 18:16:27 +0000</pubDate>
		<dc:creator>saikoro</dc:creator>
				<category><![CDATA[Android]]></category>
		<category><![CDATA[Inkscape]]></category>
		<category><![CDATA[Paint.NET]]></category>
		<category><![CDATA[Androboice]]></category>

		<guid isPermaLink="false">http://naskit.com/?p=224</guid>
		<description><![CDATA[本体を購入して、開発環境を整えて、マーケットでアプリケーションを公開するまで全部そろえても格安で開発ができるのがAndroidの売りのひとつ。パソコンとインターネット環境があればたったの25ドルでマーケットに公開できるのだ。
]]></description>
			<content:encoded><![CDATA[<p><script type="text/javascript"><!--
google_ad_client = "pub-6892715802145135";
/* 468x15, 作成済み 09/11/01 */
google_ad_slot = "8121608277";
google_ad_width = 468;
google_ad_height = 15;
//-->
</script>
<script type="text/javascript"
src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
</script>
</script>
<script type="text/javascript"
src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
</script></p><p>本体を購入して、開発環境を整えて、マーケットでアプリケーションを公開するまで全部そろえても格安で開発ができるのがAndroidの売りのひとつ。パソコンとインターネット環境があればたったの25ドルでマーケットに公開できるのだ。</p>
<p>アイコンを描くアプリも無料でやってしまいたい。イラストレーターなんて個人の趣味では手がでない・・。NexusOneやXperiaやDesireが買えてしまうではないか！</p>
<p>私は<a href="http://www.inkscape.org/index.php?lang=ja" target="_blank">Inkscape</a>でアイコンを作って、<a href="http://www.getpaint.net/" target="_blank">PaintDotNet</a>でトリミングするなどして間に合わせている。両方フリーソフト。<br />
GIMPも有名で超強力なツールだけど、Windowsを使っているならPaintDotNetでも十分だな。InkscapeやGIMPはLinuxやMacでも使えるので、Androidのアプリ開発はWin、Mac、Linuxのどれを使ってもよい。すばらしい！</p>
<p>AndroboiceのアイコンのデータもInkscapeで作成したもの。<br />
<a href="http://naskit.com/wp-content/uploads/inkscape_androboice_01.png"><img src="http://naskit.com/wp-content/uploads/inkscape_androboice_01-300x230.png" alt="" title="inkscape_androboice_01" width="300" height="230" class="alignleft size-medium wp-image-349" /></a><br />
作成方法はまず、フリーハンドで輪郭を描いてノードっていうポイントを調整して輪郭を整える。<br />
そしてストロークのスタイルと塗りで線の太さと色を決める。<br />
それからフィルで中身を塗りつぶす。</p>
<p><br style="clear:both;" /><br />
<a href="http://naskit.com/wp-content/uploads/inkscape_androboice_02.png"><img src="http://naskit.com/wp-content/uploads/inkscape_androboice_02-300x230.png" alt="" title="inkscape_androboice_02" width="300" height="230" class="alignleft size-medium wp-image-350" /></a><br />
グラデーションをつける。<br />
レイヤー管理ができるので、別のレイヤーに輪郭のパスをコピーして、<br />
ストロークは「ｘ」にして線を消す。フィルはグラデーションを選んでうまい具合に調整する。<br />
この画ではレイヤーを3つしか使ってないけど、複雑な絵になるともっと細かく分けたほうが良いかもしれない。</p>
<p><br style="clear:both;" /><br />
<a href="http://naskit.com/wp-content/uploads/inkscape_androboice_03.png"><img src="http://naskit.com/wp-content/uploads/inkscape_androboice_03-300x230.png" alt="" title="inkscape_androboice_03" width="300" height="230" class="alignleft size-medium wp-image-351" /></a><br />
口のなかのパーツもつくる。レイヤーの表示・非表示切り替えやロック機能を使うと作業しやすい。</p>
<p><br style="clear:both;" /><br />
<a href="http://naskit.com/wp-content/uploads/inkscape_androboice_04.png"><img src="http://naskit.com/wp-content/uploads/inkscape_androboice_04-300x230.png" alt="" title="inkscape_androboice_04" width="300" height="230" class="alignleft size-medium wp-image-352" /></a><br />
最後に全てのレイヤーを表示して絵になっているかチェック。<br />
これで元になるデータが完成。保存形式はSVGっていうXMLでできたベクターデータで、イラストレータでも読み込める形式だからデザイナーとの連携もできる。<br />
ベクターデータの良いところは拡大縮小しても線が滑らかなこと。</p>
<p>Android1.6からは複数の画面解像度に対応したアイコンをアプリに使うことを推奨しているので、このデータを素にして複数のPNG形式のビットマップを出力する。</p>
<p><br style="clear:both;" /><br />
<a href="http://naskit.com/wp-content/uploads/inkscape_androboice_05.png"><img src="http://naskit.com/wp-content/uploads/inkscape_androboice_05-238x300.png" alt="" title="inkscape_androboice_05" width="238" height="300" class="alignleft size-medium wp-image-353" /></a><br />
出力したい画像を選択ツールで選択しておいて、「ファイル＞＞ビットマップにエクスポート」でエクスポート用のダイアログが出るので、エクスポート領域が「選択」、ビットマップサイズを大体欲しいサイズに合わせて「エクスポート」ボタンを押せばOK。<br />
3種類のPNGを出力して別のソフトで調整する。<br />
大きさは<a href="http://developer.android.com/guide/practices/ui_guidelines/icon_design.html" target="_blank">ここ</a>にもあるとおり、36x36px, 48x48px, 72x72pxくらいで作っておく。</p>
<p>あとはPaintDotNetで大きさを調整すればよい。線や塗り以外の部分は透明になるのでここで背景をつけてもよいかも。</p>
<p>絵のセンスはないけど、拡大されてギザギザになったイメージが端末に表示されなければ何とか見れるものだなー。</p>
<p><a href="http://developer.android.com/guide/practices/ui_guidelines/index.html" target="_blank">デベロッパーサイト</a>のリンクからアイコンのテンプレートがダウンロードできるが、これがpsd形式なのである。PhotoShopの形式ね・・・。どうかと思うでしかし・・・<br />
これを読むためにンー万円は払えないなー。<br />
フォトショップとイラストレータっていまいち使いづらい。あの独自インタフェース。負け惜しみではないが・・・・「弘法筆を選ばず」というけど高い金払ったらすばらしいデザインができるわけでもないしねー。</p>
<p>そこでPaintDotNetで読み込む方法があった。「Paint.NET　PSD　Plugin」ってやつ。<a href="http://psdplugin.codeplex.com/" target="_blank">ここ</a>から読み込んで[PhotoShop.dll」ってライブラリをゲットしたら、「C:/Program Files/Paint.NET/FileTypes」フォルダにコピーする。次にPaintDotNetを起動すると「PSD形式」の読み書きができる。<br />
これでデザイナーさんと連携できるなー。</p>
<p>InkscapeはほかにもPDFの編集もできるし、インストールしておいて損はないソフト。<br />
昔は洋書しかなかったけど最近はAmazonで<a href="http://www.amazon.co.jp/s/ref=nb_sb_noss?__mk_ja_JP=%83J%83%5E%83J%83i&#038;url=search-alias%3Daps&#038;field-keywords=inkscape&#038;x=0&#038;y=0" target="_blank">何冊か</a>解説本が出ている。<br />
私は<br />
<iframe src="http://rcm-jp.amazon.co.jp/e/cm?lt1=_blank&#038;bc1=000000&#038;IS2=1&#038;bg1=545454&#038;fc1=DDDDDD&#038;lc1=7AB8FF&#038;t=saikoblog-22&#038;o=9&#038;p=8&#038;l=as1&#038;m=amazon&#038;f=ifr&#038;md=1X69VDGQCMF7Z30FM082&#038;asins=4863910738" style="width:120px;height:240px;" scrolling="no" marginwidth="0" marginheight="0" frameborder="0"></iframe><br />
を買った。GIMPの解説もあるけど素材データが付録のCD-ROMについている。</p>
<p>まとめ。<br />
Androidの開発環境はパソコンとインターネットがあればそろってしまう。お金は必要ないし、25ドルでアプリをマーケットに公開することもできる。野良アプリでよければ25ドルさえ必要ない。<br />
恋人に電話を掛けるだけのアプリ。こんなの作って自分の電話機に入れておいたら素敵じゃないか！通話履歴なんかもクラウドなんかにアップロードして・・・？？<br />
記念日に一言メッセージを表示するウィジットなんてのもありかもしれん。新機種ゲットするため奥さんを説得するのに「愛情カスタム」したお古の端末をプレゼントするなんて作戦はどうかね。うまくいけば新機種が出るたびに機種変できるかも？<br />
とにかくこんなにすばらしい環境は他には無いと思うので少しでも多くの人にこの楽しさを味わってもらいたいなー。</p>
<div class="plus-one-wrap"><g:plusone size="medium" href="http://naskit.com/2010/04/22/inkscape%e3%81%a7android%e3%82%a2%e3%83%97%e3%83%aa%e3%81%ae%e3%82%a2%e3%82%a4%e3%82%b3%e3%83%b3%e3%82%92%e4%bd%9c%e6%88%90%e3%81%99%e3%82%8b/"></g:plusone></div>]]></content:encoded>
			<wfw:commentRss>http://naskit.com/2010/04/22/inkscape%e3%81%a7android%e3%82%a2%e3%83%97%e3%83%aa%e3%81%ae%e3%82%a2%e3%82%a4%e3%82%b3%e3%83%b3%e3%82%92%e4%bd%9c%e6%88%90%e3%81%99%e3%82%8b/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
	</channel>
</rss>

