Clock In App Icon showing concentric circles that form a clock

Clock In

Description A minimal time tracking app
Time Frame 2 weeks
Platform iOS
Tools Used Sketch

Every solution starts with a problem. For this version, I isolated four problems that were tacklable within the time frame.

Screenshot of Apple App Store reviews with highlighted areas discussing the need for a calendar, pay periods, a clock in and out feature, and overtime pay.

The original Clock In was a simple time tracking app, but users wanted more. The userflow was essentially limited to entering a start time, end time, tips, and a break.

Screenshots of the old Clock In app with a grey and blue color scheme

Finding solutions. For each problem, I came to a solution through empathizing with the issue, exploring options, and realizing those options until a suitable solution was found.

A chart describing the design process from empathizing to exploring to realizing.

Using wireframes, I mapped out a typical userflow. We wanted a flow that could easily be customized to reflect the original, minimal Clock In design, while incorporating the new features in an unobstrusive way.

A map of the app with arrows leading from screenshot to screenshot, describing how users would interact with the app.

A refreshed and modernized UI completed the redesign.

A styleguide for the app showing the fonts and colors used.

The result was a feature-heavy update that felt familiar to our legacy users, while gaining a 200% increase in revenue from new users.


Let’s take a look at the new Clock In.

Before

After

Hover for dark mode
The old Clock In shifts screen
The new Clock In shifts screen with calendar

The old shifts screen didn't have a way to visual the days worked.

The new shifts screen with added calendar.

The new Clock In shifts screen without calendar

The calendar is easily dismissed to reveal more shifts.

The new Clock In new job screen

Jobs are easily personalized and color-coded.

The old Clock In new shift screen
The new Clock In new shift screen

The old shift screen didn't account for holiday pay or time and a half.

The new shift screen allowed for easier customization of rate and breaks.

The new shifts screen with a bar at the bottom indicating the user is clocked in for work

Users can now effortlessly clock in with one touch by holding down the add button in the top right corner.

The old Clock In sharing screen
The new Clock In sharing screen

The updated sharing screen reflecting the new design.