About Rally
Rally is a personal finance app that tracks spending habits, and generates insights and alerts related to your finances.
Rally is designed to display a large amount of densely organized information in a manageable way. Users are invited to identify patterns in the data presented, by cross-referencing and investigating information.
A premium style
The dark grey UI gives Rally a premium feel, while also allowing its bright accent colors that represent data to stand out against the background. The high contrast between data and the background color make it easy to read its graphs and charts.
Data-driven aesthetic
Rally’s UI focuses on viewing, investigating, and understanding data. Infographics laid out in a dashboard invite the user to view a summary of their spending, including the details of a single transaction.
The UI is dense and direct, with an emphasis on typography, color, and shape.
Product architecture
Rally’s information architecture has a hierarchical structure, allowing users to look at their finances through a variety of categories. The financial overview provides the most general version of this category, with an individual transaction being the most detailed category in the structure.
Content
Content is divided into sections related to personal finance, such as accounts, budgets, and bills. Rally’s home page operates as a hub to these sections.
Because Rally is concentrated on presenting and describing different areas of personal finance, it’s important that users can easily move between sections. A permanent location for navigation makes it easy for users to switch sections easily. On desktop and tablet, Rally uses rail navigation. On mobile, Rally uses tabs. These navigation patterns are ideal because although they are always on-screen, they take up very little space.
Layout
Color
Sometimes Rally needs to show multiple infographics on a single screen, each with multiple sections. To do this, Rally has adopted a color theme with one primary color, and five additional colors. This elaborate color theme allows Rally to present readable, distinct infographics.
Typography
Iconography
Rally uses custom iconography to represent to its four main sections: Overview, Accounts, Bills, Budgets, and Settings.
The icons use curved forms and sharp corners that resemble the shape of Rally’s typography.
Shape
Components
Motion
Rally has a simple and reserved motion style to help balance the visual density of the UI.