Reports interfaces
Filtering reports by time periods
The most common dimension that your end users will want to filter their reports by is time period. This functionality is usually offered by providing a date picker interface component that allows a user to select a particular date range that they’re interested in viewing.
The most important thing to bear in mind when creating a date picker that’s useful in the context of financial reports is that the time periods that are most relevant to understanding financial data are the traditional accounting intervals used in business, for example Annual, Quarterly, and Monthly. Ideally you’ll want to provide a date picker that allows your users to select these intervals directly, rather than forcing them to manually select arbitrary start and end dates.
We recommend either choosing a date picker component that allows you to provide smart preset intervals to your users, or building your own date picker component so you can ensure that it’s tailored to the context of financial reports.
Here is a prototype of a date picker component that we’ve built that allows users to select ranges from preset accounting intervals, you can use this as a starting point and a reference for creating the ideal date picker for your platform:
Implementation examples
Income statement
An income statement is an excellent way to present a rolled-up view of the financial performance of a business over a specific period of time. An ideal income statement interface will present:
- Lists of ledgers grouped by
sub_type
with asub_type
calculated total at the bottom of group. - Each ledger should also display its own total dollar amount that sums the individual line entries in that ledger.
- Calculated totals that provide a relevant summary of the entire set of data for the time period, for example Gross Profit, Total Operating Profit, and Net Profit.
Teal makes it easy to render an income statement like the one described by providing you with this information in the Get Income Statement endpoint response.
Here is an example of an income statement interface rendered in this way:
Cash flow report
A cash flow report is a powerful way to transform a linear list of bank transactions into a view of the health and liquidity of a business, taking transaction data you already have and presenting it in a structured format that’s very valuable to your users.
An ideal cash flow report interface will, for a specific time period, provide a glanceable high-level view of the starting balance, a list of the various categories of income and expenses that have affected the balance, and an ending balance. It should also allow the user to drill down into the details of each category to see the individual transactions that make up the totals, and make changes to the assigned category of a transaction.