- アプリケーションの概要
- なぜこのアプリケーションを作ろうと思ったのか
- アプリケーションの機能一覧
- このアプリケーション内で使用している技術一覧
- 工夫したところ
- 苦労したところ
- チャレンジしたこと
- 今後追加したい機能について
- プログラミングに対する向き合い方について
- オリジナルアプリ通して得られた気付き
ACTION
小さな積み重ねを通して"自信"と”自分は出来る感覚”を持ちながら成長につなげることを目的とした、習慣化や目標設定・自分自身を励ますことができるアプリケーションです。
https://action-today.herokuapp.com/
- ID: admin
- Pass: 2222
- ニックネーム: ぶどう
- メールアドレス: [email protected]
- yume12345aa
- 生年月日: 2000年1月27日
新規登録時とログイン時で画面遷移が異なるため、是非ユーザー登録して遊んでみてください！
- 新規登録：新規登録後、イフゼンルールを設定してから習慣カウント画面へ
- ログイン：ログイン後、習慣カウント画面へ
小さな習慣（良い行い）が、大きな自己成長に繋がるのではないかという仮説があったからです。
なぜならば、憧れている方を構造化して紐解いてみると、１日で大成するわけではなく、日々どれだけ良質な習慣を積み重ねられているかによると感じました。
また習慣化することによって、"自信"や"自分は出来るという感覚"を身につけられるのではないかと考えました。
- 「成長したいと思っているけれど、自分にとっての良い習慣が続かない」
- 「続いたことを可視化をしたいけれど書くのが手間であり、紙に書いてもなくす」
上記らを機能に落とし込もうと考えました。
| NO | 画面 | 機能 | 目的 | 備考 | 様子 |
|---|---|---|---|---|---|
| 1 | ランディングページ | 機能紹介 | どんなアプリなのか知ってから登録したいため | 画像で誰のために何ができるアプリなのか説明 |  |
| 2 | ユーザー登録 | 新規登録・ログイン機能 | ユーザーごとにカウントするため | JavaScriptで🔑マークに遊びを入れた |  |
| 3 | イフゼンルール | 新規登録・編集・更新機能 | 習慣化させるため | カテゴリー別に考えられるようにした |  |
| 4 | 習慣カウント | カウント機能 | 可視化するため | ワンクリックでカウント可能 |  |
| 5 | 目標設定 | 新規登録・詳細・編集・更新・削除機能 | どうなりたいか明確にするため | 改行できるように設定 |  |
| 6 | セルフコンパッション | 新規投稿機能 | 上手くいかない時でも励ますため | Ajaxによる非同期通信 |  |
- Rails 6.1.3
- ruby 3.0.0
- MySQL 5.6.50
- Rails 6.1.3
- ruby 3.0.0
- capistrano 3.16.0
- unicorn 5.7.0
- nginx1
- MariaDB 5.5.68
- 12/21〜1/13（構想・ユーザーインタビュー・要件定義・データベース設計）
- 1/14〜2/19(実装スタート・デプロイまで）
- 2/20〜2/23（フィードバックを受けて改善）
| Column | Type | Options |
|---|---|---|
| nickname | string | null: false |
| string | null: false, unique: true | |
| encrypted_password | string | null: false |
| birthdate | date | null: false |
- has_many :objectives
- has_many :troubles
- has_many :habits
- has_one :rule
| Column | Type | Options |
|---|---|---|
| user | references | null: false, foreign_key: true |
| title | string | null: false |
| category_id | integer | null: false |
| wish | text | null: false |
| outcome | text | null: false |
| obstacle | text | null: false |
| plan | text | null: false |
- belongs_to :user
| Column | Type | Options |
|---|---|---|
| user | references | null: false, foreign_key: true |
| message_type | integer | |
| worry | text | null: false |
- belongs_to :user
| Column | Type | Options |
|---|---|---|
| user | references | null: false, foreign_key: true |
| count_1 | boolean | |
| restart_1 | boolean | |
| count_2 | boolean | |
| restart_2 | boolean | |
| count_3 | boolean | |
| restart_3 | boolean | |
| count_4 | boolean | |
| restart_4 | boolean | |
| count_5 | boolean | |
| restart_5 | boolean |
- belongs_to :user
- has_one :rule
| Column | Type | Options |
|---|---|---|
| user | references | null: false, foreign_key: true |
| if_1 | boolean | null: false |
| then_1 | boolean | null: false |
| if_2 | boolean | null: false |
| then_2 | boolean | null: false |
| if_3 | boolean | null: false |
| then_3 | boolean | null: false |
| if_4 | boolean | null: false |
| then_4 | boolean | null: false |
| if_5 | boolean | null: false |
| then_5 | boolean | null: false |
- belongs_to :user
- belongs_to :habit, optional: true
% git clone https://github.com/erika618/action_app.git
% cd action_app
% bundle install
% rails db:create
% rails db:migrate
% yarn install
✅ユーザーの新規登録時の画面遷移を確認
% bundle exec rspec spec/system/users_spec.rb
✅新規目標設定時の画面遷移を確認
% bundle exec rspec spec/system/objectives_spec.rb
✅新規イフゼンルール設定時の画面遷移を確認
% bundle exec rspec spec/system/rules_spec.rb
✅ユーザーの新規登録時のバリデーションを確認
% bundle exec rspec spec/models/user_spec.rb
✅目標設定時のバリデーションを確認
% bundle exec rspec spec/models/objective_spec.rb
✅イフゼンルールのバリデーションを確認
% bundle exec rspec spec/models/rule_spec.rb
🚨brakeman（脆弱性に繋がるコードがないか確認するため ※全てのファイル・全ての警告オプション）
% bundle exec brakeman -A -w1
🚨rails_best_practices（読みやすく正しいコードか確認するため）
% rails_best_practices .
🚨rubocop（インデントを整えるため）
% bundle exec rubocop -a
以下、３点を工夫しました。
- ランディングページを作り、機能をあらかじめ説明することによって使ってみたくなるよう構成。
- ユーザー登録することによって、パーソナルな環境を作れるよう構成。
- 習慣カウントについて、ログイン後のトップページとし
checked: trueをつけてワンクリックでカウント出来るよう工夫。 - ナビゲーションについて、アイコンも併用。視覚的にもわかりやすく表現。
- 毎日、アプリケーションを開いてもらえるように、見た目についても気を配った。具体的にはオリジナルロゴの作成や、３色以内のベーシックな色合いなど。
- 日々の習慣をカウントするだけでなく、途切れてしまったあとに復活した回数もカウントできる「restart」を設けて、ポジティブなアプリケーションになるように考えた。
- パスワードについて安全性を高めるためデフォルト6文字→10文字以上に変更。その際、入力時に10文字以上になると鍵マークがくっきりするよう遊びをつけた。
以下、３点が特に苦労しました。
- 実現したいことを機能に落とし込んだため、どうデータベース設計をしたらいいか（ふるまいごとに分けられるか）に苦慮した。
- ふるまいごとにデータベースを分けた結果、習慣カウントにイフゼンルールを表示させる方法に苦慮した。（アソシエーションやストロングパラメーター、外部キーの理解が深まった）
- セルフコンパッションで対話調にする方法に苦慮した。また実現できたと思ったら本番環境で画像が反映されないことに苦慮した。（
enumによるラジオボタンの実装、条件分岐、アセットコンパイルについての理解が深まった）
最後のイフゼンルールを実装する際、テスト駆動開発のことを知り、実践しました。
「レッドグリーンリファクタリング」で進めていく実装方法のおかげで開発環境と本番環境で一致していないバグに気づくことができました。
一つずつ動作するきれいなコードにブラッシュアップしていく工程が、楽しかったです。またGitHubのコミットの粒度を今までで一番揃えられた気がして嬉しかったです。
実際に使ってもらったユーザーからフィードバックを受け、見た目に関する部分は修正しました。 今後、機能について以下のような追加をしていきたいと考えています。
- マイページ(ニックネームを変更したい)
- カウント時のアニメーション(カウントしたくなるようなアニメーション)
- 自分のカウントを他人へ共有できる機能(他者との繋がりでより習慣化へつなげる)
- 目標を検索できる機能(今まで投稿したものを探しやすくする)
技術力と同じ位、楽しく長く付き合っていくための向き合い方を試行錯誤しながらアプリケーションを制作していました。
なぜならば、プログラミングは上手くいかないことの方が多く、自分との弱さに向き合う機会が多いと感じたためです。
現在は、以下の考えや行動を大切にしながら、プログラミングと向き合っています。
- 毎日15分以上行うこと（ハードルは低く設定）
- 「HOW」より「WHY」を大事にインプットする（応用に繋がると実感したため）
- アウトプットをすること（言語化できない＝理解できていないと気がついたため）
オリジナルアプリを初めて作ってみて、「想い」を仕様に落とし込んで機能にする「楽しさ」と「難しさ」を一番に感じました。
また今回は自分の想いを形にしましたが、これを他の方の想いや戦略を形にできたらどれだけ面白いだろうかとワクワクしました。
進め方について、自分の仮説だけでなく、他者の意見を取り入れることによって、より本質的な課題解決に繋がるアプリケーションにブラッシュアップできることも感じたことです。
今後も「この課題を解決したい」「こんなふうに便利にしたい」いろんな人の想いを、アプリケーションの力で仕組み化・具現化していく経験を増やしていきたいです。
![dependabot[bot] avatar](https://avatars.githubusercontent.com/in/29110?v=4 "dependabot[bot]")
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent