カバのメモ

プログラミング経験0からのスタート。本とGoogleに頼って勉強中。分からないこと、調べたことを載せていきます。

126・127日目 AndroidStudioで作ったアプリの実機テスト方法を探る

DropBoxにapkファイルを放り込めば、簡単に実機での動作確認ができました。

これについては、いつかまとめておきたいと想います。

けれど、本に載っていた、コンソール(コマンドプロンプト)を利用して、apkファイルをAndroid端末にインストールすることができません。いろいろ試しているのですが、結局できないままです。

この本によると、、

Androidプログラミングバイブル SDK5/4対応 (smart phone programming bible)

生成したapkファイルをandoroid端末にインストールするには、コンソール(コマンドプロンプト)で次のように入力します。「-r」はファイルがすでに存在していた場合は上書きするオプションです。

adb -r install app-release.apk

できない。この説明だけでは私には分かりません。

でも、DropBoxでできることが分かったのでそんなに頑張らなくてもいいとは思うのですが、コマンドプロンプトもあまり使ったことがないので、この機会に触っておきたいなという思いから、ガチャガチャやっています。それに、SDKが何かイマイチ理解していないので、それを勉強するにも良い機会かと思いながらいじっています。

そんな私の様子を見た主人、、、

「(お母さんは)もともとPCの基礎知識がないから大変そうだね。おやすみ~」

主人のお気に入りの焼酎に水を入れてやろう!!

おまけ

大日本印刷のギャラリーの一つ、ドットDNPで開催されていた「はらぺこあおむし展」に行っていきました。そこでは、ipadを使って子どもたちが自由にアプリやデジタル絵本を楽しむことができるようになっていました。ipadは使いたい放題で、子ども向けアプリの見本市のような感じで面白かったです。こんなに優秀なアプリがたくさんあるのに、いまさら自分がそれを目指すのはムリ~と泣きそうになりましたが、、、。

11月からまた新しい企画展がスタートします。小さなギャラリーですが、また子連れで行ってみたいと思える刺激的なスポットです。

plaza.dnp

124・125日目 AndroidStudioでapkを変更する~アプリのバージョンアップの方法

(2015年10月22日の記事です。AndroidStudio1.2を使用しています。)

リリース後早速ミスを発見。

f:id:hipopocroco:20151022011742p:plain

自分のスマホにインストールしてみたら、、、、

あれ???アイコンのタイトルが15Puzzze????

なんてこった~。なんでリリース前に気づかなかったんだ!!

そこで、すぐにバージョンを上げることになりました。

ところが、、、、

APKファイルができない!!アップデートできない!?

データを修正したのですが、とにかく新しいAPKファイルが作成されない。いろいろ調べて行くうちにこれらのサイトに、出会いようやく分かりました。

qiita.com

blog.hello-world.jp.net

どうやらbuild.gradleから変更させるようなのです。

私は、Android manifest.xmlばかりいじっていて分かりませんでした。

Eclipseなどを使用していた方はこちらの2つの記事をどれか読めばすぐに分かると思います。

でも、私はこの記事を参考にしても結構時間がかかったので、スクリーンショットを交えたレポートを残しておきます。

自分がやったことをスクリーンショットと共に書き残さないと忘れそうなので。

【AndroidStudio】build.gradleを変更して新しいapkファイルを作る

①app>build.gradleを開き、バージョンを上げる。 versionCodeは整数で。

f:id:hipopocroco:20151022013536p:plain

スクリーンショットが間に合わなかったのですが、上に黄色いバーが出ます。一番右にsync というボタンがでるのでそれを押します。(詳しい表記は忘れました。)すると、数秒後に下画面にUP TO DATEの文字がたくさん現れます。

f:id:hipopocroco:20151022013608p:plain

③AndroidManifestを確認すると、無事自動的にアップデートされています。(私がAPKファイルが作れなかったのは、AndroidManifestから作ろうとしていたからです。)

f:id:hipopocroco:20151022013641p:plain

④あとは、普通にapkファイルを作ります。

パスワードを入力して、、、

f:id:hipopocroco:20151022015341p:plain

fnish

f:id:hipopocroco:20151022015402p:plain

⑤無事 apkファイルできました!!!

f:id:hipopocroco:20151022013713p:plain

 

Google Play Developer Consoleで、アプリをバージョンアップさせる

①自分の作ったアプリをクリック

f:id:hipopocroco:20151022015656p:plain

②アイコンの隣のボタンを押す(もうメニューが見えている場合もありますが)

f:id:hipopocroco:20151022015717p:plain

③apkボタンを押す

f:id:hipopocroco:20151022015738p:plain

④”新しいAPKをアップロード” ボタンを押す

f:id:hipopocroco:20151022015809p:plain

⑤先ほど作ったAPKをドロップする。

f:id:hipopocroco:20151022015832p:plain

⑥保存!!完成!!

f:id:hipopocroco:20151022015846p:plain

終わりに

できてしまえば、とっても簡単な作業。でも、どうしてアップデートできないのか2日間悩みました。知らなければ、永遠にできないかもと不安に感じるものです。

アプリは完成しましたが、いろいろできていないことがあります。そのうちの一つが実機テスト!コマンドプロンプトを使って、apkファイルを端末うつして、、、というやり方。こちらのやり方が上手くできないのです。google play上からインストールして動作状況は問題ないのですが、毎回そのやり方で実機テストを行うのはよろしくないので。

明日やることは、実機テスト!!次の日にやることが具体的に決まっていると、勉強のモチベーションが上がります。

ちなみに、、、、アイコンのタイトルを間違えた原因

それはこれだ!!

app>src> main> res> values>string.xml

このstringのapp_nameが違ってた。

最初15puzzleの名前にしようと思っていたデータを変更することを忘れていました。

f:id:hipopocroco:20151022012231p:plain

string.xmlのファイルが、アイコンの下につく名前になることがよく分かりました。

 

122・123日目 初めて作ったアプリ、GooglePlayに公開しました。

122日目 GooglePlayDevelopperConsoleで登録などなど、デザイン修正などなど、、。

123日目 本日、GooglePlayに公開しました。

長かった~!!

眠かった~!!

朝が弱くて、娘にはだらしのない母を刻印づけてしまいましたが、夜中母ちゃんは頑張ったぞ!

IT業界とは全くかけ離れた人生を歩み、プログラムなんてエクセルの四則計算しかできない私ですが、ようやく一つの目標までたどりつけました。しかも、無謀にも独学で、Google先生と本を頼りにやってきました。

途中このブログに立ち止まってくださった先輩方の助言と励ましなくしては完成まで至らなかったと思います。ここまで導いてくださった皆さんありがとうございました。お世話になったサイトや書籍などの紹介は後日まとめたいと思います。今日はもう疲れました。

 

肝心のアプリの出来栄えはというと、、、、

今ここで紹介できるほどの自信がなく、今日はやめておきます。

 

アプリが完成したら、どれだけ嬉しいんだろうと夢を見ていましたが、実際はそうではなく、先輩方が作っているアプリの凄さが分かり、恐れおののいて後ずさりしたくなったというのが今の心境です。

でも、もう勉強をおしまいにする気はなく、もうちょっといじってみたくなりました。知識が乏しい私にとって、一つアプリを作り上げて初めて「プログラムってこういうことなんだ」という勉強の下準備ができた気がします。

今、ようやくプログラムを勉強するスタートラインに立てた気がします。

それにしても、、、、

もとはといえば、(プログラム未経験の)主人の「お母さんならできるよ!」という意味不明なつぶやきと洗脳のおかげでスタートしたアプリ開発。一緒に喜ぶべき主人は爆睡です。

一人でワイン飲んでやる!

 

 

121日目 リリースに必要な画像アセットまとめ

support.google.com

これを見れば全部載っているのですが、あの画像のサイズいくつだっけ??と、ちょっと確認するには面倒に感じたので自分が見やすいようにまとめました。

スクリーンショット画像

f:id:hipopocroco:20151016222627p:plain

ストアの掲載情報を公開するには、2 枚以上のスクリーンショットを用意する必要があります。

  • JPEG または 24 ビット PNG(アルファなし)
  • 最小サイズ: 320 ピクセル
  • 最大サイズ: 3840 ピクセル
  • スクリーンショットの最大サイズを最小サイズの 2 倍以上にすることはできません。

高解像度アイコン

f:id:hipopocroco:20151016222655p:plain

  • 32 ビット PNG(アルファ付き)
  • サイズ: 512px x 512px
  • ファイルの最大サイズ: 1024 KB

宣伝用画像

f:id:hipopocroco:20151016222723p:plain

  • PEG または 24 ビット PNG(アルファなし)
  • サイズ: 1024 px x 500 px 

その他

 プロモーション画像は絶対必要ではなさそうですし、バナーアセットもAndroidTV対応アプリではないので、とりあえず今回は必要なし。

f:id:hipopocroco:20151016222538p:plain

そもそもアセットってなんだ??

まず、画像アセットについてご説明します。
画像アセットとは、PSDファイルのレイヤーやレイヤーグループから、要素に適したサイズで画像の書き出しを自動で行ってくれるPhotoshopの新機能です。

PhotoshopCCでレイヤーごとに画像アセットとして書き出す方法

 もともと、Photoshopの機能ということでしょうか。要素に適したサイズの画像で作られたということでしょうか。綴はassetでいいのかな???

おわりに

最後にこんな作業が待っているとは思いませんでした。面倒くさいものですが、これを丁寧につくると作らないとでは大きな差がでるのかな。。。

 

 

120日目 リリースのための勉強

とてもしょぼいプログラムですが、動かすことができました。「アプリ」という名前でくくられるのもおこがましいレベルの内容ですが、リリースまでの一連の流れを体験してみたくて勉強しています。

 

リリースが近づいてくると、名前の付け方についていろいろ考えるようになりました。

