へなちょこSEの考察

0x21歳のへなちょこSEが、日々思うことを考察します。自社内、金融系を経て現在法人系PKG開発に従事。

【React Native/Expo】アプリを多言語対応するためにやったこと

こんにちは。

「Fast Template」という定型文のメールやSMSの作成を素早く簡単に行えるソフトを作っています。

Fast Template

Fast Template

  • Haruya Nakamura
  • 仕事効率化
  • ¥120
apps.apple.com

Fast Template Lite

Fast Template Lite

  • Haruya Nakamura
  • 仕事効率化
  • 無料
apps.apple.com

今回、アプリを多言語対応したためその時にやったことを書いておきます。

expo-localizationとi18nを使う

初期設定と基本的な使い方

「React Native expo localization」で検索したときに、だいたいi18nを使うというのが見つかるのでそれでやります。

docs.expo.io

この辺とか見ながら。

続きを読む

【New Release】素早く定型文送信できるアプリ、「Fast Template」をリリースしました!(iOS)

新しいアプリをリリースしました!

「Fast Template」という定型文を送信するアプリになります。

Fast Template

Fast Template

  • Haruya Nakamura
  • 仕事効率化
  • ¥120
apps.apple.com

Fast Template Lite

Fast Template Lite

  • Haruya Nakamura
  • 仕事効率化
  • 無料
apps.apple.com

ちなみに、初めから海外でも使ってもらえるようにと考えて英語版で作ってます。

難しい英語はありませんし、一度慣れればなんてことないと思いますが。

アプリの特徴

  • 「ワンタップ」で決められた方法で定型文を作成できる
  • 日付の埋め込み機能
  • 時刻指定のリマインダー機能

それぞれ簡単に説明します。

「ワンタップ」で決められた方法で定型文を作成できる

f:id:hareruya_maro:20200130001540p:plain

上のはアプリの起動直後の画面ですが、それぞれのタイルが定型文を作成するためのボタンになっています。

テンプレート作成系のアプリはいくつかあるのですが、どれもリスト形式で選択する感じで、さくっと選ぶのが難しかったのでもっと大きく大胆に配置するようにしました。

また、このボタンをタップすれば、あらかじめ設定しておいた方法で定型文を作成できます。

対応しているのは現在以下の作成方法。

  • メール
  • SMS
  • ほかのアプリへのShare(iOS標準のShare機能、一部アプリはダイレクトリンク)

例えば「メール」で宛先のメールアドレスや件名なんかも設定しておけば、ボタンを押すだけでメール送信画面が開きます(自動送信はできませんが・・・)

他のアプリへのShareでは、TwitterへのShareとかできます。

毎回呟いてる定型文があれば、使えます(使うか??)。

日付の埋め込み機能

日付の埋め込み機能は、指定したフォーマット(${d:YYYYMMDD}みたいな)で定型文を作っておくと、現在日時で埋め込んでくれます。

(なんのことはない、moment.jsを使ってるだけですが・・・)

例えばメールで今日の日付を必ず埋め込みたいとか、送った日時を本文に入れておきたいとか、そんな要件があると使えるかと思います。

時刻指定のリマインダー機能

指定した時刻に通知を出すこともできます。

例えば朝9時にこの定型文のメールを送る(出勤連絡とか?)とか、そんな使い方でしょうか。

1定型文につき2つまで設定可能です。

指定方法も曜日指定と月のうちの3日選んで指定が可能です。

3日で足りなければ、お手数ですが同じのを増やしてください・・・。

今後の目論見

今後の機能追加として以下のようなものを考えています。

  • 指定した場所についたら通知するロケーション通知(会社着いたら通知、みたいな)
  • 通知を指定した時間経ったら再通知するようスヌーズを指定できるように(30分後に再通知、みたいな)
  • 定型文のコピー
  • ボタン配置の変更
  • 日時埋め込みを柔軟に(前日、翌日、1時間後、などの指定)
  • アプリアイコンにバッジを表示(もしかしたらプレミアム機能にするかも)
  • 日本語化
  • Android対応(なんかいろいろ問題が多いので実現しないかも。。。)

Lite版はとりあえず無料なので、ぜひ使ってみてください。

Privacy policy for "Fast Template"

Privacy Policy

Haruya Nakamura built the Fast Template app as a Commercial app. This SERVICE is provided by Haruya Nakamura and is intended for use as is.

This page is used to inform visitors regarding my policies with the collection, use, and disclosure of Personal Information if anyone decided to use my Service.

If you choose to use my Service, then you agree to the collection and use of information in relation to this policy. The Personal Information that I collect is used for providing and improving the Service. I will not use or share your information with anyone except as described in this Privacy Policy.

The terms used in this Privacy Policy have the same meanings as in our Terms and Conditions, which is accessible at Fast Template unless otherwise defined in this Privacy Policy.

Information Collection and Use

For a better experience, while using our Service, I may require you to provide us with certain personally identifiable information, including but not limited to E-Mail Address. The information that I request will be retained on your device and is not collected by me in any way.

The app does use third party services that may collect information used to identify you.

Link to privacy policy of third party service providers used by the app

Log Data

I want to inform you that whenever you use my Service, in a case of an error in the app I collect data and information (through third party products) on your phone called Log Data. This Log Data may include information such as your device Internet Protocol (“IP”) address, device name, operating system version, the configuration of the app when utilizing my Service, the time and date of your use of the Service, and other statistics.

Cookies

Cookies are files with a small amount of data that are commonly used as anonymous unique identifiers. These are sent to your browser from the websites that you visit and are stored on your device's internal memory.

This Service does not use these “cookies” explicitly. However, the app may use third party code and libraries that use “cookies” to collect information and improve their services. You have the option to either accept or refuse these cookies and know when a cookie is being sent to your device. If you choose to refuse our cookies, you may not be able to use some portions of this Service.

Service Providers

I may employ third-party companies and individuals due to the following reasons:

  • To facilitate our Service;
  • To provide the Service on our behalf;
  • To perform Service-related services; or
  • To assist us in analyzing how our Service is used.

I want to inform users of this Service that these third parties have access to your Personal Information. The reason is to perform the tasks assigned to them on our behalf. However, they are obligated not to disclose or use the information for any other purpose.

Security

I value your trust in providing us your Personal Information, thus we are striving to use commercially acceptable means of protecting it. But remember that no method of transmission over the internet, or method of electronic storage is 100% secure and reliable, and I cannot guarantee its absolute security.

Links to Other Sites

This Service may contain links to other sites. If you click on a third-party link, you will be directed to that site. Note that these external sites are not operated by me. Therefore, I strongly advise you to review the Privacy Policy of these websites. I have no control over and assume no responsibility for the content, privacy policies, or practices of any third-party sites or services.

Children’s Privacy

These Services do not address anyone under the age of 13. I do not knowingly collect personally identifiable information from children under 13. In the case I discover that a child under 13 has provided me with personal information, I immediately delete this from our servers. If you are a parent or guardian and you are aware that your child has provided us with personal information, please contact me so that I will be able to do necessary actions.

Changes to This Privacy Policy

I may update our Privacy Policy from time to time. Thus, you are advised to review this page periodically for any changes. I will notify you of any changes by posting the new Privacy Policy on this page. These changes are effective immediately after they are posted on this page.

Contact Us

If you have any questions or suggestions about my Privacy Policy, do not hesitate to contact me at Haruya.Nakamura.86@gmail.com.

This privacy policy page was created at privacypolicytemplate.net and modified/generated by App Privacy Policy Generator

個人開発でアプリを作るときに考えたこと2(何を使うか)

こんにちは。

前の記事では個人開発を始めるにあたり、何を作るかをどう考えたかを書きました。

henahena.hateblo.jp

今回は「何を使うか」ということで、技術選定の話を書きます。

初めてのスマホアプリ開発なら、「React Native + Expo」一択

異論は認めます。が、少なくとも自分はこの選択肢で間違いありませんでした。

仕事でスマホアプリを作ったことがある人などは除き、スマホアプリ自体を初めて作るなら、SwiftとかKotlinとかで作るよりもとりあえずReact Native + Expoで良いと思います。

