2017年3月1日水曜日

LaunchKit の使い方

概要

LaunchKit は iOS や Android アプリをストアで公開するときに必要になるスクリーンショットを簡単に作成することができるサービスです
今回は iOS 用のスクリーンショットの作成方法を紹介したいと思います

環境

  • Mac OS X 10.11.5
  • Xcode 7.3.1
  • LaunchKit 2016/05/27 時点

アカウントの登録とログイン

アカウントはメールアドレスがあれば取得できます
登録すると確認用のメールが届くのでメールに記載の URL をクリックしてアカウントの確認をしてください
アカウントが取得できたらログインしてくだい
try_launchkit_login.png

Screenshot Builder の選択

スクリーンショットを作成するには「Screenshot Builder」を選択します
LaunchKit のサービス自体はスクリーンショットを作成するサービスの他に Web ページを作成したりアプリのレビューを監視して Slack などに通知してくれるサービスもあります
try_launchkit_select_service.png

プラットフォームの選択

スクリーンショットを作成するアプリの種類を選択します
今回は iOS 用のスクリーンショットを作成するので iOS を選択します
try_launchkit_select_platform.png

データをアップロードする

Xcode のアプリシミュレータで取得したスクリーンショットを 1 枚初めにアップロードします
Xcode のアプリシミュレータでスクリーンショットを取得するのはアプリを起動して Cmd + s でデスクトップに保存することができます
取得するスクリーンショットのサイズは iPhone6 Plus のシミュレータを起動してウィンドウのスケールを 100% にした状態で取得できる 1242 × 2208 のサイズがおすすめのようです

スクリーンショットを取得したらアップロードしましょう
「Upload a screenshot」の項目に取得したスクリーンショットをアップロードします
try_launchkit_upload.png

アップロードが完了するとスクリーンショットのデザインを設定する画面に切り替わります

レイアウトを設定する

LaunchKit では取得したスクリーンショットが実機で表示されているようなスクリーンショットを作成することができます
そのスクリーンショットに対して背景を設定したり文字を付与することでわかりやすいスクリーンショットに装飾することができます

まず、表示する文字を上にするか下にするか決定します
try_launchkit_select_design.png

無料のプランだと上下のどちらかしか選択できませんが Pro という年額 $99 のプランに変更すればいろいろなレイアウトを選択することができます

とりあえずここでは文字を上に表示する「Cropped Device with Text Above」を選択します

デバイスの色を設定する

次にデバイスの色を設定します
try_launchkit_select_color.png

無料プランだと白 or 黒を選択することになります
プロだと Gold or Rose も選択できるようになります

今回は「White Device」を選択します

背景や文字の内容を設定する

次に背景色と文字の色、内容を設定します
フォントはサイズや色、フォントファミリを設定することができます
背景は色を変更することができます
色は 16 進数のカラーコードで設定します
お好きなフォントサイズや背景色を設定してください

あとは表示する文字の内容を変更してください
try_launchkit_set_detail.png

またこのフェーズでこれまで設定した文字の配置やデバイスの色も再度調整することができます
問題なければ「Next」で次に進みます

エキスポートする

設定が完了すると以下のような画面になります
try_launchkit_edit.png

ここでもこれまで設定した項目を再度調整できる他、追加であと 4 枚同様にスクリーンショットを追加することができます
また、名前を設定して今回のスクリーンショットの情報を保存することができます
とりあえず今回はサンプルなので 1 枚のスクリーンショットで進めます

あとは作成したスクリーンショットをエキスポートしてみましょう
画面右上に「Preview & Export」というボタンがあるので選択します

するとダウンロード画面になるので「Download Free set」を選択してスクリーンショットをダウンロードを開始します
try_launchkit_download.png

スクリーンショットの作成が完了しダウンロードできるようになると以下のようなダイアログが表示されるのでダウンロードしてください
try_launchkit_ready_download.png

ここが若干残念な感じなのですが、無料だと iPhone 6s Plus 用のスクリーンショットしか作成してくれません
Pro プランになると「iPhone 4s」「iPhone 5s & SE」「iPhone 6s」のスマホサイズの他、「iPad」と「iPad Pro」のタブレットサイズのスクリーンショットも作成してくれます

また、気づいたのですが実は昔 LaunchKit に登録したアカウントがありそのアカウントでスクリーンショットを作成すると無料プランでも「iPhone 4s」「iPhone 5s & SE」「iPhone 6s」のスクリーンショットを作成することができました (タブレットサイズはダメでした)
おそらくアカウントを登録した時期によって無料プランの機能の提供範囲が異なるのが原因なんじゃないかと思います

あとはダウンロードした zip を解凍すれば作成されたスクリーンショットがあるのでこれを iTunesConnect の 5.5 inch 用のスクリーンショットのところにアップロードすれば OK です

  • 5.5-inch (iPhone 6+) - Screenshot 1.jpg

5.5-inch (iPhone 6+) - Screenshot 1.jpg

※このスクリーンショットはブログ掲載用のためサイズを縮小しています

最後に

個人でアプリを作っている人はスクリーンショットまでこだわって作成するのが大変だと思うのでそういう人には非常に便利なツールかなと思います

ただ、無料だと対応しているデバイスが少ないので、結局他のデバイス用のスクリーンショットを作成する必要があるので、そこが辛い点かなと思います

0 件のコメント:

コメントを投稿