diff --git a/content/pages/about-en.mdx b/content/pages/about-en.mdx index b7e001e..a5cea39 100644 --- a/content/pages/about-en.mdx +++ b/content/pages/about-en.mdx @@ -18,21 +18,29 @@ This is **Eason Chang**'s website. You can find my interesting projects, thought Hey! I am **Eason Chang (Yin-Hsiang Chang)** 👋 -I'm a **Fullstack Developer / Maker**. I love to build interesting [cool stuff](/projects)! My goal is to make humanity better with my inventions. +I'm a **Fullstack Engineer turned indie maker**. I went from building enterprise software at Trend Micro to co-founding **Aburi Studio** with Carol Hsiao—where we're on a mission to help people achieve financial freedom through better tools. -I also love writing [posts](/posts), covering software engineering, web dev, maker, and productivity. +Right now, I'm obsessed with one question: "How can we make financial independence accessible to everyone?" That's why I built [FireFree](https://firefree.app), [CoreHour](https://corehour.app), and [DailyPay](https://dailypay.aburi.app)—tools that demystify the path to early retirement. -I'm a Taiwanese 🇹🇼, big fan of bubble tea 🧋! I'm currently living in Calgary, Canada 🇨🇦, actively seeking a job! +I also love writing [posts](/posts), covering **Software Engineering**, **Product Development**, **Maker Culture**, and **building profitable products**. -## Hire me +I'm from Taiwan 🇹🇼, creating from Canada 🇨🇦, big fan of bubble tea 🧋! -I am actively seeking any opportunities in Canada. I am open to **full-time, part-time, contract, or internship positions**. I am also open **on-site** or **remote** work, and willing to **relocate** to a different city if needed. +## Work with me -I am a **software engineer** with **5 years of experience**, specializing in web **frontend** development using modern technologies like React, Next.js, TypeScript, and Tailwind CSS. I also have experience in **backend** development using Node.js, Python, Golang, and **cloud platforms** like AWS. +I'm currently building financial independence tools through **Aburi Studio**, co-founded with Carol Hsiao. We're creating products like [FireFree](https://firefree.app), [CoreHour](https://corehour.app), and [DailyPay](https://dailypay.aburi.app) that help people achieve financial freedom. -I am a fast learner, easy to work with, and a good team player. I used to work in both fast-paced startup environment at [GDP Inc.](https://www.linkedin.com/company/gdp-world/) (a FinTech startup), and in big corporate environments at [Trend Micro](https://www.trendmicro.com/) (a leading cybersecurity company). +I'm also open to **consulting, collaboration, or full-time opportunities** that align with my mission of building products that matter. -Feel free to check out my [resume](https://drive.google.com/file/d/1-RdgOpRQxKpwLDSpFHWX0rzkCdnquDZG/view), connect me on [LinkedIn](https://www.linkedin.com/in/easonchang101/), explore my [GitHub](https://github.com/eason-dev), or [book my time](https://fantastical.app/easonchang/chat) to chat with me! +As a **software engineer** with **5+ years of experience**, I specialize in: +- **Frontend**: React, Next.js, TypeScript, Tailwind CSS +- **Backend**: Node.js, Python, Golang, Supabase +- **Cloud & DevOps**: AWS, Vercel, CI/CD pipelines +- **Architecture**: Monorepo (Turborepo), zero-knowledge encryption, full-stack product development + +I've worked in both fast-paced startup environments at [GDP Inc.](https://www.linkedin.com/company/gdp-world/) (FinTech) and large enterprises at [Trend Micro](https://www.trendmicro.com/) (cybersecurity leader), now building my own products at **Aburi Studio**. + +Feel free to check out my [resume](https://drive.google.com/file/d/1-RdgOpRQxKpwLDSpFHWX0rzkCdnquDZG/view), connect with me on [LinkedIn](https://www.linkedin.com/in/easonchang101/), explore my [GitHub](https://github.com/eason-dev), or [book my time](https://fantastical.app/easonchang/chat) to chat with me! ## Let's talk! diff --git a/content/pages/about-zh.mdx b/content/pages/about-zh.mdx index 87967ed..3c4077c 100644 --- a/content/pages/about-zh.mdx +++ b/content/pages/about-zh.mdx @@ -18,19 +18,27 @@ redirect_from: 嗨！我是 **Eason Chang 張楹翔** 👋 -我是一位**全端軟體工程師 / Maker**。我喜歡動手打造些有趣的[酷東東](/projects)！夢想是透過發明來造福人類。 +我是一位**全端工程師，也是獨立創客**。我從趨勢科技的企業軟體開發，走向與 Carol Hsiao 共同創辦 **Aburi Studio**——我們的使命是透過更好的工具，幫助人們實現財務自由。 -我在這裡寫了[許多文章](/posts)，主題涵蓋軟體工程、網站開發、自造者（Maker）、和生產力。 +現在，我專注於一個問題：「如何讓每個人都能實現財務獨立？」這就是為什麼我打造了 [FireFree](https://firefree.app)、[CoreHour](https://corehour.app) 和 [DailyPay](https://dailypay.aburi.app)——這些工具讓提早退休的道路變得清晰可見。 -我來自台灣 🇹🇼，是珍珠奶茶狂熱者 🧋！目前住在加拿大 Calgary 🇨🇦，積極尋找工作中！ +我在這裡分享我在**軟體工程**、**產品開發**、**創客文化**、和**打造獲利產品**的學習心得。 -## 雇用我 +來自台灣 🇹🇼，在加拿大 🇨🇦 創造中，珍珠奶茶狂熱者 🧋！ -我目前積極尋找加拿大的任何工作機會。我願意接受 **全職、兼職、合約、或實習**。我也願意在 **辦公室** 或 **遠端** 工作，並且願意 **遷往** 其他城市。 +## 與我合作 -我是一位 **軟體工程師**，擁有 **5 年的經驗**，專精於使用現代技術如 React、Next.js、TypeScript、和 Tailwind CSS 進行網站 **前端** 開發。我也有 **後端** 開發的經驗，使用 Node.js、Python、Golang，以及 **雲端平台** 如 AWS。 +我目前正在透過 **Aburi Studio**（與 Carol Hsiao 共同創辦）打造財務獨立工具。我們創造了 [FireFree](https://firefree.app)、[CoreHour](https://corehour.app) 和 [DailyPay](https://dailypay.aburi.app) 等產品，幫助人們實現財務自由。 -我學東西超快、易於合作，並且是一位良好的 team player。我曾在快速的新創環境 [GDP Inc.](https://www.linkedin.com/company/gdp-world/)（FinTech 新創）和大型企業環境 [趨勢科技](https://www.trendmicro.com/)（資安公司）工作過。 +我也開放**諮詢、合作、或全職機會**，只要符合我打造有意義產品的使命。 + +作為一位擁有 **5 年以上經驗**的**軟體工程師**，我專精於： +- **前端**：React、Next.js、TypeScript、Tailwind CSS +- **後端**：Node.js、Python、Golang、Supabase +- **雲端與 DevOps**：AWS、Vercel、CI/CD 流程 +- **架構**：Monorepo（Turborepo）、零知識加密、全端產品開發 + +我曾在快節奏的新創環境 [GDP Inc.](https://www.linkedin.com/company/gdp-world/)（FinTech）和大型企業 [趨勢科技](https://www.trendmicro.com/)（資安領導者）工作，現在在 **Aburi Studio** 打造自己的產品。 歡迎查看我的 [履歷](https://drive.google.com/file/d/1-RdgOpRQxKpwLDSpFHWX0rzkCdnquDZG/view)，Connect 我的 [LinkedIn](https://www.linkedin.com/in/easonchang101/)，探索我的 [GitHub](https://github.com/eason-dev)，或是 [預約時間](https://fantastical.app/easonchang/chat) 與我聊聊！ diff --git a/content/posts/project-corehour-en.mdx b/content/posts/project-corehour-en.mdx new file mode 100644 index 0000000..565ea20 --- /dev/null +++ b/content/posts/project-corehour-en.mdx @@ -0,0 +1,140 @@ +--- +title: "CoreHour - Focus on What Truly Matters: Smart Time Management" +description: "Track your time, discover your peak productivity hours, and build sustainable work habits with CoreHour" +slug: "corehour" +language: en +socialImage: "/images/projects/corehour.png" +date: 2025-01-26 +type: Post +isDraft: false +--- + +![CoreHour - Time Management Tool](/images/projects/corehour.png) + +## Introduction + +**CoreHour** helps you discover your peak productivity hours and build work habits that actually stick. Built for indie hackers, makers, and anyone who wants to make every hour count. + +I created this project with [Carol Hsiao](https://carolhsiao.webflow.io/) as part of **Aburi Studio**'s financial independence toolkit. CoreHour bridges the gap between time and money - helping you understand which hours generate the most value. + +## Demo & Source Code + +CoreHour is live and ready to use: + +- **Website:** [corehour.app](https://corehour.app) +- **Source Code:** Private (part of Aburi Studio products) + +## Why We Built CoreHour + +As indie makers building our own products, we struggled with a common problem: **not all hours are created equal**. + +Some hours we're incredibly productive - shipping features, solving hard problems, making real progress. Other hours? We're just going through the motions. + +Traditional time trackers tell you *how long* you worked. But they don't tell you: +- **When** you're most productive +- **What** work generates the most value +- **How** to align your time with your financial goals + +That's why we built CoreHour - to help you work smarter, not just longer. + +## Key Features + +### Smart Time Tracking +Automatic detection of your most productive hours. CoreHour learns your patterns and helps you schedule deep work when you're at your best. + +### Goal-Oriented Design +Align daily tasks with long-term objectives. See how today's work connects to your bigger vision. + +### Cashflow Integration +Connect time to revenue for better project decisions. Understand which activities actually move the needle on your financial independence journey. + +### Habit Building +Sustainable routines backed by your actual productivity data. Build habits based on evidence, not guesswork. + +## The Philosophy Behind CoreHour + +CoreHour is built on several key principles: + +### Quality Over Quantity +It's not about working more hours - it's about making the hours you work count. We focus on productive output, not time logged. + +### Energy Management +Your energy fluctuates throughout the day. CoreHour helps you identify when you're naturally most focused so you can schedule accordingly. + +### Value-Based Time Tracking +Not all tasks are equal. CoreHour helps you identify high-value activities and eliminate time sinks. + +### Sustainable Productivity +Burnout is real. CoreHour encourages sustainable work patterns that you can maintain long-term. + +## How CoreHour Works + +1. **Track Your Time:** Log what you're working on throughout the day +2. **Discover Patterns:** CoreHour analyzes when you're most productive +3. **Align With Goals:** Connect daily tasks to your long-term objectives +4. **Optimize Schedule:** Schedule deep work during your peak hours +5. **Track Value:** See which activities contribute most to your goals + +## Part of the Aburi Studio Ecosystem + +CoreHour is designed to work seamlessly with our other financial independence tools: + +- **FireFree:** Calculate your path to financial independence +- **DailyPay:** Monitor daily spending and income +- **CoreHour:** Optimize how you spend your time to reach your goals faster + +Together, these tools help you: +- Understand where your time goes +- See how time connects to income +- Optimize your path to financial freedom + +## Technologies + +We built CoreHour with a modern, focused tech stack: + +- [Next.js](https://nextjs.org/): React framework for optimal performance +- [TypeScript](https://www.typescriptlang.org/): Type-safe development +- [Supabase](https://supabase.com/): Backend and database +- [Tailwind CSS](https://tailwindcss.com/): Beautiful, responsive UI +- [Recharts](https://recharts.org/): Data visualization +- [Vercel](https://vercel.com/): Deployment and hosting + +## For Indie Makers and Solopreneurs + +CoreHour is specifically designed for people building their own products and businesses: + +- **Project-Based Tracking:** Organize time by project, not just task +- **Revenue Attribution:** See which projects generate income +- **Focus Sessions:** Built-in Pomodoro timer for deep work +- **Weekly Reviews:** Reflect on what worked and what didn't + +## What Makes CoreHour Different + +Unlike traditional time trackers: + +- **Goal-Oriented:** Everything ties back to your long-term objectives +- **Energy-Aware:** Respects your natural productivity rhythms +- **Value-Focused:** Emphasizes output over input +- **Independence-Minded:** Built for people pursuing financial freedom + +## Getting Started + +Ready to make every hour count? + +Visit [corehour.app](https://corehour.app) to start tracking your time and discovering your most productive hours. + +## Conclusion + +Building CoreHour has taught us so much about our own productivity patterns. We hope it helps you work smarter, build better habits, and reach your financial independence goals faster. + +If you have any feedback or suggestions, please feel free to contact us or leave a comment below! + +## References + +Inspiration and prior art for this project: + +- [Deep Work by Cal Newport](https://www.calnewport.com/books/deep-work/) +- [The Power of Full Engagement by Jim Loehr](https://www.amazon.com/Power-Full-Engagement-Managing-Performance/dp/0743226755) +- [RescueTime - Time Management Software](https://www.rescuetime.com/) +- [Toggl Track - Time Tracking Software](https://toggl.com/track/) +- [Clockify - Free Time Tracker](https://clockify.me/) diff --git a/content/posts/project-corehour.mdx b/content/posts/project-corehour.mdx new file mode 100644 index 0000000..8d3a392 --- /dev/null +++ b/content/posts/project-corehour.mdx @@ -0,0 +1,140 @@ +--- +title: "CoreHour - 專注於真正重要的事：智慧時間管理" +description: "追蹤時間、發現高峰生產力時段，並使用 CoreHour 建立可持續的工作習慣" +slug: "corehour" +language: zh-TW +socialImage: "/images/projects/corehour.png" +date: 2025-01-26 +type: Post +isDraft: false +--- + +![CoreHour - 時間管理工具](/images/projects/corehour.png) + +## 專案簡介 + +**CoreHour** 幫助你發現高峰生產力時段，建立真正持久的工作習慣。專為獨立開發者、創客、和想讓每小時都有價值的人打造。 + +我與 [Carol Hsiao](https://carolhsiao.webflow.io/) 共同創造了這個專案，作為 **Aburi Studio** 財務獨立工具套件的一部分。CoreHour 連接時間與金錢之間的橋樑——幫助你理解哪些時間創造最多價值。 + +## Demo & 網站 + +CoreHour 已上線並可使用： + +- **網站：**[corehour.app](https://corehour.app) +- **原始碼：**私有（Aburi Studio 產品的一部分） + +## 為什麼我們要打造 CoreHour + +作為打造自己產品的獨立創客，我們遇到一個常見問題：**不是所有時間都具有相同價值**。 + +有些時段我們超級有生產力——推出功能、解決難題、取得真正進展。其他時段？我們只是在走過場。 + +傳統的時間追蹤工具告訴你工作了*多久*。但它們不會告訴你： +- **何時**最有生產力 +- **什麼**工作創造最多價值 +- **如何**讓時間與財務目標對齊 + +這就是為什麼我們打造 CoreHour——幫助你更聰明地工作，而不只是工作更久。 + +## 主打功能 + +### 智慧時間追蹤 +自動偵測你最有生產力的時段。CoreHour 學習你的模式，幫助你在最佳狀態時安排深度工作。 + +### 目標導向設計 +將日常任務與長期目標對齊。看見今天的工作如何連結到你的更大願景。 + +### 現金流整合 +連結時間與收入，做出更好的專案決策。了解哪些活動真正推動你的財務獨立旅程。 + +### 習慣養成 +基於實際生產力數據的可持續例行工作。根據證據而非猜測來建立習慣。 + +## CoreHour 背後的哲學 + +CoreHour 建立在幾個關鍵原則上： + +### 質量重於數量 +重點不是工作更多小時——而是讓你工作的時間發揮價值。我們專注於生產力產出，而非記錄的時間。 + +### 能量管理 +你的能量在一天中會波動。CoreHour 幫助你識別自然最專注的時段，讓你相應安排工作。 + +### 價值導向的時間追蹤 +不是所有任務都同等重要。CoreHour 幫助你識別高價值活動並消除時間黑洞。 + +### 可持續的生產力 +倦怠是真實存在的。CoreHour 鼓勵可長期維持的可持續工作模式。 + +## CoreHour 如何運作 + +1. **追蹤時間：**記錄你一整天在做什麼 +2. **發現模式：**CoreHour 分析你何時最有生產力 +3. **對齊目標：**將日常任務連結到長期目標 +4. **優化時程：**在高峰時段安排深度工作 +5. **追蹤價值：**看見哪些活動對目標貢獻最多 + +## Aburi Studio 生態系的一部分 + +CoreHour 設計為與我們其他財務獨立工具無縫協作： + +- **FireFree：**計算你的財務獨立之路 +- **DailyPay：**監控每日支出和收入 +- **CoreHour：**優化如何運用時間更快達成目標 + +這些工具一起幫助你： +- 了解時間去向 +- 看見時間如何連結到收入 +- 優化通往財務自由的路徑 + +## 技術架構 + +我們使用現代化、專注的技術堆疊打造 CoreHour： + +- [Next.js](https://nextjs.org/)：React 框架，實現最佳效能 +- [TypeScript](https://www.typescriptlang.org/)：型別安全的開發 +- [Supabase](https://supabase.com/)：後端和資料庫 +- [Tailwind CSS](https://tailwindcss.com/)：美觀、響應式的 UI +- [Recharts](https://recharts.org/)：資料視覺化 +- [Vercel](https://vercel.com/)：部署和託管 + +## 為獨立創客和個人創業者設計 + +CoreHour 特別為打造自己產品和事業的人設計： + +- **專案導向追蹤：**按專案而非僅任務組織時間 +- **收入歸因：**看見哪些專案產生收入 +- **專注時段：**內建番茄鐘計時器進行深度工作 +- **每週回顧：**反思什麼有效、什麼無效 + +## CoreHour 的獨特之處 + +與傳統時間追蹤工具不同： + +- **目標導向：**所有事情都連結回長期目標 +- **能量感知：**尊重你的自然生產力節奏 +- **價值聚焦：**強調產出而非投入 +- **獨立思維：**為追求財務自由的人打造 + +## 開始使用 + +準備好讓每小時都有價值了嗎？ + +造訪 [corehour.app](https://corehour.app) 開始追蹤時間，發現你最有生產力的時段。 + +## 結語 + +打造 CoreHour 讓我們學到很多關於自己生產力模式的知識。我們希望它能幫助你更聰明地工作、建立更好的習慣，並更快達成財務獨立目標。 + +如果你有任何建議或問題，歡迎聯繫我們或在下方留言！ + +## 參考資料 + +這個專案的靈感和先行作品： + +- [Deep Work 深度工作力 by Cal Newport](https://www.calnewport.com/books/deep-work/) +- [The Power of Full Engagement 精力管理 by Jim Loehr](https://www.amazon.com/Power-Full-Engagement-Managing-Performance/dp/0743226755) +- [RescueTime - 時間管理軟體](https://www.rescuetime.com/) +- [Toggl Track - 時間追蹤軟體](https://toggl.com/track/) +- [Clockify - 免費時間追蹤器](https://clockify.me/) diff --git a/content/posts/project-dailypay-en.mdx b/content/posts/project-dailypay-en.mdx new file mode 100644 index 0000000..d2429a8 --- /dev/null +++ b/content/posts/project-dailypay-en.mdx @@ -0,0 +1,171 @@ +--- +title: "DailyPay - See Your Money Move in Real-Time: Daily Financial Tracking" +description: "Your financial dashboard updated daily - track spending, monitor bank balances, and stay on top of your money with DailyPay" +slug: "dailypay" +language: en +socialImage: "/images/projects/dailypay.png" +date: 2025-01-26 +type: Post +isDraft: false +--- + +![DailyPay - Daily Financial Tracking](/images/projects/dailypay.png) + +## Introduction + +**DailyPay** gives you a real-time view of your financial health. No more waiting until month-end to realize you overspent—know where you stand every single day. + +I created this project with [Carol Hsiao](https://carolhsiao.webflow.io/) as part of **Aburi Studio**'s financial independence toolkit. DailyPay is the daily pulse check that keeps your finances on track. + +## Demo & Source Code + +DailyPay is live and ready to use: + +- **Website:** [dailypay.aburi.app](https://dailypay.aburi.app) +- **Source Code:** Private (part of Aburi Studio products) + +## Why We Built DailyPay + +Most people only check their finances when something goes wrong: +- Overdraft notification +- Credit card bill shock +- Wondering where all the money went + +By then, it's too late to course-correct. + +We wanted to build something that gives you **daily financial awareness** without the overwhelm. Something that: + +- **Updates automatically** from your bank accounts +- **Shows patterns** in your spending +- **Connects to your FIRE goals** via FireFree integration +- **Makes finances feel manageable** instead of stressful + +That's why we built DailyPay - your daily financial pulse check. + +## Key Features + +### Daily Sync +Automatic updates from your bank accounts. Wake up knowing exactly where your money stands. + +### Visual Clarity +See spending patterns at a glance with intuitive charts. Understand your money without spreadsheets. + +### Category Intelligence +Smart categorization of your transactions. Know where your money is really going. + +### FIRE Integration +Connects with FireFree to track progress toward financial independence. See how today's spending affects your long-term goals. + +### Multi-Account Support +Unified view across all your accounts. One dashboard for your complete financial picture. + +## The Philosophy Behind DailyPay + +DailyPay is built on a simple insight: **frequency beats intensity when it comes to financial awareness**. + +Checking your finances once a month leads to: +- Surprises (usually bad ones) +- Reactionary decisions +- Stress and guilt + +Checking daily leads to: +- Awareness without obsession +- Proactive adjustments +- Calm confidence + +### Daily Habits > Monthly Reviews + +Just like weighing yourself daily keeps weight in check, checking finances daily keeps spending in check. It's not about perfection - it's about awareness. + +### Gentle Reminders, Not Guilt Trips + +DailyPay shows you the data without judgment. No red alerts, no shame - just clear information to make better decisions. + +### Connection to Long-Term Goals + +Every daily decision connects to your FIRE goals. DailyPay helps you see how today's choices affect tomorrow's freedom. + +## How DailyPay Works + +1. **Connect Your Accounts:** Link your bank accounts and credit cards +2. **Automatic Daily Sync:** DailyPay updates your balances and transactions every day +3. **See Spending Patterns:** Visualize where your money is going +4. **Track Net Worth:** Watch your total assets minus debts +5. **Connect to FIRE Goals:** See how daily spending affects your path to financial independence + +## Part of the Aburi Studio Ecosystem + +DailyPay is designed to work seamlessly with our other financial independence tools: + +- **FireFree:** Your long-term financial independence calculator +- **CoreHour:** Connect your time to your income +- **DailyPay:** Your daily financial pulse check + +Together, these tools create a complete financial awareness system: +- **Long-term vision** (FireFree) +- **Time optimization** (CoreHour) +- **Daily execution** (DailyPay) + +## Technologies + +We built DailyPay with a modern, secure tech stack: + +- [Next.js](https://nextjs.org/): React framework for optimal performance +- [TypeScript](https://www.typescriptlang.org/): Type-safe development +- [Supabase](https://supabase.com/): Backend and secure database +- [Tailwind CSS](https://tailwindcss.com/): Clean, responsive UI +- [Recharts](https://recharts.org/): Beautiful financial charts +- [Vercel](https://vercel.com/): Fast, reliable hosting + +### Security & Privacy + +Your financial data is sensitive. We take security seriously: + +- **Encrypted connections:** All data transmitted over HTTPS +- **Secure storage:** Bank credentials never stored in plain text +- **Read-only access:** We can view transactions but can't move money +- **Your data is yours:** Export or delete anytime + +## Who Is DailyPay For? + +DailyPay is perfect for: + +- **FIRE Seekers:** People pursuing financial independence who need daily accountability +- **Recovering Overspenders:** Those building better spending habits +- **Multi-Account Jugglers:** People tired of logging into 5 different bank sites +- **Goal-Oriented Savers:** Anyone working toward a big financial goal +- **Indie Makers:** Solopreneurs tracking business and personal finances + +## What Makes DailyPay Different + +Unlike traditional budgeting apps: + +- **Daily, not monthly:** Financial awareness every single day +- **FIRE-focused:** Built for people pursuing financial independence +- **Simple, not overwhelming:** Clean interface, essential metrics +- **Integrated ecosystem:** Works with CoreHour and FireFree +- **Habit-building:** Designed to create daily financial awareness habits + +## Getting Started + +Ready to see your money move in real-time? + +Visit [dailypay.aburi.app](https://dailypay.aburi.app) to start tracking your daily financial health. + +## Conclusion + +Building DailyPay has completely changed how we relate to money. Daily awareness removes the anxiety and creates calm confidence. + +We hope DailyPay helps you build better financial habits and stay on track toward your independence goals. + +If you have any feedback or suggestions, please feel free to contact us or leave a comment below! + +## References + +Inspiration and prior art for this project: + +- [Mint - Budget Tracker & Planner](https://mint.intuit.com/) +- [YNAB - You Need A Budget](https://www.ynab.com/) +- [Personal Capital - Wealth Management](https://www.personalcapital.com/) +- [Copilot Money - Finance Tracker](https://copilot.money/) +- [MoneyStats - Financial Dashboard](https://moneystats.com/) diff --git a/content/posts/project-dailypay.mdx b/content/posts/project-dailypay.mdx new file mode 100644 index 0000000..aee86a8 --- /dev/null +++ b/content/posts/project-dailypay.mdx @@ -0,0 +1,171 @@ +--- +title: "DailyPay - 即時看見你的金錢流動：每日財務追蹤" +description: "每日更新的財務儀表板 - 使用 DailyPay 追蹤支出、監控銀行餘額，掌握你的金錢動向" +slug: "dailypay" +language: zh-TW +socialImage: "/images/projects/dailypay.png" +date: 2025-01-26 +type: Post +isDraft: false +--- + +![DailyPay - 每日財務追蹤](/images/projects/dailypay.png) + +## 專案簡介 + +**DailyPay** 提供你財務健康的即時檢視。不用等到月底才發現超支——每天都知道你的財務狀況。 + +我與 [Carol Hsiao](https://carolhsiao.webflow.io/) 共同創造了這個專案，作為 **Aburi Studio** 財務獨立工具套件的一部分。DailyPay 是讓你的財務保持在軌道上的每日脈搏檢查。 + +## Demo & 網站 + +DailyPay 已上線並可使用： + +- **網站：**[dailypay.aburi.app](https://dailypay.aburi.app) +- **原始碼：**私有（Aburi Studio 產品的一部分） + +## 為什麼我們要打造 DailyPay + +大多數人只在出問題時才檢查財務： +- 透支通知 +- 信用卡帳單震驚 +- 不知道錢都花到哪去了 + +但那時候，已經來不及修正了。 + +我們想打造一個提供**每日財務意識**而不會讓人感到壓力的工具。一個能夠： + +- **自動更新** 從銀行帳戶 +- **顯示模式** 在你的支出中 +- **連結到 FIRE 目標** 透過 FireFree 整合 +- **讓財務變得可管理** 而非充滿壓力 + +這就是為什麼我們打造 DailyPay - 你的每日財務脈搏檢查。 + +## 主打功能 + +### 每日同步 +從銀行帳戶自動更新。醒來就知道你的錢確切在哪裡。 + +### 視覺清晰 +用直覺圖表一眼看出消費模式。不需試算表就能理解你的金錢。 + +### 智慧分類 +聰明分類你的交易記錄。知道你的錢真正去了哪裡。 + +### FIRE 整合 +連結 FireFree 追蹤財務獨立進度。看見今天的支出如何影響長期目標。 + +### 多帳戶支援 +統一檢視所有帳戶。一個儀表板呈現完整財務狀況。 + +## DailyPay 背後的哲學 + +DailyPay 建立在一個簡單的洞察上：**在財務意識方面，頻率勝過強度**。 + +每月檢查一次財務會導致： +- 意外（通常是不好的） +- 反應性決策 +- 壓力和罪惡感 + +每日檢查會導致： +- 有意識但不執著 +- 主動調整 +- 平靜自信 + +### 每日習慣 > 每月回顧 + +就像每天量體重能控制體重一樣，每天檢查財務能控制支出。重點不是完美——而是意識。 + +### 溫和提醒，而非罪惡感 + +DailyPay 展示資料而不評判。沒有紅色警報、沒有羞愧——只有清晰的資訊讓你做出更好的決策。 + +### 連結到長期目標 + +每個日常決定都連結到你的 FIRE 目標。DailyPay 幫助你看見今天的選擇如何影響明天的自由。 + +## DailyPay 如何運作 + +1. **連接帳戶：**連結你的銀行帳戶和信用卡 +2. **自動每日同步：**DailyPay 每天更新你的餘額和交易 +3. **看見支出模式：**視覺化你的錢去了哪裡 +4. **追蹤淨資產：**觀察總資產減去債務 +5. **連結 FIRE 目標：**看見每日支出如何影響你的財務獨立之路 + +## Aburi Studio 生態系的一部分 + +DailyPay 設計為與我們其他財務獨立工具無縫協作： + +- **FireFree：**你的長期財務獨立計算機 +- **CoreHour：**連結時間與收入 +- **DailyPay：**你的每日財務脈搏檢查 + +這些工具一起創造完整的財務意識系統： +- **長期願景**（FireFree） +- **時間優化**（CoreHour） +- **每日執行**（DailyPay） + +## 技術架構 + +我們使用現代化、安全的技術堆疊打造 DailyPay： + +- [Next.js](https://nextjs.org/)：React 框架，實現最佳效能 +- [TypeScript](https://www.typescriptlang.org/)：型別安全的開發 +- [Supabase](https://supabase.com/)：後端和安全資料庫 +- [Tailwind CSS](https://tailwindcss.com/)：乾淨、響應式的 UI +- [Recharts](https://recharts.org/)：美觀的財務圖表 +- [Vercel](https://vercel.com/)：快速、可靠的託管 + +### 安全與隱私 + +你的財務資料很敏感。我們認真對待安全： + +- **加密連接：**所有資料透過 HTTPS 傳輸 +- **安全儲存：**銀行憑證絕不以明文儲存 +- **唯讀存取：**我們可以查看交易但不能移動資金 +- **你的資料是你的：**隨時匯出或刪除 + +## DailyPay 適合誰？ + +DailyPay 完美適合： + +- **FIRE 追求者：**追求財務獨立需要每日責任的人 +- **改善過度支出者：**正在建立更好消費習慣的人 +- **多帳戶管理者：**厭倦登入 5 個不同銀行網站的人 +- **目標導向儲蓄者：**為重大財務目標努力的任何人 +- **獨立創客：**追蹤商業和個人財務的個人創業者 + +## DailyPay 的獨特之處 + +與傳統預算應用程式不同： + +- **每日，而非每月：**每一天都有財務意識 +- **FIRE 聚焦：**為追求財務獨立的人打造 +- **簡單，不壓倒：**乾淨介面、基本指標 +- **整合生態系：**與 CoreHour 和 FireFree 協作 +- **習慣養成：**設計來創造每日財務意識習慣 + +## 開始使用 + +準備好即時看見你的金錢流動了嗎？ + +造訪 [dailypay.aburi.app](https://dailypay.aburi.app) 開始追蹤你的每日財務健康。 + +## 結語 + +打造 DailyPay 完全改變了我們與金錢的關係。每日意識消除焦慮，創造平靜自信。 + +我們希望 DailyPay 幫助你建立更好的財務習慣，並保持在獨立目標的軌道上。 + +如果你有任何建議或問題，歡迎聯繫我們或在下方留言！ + +## 參考資料 + +這個專案的靈感和先行作品： + +- [Mint - 預算追蹤器與規劃工具](https://mint.intuit.com/) +- [YNAB - You Need A Budget 你需要預算](https://www.ynab.com/) +- [Personal Capital - 財富管理](https://www.personalcapital.com/) +- [Copilot Money - 財務追蹤器](https://copilot.money/) +- [MoneyStats - 財務儀表板](https://moneystats.com/) diff --git a/content/posts/project-equation-pyramid-en.mdx b/content/posts/project-equation-pyramid-en.mdx new file mode 100644 index 0000000..e4ef45f --- /dev/null +++ b/content/posts/project-equation-pyramid-en.mdx @@ -0,0 +1,182 @@ +--- +title: "Equation Pyramid - Math Puzzle Game Inspired by The Devil's Plan" +description: "Challenge your mathematical skills with Equation Pyramid, an interactive 3D puzzle game inspired by Netflix's The Devil's Plan" +slug: "equation-pyramid" +language: en +socialImage: "/images/projects/equation-pyramid.jpg" +date: 2025-01-26 +type: Post +isDraft: false +--- + +![Equation Pyramid - Math Puzzle Game](/images/projects/equation-pyramid.jpg) + +## Introduction + +**Equation Pyramid** is an interactive math puzzle game inspired by Season 2 of Netflix's reality show "The Devil's Plan." Challenge your mathematical skills and strategic thinking by finding the correct equations from a limited set of numbers. + +I created this project with [Carol Hsiao](https://carolhsiao.webflow.io/), combining game design with modern web technologies to bring this addictive puzzle game to the browser. + +## Demo & Source Code + +Equation Pyramid is an open-source project: + +- **Play Now:** [equation-pyramid.vercel.app](https://equation-pyramid.vercel.app) +- **Source Code:** [github.com/eason-dev/equation-pyramid](https://github.com/eason-dev/equation-pyramid) + +## Why We Built Equation Pyramid + +After watching "The Devil's Plan" Season 2 on Netflix, we were fascinated by the Equation Pyramid game. The concept was brilliant: + +- **Simple Rules:** Use numbers to form valid mathematical equations +- **Strategic Depth:** Multiple ways to arrange the same numbers +- **Addictive Challenge:** Easy to learn, hard to master + +But there was no way to play it online. So we decided to build it ourselves. + +We wanted to create a version that: +- **Captures the essence** of the original game +- **Works in the browser** - no download required +- **Looks beautiful** with 3D visualization +- **Is open source** so others can learn from and improve it + +## Game Features + +### Strategic Challenge +Use addition, subtraction, multiplication, and division to form valid equations. Every number placement matters! + +### Multiple Difficulty Levels +From beginner puzzles to expert challenges. Start easy and work your way up. + +### Real-time Validation +Automatic verification of equation correctness. Get instant feedback on your solutions. + +### Visual 3D Pyramid +Engaging 3D visualization adds excitement to gameplay. Watch the pyramid come to life as you solve it. + +### Open Source +Full source code available on GitHub. Perfect for learning React Three Fiber and game logic. + +## How to Play + +1. **Start with Numbers:** You're given a set of numbers to work with +2. **Form Equations:** Place numbers to create valid mathematical equations +3. **Follow the Rules:** Each equation must be mathematically correct +4. **Complete the Pyramid:** Fill all positions to win +5. **Try Different Strategies:** Multiple solutions may exist! + +### Game Rules + +- Use basic operations: +, -, ×, ÷ +- Each equation must be mathematically valid +- Left-to-right evaluation (no operator precedence) +- All positions must be filled correctly + +## Technologies + +We built Equation Pyramid with cutting-edge web technologies: + +- [Next.js](https://nextjs.org/): React framework for optimal performance +- [TypeScript](https://www.typescriptlang.org/): Type-safe game logic +- [React Three Fiber](https://docs.pmnd.rs/react-three-fiber/): 3D rendering in React +- [Three.js](https://threejs.org/): WebGL 3D graphics engine +- [Tailwind CSS](https://tailwindcss.com/): Modern, responsive styling +- [Vercel](https://vercel.com/): Fast, global deployment + +### Technical Highlights + +**3D Visualization:** React Three Fiber makes it easy to create interactive 3D experiences in React. The pyramid rotates and responds to user interaction. + +**Game Logic:** Complex validation system ensures equations are mathematically correct while handling edge cases and multiple solution paths. + +**Responsive Design:** Works on desktop, tablet, and mobile. Touch-friendly controls for mobile gameplay. + +**Performance:** Optimized rendering and state management for smooth 60fps gameplay even on mobile devices. + +## The Making of Equation Pyramid + +### Design Process + +Carol designed the entire game experience: +- **Visual Style:** Clean, modern interface that doesn't distract from gameplay +- **User Flow:** Intuitive controls that feel natural +- **Difficulty Curve:** Gradually increasing challenge to keep players engaged +- **Feedback System:** Clear visual feedback for correct and incorrect moves + +### Development Challenges + +Building a math puzzle game taught us a lot: + +**Equation Validation:** Had to handle all edge cases - division by zero, order of operations, floating point precision. + +**3D Performance:** Balancing visual appeal with performance on mobile devices required careful optimization. + +**Game State Management:** Tracking all possible moves and solution paths needed careful architecture. + +**User Experience:** Making complex math feel approachable and fun required many iterations. + +## What Players Are Saying + +> "Addictive! Can't stop trying to beat my best time." +> +> — Beta tester + +> "Great way to practice mental math. My kids love it too!" +> +> — Parent and player + +> "The 3D visualization is beautiful. Makes the puzzle come alive." +> +> — Game enthusiast + +## Open Source Philosophy + +We made Equation Pyramid open source because: + +- **Learn from Real Code:** See how we implemented 3D games in React +- **Community Improvements:** Others can add features and fix bugs +- **Educational Value:** Perfect project for learning React Three Fiber +- **Give Back:** We learned from open source, now we contribute + +Feel free to: +- Star the repo if you like it +- Report bugs or request features +- Submit pull requests with improvements +- Fork it and make your own version + +## Future Plans + +We're considering adding: +- **Multiplayer Mode:** Race against friends +- **Daily Challenges:** New puzzle every day +- **Leaderboards:** Compete for fastest solve times +- **Custom Puzzles:** Create and share your own challenges +- **Achievement System:** Unlock rewards for milestones + +Want to help? Check out the GitHub issues and contribute! + +## Try It Now + +Ready to test your math skills? + +Play now at [equation-pyramid.vercel.app](https://equation-pyramid.vercel.app) + +No download required - works directly in your browser! + +## Conclusion + +Building Equation Pyramid was a fun weekend project that turned into something we're really proud of. It combines our love of puzzle games, math, and modern web technologies. + +We hope you enjoy playing it as much as we enjoyed building it! + +If you have feedback, find bugs, or have feature suggestions, please open an issue on GitHub or leave a comment below. + +## References + +Inspiration for this project: + +- [The Devil's Plan (Netflix)](https://www.netflix.com/title/81654350) - Original game inspiration +- [React Three Fiber Documentation](https://docs.pmnd.rs/react-three-fiber/) - 3D rendering in React +- [Three.js Examples](https://threejs.org/examples/) - WebGL inspiration +- [KenKen Puzzles](https://www.kenkenpuzzle.com/) - Similar math puzzle games +- [24 Game](https://www.4nums.com/game/) - Classic number puzzle diff --git a/content/posts/project-equation-pyramid.mdx b/content/posts/project-equation-pyramid.mdx new file mode 100644 index 0000000..f851349 --- /dev/null +++ b/content/posts/project-equation-pyramid.mdx @@ -0,0 +1,182 @@ +--- +title: "Equation Pyramid - 靈感來自《惡魔計劃》的數學解謎遊戲" +description: "用 Equation Pyramid 挑戰你的數學技能，這是一款受 Netflix《惡魔計劃》啟發的互動式 3D 解謎遊戲" +slug: "equation-pyramid" +language: zh-TW +socialImage: "/images/projects/equation-pyramid.jpg" +date: 2025-01-26 +type: Post +isDraft: false +--- + +![Equation Pyramid - 數字金字塔遊戲](/images/projects/equation-pyramid.jpg) + +## 專案簡介 + +**Equation Pyramid** 是一款互動式數學解謎遊戲，靈感源自 Netflix 實境秀《惡魔計劃》第二季。挑戰你的數學技能與策略思維，在有限的數字中找出正確的數學等式。 + +我與 [Carol Hsiao](https://carolhsiao.webflow.io/) 共同創造了這個專案，結合遊戲設計與現代網頁技術，將這款令人上癮的解謎遊戲帶到瀏覽器中。 + +## Demo & 程式碼 + +Equation Pyramid 是一個開源專案： + +- **立即遊玩：**[equation-pyramid.vercel.app](https://equation-pyramid.vercel.app) +- **原始碼：**[github.com/eason-dev/equation-pyramid](https://github.com/eason-dev/equation-pyramid) + +## 為什麼我們要打造 Equation Pyramid + +在看完 Netflix 上的《惡魔計劃》第二季後，我們對 Equation Pyramid 遊戲著迷了。這個概念太棒了： + +- **簡單規則：**使用數字組成有效的數學等式 +- **策略深度：**相同數字有多種排列方式 +- **上癮挑戰：**容易學習，難以精通 + +但沒有地方可以在線上玩。所以我們決定自己打造一個。 + +我們想創造一個版本，能夠： +- **捕捉精髓** 原始遊戲的本質 +- **在瀏覽器運作** - 不需下載 +- **看起來美觀** 用 3D 視覺化 +- **開源** 讓其他人可以學習和改進 + +## 遊戲特色 + +### 策略挑戰 +運用加減乘除四則運算，排列出正確等式。每個數字的位置都很重要！ + +### 多種難度 +從簡單到困難的解謎挑戰。從簡單開始，逐步進階。 + +### 即時驗證 +自動檢查等式是否正確。立即獲得解答的回饋。 + +### 3D 金字塔視覺效果 +引人入勝的 3D 視覺化增添遊戲興奮感。看著金字塔隨著你的解謎而活起來。 + +### 開源專案 +完整程式碼公開在 GitHub。適合學習 React Three Fiber 和遊戲邏輯。 + +## 如何遊玩 + +1. **從數字開始：**你會得到一組數字來使用 +2. **組成等式：**放置數字來創造有效的數學等式 +3. **遵循規則：**每個等式必須在數學上正確 +4. **完成金字塔：**填滿所有位置即獲勝 +5. **嘗試不同策略：**可能存在多種解法！ + +### 遊戲規則 + +- 使用基本運算：+、-、×、÷ +- 每個等式必須在數學上有效 +- 從左到右計算（無運算符優先權） +- 所有位置必須正確填滿 + +## 技術架構 + +我們使用尖端網頁技術打造 Equation Pyramid： + +- [Next.js](https://nextjs.org/)：React 框架，實現最佳效能 +- [TypeScript](https://www.typescriptlang.org/)：型別安全的遊戲邏輯 +- [React Three Fiber](https://docs.pmnd.rs/react-three-fiber/)：在 React 中進行 3D 渲染 +- [Three.js](https://threejs.org/)：WebGL 3D 圖形引擎 +- [Tailwind CSS](https://tailwindcss.com/)：現代、響應式的樣式 +- [Vercel](https://vercel.com/)：快速、全球部署 + +### 技術亮點 + +**3D 視覺化：**React Three Fiber 讓在 React 中創造互動式 3D 體驗變得簡單。金字塔會旋轉並回應使用者互動。 + +**遊戲邏輯：**複雜的驗證系統確保等式在數學上正確，同時處理邊界情況和多個解法路徑。 + +**響應式設計：**在桌面、平板和手機上運作。為手機遊玩提供觸控友善的控制。 + +**效能：**優化的渲染和狀態管理，即使在行動裝置上也能流暢達到 60fps 遊玩。 + +## Equation Pyramid 的製作過程 + +### 設計流程 + +Carol 設計了整個遊戲體驗： +- **視覺風格：**乾淨、現代的介面不會分散遊玩注意力 +- **使用者流程：**直覺的控制感覺自然 +- **難度曲線：**逐漸增加挑戰以保持玩家參與 +- **回饋系統：**清晰的視覺回饋顯示正確和錯誤的移動 + +### 開發挑戰 + +打造數學解謎遊戲讓我們學到很多： + +**等式驗證：**必須處理所有邊界情況 - 除以零、運算順序、浮點數精度。 + +**3D 效能：**在行動裝置上平衡視覺吸引力與效能需要仔細優化。 + +**遊戲狀態管理：**追蹤所有可能的移動和解法路徑需要仔細的架構。 + +**使用者體驗：**讓複雜的數學變得平易近人和有趣需要許多次迭代。 + +## 玩家評價 + +> 「令人上癮！停不下來想打破最佳時間。」 +> +> — 測試玩家 + +> 「練習心算的好方法。我的孩子也超愛！」 +> +> — 家長玩家 + +> 「3D 視覺化很美。讓解謎活了起來。」 +> +> — 遊戲愛好者 + +## 開源哲學 + +我們讓 Equation Pyramid 開源是因為： + +- **從真實程式碼學習：**看看我們如何在 React 中實現 3D 遊戲 +- **社群改進：**其他人可以添加功能和修復錯誤 +- **教育價值：**學習 React Three Fiber 的完美專案 +- **回饋社群：**我們從開源學習，現在我們貢獻 + +歡迎： +- 如果喜歡就給個星星 +- 報告錯誤或請求功能 +- 提交改進的 Pull Request +- Fork 它並製作自己的版本 + +## 未來計畫 + +我們正在考慮添加： +- **多人模式：**與朋友競速 +- **每日挑戰：**每天新解謎 +- **排行榜：**競爭最快解題時間 +- **自訂解謎：**創造並分享自己的挑戰 +- **成就系統：**解鎖里程碑獎勵 + +想幫忙嗎？查看 GitHub issues 並貢獻！ + +## 立即試玩 + +準備好測試你的數學技能了嗎？ + +立即在 [equation-pyramid.vercel.app](https://equation-pyramid.vercel.app) 遊玩 + +不需下載 - 直接在瀏覽器中運作！ + +## 結語 + +打造 Equation Pyramid 是一個有趣的週末專案，最後變成我們真正引以為傲的東西。它結合了我們對解謎遊戲、數學和現代網頁技術的熱愛。 + +我們希望你喜歡玩它，就像我們喜歡打造它一樣！ + +如果你有回饋、發現錯誤或有功能建議，請在 GitHub 開 issue 或在下方留言。 + +## 參考資料 + +這個專案的靈感： + +- [惡魔計劃 (Netflix)](https://www.netflix.com/title/81654350) - 原始遊戲靈感 +- [React Three Fiber 文件](https://docs.pmnd.rs/react-three-fiber/) - React 中的 3D 渲染 +- [Three.js 範例](https://threejs.org/examples/) - WebGL 靈感 +- [KenKen 解謎](https://www.kenkenpuzzle.com/) - 類似的數學解謎遊戲 +- [24 點遊戲](https://www.4nums.com/game/) - 經典數字解謎 diff --git a/content/posts/project-firefree-en.mdx b/content/posts/project-firefree-en.mdx new file mode 100644 index 0000000..5f5073e --- /dev/null +++ b/content/posts/project-firefree-en.mdx @@ -0,0 +1,140 @@ +--- +title: "FireFree - Your Path to Financial Freedom: FIRE Calculator" +description: "Calculate your path to financial independence and early retirement with FireFree, a comprehensive FIRE calculator built by Aburi Studio" +slug: "firefree" +language: en +socialImage: "/images/projects/firefree.png" +date: 2025-01-26 +type: Post +isDraft: false +--- + +![FireFree - FIRE Calculator](/images/projects/firefree.png) + +## Introduction + +**FireFree** is a comprehensive FIRE (Financial Independence, Retire Early) calculator that transforms complex financial planning into clear, actionable insights. Built for anyone dreaming of early retirement, it tracks your entire financial picture in one place. + +I created this project with [Carol Hsiao](https://carolhsiao.webflow.io/) as the flagship product of **Aburi Studio**, our mission-driven startup focused on making financial independence accessible to everyone. + +## Demo & Source Code + +FireFree is live and ready to use: + +- **Demo:** [firefree.app](https://firefree.app) +- **Try Demo Mode:** Experience the full app without signup +- **Source Code:** Private (part of Aburi Studio products) + +## Why We Built FireFree + +After years of working in the tech industry, I became obsessed with one question: **"How can we make financial independence accessible to everyone?"** + +Most FIRE calculators are either too simple (just a single number) or too complex (spreadsheets with hundreds of cells). We wanted to build something that: + +- **Tracks your complete financial picture** across multiple currencies +- **Visualizes your progress** with beautiful, intuitive charts +- **Calculates your exact FIRE date** based on real numbers +- **Respects your privacy** with zero-knowledge encryption +- **Works globally** with full multi-currency support + +That's why we created FireFree - to demystify the path to early retirement. + +## Key Features + +### Track Your Complete Net Worth +Monitor savings, investments, debts, and real assets across multiple currencies. FireFree automatically syncs exchange rates so you always see accurate totals. + +### Calculate Your FIRE Date +See your exact path to financial independence based on your real numbers. Input your monthly expenses, savings rate, and expected returns to get your personalized FIRE timeline. + +### Visualize Your Progress +Watch your net worth trends and forecast charts update in real-time. Beautiful visualizations make it easy to understand where you are and where you're going. + +### Go Global +Full multi-currency support with automatic exchange rate syncing. Track assets in USD, CAD, TWD, or any major currency. + +### Start Immediately +Try the full app in demo mode - no signup required. When you're ready, create an account to save your real financial data with zero-knowledge encryption. + +## Technologies + +We built FireFree with a modern, scalable tech stack: + +- [Next.js 16](https://nextjs.org/): Latest React framework with App Router +- [TypeScript](https://www.typescriptlang.org/): Type-safe development +- [Supabase](https://supabase.com/): Backend, authentication, and database +- [Turborepo](https://turbo.build/): Monorepo architecture for scalability +- [Tailwind CSS](https://tailwindcss.com/): Rapid UI development +- [Recharts](https://recharts.org/): Beautiful financial charts +- [next-intl](https://next-intl-docs.vercel.app/): Full bilingual support (English/繁體中文) +- [Vercel](https://vercel.com/): Deployment and hosting + +### Architecture Highlights + +- **Zero-knowledge encryption:** Your financial data is encrypted before it leaves your device +- **Monorepo structure:** Shared packages for consistency across our product suite +- **Real-time sync:** Changes reflect instantly across all your devices +- **Responsive design:** Works seamlessly on desktop, tablet, and mobile + +## How FireFree Works + +1. **Add Your Assets:** Input your savings accounts, investment portfolios, real estate, and other assets +2. **Track Your Debts:** Record credit cards, loans, and mortgages +3. **Set Your Goals:** Enter your target annual expenses and desired safety cushion +4. **Calculate Your FIRE Date:** FireFree automatically calculates when you'll reach financial independence +5. **Monitor Progress:** Track your net worth trends and adjust your strategy as needed + +## The Philosophy Behind FireFree + +FireFree is built on the proven FIRE movement principles: + +- **The 4% Rule:** Safely withdraw 4% of your portfolio annually in retirement +- **Financial Independence Number = Annual Expenses × 25** +- **Focus on savings rate** over absolute income +- **Track net worth** to measure real progress + +## Part of the Aburi Studio Ecosystem + +FireFree is designed to work seamlessly with our other financial independence tools: + +- **CoreHour:** Track your time and align it with income goals +- **DailyPay:** Monitor daily spending and bank balances +- Together, these tools provide a complete picture of your path to financial freedom + +## What Users Are Saying + +> "Finally, a FIRE calculator that doesn't feel like homework. The visualizations make it so clear where I'm at." +> +> — Early beta user + +> "The multi-currency support is a game-changer. I have assets in three different countries and FireFree handles it perfectly." +> +> — International investor + +## Our Vision + +At Aburi Studio, we believe financial independence shouldn't be a privilege reserved for finance professionals. Everyone deserves tools that make the path to early retirement clear and achievable. + +FireFree is our first step toward democratizing financial independence. We're continuously improving based on user feedback and adding new features to help more people achieve their FIRE goals. + +## Get Started Today + +Ready to calculate your path to financial freedom? + +Visit [firefree.app](https://firefree.app) and try the demo mode - no signup required. + +## Conclusion + +Building FireFree has been an incredible journey. We've combined our passion for financial independence with modern technology to create a tool we genuinely believe can change lives. + +If you have any feedback or suggestions, please feel free to contact us through the app or leave a comment below. We'd love to hear about your FIRE journey! + +## References + +Inspiration and prior art for this project: + +- [Mr. Money Mustache - The Shockingly Simple Math Behind Early Retirement](https://www.mrmoneymustache.com/2012/01/13/the-shockingly-simple-math-behind-early-retirement/) +- [FIRE Calculator by The Measure of a Plan](https://engaging-data.com/fire-calculator/) +- [cFIREsim - Open-Source FI Calculator](https://www.cfiresim.com/) +- [Personal Capital Retirement Planner](https://www.personalcapital.com/) +- [networthify - See when you can retire early](https://networthify.com/calculator/earlyretirement) diff --git a/content/posts/project-firefree.mdx b/content/posts/project-firefree.mdx new file mode 100644 index 0000000..db4e3de --- /dev/null +++ b/content/posts/project-firefree.mdx @@ -0,0 +1,140 @@ +--- +title: "FireFree - 計算你的財務自由之路：FIRE 計算機" +description: "使用 FireFree 計算你的財務獨立和提早退休之路，由 Aburi Studio 打造的全方位 FIRE 計算工具" +slug: "firefree" +language: zh-TW +socialImage: "/images/projects/firefree.png" +date: 2025-01-26 +type: Post +isDraft: false +--- + +![FireFree - FIRE 計算機](/images/projects/firefree.png) + +## 專案簡介 + +**FireFree** 是一個全面的 FIRE（財務獨立、提早退休）計算機，將複雜的財務規劃轉化為清晰、可執行的洞察。專為夢想提早退休的人打造，在一個地方追蹤你的整體財務狀況。 + +我與 [Carol Hsiao](https://carolhsiao.webflow.io/) 共同創造了這個專案，作為 **Aburi Studio** 的旗艦產品——我們使命導向的新創公司，專注於讓每個人都能實現財務獨立。 + +## Demo & 網站 + +FireFree 已上線並可使用： + +- **網站：**[firefree.app](https://firefree.app) +- **試用示範模式：**無需註冊即可體驗完整功能 +- **原始碼：**私有（Aburi Studio 產品的一部分） + +## 為什麼我們要打造 FireFree + +在科技業工作多年後，我開始專注於一個問題：**「如何讓每個人都能實現財務獨立？」** + +大多數 FIRE 計算機要不太簡單（只有一個數字）、要不太複雜（有數百個儲存格的試算表）。我們想打造一個工具，能夠： + +- **追蹤完整的財務狀況** 跨越多種貨幣 +- **視覺化你的進度** 用美觀、直覺的圖表 +- **計算精確的 FIRE 日期** 基於真實數字 +- **尊重你的隱私** 使用零知識加密 +- **全球通用** 完整多幣別支援 + +這就是為什麼我們創造了 FireFree - 讓提早退休的道路變得清晰可見。 + +## 主打功能 + +### 追蹤完整淨資產 +跨多種貨幣監控儲蓄、投資、債務和實體資產。FireFree 自動同步匯率，讓你隨時看到準確的總額。 + +### 計算 FIRE 退休日期 +根據真實數字，看見你通往財務獨立的確切路徑。輸入每月支出、儲蓄率和預期報酬率，獲得個人化的 FIRE 時間表。 + +### 視覺化進度 +即時更新的淨資產趨勢和預測圖表。美觀的視覺化讓你輕鬆理解現在的位置和前進的方向。 + +### 全球通用 +完整多幣別支援，自動同步匯率。追蹤 USD、CAD、TWD 或任何主要貨幣的資產。 + +### 立即開始 +示範模式體驗完整功能 - 無需註冊。準備好時，建立帳號以零知識加密保存真實財務資料。 + +## 技術架構 + +我們使用現代化、可擴展的技術堆疊打造 FireFree： + +- [Next.js 16](https://nextjs.org/)：最新的 React 框架，搭配 App Router +- [TypeScript](https://www.typescriptlang.org/)：型別安全的開發 +- [Supabase](https://supabase.com/)：後端、身份驗證和資料庫 +- [Turborepo](https://turbo.build/)：Monorepo 架構，實現可擴展性 +- [Tailwind CSS](https://tailwindcss.com/)：快速 UI 開發 +- [Recharts](https://recharts.org/)：美觀的財務圖表 +- [next-intl](https://next-intl-docs.vercel.app/)：完整雙語支援（English/繁體中文） +- [Vercel](https://vercel.com/)：部署和託管 + +### 架構亮點 + +- **零知識加密：**你的財務資料在離開裝置前就已加密 +- **Monorepo 結構：**共享套件確保產品套件的一致性 +- **即時同步：**變更立即反映在所有裝置上 +- **響應式設計：**在桌面、平板和手機上流暢運作 + +## FireFree 如何運作 + +1. **新增資產：**輸入儲蓄帳戶、投資組合、不動產和其他資產 +2. **追蹤債務：**記錄信用卡、貸款和房貸 +3. **設定目標：**輸入目標年度支出和期望的安全墊 +4. **計算 FIRE 日期：**FireFree 自動計算你何時達到財務獨立 +5. **監控進度：**追蹤淨資產趨勢，並根據需要調整策略 + +## FireFree 背後的哲學 + +FireFree 建立在經過驗證的 FIRE 運動原則上： + +- **4% 法則：**退休後每年安全提取投資組合的 4% +- **財務獨立數字 = 年度支出 × 25** +- **專注於儲蓄率** 而非絕對收入 +- **追蹤淨資產** 來衡量真實進度 + +## Aburi Studio 生態系的一部分 + +FireFree 設計為與我們其他財務獨立工具無縫協作： + +- **CoreHour：**追蹤時間並與收入目標對齊 +- **DailyPay：**監控每日支出和銀行餘額 +- 這些工具一起提供通往財務自由的完整視圖 + +## 使用者評價 + +> 「終於有一個 FIRE 計算機不像在做功課。視覺化讓我的狀況變得非常清楚。」 +> +> — 早期測試用戶 + +> 「多幣別支援改變遊戲規則。我在三個不同國家有資產，FireFree 完美處理。」 +> +> — 國際投資者 + +## 我們的願景 + +在 Aburi Studio，我們相信財務獨立不應該是金融專業人士的特權。每個人都應該擁有讓提早退休之路清晰可行的工具。 + +FireFree 是我們邁向財務獨立民主化的第一步。我們根據用戶回饋持續改進，並增加新功能來幫助更多人實現 FIRE 目標。 + +## 今天就開始 + +準備好計算你的財務自由之路了嗎？ + +造訪 [firefree.app](https://firefree.app) 並試用示範模式 - 無需註冊。 + +## 結語 + +打造 FireFree 是一段令人難以置信的旅程。我們將對財務獨立的熱情與現代科技結合，創造了一個我們真心相信能改變生活的工具。 + +如果你有任何建議或問題，歡迎透過應用程式聯繫我們，或在下方留言。我們很想聽聽你的 FIRE 旅程！ + +## 參考資料 + +這個專案的靈感和先行作品： + +- [Mr. Money Mustache - 提早退休背後令人震驚的簡單數學](https://www.mrmoneymustache.com/2012/01/13/the-shockingly-simple-math-behind-early-retirement/) +- [The Measure of a Plan 的 FIRE 計算機](https://engaging-data.com/fire-calculator/) +- [cFIREsim - 開源 FI 計算機](https://www.cfiresim.com/) +- [Personal Capital 退休規劃工具](https://www.personalcapital.com/) +- [networthify - 看看你何時能提早退休](https://networthify.com/calculator/earlyretirement) diff --git a/content/posts/project-focuszone-en.mdx b/content/posts/project-focuszone-en.mdx new file mode 100644 index 0000000..cb327fb --- /dev/null +++ b/content/posts/project-focuszone-en.mdx @@ -0,0 +1,222 @@ +--- +title: "FocusZone - Vision OS Productivity App with AI-Powered Distraction Detection" +description: "Stay focused in immersive environments with FocusZone, a Vision OS app featuring Pomodoro timer and AI distraction detection for Apple Vision Pro" +slug: "focuszone" +language: en +socialImage: "/images/projects/focuszone.png" +date: 2025-01-26 +type: Post +isDraft: false +--- + +![FocusZone - Vision OS Productivity App](/images/projects/focuszone.png) + +## Introduction + +**FocusZone** is an innovative productivity app designed exclusively for Apple Vision Pro. Leveraging spatial computing technology, it creates an immersive focus environment while using AI to detect distractions and help you stay on task. + +I created this project with [Carol Hsiao](https://carolhsiao.webflow.io/), who designed the elegant spatial UI/UX interface. This is our exploration into the future of productivity in spatial computing. + +## Demo & Source Code + +FocusZone is available for Vision OS: + +- **Source Code:** [github.com/eason-dev/FocusZone](https://github.com/eason-dev/FocusZone) +- **Platform:** Apple Vision Pro (Vision OS 2.0+) + +## Why We Built FocusZone + +When Apple Vision Pro was announced, we immediately saw its potential for **focused work**: + +- **Immersive Environments:** Block out physical distractions +- **Spatial Computing:** Position your work naturally in 3D space +- **Rich Sensors:** Cameras, microphones, eye tracking for context awareness + +But traditional productivity apps weren't designed for spatial computing. We wanted to build something that: + +- **Leverages Vision Pro's unique capabilities** +- **Detects distractions proactively** using AI +- **Maintains focus** without being intrusive +- **Respects natural work patterns** + +That's why we built FocusZone - productivity reimagined for spatial computing. + +## Core Features + +### Pomodoro Timer +Classic time management technique implemented in a spatial environment. See your timer floating in your immersive space, always visible but never intrusive. + +### Smart Distraction Detection +AI detects three types of distractions: + +**Phone Appearance:** When your iPhone enters your field of view during a focus session, FocusZone gently reminds you to stay on task. + +**Loud Sound:** Sudden noise spikes that break concentration trigger awareness alerts. + +**Head Movement:** Excessive head turning or looking around signals wandering attention. + +### Customizable Immersive Spaces +Multiple environment options to create your ideal work atmosphere: +- Minimalist void for maximum focus +- Natural environments (forest, beach, mountains) +- Abstract patterns that aid concentration +- Custom spaces you create + +### Real-time Alerts +Gentle reminders when distractions are detected. Not punishing - just bringing awareness back to your work. + +### Analytics Dashboard +Track your focus time and distraction patterns over time. Understand what breaks your concentration and optimize your environment. + +## The Philosophy Behind FocusZone + +FocusZone is built on several key insights about focus and attention: + +### Awareness Over Punishment +We don't shame you for getting distracted. We gently bring awareness back to your intention to focus. + +### Context-Aware Intelligence +The same behavior might be distraction in one context and necessary in another. FocusZone learns your patterns. + +### Spatial Computing Advantage +Vision Pro's sensors give us unprecedented context about your work environment. We use this responsibly. + +### Sustainable Focus +Long focus sessions aren't always better. FocusZone encourages regular breaks and sustainable work patterns. + +## How FocusZone Works + +### 1. Choose Your Environment +Select an immersive space that helps you focus. Experiment to find what works best for your work type. + +### 2. Set Your Focus Session +Use the Pomodoro timer (25 minutes work, 5 minutes break) or customize your own intervals. + +### 3. AI Monitors Context +FocusZone's AI watches for distraction signals: +- Phone in field of view +- Loud environmental sounds +- Excessive head movement patterns + +### 4. Gentle Reminders +If distraction is detected, you get a subtle reminder - a gentle glow, soft sound, or brief message. + +### 5. Analytics & Improvement +After each session, see patterns in your focus and distractions. Adjust your environment and habits accordingly. + +## Technologies + +FocusZone leverages cutting-edge Vision OS capabilities: + +- [Vision OS 2](https://developer.apple.com/visionos/): Apple's spatial computing platform +- [SwiftUI](https://developer.apple.com/xcode/swiftui/): Modern declarative UI framework +- [RealityKit](https://developer.apple.com/augmented-reality/realitykit/): 3D rendering and physics +- [ARKit](https://developer.apple.com/augmented-reality/arkit/): Spatial awareness and tracking +- [Create ML](https://developer.apple.com/machine-learning/create-ml/): On-device machine learning +- [Core ML](https://developer.apple.com/documentation/coreml): ML model execution + +### Technical Highlights + +**On-Device AI:** All distraction detection runs locally on Vision Pro. Your work context never leaves your device. + +**Spatial Audio:** 3D positional audio for timer alerts that don't break immersion. + +**Eye Tracking:** Optional attention monitoring to understand focus depth (privacy-first, data stays local). + +**Hand Gestures:** Natural interactions using Vision Pro's hand tracking. No controllers needed. + +**Efficient Performance:** Optimized to run in the background without draining battery or affecting other apps. + +## The Making of FocusZone + +### Design Process + +Carol designed the spatial UI with careful attention to: + +**Non-Intrusive Presence:** Timer and controls visible when needed, transparent when not. + +**Spatial Ergonomics:** Elements positioned at comfortable viewing angles for extended use. + +**Visual Hierarchy:** Focus timer prominent, secondary controls accessible but not distracting. + +**Immersive Environments:** Spaces that aid concentration without becoming boring or overstimulating. + +### Development Challenges + +Building for Vision OS taught us a lot: + +**Spatial UI Paradigms:** Traditional 2D UI patterns don't always work in 3D space. + +**Performance in Immersion:** Maintaining smooth framerates while running AI models required optimization. + +**Privacy-First AI:** All processing happens on-device. More challenging but essential for trust. + +**Natural Interactions:** Hand gestures need to feel intuitive, not frustrating. + +**Testing:** Limited access to Vision Pro hardware made iteration slower. + +## Privacy & Ethics + +FocusZone takes privacy seriously: + +- **On-Device Processing:** All AI runs locally, nothing sent to servers +- **No Recording:** We don't record or store video/audio +- **User Control:** You decide what distractions to monitor +- **Transparent Behavior:** Clear feedback on what FocusZone is doing +- **Data Ownership:** Your analytics data stays on your device + +## Who Is FocusZone For? + +FocusZone is perfect for: + +- **Knowledge Workers:** Developers, writers, designers doing deep work +- **Students:** Studying in immersive, distraction-free environments +- **Remote Workers:** Creating focus zones at home +- **Vision Pro Early Adopters:** Exploring productivity in spatial computing +- **Anyone Seeking Focus:** People serious about managing their attention + +## What Makes FocusZone Different + +Unlike traditional focus apps: + +- **Spatial Computing Native:** Built specifically for Vision OS, not a port +- **Proactive Detection:** AI catches distractions before they derail you +- **Context Aware:** Understands your environment, not just time +- **Immersive by Default:** Leverages Vision Pro's unique capabilities +- **Privacy-First:** All processing on-device + +## Future Vision + +We're exploring: + +- **Multi-User Focus Sessions:** Collaborate in shared immersive spaces +- **Smart Environment Adjustment:** AI suggests optimal environments based on work type +- **Integration with Calendar:** Automatic focus sessions for deep work blocks +- **Biometric Feedback:** Optional heart rate monitoring for optimal break timing +- **Habit Building:** Long-term focus habit development + +## Get Started + +FocusZone is available on GitHub: + +Visit [github.com/eason-dev/FocusZone](https://github.com/eason-dev/FocusZone) + +Requires: Apple Vision Pro with Vision OS 2.0 or later + +## Conclusion + +Building FocusZone has been an incredible journey into the future of productivity. Spatial computing opens entirely new possibilities for how we manage attention and create focused work environments. + +We believe Vision Pro and spatial computing will fundamentally change how we work. FocusZone is our early exploration of that future. + +If you have a Vision Pro and try FocusZone, we'd love to hear your feedback! Open an issue on GitHub or leave a comment below. + +## References + +Inspiration and prior art for this project: + +- [Deep Work by Cal Newport](https://www.calnewport.com/books/deep-work/) - Focus philosophy +- [Forest App](https://www.forestapp.cc/) - Phone focus blocking +- [Freedom](https://freedom.to/) - Distraction blocking +- [Apple Vision Pro Human Interface Guidelines](https://developer.apple.com/design/human-interface-guidelines/designing-for-visionos) +- [RealityKit Documentation](https://developer.apple.com/documentation/realitykit) diff --git a/content/posts/project-focuszone.mdx b/content/posts/project-focuszone.mdx new file mode 100644 index 0000000..515ee0b --- /dev/null +++ b/content/posts/project-focuszone.mdx @@ -0,0 +1,222 @@ +--- +title: "FocusZone - 結合 AI 干擾偵測的 Vision OS 專注應用" +description: "使用 FocusZone 在沉浸式環境中保持專注，這是一款為 Apple Vision Pro 設計的 Vision OS 應用，具備番茄鐘計時器和 AI 干擾偵測" +slug: "focuszone" +language: zh-TW +socialImage: "/images/projects/focuszone.png" +date: 2025-01-26 +type: Post +isDraft: false +--- + +![FocusZone - Vision OS 專注應用](/images/projects/focuszone.png) + +## 專案簡介 + +**FocusZone** 是專為 Apple Vision Pro 設計的創新生產力應用程式。利用空間計算技術，創造沉浸式專注環境，並透過 AI 偵測干擾因素，幫助你保持專注。 + +我與 [Carol Hsiao](https://carolhsiao.webflow.io/) 共同創造了這個專案，她設計了優雅的空間 UI/UX 介面。這是我們對空間計算生產力未來的探索。 + +## Demo & 程式碼 + +FocusZone 適用於 Vision OS： + +- **原始碼：**[github.com/eason-dev/FocusZone](https://github.com/eason-dev/FocusZone) +- **平台：**Apple Vision Pro（Vision OS 2.0+） + +## 為什麼我們要打造 FocusZone + +當 Apple Vision Pro 發布時，我們立即看到它在**專注工作**方面的潛力： + +- **沉浸式環境：**阻擋實體干擾 +- **空間計算：**在 3D 空間中自然地定位工作 +- **豐富感測器：**相機、麥克風、眼動追蹤提供情境感知 + +但傳統的生產力應用程式並非為空間計算設計。我們想打造一個能夠： + +- **運用 Vision Pro 的獨特能力** +- **主動偵測干擾** 使用 AI +- **保持專注** 而不會造成干擾 +- **尊重自然工作模式** + +這就是為什麼我們打造 FocusZone - 為空間計算重新想像的生產力。 + +## 核心功能 + +### 番茄工作法計時器 +經典時間管理技巧在空間環境中實現。看見計時器漂浮在沉浸空間中，始終可見但絕不干擾。 + +### 智慧干擾偵測 +AI 偵測三種類型的干擾： + +**手機出現：**當你的 iPhone 在專注時段進入視野時，FocusZone 溫和提醒你保持專注。 + +**噪音：**突然的噪音峰值會打斷專注，觸發意識警報。 + +**頭部移動：**過度的頭部轉動或四處張望表示注意力渙散。 + +### 自訂沉浸空間 +多種環境選擇，創造理想工作氛圍： +- 極簡虛空以達到最大專注 +- 自然環境（森林、海灘、山脈） +- 有助專注的抽象圖案 +- 你創建的自訂空間 + +### 實時提醒 +偵測到干擾時的溫和提醒。不是懲罰 - 只是將意識帶回你的工作。 + +### 分析儀表板 +隨時間追蹤專注時間和干擾模式。了解什麼打斷你的專注，並優化環境。 + +## FocusZone 背後的哲學 + +FocusZone 建立在幾個關於專注和注意力的關鍵洞察上： + +### 意識而非懲罰 +我們不會因為分心而羞辱你。我們溫和地將意識帶回你專注的意圖。 + +### 情境感知智慧 +相同的行為在某個情境下可能是干擾，在另一個情境下則是必要的。FocusZone 學習你的模式。 + +### 空間計算優勢 +Vision Pro 的感測器為我們提供前所未有的工作環境情境。我們負責任地使用這些資料。 + +### 可持續專注 +長時間專注並不總是更好。FocusZone 鼓勵定期休息和可持續的工作模式。 + +## FocusZone 如何運作 + +### 1. 選擇環境 +選擇有助於專注的沉浸空間。實驗找出最適合你工作類型的環境。 + +### 2. 設定專注時段 +使用番茄鐘計時器（25 分鐘工作，5 分鐘休息）或自訂間隔。 + +### 3. AI 監控情境 +FocusZone 的 AI 觀察干擾訊號： +- 視野中的手機 +- 環境中的噪音 +- 過度的頭部移動模式 + +### 4. 溫和提醒 +如果偵測到干擾，你會得到微妙的提醒 - 溫和的光暈、柔和的聲音或簡短訊息。 + +### 5. 分析與改進 +每次時段後，看見專注和干擾的模式。相應調整環境和習慣。 + +## 技術架構 + +FocusZone 運用尖端的 Vision OS 能力： + +- [Vision OS 2](https://developer.apple.com/visionos/)：Apple 的空間計算平台 +- [SwiftUI](https://developer.apple.com/xcode/swiftui/)：現代宣告式 UI 框架 +- [RealityKit](https://developer.apple.com/augmented-reality/realitykit/)：3D 渲染和物理 +- [ARKit](https://developer.apple.com/augmented-reality/arkit/)：空間感知和追蹤 +- [Create ML](https://developer.apple.com/machine-learning/create-ml/)：裝置上機器學習 +- [Core ML](https://developer.apple.com/documentation/coreml)：ML 模型執行 + +### 技術亮點 + +**裝置上 AI：**所有干擾偵測都在 Vision Pro 本地執行。你的工作情境永遠不會離開裝置。 + +**空間音訊：**計時器警報的 3D 位置音訊不會打破沉浸感。 + +**眼動追蹤：**可選的注意力監控以了解專注深度（隱私優先，資料保留在本地）。 + +**手勢：**使用 Vision Pro 的手部追蹤進行自然互動。不需控制器。 + +**高效效能：**優化為在背景執行而不會耗盡電池或影響其他應用程式。 + +## FocusZone 的製作過程 + +### 設計流程 + +Carol 設計空間 UI 時仔細注意： + +**非干擾存在：**需要時可見計時器和控制，不需要時透明。 + +**空間人體工學：**元素定位在舒適的觀看角度以供長時間使用。 + +**視覺層次：**專注計時器突出，次要控制可存取但不分散注意力。 + +**沉浸式環境：**有助專注的空間，不會變得無聊或過度刺激。 + +### 開發挑戰 + +為 Vision OS 開發讓我們學到很多： + +**空間 UI 範式：**傳統的 2D UI 模式在 3D 空間中並不總是有效。 + +**沉浸中的效能：**在執行 AI 模型的同時保持流暢的幀率需要優化。 + +**隱私優先 AI：**所有處理都在裝置上進行。更具挑戰性但對信任至關重要。 + +**自然互動：**手勢需要感覺直覺，而不是令人沮喪。 + +**測試：**有限的 Vision Pro 硬體存取使迭代變慢。 + +## 隱私與倫理 + +FocusZone 認真對待隱私： + +- **裝置上處理：**所有 AI 在本地執行，不傳送到伺服器 +- **不錄製：**我們不錄製或儲存影片/音訊 +- **使用者控制：**你決定監控哪些干擾 +- **透明行為：**清楚回饋 FocusZone 正在做什麼 +- **資料所有權：**你的分析資料保留在裝置上 + +## FocusZone 適合誰？ + +FocusZone 完美適合： + +- **知識工作者：**進行深度工作的開發者、作家、設計師 +- **學生：**在沉浸式、無干擾環境中學習 +- **遠端工作者：**在家創造專注區域 +- **Vision Pro 早期採用者：**探索空間計算中的生產力 +- **任何尋求專注的人：**認真管理注意力的人 + +## FocusZone 的獨特之處 + +與傳統專注應用程式不同： + +- **空間計算原生：**專為 Vision OS 打造，而非移植 +- **主動偵測：**AI 在干擾使你脫軌之前捕捉它們 +- **情境感知：**了解你的環境，而非僅僅時間 +- **預設沉浸式：**運用 Vision Pro 的獨特能力 +- **隱私優先：**所有處理在裝置上 + +## 未來願景 + +我們正在探索： + +- **多人專注時段：**在共享沉浸空間中協作 +- **智慧環境調整：**AI 根據工作類型建議最佳環境 +- **日曆整合：**為深度工作區塊自動專注時段 +- **生物回饋：**可選的心率監控以優化休息時機 +- **習慣養成：**長期專注習慣培養 + +## 開始使用 + +FocusZone 在 GitHub 上可用： + +造訪 [github.com/eason-dev/FocusZone](https://github.com/eason-dev/FocusZone) + +需求：Apple Vision Pro 搭配 Vision OS 2.0 或更新版本 + +## 結語 + +打造 FocusZone 是一段通往生產力未來的令人難以置信的旅程。空間計算為我們如何管理注意力和創造專注工作環境開啟了全新的可能性。 + +我們相信 Vision Pro 和空間計算將從根本上改變我們的工作方式。FocusZone 是我們對那個未來的早期探索。 + +如果你有 Vision Pro 並試用 FocusZone，我們很想聽聽你的回饋！在 GitHub 開 issue 或在下方留言。 + +## 參考資料 + +這個專案的靈感和先行作品： + +- [Deep Work 深度工作力 by Cal Newport](https://www.calnewport.com/books/deep-work/) - 專注哲學 +- [Forest 專注森林](https://www.forestapp.cc/) - 手機專注封鎖 +- [Freedom 自由](https://freedom.to/) - 干擾封鎖 +- [Apple Vision Pro 人機介面指南](https://developer.apple.com/design/human-interface-guidelines/designing-for-visionos) +- [RealityKit 文件](https://developer.apple.com/documentation/realitykit) diff --git a/public/images/projects/corehour.png b/public/images/projects/corehour.png new file mode 100644 index 0000000..e3d669f Binary files /dev/null and b/public/images/projects/corehour.png differ diff --git a/public/images/projects/dailypay.png b/public/images/projects/dailypay.png new file mode 100644 index 0000000..dbd396d Binary files /dev/null and b/public/images/projects/dailypay.png differ diff --git a/public/images/projects/equation-pyramid.jpg b/public/images/projects/equation-pyramid.jpg new file mode 100644 index 0000000..de2c5a7 Binary files /dev/null and b/public/images/projects/equation-pyramid.jpg differ diff --git a/public/images/projects/firefree.png b/public/images/projects/firefree.png new file mode 100644 index 0000000..fa2fa3d Binary files /dev/null and b/public/images/projects/firefree.png differ diff --git a/public/images/projects/focuszone.png b/public/images/projects/focuszone.png new file mode 100644 index 0000000..3d964c4 Binary files /dev/null and b/public/images/projects/focuszone.png differ diff --git a/public/locales/en/indexPage.json b/public/locales/en/indexPage.json index 80e0432..6aac515 100644 --- a/public/locales/en/indexPage.json +++ b/public/locales/en/indexPage.json @@ -1,8 +1,7 @@ { "latest-posts": "Latest Posts", - "intro-title": "Hey, I am Eason Chang 👋", - "intro-1": "I am a Fullstack Developer. I love building <0>cool stuff!", - "intro-2": "Here I write <0>posts about Software Engineering, Web Dev, Maker, and Productivity.", - "intro-3": "I am from Taiwan 🇹🇼, currently live in Canada 🇨🇦, and actively seeking a job!", - "intro-4": "Feel free to check out my <0>resume, connect with me on <1>LinkedIn, explore my <2>GitHub, follow me on <3>Twitter, or <4>book my time and chat with me!" + "intro-title": "Hey, I'm Eason Chang 👋", + "intro-1": "I'm a Fullstack Engineer and indie maker. I love building <0>cool stuff! Recently co-founded Aburi Studio with Carol Hsiao, building tools like FireFree, CoreHour, and DailyPay to help people achieve financial freedom.", + "intro-2": "Here I write about Software Engineering, Product Development, Maker Culture, and building profitable products. From Taiwan 🇹🇼, creating from Canada 🇨🇦.", + "intro-3": "Feel free to check out my <0>resume, connect with me on <1>LinkedIn, explore my <2>GitHub, follow me on <3>Twitter, or <4>book my time and chat with me!" } diff --git a/public/locales/zh-TW/indexPage.json b/public/locales/zh-TW/indexPage.json index af98639..20320af 100644 --- a/public/locales/zh-TW/indexPage.json +++ b/public/locales/zh-TW/indexPage.json @@ -1,8 +1,7 @@ { "latest-posts": "最新文章", "intro-title": "Hey，我是 Eason Chang 👋", - "intro-1": "我是一位全端軟體工程師。我喜歡創造<0>酷東西！", - "intro-2": "我在這裡寫了許多<0>文章，主題涵蓋軟體工程、網站開發、自造者（Maker）、和生產力。", - "intro-3": "我來自台灣 🇹🇼，現居住在加拿大 🇨🇦 並積極求職中！", - "intro-4": "歡迎逛逛<0>我的履歷、加我的 <1>LinkedIn、瀏覽 <2>GitHub、追蹤 <3>Twitter、或是<4>預約時間與我聊天！" + "intro-1": "我是一位全端軟體工程師，也是獨立創客。我喜歡創造<0>酷東西！最近和 Carol Hsiao 共同創辦了 Aburi Studio，打造 FireFree、CoreHour、DailyPay 等工具，幫助人們實現財務自由。", + "intro-2": "我在這裡分享我在軟體工程、產品開發、創客文化、和打造獲利產品的學習心得。來自台灣 🇹🇼，在加拿大 🇨🇦 創造中。", + "intro-3": "歡迎逛逛<0>我的履歷、加我的 <1>LinkedIn、瀏覽 <2>GitHub、追蹤 <3>Twitter、或是<4>預約時間與我聊天！" } diff --git a/src/data/projects.ts b/src/data/projects.ts index d04f3e1..c7ffe4a 100644 --- a/src/data/projects.ts +++ b/src/data/projects.ts @@ -10,6 +10,11 @@ import ScifiTrophyImg from "../../public/images/projects/scifi-trophy.png"; import SigmaGoImg from "../../public/images/projects/sigmago.jpg"; import SmartGlovesImg from "../../public/images/projects/smart-gloves.png"; import WinsterImg from "../../public/images/projects/winster.png"; +import FireFreeImg from "../../public/images/projects/firefree.png"; +import CoreHourImg from "../../public/images/projects/corehour.png"; +import DailyPayImg from "../../public/images/projects/dailypay.png"; +import EquationPyramidImg from "../../public/images/projects/equation-pyramid.jpg"; +import FocusZoneImg from "../../public/images/projects/focuszone.png"; export type Project = { title: string; @@ -27,6 +32,81 @@ export type Project = { }; export const PROJECTS_ZH = [ + // FireFree - FIRE Calculator + { + title: "FireFree - 計算你的財務自由之路", + description: "全面的 FIRE（財務獨立、提早退休）計算機。追蹤淨資產、計算退休日期、視覺化進度。支援多幣別、零知識加密。與 Carol Hsiao 共同打造，Aburi Studio 出品。", + links: { + post: "/posts/firefree", + github: "", + site: "https://firefree.app", + }, + image: { + src: FireFreeImg, + alt: "FireFree - FIRE 財務自由計算機", + placeholder: "blur", + }, + }, + // CoreHour - Time Management + { + title: "CoreHour - 專注於真正重要的事", + description: "智慧時間追蹤工具，幫助你發現高峰生產力時段。將日常任務與長期目標對齊，連結時間與收入，建立可持續的工作習慣。Aburi Studio 生態系的一部分，與 FireFree 和 DailyPay 無縫協作。", + links: { + post: "/posts/corehour", + github: "", + site: "https://corehour.app", + }, + image: { + src: CoreHourImg, + alt: "CoreHour - 時間管理工具", + placeholder: "blur", + }, + }, + // DailyPay - Daily Financial Tracking + { + title: "DailyPay - 即時看見你的金錢流動", + description: "每日財務追蹤儀表板，提供財務健康即時檢視。從銀行帳戶自動同步，用直覺圖表呈現消費模式，智慧分類交易記錄。連結 FireFree 追蹤財務獨立進度。由 Aburi Studio 打造，完整財務獨立工具套件的一部分。", + links: { + post: "/posts/dailypay", + github: "", + site: "https://dailypay.aburi.app", + }, + image: { + src: DailyPayImg, + alt: "DailyPay - 每日財務追蹤", + placeholder: "blur", + }, + }, + // Equation Pyramid - Math Puzzle Game + { + title: "Equation Pyramid - 數字金字塔遊戲", + description: "靈感來自 Netflix《惡魔計劃》的互動式數學解謎遊戲。運用加減乘除四則運算排列出正確等式。使用 Next.js、React Three Fiber、Three.js 打造流暢的 3D 互動體驗。與 Carol Hsiao 共同創作的開源專案。", + links: { + post: "/posts/equation-pyramid", + github: "https://github.com/eason-dev/equation-pyramid", + site: "https://equation-pyramid.vercel.app", + }, + image: { + src: EquationPyramidImg, + alt: "Equation Pyramid - 數字金字塔遊戲", + placeholder: "blur", + }, + }, + // FocusZone - Vision OS Productivity App + { + title: "FocusZone - Vision OS 專注生產力應用", + description: "專為 Apple Vision Pro 設計的生產力應用。結合番茄工作法計時器與 AI 干擾偵測（手機出現、噪音、頭部移動），創造沉浸式專注環境。使用 Vision OS 2、SwiftUI、RealityKit 開發。與 Carol Hsiao 共同創作。", + links: { + post: "/posts/focuszone", + github: "https://github.com/eason-dev/FocusZone", + site: "", + }, + image: { + src: FocusZoneImg, + alt: "FocusZone - Vision OS 專注應用", + placeholder: "blur", + }, + }, // Timez - Timezone Converter { title: "Timez - Time Zone Converter 時區轉換工具", @@ -218,6 +298,81 @@ export const PROJECTS_ZH = [ ]; export const PROJECTS_EN = [ + // FireFree - FIRE Calculator + { + title: "FireFree - Calculate Your Path to Financial Freedom", + description: "Comprehensive FIRE (Financial Independence, Retire Early) calculator. Track net worth, calculate retirement date, visualize progress. Multi-currency support with zero-knowledge encryption. Co-created with Carol Hsiao, built by Aburi Studio.", + links: { + post: "/posts/firefree", + github: "", + site: "https://firefree.app", + }, + image: { + src: FireFreeImg, + alt: "FireFree - FIRE Calculator", + placeholder: "blur", + }, + }, + // CoreHour - Time Management + { + title: "CoreHour - Focus on What Truly Matters", + description: "Smart time tracking tool that helps you discover peak productivity hours. Align daily tasks with long-term goals, connect time to revenue, build sustainable work habits. Part of the Aburi Studio ecosystem, works seamlessly with FireFree and DailyPay.", + links: { + post: "/posts/corehour", + github: "", + site: "https://corehour.app", + }, + image: { + src: CoreHourImg, + alt: "CoreHour - Time Management Tool", + placeholder: "blur", + }, + }, + // DailyPay - Daily Financial Tracking + { + title: "DailyPay - See Your Money Move in Real-Time", + description: "Daily financial tracking dashboard with real-time view of financial health. Automatic sync from bank accounts, intuitive charts for spending patterns, smart transaction categorization. Connects with FireFree to track financial independence progress. Built by Aburi Studio.", + links: { + post: "/posts/dailypay", + github: "", + site: "https://dailypay.aburi.app", + }, + image: { + src: DailyPayImg, + alt: "DailyPay - Daily Financial Tracking", + placeholder: "blur", + }, + }, + // Equation Pyramid - Math Puzzle Game + { + title: "Equation Pyramid - Math Puzzle Game", + description: "Interactive math puzzle game inspired by Netflix's The Devil's Plan. Use arithmetic operations to form valid equations. Built with Next.js, React Three Fiber, and Three.js for smooth 3D interactive experience. Co-created with Carol Hsiao as an open source project.", + links: { + post: "/posts/equation-pyramid", + github: "https://github.com/eason-dev/equation-pyramid", + site: "https://equation-pyramid.vercel.app", + }, + image: { + src: EquationPyramidImg, + alt: "Equation Pyramid - Math Puzzle Game", + placeholder: "blur", + }, + }, + // FocusZone - Vision OS Productivity App + { + title: "FocusZone - Vision OS Productivity App", + description: "Productivity app designed for Apple Vision Pro. Combines Pomodoro timer with AI distraction detection (phone appearance, noise, head movement) to create immersive focus environment. Developed using Vision OS 2, SwiftUI, and RealityKit. Co-created with Carol Hsiao.", + links: { + post: "/posts/focuszone", + github: "https://github.com/eason-dev/FocusZone", + site: "", + }, + image: { + src: FocusZoneImg, + alt: "FocusZone - Vision OS Productivity App", + placeholder: "blur", + }, + }, // Timez - Timezone Converter { title: "Timez - Time Zone Converter",