Android用アイコンの作成方法

自分でAndroidアプリを作ってZiioにインストールすると、アイコンに統一感がないなと感じました。Windows用に昔作ったアイコンを使いまわしたのが良くないのですね。Android UIガイドラインを参考にして自分で作ってみました。そのときの作り方を紹介します。

アイコンの大きさは、ldpiが36×36ピクセル、mdpiが48×48ピクセル、hdpiが72×72ピクセルです。はじめにドロー系ソフトでアイコンの元絵を作ります。次にペイント系ソフトで効果を付けます。私はInkscapeとPhotoshop Elementsを使いました。練習で子供のアイドルのアイコンを作りました。

Inkscapeでアイコンを作成

 Inkscapeのドキュメントは72×72ピクセルで作りました。Androidのガイドラインに従って線の色をグレー#404040、オレンジ#FF6600、赤#CC0000にしました。この画像をPNG形式で保存します。サイズは72×72,48×48,36×36にします。後でAndroidのプロジェクトにインポートしやすいように、ldpi、mdpi、hdpiフォルダを作って各サイズのPNGファイルを保存します。私は保存するときにlc_**_72.pngなどと名前を付けてしまい、プロジェクトにインポートするときに各サイズとも同じ名前にしなければならないことに気がつきました。ガイドラインをよく読んでみると「解像度ごとにフォルダ分けをすると便利だよ」とちゃんと書いてありました。

さて、ガイドラインによると効果は「トップライト」と「ドロップシャドー」、「テクスチャ」を付けるとあります。「テクスチャ」の効果が良くわからなかったので今回はつけませんでした。Photoshop Elementsで「トップライト」と「ドロップシャドー」をつける方法を説明します。「レイヤースタイル」で「ドロップシャドー」を選択します。後から影の位置と大きさを変更します。

トップライトの効果はPhotoshop Elementsの「フィルター」メニュー「描画」→「照明効果…」をクリックします。光源タイプを「スポットライト」にして光源を調整します。

トップライト効果を付ける

ドロップシャドーの効果は照明角度を90度、シャドー距離を1ピクセルにしました。

レイヤースタイルの設定

出来上がり！

出来上がったアイコン

アイコンはたくさん必要なので簡単に作れるほうが良いですよね。初期のAndroid のアイコンガイドラインはつくるのに苦労しそうな感じでした。ここの角度が何度だとか立体的なアイコンでしたが、新しいガイドラインはシンプルで作りやすくなっています。

AndroidのWidget用イメージの作成

AndroidアプリでWidgetを作成してみました。背景のpngファイルを作ろうとしたら以下のページを見つけました。

Widget Design Guidelines

http://developer.android.com/guide/practices/ui_guidelines/widget_design.html

UIデザインのガイドラインの中にWidgetに関する記述があり、そのページからPhotoshop用ファイルがダウンロードできます。ガイドラインによるとWidgetの大きさもいくつか規則があるみたいです。縦画面では

320×100ピクセル

240×300ピクセル

160×200ピクセル

とあります。携帯電話なので画面の解像度が低いものが多いですからね。そういえば、Widgetを追加しようとして、画面にスペースがありません。って起こられたことがあります。今後、Android端末でWidget同士でスペース争いが起こりそうです。小さいほうが有利かもしれません。

AndroidのUI Guidlineはアイコン用テンプレートファイルもダウンロードできて便利です。そういえばXP用アイコンのガイドラインもありましたね。

Creating Windows XP Icons

http://msdn.microsoft.com/en-us/library/ms997636.aspx

マスクの紐を直す方法

子供（２歳）がマスクの紐を切ってしまいました。

「パパなおして」と言われ、さてどうしたものか。

紐が切れたマスク

 

切れた紐とにらめっこしていたら、「おっ！」という発見が！

マスクの端

 

マスクの修理完成

穴に紐を通して結びなおせば、出来上がり。穴が小さかったので穴あけを使いました。

穴が開いていないときは穴あけを使うといいかもしれません。

紐の長さが調整できて便利になりました。小さい子供にも使えて優れものです。

Androidアプリ開発の勉強中

　”ANDROID HACKS”を読んでアプリ開発を勉強中です。良い本なのですが実際に本のコードを書いていくとやや気になる点がありました。Javaコードのimport文が本のサンプルコードから抜けていることが気になります。実際にコードを書こうとしても書けない。他のコード(画面レイアウトのXMLやManifest.xml)は書けるのに肝心な部分が抜けています。仕方がないのでsubversionでサンプルを落としてからそれのimport文を見ながら書いています。そういえば、開発の現場で初心者の人から「どういうクラスを使って良いのか分からない。」と言われたことがありました。.net FrameworkやJavaで用意されているクラスはすごい数があります。その中でどのクラスを使っていけば目的のソフトが実装できるのか、また、自分でクラスを作るときどのような名前、パッケージ名にするのか。よく考えたらそんなことが書かれた入門書はありません。（探せばあるのかも）入門書の著者が知らず知らずに使っているimport文(using文)やサンプルコード内のクラスの使い方などを参考しながら勉強していくのだと思います。別の初心者は「入門書をやりました。だけど、何を作っていいかわからない。」とも言います。自分で書いたサンプルコードが作ったものなんだと思うのですが。なんだか言いたいことを言っていますが。ANDROID HACKSのコードをせっせと自分で打つと著者のコーディングが分かって面白いです。もう少しアプリ作成手順に従ったページ構成だと打ち込みやすいです。