今回は適当ですが、今後いろいろ新しいことを初める時に、どんな名前をつければよいか考えるための勉強になりました。

その勉強のためのヒントとなった本がこれ!  

思わず話したくなる ロゴの秘密

思わず話したくなる ロゴの秘密

 

 90の有名会社について次のことがシンプルにまとめられています。

 

  • ロゴデザインの変遷
  • 社名の由来
  • 会社理念

パラパラっと見るだけでも面白い。

ロゴデザインを考えるヒントになりそうなものばかりです。

ちなみに、、、、

面白いと思った会社の名前由来は、

ご存知でしたか??気になる方はぜひ検索してみてください。

好きなロゴマークは

  • 石油会社のシェル

貝印のマークで有名です。

現在の表章は1971年にフランス出身のレイモンド・ローウィーが手がけた作品(本文p183より)

だそうです。このレイモンド・ローウィー氏の作品を見ると、見たことある!!というデザインがたくさん出てきます。ラッキーストライクなどタバコのデザインもたくさんありますが、カッコイイ!!

matome.naver.jp

  • ヤフージャパン

ブラウザ上でも見やすいプライマリーカラーの赤(パントーン185)が使用されている。(本文p150より)

文字の大きさや高さが1字として揃っていないにも関わらず絶妙なバランスが保たれているのはすごいな-と思います。パントーン185覚えておこう!

 

*****

こんなどうでもいいことで立ち止まらず、とっととリリースすればいいのに、のんびりいろいろ考えながら進めています。

 

 

 

119日目 Makeappiconを使って、ランチャーアイコンを5分で作る(デザイン画像は事前に用意)

ようやくデザインも決まり、というか諦めて、次のステップにきました。

ついに、ランチャ-アイコン!

大きさをいちいち変えるのが面倒な~と思っていたら、こんなサイトに出会いました。

crowdworks.jp

このサイトで紹介されていた、Makeappiconがとても便利でした。私が無知なだけで日本のサイトにも同じようなものあるのかもしれませんが、試しにこれで作ってあまりの簡単さに感動しました。サイト上で作成しEmailで送ってくれます。

makeappicon.com

そこで、今回はタイトル通り、5分もかからずできたこの方法をレポートします。ただし、アイコンのデザインは自分で作りました。

*ただ、メアドを設定することで、スパムメールがたくさん届かないか内心ドキドキしています。その辺は自己責任で。

Makeappiconでランチャーアイコンを作ってみる(2015年秋)

①MakeappiconのHP

f:id:hipopocroco:20151007005726p:plain

②自分が作ったアイコンのデザインをドロップ&ドラックして、、

f:id:hipopocroco:20151007005753p:plain

③MakeappiconのHP画面上に放り込むだけ。すると、、、

Baking,,,ってちょっとかわいくないですか???矢印のように自動的にトースターに入っていくのです。

f:id:hipopocroco:20151007005814p:plain

④数秒で完成!スマホの画面イメージに合うかどうかも自動的にチェックしてくれて感動です。▼これはiphone

f:id:hipopocroco:20151007005846p:plain

⑤自分のEメールアドレスを書いて緑のDownloadボタンを押せば自動的に送られてきます。▼これはAndroid版の画面

f:id:hipopocroco:20151007005904p:plain

⑥1,2分後に送られてきました。こんな感じのメール。

f:id:hipopocroco:20151007005926p:plain

⑦で、Downloadすると、、こんな感じ。

f:id:hipopocroco:20151007005947p:plain

⑧無事ランチャーアイコンすべて出来上がっていました。完成!!

f:id:hipopocroco:20151007010001p:plain

 

終了!撮影してなければもっと早くできそうです。

終わりに

このツールがなければ、いちいち大きさを変えて、タイトルを入れて、、と作っていたと思います。面倒だな~と思ってたストレスが一発解消!いろんな便利ツールがあるものですね。

JAVAの勉強はまだ全然足りませんが、アプリをリリースするまでの一連の流れをやってみたくて色々試しています。呆れるほど時間がかかってしまい、恥ずかしい限りですが体を崩さない程度に続けてみたいと思います。

 

 

 

 

118日目 アプリのデザインパーツを組み合わせて動かしてみる

無事、PC、起動しました。そして、Genymotionでチェックできました。

けれど、、、、

実際動かしてみましたが、やっぱりデザインが気に入らなかったのでもう一度イラレを使って直しています。

デザインソフトと違ってアプリのデザインは、組み合わせている状態を想像するしかないのが辛い。一個一個のパーツが組み合わさって初めて感じる違和感をもう一回作りなおすって大変ですね。慣れれば簡単なのかもしれませんが、面倒です。

それに、Illustratorも初心者の私。やっぱり、最初は素材集にも助けてもらうことにしました。実際使わなかったとしても、この素材集をみているだけで勉強になりますし、私生活でもたくさん使えそうで買ってよかった本です。

かわいい北欧のデザイン素材集 スカンジナビアデザインブック

 

やはりデザインって需要ですね。