work

Positive Finance

PHP 7JavaScriptMySQLBackbone.jsChart.jsMobile-First Design

Positive finance is a sales tool used by loan writers, mortgage brokers, accountants or salespeople to quickly and engagingly illustrate the effects an investment property can have on an individual. It is intended to be used primarily on a tablet or mobile device in a customer-facing environment. It may calculate the effect of an investment on loan repayment time, tax savings, time-to-retirement, bad-debt-to-tax ratio. It may also engage the client beyond an initial meeting with a salesperson with email reports or contact information.

positive finance artistic impression

About

The Problem

Communicating the effect an invest property can have on an individual can often be a time-consuming and complex process. A common approach involved an appointment with a customer in front of a spreadsheet. Keeping client’s engaged and informed was difficult; concepts must often be over simplified for the sake of time. A quick, confident and accurate method was required to engage the client without sacrificing accuracy.

The Brief

A solution was required that could quickly display the effects an investment had on an individual or couple. It should be accessible to those without prior knowledge of financial concepts, and should effectively display a causal relationship between an individual, an investment and it’s return. It should be bright, engaging, and most importantly, tablet and mobile-friendly. It should be simple, but not simplistic. Clients should feel that they receive meaningful information that directly relates to their situation.

The Solution

A mobile-first development approach was taken, ensuring that elements and instructions looked well and behaved with a native-like feeling was essential. Most hover states were replaced with touch or active states and elements were animated minimally but noticeably. Overall, a measure for success was the responsiveness and the degree to which the UX felt native. On desktop, the content was kept to a 1024px centre column, meaning elements could easily be reused for non-mobile experiences. A simple graphing system meant that reports could make liberal use of visuals. Coupled with bright colours, this resulted in an engaging feel for users. Elements were kept large, but not oversized, meaning that a client could easily read and quickly understand each page if they were being shown via a salesperson. Custom emails were developed to match the look-and-feel of the app itself, meaning a salesperson could easily email a finished report to a client, further engaging with the client beyond their initial meeting.

Client-Side

Given that the application was customer facing, the client-side of the application was kept as simple as possible to reduce potential problems. Backbone was used for common components, events, utilities and to reduce potential cross-browser bugs. Chart.js was used for graphs and reports, with an emphasis on simple communication between visual components. Fastclick was used to enhance the responsive feel of the application. To ensure a results were computed as fast as possible, most computational requirements of the application were kept client-side; meaning results could often be produced in times of low or intermittent internet connection.

Server-Side

Server-side, the application involved relatively simple CRUD actions with small portions of computational work. PHP was used with MySQL - using a query builder in place of a full ORM - and a strong emphasis was placed on speed and reliability.

Reports

positive finance reports

Data Entry

positive finance data entry

Review

positive finance review