Church Offering Deposit Form

Overview 

 This project builds upon the digital signature form project to create a mobile-friendly offering deposit entry form. The form will streamline the process of recording multiple donations collected during church offerings, with digital signatures from two counting staff members. 

 Due Date: August 31, 2025 

 Objectives 

 

 Build a mobile-optimized offering deposit form as a Google Apps Script web app 

 Support rapid entry of multiple deposits with minimal friction 

 Implement dynamic data loading from Google Sheets for staff names and fund types 

 Capture digital signatures from two counting staff members 

 Generate timestamped PDF records with signatures 

 Store all data in Google Sheets for tracking and reporting 

 Embed the application in BookStack for easy access 

 

 Prerequisites 

 Before starting, ensure you have completed the digital signature project and are familiar with: 

 

 Google Apps Script web app development 

 HTML5, CSS3, ES6+, and Web Components 

 Digital signature capture using canvas/Signature Pad 

 PDF generation and Google Drive integration 

 Google Sheets API operations 

 Mobile-responsive design principles 

 

 Database Structure Setup 

 1. Create Required Google Sheets 

 Create three Google Sheets in your project folder: 

 Sheet 1: "Offering Deposits" (Main Data Sheet) 

 Columns: Date, Name, Payment Form, Amount, Offering, Note, Counter 1, Counter 2, Timestamp, PDF File ID, Drive Link, Status 

 Sheet 2: "Offering Counting Staff" 

 Columns: Name, Active Status Pre-populate with: 

 

 Xiaoying Shen 

 Weihong Xue 

 Sinnie Lee 

 Lisa Hsieh 

 

 Sheet 3: "Funds" 

 Columns: Fund Name, Active Status, Display Order Pre-populate with: 

 

 General 

 Church Building 

 Benevolent 

 Missions 

 Short-Term Mission 

 Capital Projects 

 Next Generation Leadership 

 

 Development Tasks 

 

 Create Efficient Deposit Entry Interface Design for Speed: 

 

 Use a repeatable row component for deposits 

 Implement "Add Another" functionality 

 Auto-calculate running totals 

 Validate data as user enters data 

 

 

 Implement Dual Digital Signature 

 Backend Data Processing 

 PDF Generation with Signatures 

 Data Validation & Error Handling 

 Optimize

 

 When entering the person who makes the donation, provide the ability to select people who make donations previously to allow rapid selection. 

 

 

 

 Technical Specifications 

 Mobile Breakpoints: 

 

 Ensure usability on both portrait and landscape 

 Test on iOS Safari and Android Chrome 

 

 User Experience Flow 

 

 Setup Phase: Select date and two counting staff members 

 Data Entry: Add deposits one by one with quick workflow 

 Review: Show summary with totals by fund type 

 Signatures: Capture both staff signatures 

 Submission: Generate PDF and save to sheets 

 Confirmation: Show success message with PDF link 

 

 Final Deliverable 

 Required Outputs: 

 

 Fully functional mobile-optimized web app 

 Integration with three Google Sheets 

 PDF generation with digital signatures 

 BookStack embedded implementation 

 Demo video (3-5 minutes) showing:

 

 Mobile form usage workflow 

 Multiple deposit entries 

 Signature capture process 

 Generated PDF output 

 Google Sheets data updates 

 

 

 

 Testing Checklist: 

 

 Mobile responsiveness across devices 

 Data validation and error handling 

 Signature capture functionality 

 PDF generation with proper formatting 

 Google Sheets integration 

 Performance under typical usage loads 

 

 Questions or Issues? 

 If you encounter challenges during development, especially with mobile optimization or performance issues, reach out to Thian-Peng directly via Signal. 

 Recommended Tools: 

 

 Use Cursor or GitHub Copilot for accelerated development 

 Test on actual mobile devices, not just browser dev tools 

 Consider using Chrome DevTools' mobile simulation for initial testing 

 

 

 This project emphasizes practical mobile UX for rapid data entry while maintaining the robust backend architecture from the digital signature project.