Laravel+Vue+Vue Router+Vuexを使って、iphpne標準のリマインダーのようなTODOアプリを作りました。
この記事では、TODOアプリを作るに至った理由を記載していきます。
■TODOアプリ制作の背景
①導入
多忙な現代人にとって、日々のTODO管理は業務を遂行する上で必要不可欠です。
つまり、アナログ・デジタル問わずTODOを管理するシステムが効率的・生産的になればなるほど、
現代人の生産性は向上していきます。
そのため、様々なTODOアプリが世の中には多く存在し、多くの人に利用されています。
②問題点
しかし、一方で様々なTODOアプリがあるため、操作性の違い、機能の違いといった
アプリごとの使いやすさが異なっています。
アプリごとに操作性や機能が異なるということは、それぞれのアプリごとに操作性や機能を覚えていかなければいけないということを意味します。
生産性・効率性を高めるためのTODOアプリに対して、そのアプリを使うこと自体の手間が発生することは、結果的に生産性や効率性を低くしてしまっていると予測されます。
③今回のアプリ開発で実現したいこと
そこで、汎用的な操作性と機能性を備えたTODOアプリを作ろうと考えました。
④汎用的な操作性の定義
汎用的な操作性とは何でしょうか？
今回の開発では、汎用的な操作性とは多くの人が一度は使ったことがあるアプリに操作性が近いことと、定義付けました。
多くの人が使用したことのあるアプリとして、LINEをベースにしました。
LINEは、日本人のスマホ・ケータイ所有者の81.6%が使用しているアプリだからです。
以下は2022年にNTTドコモで行われたSNS利用率調査の結果です。
SNS利用率調査
[調査対象：全国・15～79歳男女・スマホ・ケータイ所有者対象・複数回答・n=6,587]
出典：2022年一般向けモバイル動向調査
⑤汎用的な機能性の検討と競合比較
次に汎用的な機能性を考えます。
まずは競合比較として、iphoneリマインダー、GoogleTodoリスト、Todo（タスク管理アプリ）の機能を調査しました。
その結果、機能としてはiphoneリマインダーが一番多くの機能を備えていることが判明しました。
■主な機能の競合比較
| 機能/アプリ名 | iphoneリマインダー | GoogleTodoリスト | ToDo（タスク管理アプリ） |
|---|---|---|---|
| Todo追加 | 〇 | 〇 | 〇 |
| リスト追加 | 〇 | 〇 | 〇 |
| 子リスト追加 | ✕ | 〇 | ✕ |
| フッター メニュー |
✕ | ✕ | ✕ |
| 全Todo表示 | 〇 | ✕ | 〇 |
| 今日の Todo表示 |
〇 | ✕ | ✕ |
| 期限有り Todo表示 |
〇 | ✕ | 〇 |
| 期限切れ Todo表示 |
〇 | ✕ | ✕ |
| 検索機能 | 〇 | ✕ | ✕ |
| 並び替え | 〇 | 〇 | 〇 |
| Todoスワイプ 操作（編集） |
〇 | ✕ | ✕ |
| ピン止め | 〇 | 〇 | ✕ |
| 繰り返し | 〇 | 〇 | 〇 |
| 日付・時刻選択 | 〇 | 〇 | 〇 |
| 画像添付 | 〇 | ✕ | 〇 |
| 優先度付け | 〇 | ✕ | ✕ |
| 場所選択 | 〇 | ✕ | 〇 |
| 実行済表示 | 〇 | 〇 | 〇 |
3.第三者の意見
また、第三者の意見として、iphone標準リマインダーを使用している知人に聞き取り調査を行いました。
その結果、機能性としてはリマインダーで満足しているが、以下の点が改善されるとより使用しやすいとの回答を得ました。
①子リスト（カテゴリーなど、リストの子要素）を追加したい
※GoogleのTodoリストでは使用できる機能です。
②検索ボックスについて、トップ画面ではなく、各リストごとのページに欲しい
③スマホで操作を行うため、リスト切り替えを画面下部でも行えるようことが望ましい
以上より、上記意見を踏まえて、iphone標準リマインダーの機能をベースに、操作性をLINEっぽく、
誰でも簡単に操作できるように、改良していく方向性を固めました。
■TODOアプリの概要
前述の分析から、iphone標準リマインダーを参考にし、以下のような機能を持ったTODOアプリを作成することにしました。
画面全体のデザインはLINEとiphone標準リマインダーをミックスしたデザインを目指します。
・TODO追加
・リスト追加
・全てのTODO表示
・今日のTODO表示
・日時指定ありのTODO表示
・期限切れのTODO表示
・検索機能
・並び替え機能
・リスト機能
・TODOスワイプによる編集操作
・タスクピン止め
・TODOの繰り返し
・優先度付け
・日付・時刻選択
・画像・場所の選択
・カテゴリー機能（子リスト機能）
・フッター機能（画面下部での操作性向上）
・新規登録・ログイン・ログアウト・退会機能
作成背景とアプリ概要は以上です。
次の②では実際に作成したアプリについて、開発環境や開発時にこだわった点、今後の課題を記載していきます。
②は以下の記事から↓
Laravel + Vue + Vue Router + Vuex】iphone標準のリマインダーみたいなTODOアプリをSPAとして作ってみた ②開発環境と開発時にこだわったこと