pratti

Interval

dashboard
Interface
category
Iconography
Pratti_Interval_Header.png

Introduction

Interval is a time-tracking app for remote workerks.
It was built with Flutter and released in April of 2019.

Establishing structure

Interval was designed with a goal - to help track work time with a simple and intuitive interface. With that in mind, the concept relied on physical objects - time cards - as the foundation.

By keeping the defining characteristics of a card — the table, the headers, and the arrangement of items — adapting it was a natural process.


Interface & interaction

Interval contains three screens, one of which - Streak - is currently unavailable. It would’ve contained a mini-game that tracked your productivity and achievements to go with it.

The dropdown at the top shows a list of timespans and the amount of hours put in each.

 

Product icon

Interval’s icon went through a few revisions under the same principle; an icon that displayed the app’s time-tracking, some sort of task being done, remotely or not.

Icon iterations

Icon iterations

The final result focused on remote collaboration, with a timer symbol instead of numbers.

Interval’s icon also has a free-form version that is primarily used for the splash screen transition.

smartphone
Tap to play
desktop_windows
Hover to play
 

Theming

Interval gets its basic components from the Flutter framework and customizes them to fit its design system. This includes buttons, title bars, menus and the type system.

 

Typography

Interval uses Rubik as its main font across the system, replacing the standard Roboto.

Typography.png

Dark mode

Since the app is already dark by default - with its indigo brand color - dark mode was an opportunity to do something different. At night, the app’s base color shifts to red, while retaining the yellow accents throughout. This is just an intentionally exaggerated approach to blue filters.