Works -

これまで作成した実績

サイトイメージ

scroll

サイトイメージ
個人開発

貯金習慣化アプリ「がまん貯金」

概要
日常の節約を“我慢の可視化”によって習慣化することを目的に開発した個人アプリ。Next.js(App Router構成)とSupabaseを用いて、認証・データ管理・グラフ表示などを実装。React Hook FormやZodを活用し、入力バリデーションやユーザー体験を重視した設計。UI/UXデザインにも注力し、モバイル中心の直感的な操作性を追求。
ターゲット
節約意識はありながらも貯金を継続することが苦手な、20〜30代の一人暮らし社会人を想定。
課題
自分自身、貯金を習慣化することが苦手で、続けられる仕組みがほしいと感じていた。既存の家計簿アプリは数多くあるものの、どれも継続できなかった。原因は「貯金の習慣化」にあると考え、日々の我慢を可視化できるアプリを開発した。
目的
日常の中で我慢した支出を“見える化”することで、貯金を楽しみながら習慣化できる仕組みをつくること。
主な機能
ユーザー認証(ログイン・サインアップ)
Supabase Authで認証管理を実装。
目標設定機能
目的・金額・期限を登録し、達成率を表示。
我慢記録の登録
金額・カテゴリ・メモを入力して記録。
進捗グラフ表示
円グラフ・棒グラフで貯金の推移を可視化。
カレンダー表示
日別の記録をカレンダーで一覧表示。
ユーザー設定
アドレス・名前・画像の変更に対応。
今後の更新
PC画面へのレスポンシブ対応
PCでも快適に操作できるレイアウトへ最適化。
フォルダ管理機能の追加
目標ごとに記録内容を整理できるフォルダを作成。
達成バッジ機能の実装
貯金額や記録日数に応じてバッジを付与。
カテゴリー追加機能
ユーザー自身でカテゴリーを作成・編集可能に。
ダークモード対応
好みに合わせて配色を切り替え可能に。
担当領域 / 制作期間
構成 / デザイン作成
30時間
コーディング
161時間
合計
191時間
使用技術
Next.jsReactTypeScriptTailwindSassSwiper
使用ツール
デザイン
CanvaFigma
開発環境
Visual Studio Code
開発支援
Chrome DevToolsTerminal (zsh)ESLintPrettier
コーディング
GitHubnpm
デプロイ
Vercel
デモアカウント
mail address
demo@demo.com
PW
demo1234

Other Works -

その他、作成サイト実績

サイトイメージ画像pc
サイトイメージ画像pc
サイトイメージ画像pc
サイトイメージ画像pc
サイトイメージ画像pc
サイトイメージ画像pc
サイトイメージ画像pc
サイトイメージ画像pc
サイトイメージ画像pc
サイトイメージ画像pc
サイトイメージ画像pc
サイトイメージ画像pc
デコレーション