バナナピーチ -アプリ開発したものを記録する-

Web制作・エンタメに興味のある筆者が自身のアプリ開発や気になったエンタメ情報をつらつらと記録していくブログ。

【知識ゼロからアプリ開発】途中経過を雑記する#1

 

全くの知識ゼロでアプリ開発ってできるの・・・?

 

プログラミングやサーバーなどの知識全くゼロからアプリ開発をしてみよう企画の途中経過を記録していきます!今回は、#1。

 

私は本当に全くの素人で、いったい何から始めたらいいかわからず、ひとまず、html5cssというウェブブラウザを構築する言語の参考書を買って読みふけり、基礎を学びました。(企画開始から3か月ぐらい)

 

 

そこから、javascriptという、ウェブブラウザに動的な要素を追加することができる言語に手を出し始め、これがまた難しく、まだまだ勉強中といった感じです(企画開始から5か月くらい)

 

 

そして、いよいよアプリ開発をいったいどうするものかと、サイトを巡り、情報収集・・・。

 

androidiosアプリを開発するには、それ専用の言語、swiftや、javaを学ばなくてはいけなくて、更により高度なアプリは、サーバーサイドの管理が必須ということを学習。開発側からしたら基礎中の基礎の知識というかそれ以前だと思いますが・・・。

 

その専用の言語を覚えたいところですが、ショートカットして、ウェブサイトを作成するhtml5cssjavascriptを使って、androidiosアプリに近いものを作れるらしいので、

 

現在は、html5cssjavascriptを使ってアプリ開発をしています。

 

私は、MacOSを持っていないので、ひとまずandroidアプリを開発中です!

 

使用しているのはMonaca

 

Monacaとは、簡単にハイブリッドアプリを開発できるプラットフォームです。

 

ハイブリッドアプリとは、本来ウェブを構築するhtml5cssjavascriptという言語を使って、ネイティブアプリ、つまりiosやandoidのストアで配布されているようなアプリを開発することで、Monacaは簡単にハイブリッドアプリを制作することができるサービスです!

 

Monacaテキストエディタとして使えるのですが、Bracketsというテキストエディタ―のほうが高性能で使い慣れているので、bracketsで制作しつつ、実機で確かめたいときは、Monacaの実機デバッグという機能を使ってかっこよくいうと、二刀流で制作しています!!

 

わざわざカッコよく言う必要もなかったですね・・・。

 

前置きが長くなりました。現在のアプリの開発画面を少し紹介します。

 

開発アプリの途中経過

 

まず、アプリを起動してスタート画面・・・。

 

f:id:tnetfor1lill:20180403155848p:plain

iphoneXで画面サイズを表示しています。

筆者がiphoneしか持っていないので、実機デバッグの際都合が良いように、iphoneXを基準にアプリを開発しています。

 

しかし、どんな端末のサイズにも対応できるようにしないと、iphoneX以外の端末になったとき、表示が崩れてしまいます。

 

なので、レスポンシブデザインを心がけて制作しています。

レスポンシブデザインとは、端末のサイズに柔軟に対応できるような画面のデザインです。

 

要素の幅や高さを%指定や、vw、vh指定を使ってうまいこと対応させるか、メディアクエリを使って対応させます。

 

これから、どんどん分からない言葉が出てくる読者の方もいるかと思いますが、筆者もネットから情報を得てアプリを開発しているため、ネットで調べればすぐに出てきます。頑張って調べてください・・・。

 

どんなアプリを開発しているのか

 

まず、これを説明しておかなければなりません。

一応、バナナピーチのプロフィールにも載せておきます。

 

アプリ名は、『Tsukushi』

 

前は『DreamList』という名前でしたが、すでに同名アプリが存在したため、急遽改名しました(汗)

 

どんなアプリかというと、

ユーザーが目標、達成までの期限、達成したときの褒美を設定して、目標の期限や達成率を通知でお知らせし、支援するアプリです。

 

また、オンラインで他のユーザーの目標を応援することもでき、共通する目標なら質問して、より達成に近づくヒントを得ることもできます。

 

今のところ、ただ、仲間内で目標共有をするとお互いに研磨しあって、目標達成意識が高められると考えていますが、更には、どんなユーザーでも支援しあって、メリットがあるアプリを開発できればと思っています。

 

簡単なアプリの活用例

例えば、大学生が「卒業論文を完成させる」という目標をアプリに登録します。

期限は、論文提出締切日までとします。

この目標を達成したときのご褒美は、「高級腕時計を一本購入」と設定します。

目標も、期限も、ご褒美も、ユーザーが自由に設定できます。

ご褒美に関しては、アプリ側から提供したいとも考えていますが、今のところどんなものが良いかは決まっていません・・・。

 

通知で、期限までの日数を、設定した時間帯に通知してくれます。

また、1日の達成率の変化も確認することができます。

メモで、1日目標のためにしたことを書き留めることができます。

達成率の変動は、自分自身で行います。

 

休憩モードで、この日取り組んだ目標以外の目標を指定時間通知オフにすることができます。

 

など、色々、アプリでできることを模索しています。

 

長くなりそうなので区切ります。

#2では、画面写真多めに、ユーザー管理をするためにFirebaseというサービスでサーバーサイドの開発に着手した結果をまとめたいと思います。