　画面レイアウト(res/layout/*.xml)を作った後にjavaコードを打ったほうが良いと分かりました。最後にAndroidManifest.xmlに書き込むのだと思います。まだまだ最初のほうです。最後のページまでたどり着けるのかな。

年末になって

年末になってネットでコンピュータ関係の買い物をしました。

Windows Home ServerとDVI分岐ケーブルです。どちらもいまさらなものですが突如ほしくなって購入しました。

Windows Home ServerはHPのX510 Data Vaultの2TBです。最初、MediaSmart Server EX490を購入したのですが、X510 Data Vaultがキャンペーンで20% OFFになっていたのに気がつきオーダーを変更してもらいました。オーダー完了後に気がつきどうしようか迷い、ダメもとでHPのサポートに電話してみたのですがとても良い対応をしていただき変更することができました。ありがとうございました。

一方、DVI分岐ケーブルはnVidiaのQuadro4 NVSのものでアナログD-SUB分岐からデジタルに変えたいと思い注文しました。これも昔のビデオカードなのでいまさらな感じでしたが注文してみました。ちゃんと注文できたのでNVSも有効利用できます。

両方とも年末注文なので年内ぎりぎりか年明けくらいに届くと思います。

Android用アプリの開発

Androidの長所は自分でソフトウエアを開発できることです。そして、開発ツールは無償で供給されていることです。

基本はGoogleのAndoroid SDKでJavaの統合開発環境Eclipseを使用して開発を行います。もちろんテキストエディタとコマンドラインでゴリゴリ作っていくこともできます。私も数年前までJavaのアプリケーションをテキストエディタでコーディングしてコマンドラインでAntを使用してビルドしていました。

Javaの統合開発環境は種類が豊富で習得しきれなかった経験があります。昔、ForteやJBuilderがあってバージョンが上がるたびに操作方法が変わっていたような。大変だったな。最近はようやくEclipseを使いました。

　ZiiO用に練習アプリを作っています。”ANDROID HACKS”という本がとても参考になります。EclipseにAndroid SDKの設定を行った後、AVD ManagerにZiiOっぽいエミュレータの設定をします。ターゲットは”Android 2.1 update1 API Level7″解像度はWVGA800にしました。”ANDROID HACKS”の練習プログラムを作成してインストールパッケージapkを作成してMicroSDにコピーします。ZiiO上でapkを実行して練習プログラムをインストールしたらZiiOで実行できました。

やっぱりすごいなー。

　当初、理解できなかったところはapkを作成するときに署名を作るところ。自分で署名を作っていいことがわからなかった。この辺りも自分でやってみないとわからないですよね。

ZiiOのレビュー(その2)

ほとんどレビューになっていない不安を感じますが。

ZiiO 7インチの良いと思うところ

　　サイズ　参考書サイズ

　　動画再生　HD再生ができます。コマ落ちしません。

　　音楽再生　ヘッドホンで聴くととても良い。

　　ケースカバーの出来　スタンドになるので操作しやすいです。最初はZiiOを持って操作をしていましたが、今は机の上において操作しています。

改善してほしい点

　　音がおかしくなるときがある。（スリープから復帰すると音がおかしくなる？自分だけ？？）

　　内臓スピーカーの位置　横置きにすると右から音が聞こえるようになるので気になる。

　　「戻る」や「ホーム」の操作ボタンにバックライトを入れてほしい。あるいはアイコンを見やすい色にしてほしい。黒にグレーのアイコンなので見にくい。

解像度について

　当初はもっと高解像度のものがほしいと思っていましたが、このままでもいいのかと思います。世の中のパソコンが高解像度化しすぎてほとんどのWebページが大きな画像を入れすぎているのだと気がつきました。今後、スマートフォンが普及してきたら今までのパソコン中心のWebデザインでは通用しないと思います。文字とレイアウトを見直して大きな画像を取り払う必要もあるのだと考えます。

自分のblogをZiiOで確認用としたらWordPressではスマートフォン用のレイアウトで出ました。Yahoo JAPANなどもスマートフォン用にレイアウトされています。大手はすでに気がついているのですね。

すごいなー。

ZiiOのレビュー（その１）

２日ほど使ってみました。

最初にアプリケーションのインストールに戸惑いました。

ほとんどのアプリはストア（マーケット）経由でインストールします。

私はZiiOをPDAのように見ていたので適当なインストーラーからインストールできると考えていました。

よくよく考えるとAndoroidは携帯電話用OSなのでセキュリティーの関係上信頼できるアプリしか入れられません。

今の携帯電話は個人情報のかたまりですよね。

野良（マーケットを経由しない）アプリという言葉を初めて聞きました。使ってみると良くわかりますね。

ZiiOに野良をインストールするようにするには「設定」の「アプリケーション」の中にある「提供先不明のアプリ」にチェックを入れます。

セキュリティーに問題があるというメッセージが表示されますがＯＫをタッチします。

これで野良をインストールできるようになります。携帯電話の場合は絶対やらないほうが良いです。

インストールしたアプリ

YouTube用アプリ

Simeji(日本語入力)

ZiiOが到着しました。

本日到着しました。

早速、使ってみました。

まず、その大きさ。

画面は７インチなので小型のネットブック並みなのかな。

解像度は480 x 800 ピクセルなのでちょっと狭い。600 x 1024あるとネットも見やすいと思います。

解像度が気になる人は１０インチがお勧めします。

動作スピードは私の体感なのですが思ったよりも早いです。

アプリケーションによって起動にやや時間がかかりますが、ZiiO本体の操作感は快適です。

気になる点はタッチパネルが昔のＰＤＡのようにしっかりと押さないと反応しないことです。

「タッチ」というよりも「タップ」といったほうが分かりやすいでしょう。

スタイラスを使って操作したくなります。

問題はそのスタイラスを本体に格納できないこと。

私はレザーケースを同時に購入したのでわかったのですが、ケースにスタイラスをつける場所がありました。

こちらに入れろということなんですね。

Creative ZiiO 7インチを購入しました。

Creative ZiiOが出荷開始されたようです。
出荷開始のEメールニュースと
注文の出荷メールが同じ日にきました。
これからAndroid端末で遊びます！