Flutterとかもあるけど、Expoのサポートの恩恵は魅力的すぎました。

煩わしいことはなるべく避ける

スマホアプリ開発で最大の関門は、最後のリリースにあると思っています。

アプリを作るだけなら、世の中にはいろいろなサンプルもあるし、コピペしまくって切り貼りだけでそれなりに動きます。

あと、作ってるときは楽しいので、調べながらでも頑張れる部分もあると思います。

ところがアプリが出来上がってさぁリリースとなったときに、やたらと厄介なことが多いです。(特にiOSアプリ)

ここで挫折したり、なんとかリリースしたけどモチベーションが下がってしまうと続けられなくなります。

そこのところを、Expoはとにかく簡単にしてくれるので良いんです。

Expoのデメリット(アプリ内課金が使えないとか、カスタマイズし始めると痒いところに手が届かないとか)はありますが、最初のアプリ作成でそこまで見切ることなんてできないので、まずはExpoで作ってリリースする、というのが大事かなと思います。

一回リリースまでこぎつけて、何度かアプリのアップデートをしていくと、いろいろやりたいことが見つかって、じゃあExpoを卒業しましょう、という流れでいいんじゃないかなと。

サーバーは使わない

「煩わしいことは避ける」のと同じ理由なのですが、サーバーサイドが必要なアプリははじめは避けたほうが良いです。

もちろん、サーバサイドはバリバリ作れるぜ!って人なら良いと思いますが、やはりサーバサイドは煩わしいです。

小さな成功体験を積み重ねるためにも、サーバレスで作れるようにしましょう。

サーバーなし(スマホ単体で完結する)ものか、サーバが必要でもFirebaseなどを使って構築や運用を考えなくていいようにすべきです。

自分はセワシタ?を作る際はFirebaseで済ませました。

ロジックが全部スマホ側に来ると、想像以上に管理もしやすくてよかったです。

特に個人開発くらいの規模間のアプリなら、ロジックは一か所にまとめてしまうほうが良いですね。

結局大事なのはリリースすること

最終的には、何を使うかはどうでもよくて、リリースまでこぎつけることがもっとも重要なことです。

リリースにこぎつけるなら、SwiftでもFlutterでもReact NativeでもCordovaでもなんでもいいです。

今の自分のスキルで作れるものを作りましょう。

スマホアプリ周りのスキルに自信がないなら、「React Native + Expo」をお勧めします。

個人的な比較表

最後に、個人的に技術を比較した内容を書いておきます。

参考まで。

Swift

昔Swiftで作ったことがありましたが、なかなかつらかったです。

Swift出たばかりで、自分のスキルも低かったためでしょうが、煩わしいことが多くてモチベーションを保つのが難しかったです。

当たり前ですが、iOSアプリしか作れないのと、Macが貧弱なAirしかなかったのでやめました。

Kotlin or Java

Androidを作るならKotlinかJavaですね。

こちらもAndroidアプリしか作れないので、両方のアプリを作りたかった(両方使っている家族でも使ってもらえるアプリにしたかった)ので外しました。

Swiftもそうですが、仮にどちらかのプラットフォームだけで使うアプリでも、今後は使うことはなさそうです。

React Native + Expo

JavaScriptアプリ開発ができる、しかもiOSAndroidの両方のアプリが一つのソースから作れる、ということで選定しました。

Cordovaと比べてNativeアプリのようにサクサク動くのも大事でした。

しかもExpoを使えばいろいろ簡単そうっていうのは魅力的でしたね。

WindowsでもiPhoneの実機で確認できるというのもありました。

また、仕事でReactを少し触ったことがあったのも大きいです。

Cordova

以前、Cordovaも少し触ったことがありましたが、当時はJavaScriptが良く分かったなかったので作り切れませんでした。

また、サンプルアプリとか見ても、あんまり良い動きをしないのでこれはちょっと嫌だなぁと思ったのもあります。

Nativeアプリのヌルヌル感が欲しかったのでCordovaは対象外になりました。

Flutter

今からアプリ開発をするなら候補に入ってきますね。

開発に着手した当時はまだまだこれからという感じだったので見送りました。

あとは、iOSアプリ作るならそこそこのスペックのMacが欲しい感じだったので、Macを買ったら触ってみたいところです。

とはいえ、やはりExpoの便利さを考慮すると、最初に手を出すことはなさそうな気がします。

個人開発でアプリを作るときに考えたこと1(何を作るかとか)

こんにちは。

個人開発で「セワシタ?」というアプリを開発しています。

セワシタ? - お世話を記録・共有できるアプリ

セワシタ? - お世話を記録・共有できるアプリ

  • Haruya Nakamura
  • ライフスタイル
  • 無料
apps.apple.com

play.google.com

まだリリースから3ヶ月(2020年1月現在)ほど、ダウンロード数もようやく100を超えたところですが、何を考えてアプリを作ったのかを書いてみようと思います。


何を作るのか

始まりは曖昧に

まず、「とりあえず何かアプリを作りたい」と思ったときに、問題になるのは「何を作るのか」だと思います。

「個人開発したい」からスタートしてたりすると、どんなアプリを作れば良いのか、特にアイデアのない状態だったりすることも多いでしょう。

自分もはじめは「何を作れば良いのかなぁ」と漠然としていました。

とりあえず、自分が困っていることはなんだろうなと考えたときに、去年飼い始めた猫のお世話が、妻とうまく協力できてないなというところがありました。

まずは「ペットのお世話をなんかうまく共有する」という曖昧なイメージを決めました。

もうちょっと具体的に

次に、アイデアを具体化していきました。

「お世話に困っている」とはいえ、まったくできてないわけじゃないし、なんならだいたい妻がやってくれるのであまり(自分は)困ってない。

具体的にお世話で困ることは何かなと思ったときに、「あのお世話終わってる?」「今日うんちした?」「おやつあげたのかな?」というあたりの情報共有が課題でした。

二重にお世話しちゃったり、おやつ2回あげちゃったりも困りますし、ペットのお世話って小さな情報の積み重ねで体調を管理してあげないといけないので、「今日のおしっこ・うんちの回数や色形」みたいな情報を共有しておかないと、体調変化に気づけ無いかもしれないんですね。

二人でやってるとそれがあるかもしれないので、それを避けるためにもお世話の情報を共有し、一元管理したい、というのが見えてきました。

競合アプリ確認

このへんで、似たようなアプリはどんなものがあるのか確認します。

普通に「ペット」「管理」とかで検索して、でてきたアプリを片っ端からダウンロードして使ってみました。

結果、「ペットの管理」をするアプリはあるけど、「お世話」をメインに管理するアプリはなさそうだぞということがわかり、これで行くことに決めました。


今ならこう考える

初めてのアプリなので、まずは自分の課題解決をメインに考えましたが、実際問題「お金儲かるか」みたいなことも大事だと思うので、今ならこんな感じで対象を絞るかなと思います。

ゲームか、ツールか

まずアプリのジャンルとして、ゲームを作るか、ツールを作るかというところがあります。

正直、ゲームは技術的にも、センス的にも難しいなと思うので、自分ならツールを選びます。

あと、ゲームは「飽きられる」という可能性があるので収益面で行くと継続性が低く、継続して収益上げたいとなると常に新しいゲームを作るか、同じゲームに新しいコンテンツを提供し続ける必要があります。

これは個人開発としてはなかなか大変だし、スケールしづらいです。

その点ツールなら、ある程度の完成形ができたらあとはメンテナンスメインでよく、次のツールを作ることができるので収益の柱を増やしていくことができます。

こちらの方が個人開発には向いているのでは?と思います。

ゲームの一発あたったときの爆発力はすごいですけどね。どうぶつタワーバトルとか。

どんなツールか

どんなツールを作るかは、何で収益を得るつもりかにも影響してきます。

日常的に使うアプリのほうが、広告収入と相性がいいです。

そんなに日常的には使わないけど、スポット的に何度か使う可能性のあるアプリは、買い切り型の有料アプリが向いています。

セワシタ?」はクラウド利用が必須のアプリだったので、将来継続的に発生するコストを考えると継続的に収益を生む広告モデル or 月額課金モデルでの収益化が必要でした。

