Trackit

Trackit allows you to keep track of your packages in transit before they arrive.

Trackit

Role

Lead UI / UX designer

Tools Used

Figma

Length

3 Weeks

Problem

The current user interface of Trackit does not reflect the simplistic streamlined user experience that the application strives to provide. This not only hinders the user perception of the application by current users, but can also deter potential users as they may feel that the application is less functional compared to others on the app store solely based on the visual aesthetic.

Responsibilities

As the lead UI / UX designer, ensuring the bridge between having a well thought out experience coincide with a design that reflected the choices was vital during the creation of this project.

Target Users

User

“I like the app, but it looks like it hasn’t been updated in years."

User

“I just wish the appearance of the app was more attractive, since it looks kind of plain.”

User

"Please change the layout. This one is annoying, and everything takes long to view (more clicks). A simpler look would be way better.”

Trackit image 1

Trackit strives to create a convenient way to simplify a complex process.

Trackit image 2 Trackit image 3 Trackit image 4 Trackit image 5

Research

Once the goal was set, user research could begin to establish the pain points of the current interface. During this period, it was clear that the common issues all stemmed from the lack of design, causing confusion and making certain elements difficult to discern on an initial use. The current interface is also very reliant on prior use of the application as options are blocked behind login screens that a first-time user may not need to simply track their package. When redesigning a more accessible and user-friendly interface, creating the ability to easily access the most valuable information in an intuitive flow was essential.

Trackit image 6

User Flow

During this process, reducing as many unessential nested pages as possible was a main priority. Designing this unified system allowed the ability to identify any limitations in the user flow much easier.

Trackit image 7

Style

The updated interface explores a new typeface, colour palette, and icon set to unify and bring to life the reimagined experience. This modernized refresh of the application also introduces a dark mode to compliment the design and reduce eye strain when using the application to track packages early in the morning or late into the night.

Trackit image 8 Trackit image 9
Trackit image 10

Ideation

The next stage in the process of relieving the pain points was to brainstorm any features that would improve the overall experience of using the application. With the user persona’s set, additional features were carefully selected to ensure all needs were met.

Trackit image 11

Tracking

The main tracking screen has been enhanced to include incoming, sent, and received packages in one organized location. Key information such as the estimated arrival date and status indicators are present to have the most useful information easily accessible.

Tracking History

The tracking history page compiles the entire history of the package including a map of the current location of the shipment. Additionally, notifications can be altered to display “out for delivery” updates, or any other movement from location to location.

Trackit image 12
Trackit image 13

In-App Payments

Any additional duties or fees can be accessed from the individual package page and can be paid within the app before arrival.

Trackit image 15

Challenges

When redesigning this application, the initial challenge was to bring the interface to life without straying too far from the purpose of the application. When redesigning, the creative process can quickly overtake the analytical process causing a disconnect between the original goal of the process. During the initial stages of the redesign, I wanted to make sure that the redesign was purposeful and functional while also maintaining a quality and user-friendly interface that holds longevity. This challenge was prevalent throughout the wireframing process, but I was able to overcome it by ensuring that every decision was based on the user research done prior to keep the user's best interest in mind.

Lessons Learned

Overall, this project was a great learning experience to try my hand at designing in dark mode. As well, the process of revitalizing an application primarily through the user interface rather than completely redefine the user flow was a great journey allowing me to hone my design skills and produce an improved product.

Click to view full prototype

Next Project