初心者がリマインダーアプリを作った話(リリース1ヶ月後の反省)
はじめに
はじめまして。私は情報系の学部に在籍している大学生です。
Twitterはこちら。
趣味でiPhoneアプリの開発をしており、12月初旬にLEFTというリマインダーアプリをApp Storeにリリースしました。
その後、実際にアプリ開発の際に考えていたことなどをまとめて、別の投稿サイトで記事にしていました。
この度noteにも記事を投稿してみようと思い、せっかくならリリースしてからわかった反省点などを追記して投稿することにしました。
ここから下は以前私が書いた記事そのままですが、
ところどころこのように引用の表記を用いて、現在思う反省点などを書いていきます。
以下、記事本文です。
--------------------------------------------------------------------------
はじめに
はじめまして。私は情報系の学部に在籍している大学生です。
もしかして自分はUI/UXに興味があるんじゃ?と思いまして、いっそのこと実際にアプリを作りながら考えてやろう、ということでリマインダーアプリを作ってみました。
作る前の段階から完成したアプリの機能紹介までを含んだ記事となっています。
簡単なアプリですが、初心者ゆえ相当な試行錯誤の末に完成したアプリです。至らぬ点などが目に付くかとは思いますが、ゆるりとご覧いただければと思います。
完成したものはこんな感じです。App Storeへのリンクはこちら
まずUXとは
色々なサイトなどで勉強しましたが、私が考えるUXの認識はアプリ(サービス)を通してユーザーが経験すること全てです。
前項ではUI/UXという言葉を使いましたが、本来UXはUIと同じくくりにするものではないのでしょう。明らかにUX∋UIです。
UXをデザインするということは、とにかくユーザーの気持ちを考えながらアプリを作っていくことになるでしょう。
参考1:UI/UXなUXのお話
参考2:UI/UXデザインの基本と初心者におすすめの勉強法
UXデザインのためにしたこと
素人による暗中模索ではありますが、色々考えながら進めていきました。
ターゲット設定
今回開発するリマインダーアプリのターゲットは自分です。
自分が欲しいと思うなら他の誰かが欲しいと思うことが有り得る、という理由からです。
自分が欲しいものを作りたいという願望もあるからです。
・・・さすがに甘いかな・・・?
コンセプト・テーマ的なもの設定
後付けですが、「1つ1つの予定と向き合うリマインダー」というコンセプトで開発しました。
Appleのリマインダーに期限までの残り時間が表示されないのが気に入らなかったことから、自分で開発しようと思ったのがそもそものきっかけだったりします。
反省ポイント
コンセプト大事。
もっときちんと練ってからやるべき。
作り始めてからだとなかなか変更しづらいくて面倒になる。
今回はモックなども作りはしましたが(後述)それでも見切り発車のようになってしまった感は否めません。
もう少し自分の中で深く考えてからでもよかったかも?と思っています。
欲しい機能洗い出し
- 予定の追加
- 予定の削除
- 予定の完了・未完了の設定
- 予定に関するメモ記入
- 予定のカテゴリ分け
- プッシュ通知
- カテゴリ分け
- 期限までの残り時間表示
開発を進めるうちに色々追加していき、上のような形に落ち着きました。
反省ポイント
本当に必要なのか?
どの機能が一番優先なのか?
その機能をどう使ってもらうのか?
などをもっと考えるべき。
「こんな感じのあったら便利そ〜」と軽く考えていました。
実際に完成してみると、「この機能必要か?」と思うことが出てきました。
それぞれの意義をより深く考えるべきでしたね。
モックアップ作成
アプリの見た目を考えるのがはじめの難関でした。
なかなかしっくり来なかったりするもので・・・。
はじめはメモ帳などにアイデアを書き溜め、これかなーと思うものができたらAdobe XDを使ってモックアップを作成しました。お恥ずかしいですが最初期のモックアップと最終的なモックアップを公開します。
こちらが最初期。↓
最初はこれがいいかもと思っていたんです・・・。
そのあとも色々な案を実装しつつ、最終的にはPinterestで「これ欲しい!」となったUIを見つけたのでそれを参考にさせていただきました。
こちらが最終案です。↓
各UI部品についての配置の意図などは後述します。
反省ポイント
「期限まで残り24時間未満の予定が…」って本当に必要?
ユーザーに伝えるべきことでもっと重要なのがあるんじゃない?
後述しますが一見すると見えない操作方法があるため、そのような情報を伝えるべきではないのかと思います。
せっかくの文字情報を使えるポイント、もっとうまく活用できるかなと思います。
実装!
とにかく頑張りました。
最終案のモックアップを作成してから3週間程度での開発となりました。
最初期の構想段階から考えると2ヶ月近くになるかと思います。
実装途中につまづいた細かい問題点については今回は触れません。調べれば出てくるような問題ばかりだったのでアウトプットするかどうかも未定です。
補足
開発環境はXcode10.1, 言語はSwift4.2です。
おそらく…。
全体的な方針
ピンポイントのタップはあまりしたくない!
ユーザーにとって、なんらかの目的を達成するために小さなボタンをタップしなきゃいけない、というのは少し面倒くさいような?と感じています。
ある一定の(そこそこ広い)範囲をタップするか、スワイプなどで対応したいと考えました。
反省ポイント
ちょっとくらいいいじゃん。
今でもこの方針自体は悪くないとは思っています。しかしその方針のためにいくつかの操作方法が見えなくなってしまったのは良くないと感じています。
他の様々なアプリでピンポイントのタップ(バツボタンなど)は使用されているため、このアプリでもむしろ使った方がユーザーにとってはわかりやすいのかも?
開発したアプリのキャプチャ
ここから場面ごとにアプリを見ていきます。
予定の追加
予定の追加は右下のフローティングボタンから行います。
定番のデザインですし、画面内にはこれ以外のボタンをほぼ用意していないのでユーザーが迷うことはないかと思います。
ポイント
予定を作成する際はタイトルを入力しないと追加されないようになっています。
(しかしそれをユーザーに伝える手段を実装し損ねました…アップデートで対応します。)→対応済みです(2018/12/30現在)
その他に、期限・メモ・通知の設定・カテゴリを表す色などの情報をユーザーが加えることができます。
作成ボタンを押すと、追加した予定にスクロールし「Added!」というメッセージを表示することで、作成できたことをユーザーがきちんと認識できるようにしています。
予定に関する情報を書くポップアップにはPopupDialogというライブラリを使用しています。
反省ポイント
現在は改善していますが、予定を追加するポップアップが一見するとスクロールできるように見えない、という声が知人からありました。
確かに…
予定の編集
予定のカードをタップすると編集できます。
追加の時にも使用したポップアップに、選択した予定の情報が格納されて表示されます。
保存ボタンを押すと情報が更新されているのがわかるかと思います。
またポップアップの周りの暗い部分をタップすると、ポップアップが閉じるようになっています。自然ですね。
反省ポイント
「タップすれば編集できる」というのがこの画面だけではわからない。
別の画面で操作方法を説明していますが、この画面だけでその情報が得られた方が手間がかからなくて良いかなと思います。
予定の完了・削除
スマホの画面キャプチャってタップの様子あまり伝えられないですね笑
予定のカードをダブルタップすることで「完了」との表示を出すことができます。
その状態でもう一度ダブルタップすると削除できます。また完了している状態でトリプルタップをすると、未完了の状態に戻すことができます。
(削除するときは「本当に削除しますか?」を聞くポップアップを出すように今後実装しようかと思います…)→こちらも実装済み(2018/12/30現在)
ポイント
編集ボタンや削除ボタンを用意しなかったのは、前述の「全体的な方針」に則っています。
ただしカード全体をタップ可能にすることで、誤タップが増えることが予想されます。
カードの中で物理的に一番タップしやすい範囲はメモが書いてある部分ではないかと考えています。そこでメモの書いてある部分はメモ自体をタップ可能にすることで対応しています。
こうすることでメモ以外をタップすることで編集ができるようになっています。またメモ自体をタップできるようにすることで、メモにタップできるURLを載せることができ一石二鳥です。
反省ポイント
完了機能が一番いらないんじゃないか説。
自分でもリリースしてから1ヶ月(リリース前からも触っていましたが)使用してますが、完了状態にしたいと思ったことは一度もありません。
削除するためにわざわざいらない手間がかかっていると感じます。
近いうちに消す機能かと思います。
トップに戻るボタン
予定の数が多くなると絶対に欲しい機能ですね。
ある程度スクロールすると左端に見えるようになっています。
また戻った先の予定で表示されていますが、期限を過ぎている予定に関しては表示をすることで知らせるようにしています。
反省ポイント
実はバグあり。
リリースしてから気づきましたが、一番右にある予定を削除するとこのボタンの挙動がおかしくなってしまいます。
もしこのアプリを入れている方がいらっしゃればお試しください。変です。
でも原因がわからず、まだ対処できていない状況です。
広告について
アプリの収益化としてよくある選択肢である広告をこのアプリでも採用しています。
しかしユーザーの広告に対する認識は「邪魔・うざい・めんどう」のようなものだと思います。UXの質を著しく低下させる原因にもなりかねません。
そこでこのアプリでは広告の掲載方法を工夫しています。
今までの画面キャプチャからわかると思いますが、バナー広告などの常時表示されるタイプの広告は使用していません。その代わりにAdMobのリワード広告(広告を閲覧するとユーザーに報酬が与えられる広告)を採用しています。このアプリでいう報酬とは予定の作成数の上限としています。上限以上の数の予定を作成しようとすると、以下のようなポップアップが表示されます。
「再生」ボタンを押さない限りは広告が再生されることはありません。
こうすることでユーザーが予期しないタイミングで(または常時)広告を流すことを避け、ユーザーに与えるストレスを軽減しようという意図があります。
反省ポイント
広告が再生できない問題。
この広告はロードが完了していないと再生できないことになっています。
そしてそのロードはよく失敗します。現在はアプリの起動時と広告再生直前にロードをするようにしているのですが、それでも失敗することがあります。
ロードするまで待つ、としたいんですがその方法がいまいちわからず「数秒待つかアプリを再起動した後にもう一度お試しください。」という表示を出すという対策しかとれていません。
方法を知りたい…
その他
右上のメニューボタンのタップ、もしくは上から下へのスワイプで上の画面に遷移します。
操作方法から開発者の個人的な考えなど、様々なことを書いています。
個人的に「開発者の顔が見えるアプリ」というのが好きなので、あえて開発者の考えなどについてもアプリ内に書いています。
反省ポイント
なぜ上から下へのスワイプで画面遷移をしたのか。
「すぐできるし、ちょっとやってみるか」みたいなノリで実装してしまいましたが、絶対いらない気がします。
開発してみて
いや〜難しかったです。全て難しい。
「こうするといいんじゃないか?」と思って形にすると「ちょっと違う?」となったり、自分が考えていた軸がぶれぶれになるのを感じました。
デザインについて
最近流行りの白を基調としたデザインにすべきだったかもしれないと思っています。Appleのアプリにも採用されている流れですからね。
とはいえ色使いにどんな意味をもたせるのかが重要なことだと思うので、今後また検討します。
UXについて
UXについて考えを深めたいということから始めたこのアプリ開発ですが、深められたというほどではないかもしれません。
自分では正しいと思っていても自分が思い込んでいるだけということもありますし、そもそも考えが至らない点などが多くあるかもしれません。
これからは自分もユーザーの一人として落ち着いて考え直していきます。
終わりに
長文駄文でしたが最後までお読みくださりありがとうございます。
もしよろしければご意見などいただければ幸いです。
--------------------------------------------------------------------------
以上、記事本文でした。
本当に終わりに
自分でもツッコミどころが大量だと感じました。
これを1ヶ月前に読んでくださった方々、実際にアプリをダウンロードしてくださった方々には膨大な疑問を生じさせたのではないかと…。
まだまだ精進しなきゃなぁと思いながら、そして改善案をもっと考えながら年末年始を過ごしたいと思います。
非常に長い文章になってしまいました。ここまで読んでくださった方、本当にありがとうございました。
皆さま良いお年をお迎えください。
サポートしていただけると非常に嬉しいです!