TimeChi - Smart Productivity Device

Client

TimeChi

Services

Visual Design UI & UX Design

Industries

Productivity

Date

April 2021

App Screen with open sidebar
App Screen with open sidebar
App Screen with open sidebar

Following a successful Indiegogo campaign, the TimeChi team recognized the need to engage a designer to enhance their Companion app for their remarkable smart productivity device. Once introductions were made, TimeChi presented their existing wireframes, and we had a productive discussion to align their business goals and expectations for the project.

How might we create a simple app that enhances the device's abilities?

Create an app that helps users track and analyze their performance.

Discovery

Research

The team demonstrated a solid understanding of the user's pain points, having conducted their own research and providing valuable insights. To further improve our approach, I conducted a thorough Competitor Analysis to identify best practices and potential opportunities.

Business goals

In collaboration with the team, we have identified several key business goals. As a startup focusing on budget and time constraints, the team aimed to address the primary user pain points while also introducing additional features to enhance the device's functionality.

Business goals

In collaboration with the team, we have identified several key business goals. As a startup focusing on budget and time constraints, the team aimed to address the primary user pain points while also introducing additional features to enhance the device's functionality.

Wireframes

The team provided their initial wireframes as a starting point for our collaboration. We analyzed and iterated upon them, leveraging our expertise to enhance design and functionality. We refined the wireframes to achieve an improved and optimized user experience.

Wireframes

The team provided their initial wireframes as a starting point for our collaboration. We analyzed and iterated upon them, leveraging our expertise to enhance design and functionality. We refined the wireframes to achieve an improved and optimized user experience.

Major Insights

By aligning user needs and business goals, we identified several key areas that required our focus. In general, the initial adopters were satisfied with the experience the team had crafted. However, a few main points emerged as areas for improvement. Firstly, there was a shared goal between the business and users to ensure a seamless and hassle-free initial setup experience. Additionally, users expressed a desire to create multiple routines, we called them flows, for different types of activity. Lastly, the TimeChi team aimed to enhance the app's value by incorporating analytics dashboard, empowering users to set and achieve their goals more effectively.

Seamless setup

Seamless setup

Getting rewarded for work done

Getting rewarded for work done

Consistently saving

Consistently saving

Seamless setup

Drawing from the experiences of early adopters, we collaborated with engineers to create a seamless setup. The process aims to meet the following objectives: it should be guided and clear. Additionally, we have focused on reducing the likelihood of errors and have ensured that recovery options are available to smooth out the overall experience.

Custom flows

It was exciting to see how users interact with the app! We noticed that people approach activities differently: some like to study in short bursts, while others work deeply for 40 to 60 minutes without stopping. This also applies to the number of activity cycles that users can perform. So, we decided to create a simple interface that allows users to easily set and access their cycles(we called them flows) based on the activity.

Performance analytics

We decided to begin with basic analytics for daily, monthly, and yearly activities to test with users, gather feedback, and expand from there. I have created various graphs that measure focus over time, provide comparison charts, and show the ratio of completed to broken cycles, as well as the ratio of all saved flows.

Visual language

Taking inspiration from the developed wireframes and utilizing the brand's colors, I have meticulously designed a simple UI Kit to ensure efficient and consistent design throughout the app. Keeping in mind the team's objective of highlighting the device, I focused on creating a clean and intuitive user interface.


For the setup flow, my aim was to provide clear guidance to users, ensuring they understand their progress, current actions, and next steps. I paid particular attention to system feedback, including error messages and troubleshooting prompts, to ensure a seamless user experience.


To streamline the flow creation process, I incorporated chunky buttons with 5-minute increments for each time period. Additionally, I implemented a convenient manual input option, enabling users to quickly enter specific time values.


To test our assumptions and meet our goals, we integrated multiple analytics widgets into the app. These widgets include comparative analysis, focus duration tracking, cycle consistency metrics, and flow distribution insights. Users have the flexibility to adjust the widgets to display results for different time frames, such as daily, weekly, monthly, and yearly data.

Evaluation and reflection

Working with such a professional team was truly enjoyable. Regular communication with key stakeholders like electronics engineers, marketing staff, and the CEO throughout the project allowed us to make decisions quickly and design efficiently.


The team carefully collected feedback from early adopters, which was very helpful in making design choices. This experience reaffirmed that creating a simple UI Kit at the beginning of a project lays a strong foundation for the rest of the work. Key advantages include:

  • The team can see the app in color and closer to high fidelity, resulting in fewer questions and more focus on solutions and flow.

  • It permits global changes to single elements throughout the design, making the transition to high fidelity easier and quicker.


Creating an app for hardware certainly presents unique challenges, making the project even more interesting.

Digital Product Designer. Creating user-centered digital experiences to help you achieve your business goals.

Digital Product Designer. Creating user-centered digital experiences to help you achieve your business goals.

Digital Product Designer. Creating user-centered digital experiences to help you achieve your business goals.