有料アプリで買い切りにしてしまうと、将来使われるほどに赤字になるという可能性もあるのでこの形は難しくなります。

クラウド利用などがなく、端末単体で利用可能なアプリであれば、買い切り型にするのでも問題ないですね。

何で収益を上げるか

上でもう書いてしまいましたが、収益の上げ方を検討する必要があります。

まぁ、個人開発アプリなんてそんなに収益上がらないのが普通なのですが、とりあえず「毎月赤字」みたいなことはさすがに避けなければいけません。

自分が作るアプリがどういうところでコストがかかるか(サーバーとか、自分の開発用の環境とか)を考えて、その分くらいは稼げるようにしないと、使ってもらうほどに損をするという悲しいことになります。

「とりあえず無料で出して、あとで広告でもつけよう」とかやることもできますが、たぶんユーザの満足度を下げるだけなので、最初から広告つけといたほうが良いです。

ちゃんと考えておきましょう。

通常、以下の3つです。

  1. 広告
  2. 有料
  3. 月額課金

有料アプリにはアプリ内購入っていうパターンもあります。

手を出しやすいのは広告ですね。

有料・月額課金は金額設定とか難しいし、有料にするとユーザーが厳しくなるという問題もあります。

個人開発者はとりあえず広告でスタートするのが無難な気がします。

競合アプリはあるか

たいてい、競合するアプリがあります。

あなたの考えつくアイデアなんてどっかの誰かが考えついてます。

とはいえ、悲観する必要はありません。

競合がいても、使ってみるとなんか使いづらかったりするものです。

多少差別化すればそれなりに使ってくれる人は現れます。

怖気づく前に作りましょう。

買わない宝くじは当たらないのです。


つらつらと書きましたが、何かしらの参考になれば幸いです。

あと、別途技術選定の話も書こうかなと思います。

【Expo (React Native)】React NavigationのHeaderをやめてReact Native ElementsのHeaderを使う

React NavigationのHeaderを使っていたのですが、StateやらPropsと絡めていろいろやろうとすると面倒だったのでやめることにしました。

代わりにReact Native ElementsのHeaderコンポーネントを使うことにします。

react-native-elements.github.io


React NavigationのHeaderを非表示にする

まずはReact NavigationのHeaderを消します。

これはCreateStackするときに指定すれば簡単に消せる様子。こんな感じ。

const ChatStack = createStackNavigator({
  Chat: ChatScreen,
}, { headerMode: 'none' });

ただ、これだと同じStack内に複数Screenを追加した場合は全部Headerが出なくなります。

自分はそれでよかったんですが、一部だけ消したいときは以下のように書くらしいです。

const ChatStack = createStackNavigator({
  Chat: {screen : ChatScreen,
         {navigationOptions: () => ({
           header: null
         }), 
        },

qiita.com


React Native ElementsのHeaderを追加する

普通にImportしてrenderに書けば出ます。

公式サイトを見てください。

一つ気を付けるのは、React Native ElementsのHeaderコンポーネントはステータスバー(一番上の時間とか電波状況とか表示してるあれ)の分を加味してサイズ決定してくれるようなので、SafeAreaViewとか使っている場合はHeaderはSafeAreaViewの外にしてあげる必要があります。

Androidとかのいろんな画面の形だとどう表示されるのかな。

ノッチがあるやつとか。試してません。

とりあえずこれでStateとかPropsを直接Headerの中で使えるようになります。

バッジ付けたかったのが簡単になってよかった。

【Expo / React Native】ExpoをSDK36に上げたらAndroidでreact-native-swiperが動かない

ExpoをSDK36に上げたところ、Androidでアプリが起動しなくなった。

事象としては下記のものと同じだった。

ViewPagerAndroid has been removed... on 1.6.0-nightly.5 · Issue #1108 · leecade/react-native-swiper · GitHub

react-native-swiperが新しいReact Nativeに対応していないらしい。

仕方ないので以下の方法で対応。

npm uninstall react-native-swiper
npm i --save react-native-swiper@^1.6.0-nightly.5
expo start -c

react-native-swiperをNightlyビルドにして、キャッシュクリアして起動すればいけた。