スキンケアアイテムの使用サイクル管理アプリ「Skinmate」を公開しました🎉
この度、スキンケアアイテムの使用サイクルを管理するアプリ「Skinmate（スキンメイト）」を公開しました！
筆者の自己紹介は下記記事で一通りしているので割愛させていただきます。 興味があればぜひご覧ください。
「Skinmate（スキンメイト）」について
概要
日ごろお使いのスキンケアアイテムを登録後、使い始めた日に「使用開始日」の登録、 使い切った日に「使用終了日」を登録するだけで下記のことが実現できます。
- スキンケアアイテムがなくなる日を予測
- 月に実質どのくらいのお金がスキンケアアイテムにかかっているかを自動算出
こんな方におすすめ
日頃お使いのスキンケアアイテムについて、このように困ったことはないですか？
- 「あの化粧水、まだあったっけ...」と出先で残量がわからなくなる
- 「愛用している乳液、『使用法にそった使い方で1ヶ月』と公式サイトに書いてあるけど適切な量を使えているのかな...」
- 使っている美容液の中身が見えなくていつ無くなるかわからない
- 実質月にどのくらいスキンケアにお金を使っているのかわからない
このような悩みをお持ちの方におすすめです！
使い方
日ごろお使いのスキンケアアイテムを登録し、使用開始日と使用終了日の記録を行うだけ。 Skinmateが自動で使い切り予定日の計測と月々の消費金額を計算します。
記録した日付は後から閲覧・編集が可能です。
月々の消費金額の計算は、単にスキンケアアイテムを使い始めた月を起点に加算という形ではありません。 月にアイテムを「どれだけ消費したのか」という視点で計算しています。 例えば、1本10,000円の美容液を60日で使っていた場合は、1ヶ月（30日）に5,000円分を消費している計算になるようなロジックにしています。
コンセプト
サービス名
Skinmate（スキンメイト）という名前には、このアプリのユーザーさんのお肌のお供という意味を込めました。
背景を少しお話しすると、実は先述した下記4点の悩みは私自身が持っていた悩みです。
- 「あの化粧水、まだあったっけ...」と出先で残量がわからなくなる
- 「愛用している乳液、『使用法にそった使い方で1ヶ月』と公式サイトに書いてあるけど適切な量を使えているのかな...」
- 使っている美容液の中身が見えなくていつ無くなるかわからない
- 実質月にどのくらいスキンケアにお金を使っているのかわからない
このアプリのユーザーさんにはこのような悩みから解放されてほしい！ Skinmateをともにスキンケアをしていく友達のように思ってほしい！
そのような想いで、名前をつけました。
ロゴ
Skinmateのロゴはこちらです。
こちらのロゴは、下記の2つをイメージして合体させたようなものにしています。
- 太陽
- 化粧水をプッシュした際に出るミスト
先に挙げたような悩みから解放され、Skinmateのユーザーさんには太陽のように明るいスキンケア生活をしていただきたいという想いを込めました。
技術スタック
- Ruby 3.1.3
- Rails 7.0.4
- Hotwire
- Slim 4.1.0
- Bootstrap 5.2.3
- Sassc 2.4.0
- Rubocop 1.50.2
- Slim_lint 0.24.0
- Eslint 8.39.0
- Prettier 2.8.8
- PostgreSQL
- GitHub Actions
- Fly.io
できるだけ費用を抑えた
独自ドメインを取ろうか迷ったのですが、長くこのサービスを育てていきたいのでできる限り費用は抑えたいと考えました。 独自ドメインでリリースすることで見た目はカッコ良くなるかもしれないけど、それは行けるところまでこのサービスを育て上げてからの話だと思いました。 Fly.ioにしたのも、無料枠を利用するためです。 私が通っているオンラインスクールフィヨルドブートキャンプでは実際にリリースしない人やリリースしてもしばらくしたらサービスを閉めてしまう人がいるみたいです。
初めてのHotwire
Hotwire自体初めてでしたが、Turboについては下記のようにとてもわかりやすいサイトがあったので助かりました。
しかし、Rails7 × Stimulus についての情報が意外と薄く、実装するのにひと苦労しました。 フィヨルドブートキャンプ上でStimulusについて書いた日報をアップすると、メンターさんより「Stimulusは触ったことがないので参考になる！」という言葉をいただけました。
このコメントをもらったのは、アップロードされた画像のプレビューをインタラクティブに表示する方法について解説したものでした。 近々、Stimulusについての記事もアップしたいと思っています。
TurboもStimulusも、私にとっては概念を理解するまで難しいものでした。 しかし、慣れるととても簡単にSPA風のアプリを作ることができてとてもいいと思います。 Vue.jsでSPAアプリを実装した時よりも個人的には理解しやすいし、コード量も少ないと感じました！
この取り組みを通して得たもの・今後何を目指すのか
冒頭で記載させていただいたこちらのブログでも述べているのですが、私は転職を目的としてプログラミングを勉強したわけではありません。
正直に言うと、最初は自分がとにかく楽しい/極めたい/一生これやりたい！と思うものを探したかったのです。 スタートアップ企業に長年いると"何でも屋さん"みたいになってしまって（これはあるあるだと思います）、自分で一つ自慢できるスキルのようなものがないのではないか？と課題を感じ始めました。 もちろん、「今いる会社がIT企業なのでITの知識を身につけたいから」という想いは嘘ではありません。
2年近くやってみて、どうだったのか。 無事、目標を見つけることができました！
それは、UI/UXデザイナーになることです！！！！ コードを書くことは、もちろん楽しかったです。楽しくなければここまで続けてません。 しかし、このアプリを作る中でデザインについてのアドバイスをいただくうちに、ユーザーさんのことを考えてUI/UXを考えるの超楽しい！となりました。 色とかボタンの配置など今はなんとなく自分がいいと思ったものを実装しています。 しかし、自分なりの「このデザインにした理由」を述べられる人間になりたいです。
開発もひと段落したので今後は、デザインはもちろん人やユーザーにまつわることを勉強して最強のUI/UXを生み出せる人間を目指していきたいです。
さいごに
この自作サービスを持って、フィヨルドブートキャンプを卒業します！
チーム開発・自作サービス共に、技術的アドバイスでお世話になったkomagataさん、デザイン面で相談に乗っていただいたmachidaさん、 課題のレビューや、日々日報をチェックしつつ見守っていただいたメンターの皆さん、 日報やツイッターにて励ましの言葉をいただいた方々、 共にチーム開発をしていただいた生徒の皆さん、 全ての方へ感謝申し上げます。
ありがとうございます！
