Original Product Development
Product Type: Browser Extension
Company: Independent Project
Split your hydro bill between roommates at the click of a button. This browser extension reimburses the billing account holder in real-time, saving them the hassle of calculating shared expenses and making sure their roommates settle up.
As the London Hydro accountholder in my years spent with roommates, I can attest to the monthly struggle of collecting pay for the utility bill from four university students. Apps like Splitwise claim to streamline this process but only seem to make it more complicated. Between sending reminders to my procrastinating roommates and keeping a spreadsheet for outstanding e-transfers, I dreamed of a simpler solution where splitting the bill is effortless.
​
After wireframing my new product idea called Utility Share, I devised a rough business plan, financial projections, and assessed technical requirements. I then used bubble.io to build the product (depicted in the video above). Although I decided not to launch of the product due to profitability and technical risks, it is conceptually viable and served as a product management exercise.
​
Together, roommates create a payment Group from which the billing accountholder will automatically be reimbursed.
​
To get started, a user creates an account and a new group through the extension's popup. The popup is the small window that opens from the menu bar icon.
Note that these are conceptual wireframes and some key pages and features are missing.
Customer Pain-Point
My Role
Walkthrough of Early Stage Wireframes
The user enters their credit card information which is stored securely using the Stripe API.
Utility Share
Once the account is set up, the user can invite their roommates to the group by entering their email.
This action triggers an email to be sent to the invitee containing a unique referral code.
The invitee enters the referral code during the sign up flow to join the associated group.
Once the group has been established, any user can click and drag the hydro bill account holder into the designated top position.
The initial setup is done. Now let's look at a bill payment scenario:
The billing accountholder follows the regular payment flow on their hydro website (London Hydro is used as an example).
The content script of the Chrome extension is triggered on the payment confirmation page. This is the script that interacts with the browser window.
When the script is triggered, a confirm box appears prompting the accountholder to split their bill. If the user clicks "OK" the Javascript snippets below will execute to perform the actions described:
-
The total bill amount will be scraped from the webpage
document.getElementById('paymentID').innerHTML;
-
the payment authorization checkbox will be checked
document.getElementById('checkboxID').checked = true;
-
and the payment form will be submitted.
document.getElementById('submitID').click();
​
At this point, the accountholder will have paid their bill in full through London Hydro, but a programmed payment transfer from the group will instantly reimburse the accountholder, based on the bill amount scraped from the website. In a single action, the accountholder has paid the bill and been reimbursed by the other group members via Stripe.
​
Risks
I decided not to launch Utility Share for the following reasons:
-
There is risk in having two co-dependent payment flows (the content script flow and London Hydro flow). For example, if the London Hydro HTML is updated, the content script could no longer scrape the total bill amount from the webpage. The accountholder would unknowingly pay the full bill amount without being reimbursed, due to failure of the content script. Similar problems would arise in the event of network issues, chargebacks, or incorrect payment information.
-
Profit potential is low. For commercial success, the product would need to scale to many households with a significant surcharge on each transaction. The following net revenue projections demonstrate the venture's low profitability: