ARKITASK

Designing an AI SaaS tool aimed at simplifying project planning for teams and organizations - Client project.

Secured early-stage funding for a Bay Area startup.

context

client
Team
Me (Product Designer)
Jesus Guadarrama (Product Designer)
Julien Hoacock (Engineer)
Anish Khazane (Engineer)
My Role
UX/UI, Visual Design, Prototyping
Timeline
3 months

BACKGROUND

I collaborated with a team of 2 designers and 2 engineers to build ArkiTask, a new productivity platform, from 0-1 in three months. We developed an MVP and brought the product to life. My role focused on product ideation, designing the visual interface, and creating high-fidelity wireframes, mockups, and prototypes for the core project planning flow/feature.

About the product

The newly founded Bay Area startup aims to help organizations save time on project planning with AI-powered templates and cost estimates. Designed as an intelligent companion, the tool enables teams to make smarter decisions about task allocation and management.

Challenge

Designing a brand-new product that was feasible to build and launch within strict time and technical constraints.

Problem

Organizations are facing challenges with managing their time effectively due to poorly written, estimated, and missing tasks.

solution

ArkiTask leverages company historical data from similar completed projects to optimize planning.

By adopting a data-first approach, users can unlock the value of their organizational data, reducing the time needed to plan projects while improving accuracy and efficiency.

view prototype -->
Demo of the Arkitask project creation flow

Initiate

Understanding the Product

Given the project’s nature, we relied on detailed conversations with the start-up founder and subject matter experts to gain insights, understand user needs, and bring the product to life.

The founder, Julien, initially shared rough sketches to outline his vision. Through weeks of ideation and iteration, these concepts evolved into a refined design with significantly improved functionality.

Constraints and planning for MVP

Since the client aimed to pitch the product to potential customers and secure funding, understanding the constraints was key:

  • Time Constraints: With only three months to build, we prioritized solving key problems
  • Technical Constraints: The client’s limited technology infrastructure required a feasible solution.

We focused on essential MVP functionalities, such as task management features that enable users to create projects and tasks, leveraging AI for assistance, and providing task estimates to attract investors and address user needs.

User Flows

To understand how users would be navigating the product, we took a step back and created user flows that would highlight how a user could quickly create a new project for their team and add tasks leveraging their prehistoric data.

design challenges

Integration

How to integrate an AI tool into a productivity platform?

Complexity

With such complex functionality, how do we make the platform intuitive and easy to use?

TECHNICAL CONSTRAINTS

How do we balance design considerations with technical constraints on an early-stage product?

Design

Open up early design discussions

To establish a shared vision for the new product, we created sketches and low-fidelity wireframes. Weekly meetings with the client and engineers were held to gather feedback, identify areas for improvement, and assess technical feasibility. Based on this input, we iterated and refined the designs as needed.

Wireframes

Prioritizing Usability and Functionality

Through several iterations, we explored the product's key functionalities and defined behaviors, gradually building higher-fidelity wireframes and visual mockups in Figma.

To ensure usability, we prioritized simplicity in design and navigation, enabling users to easily access information and features.

The design also aimed to present the AI system’s capabilities clearly and accessibly, helping users understand and leverage its functions.

Iterations

Balancing user and business goals

Initially, the client required users to manually input estimated hours for each task, with the business goal of improving the product's accuracy in the future. However, this approach was tedious and time-consuming. I pushed back on this during discussions with the client, emphasizing the importance of a better user experience.

The iterated approach allows users to quickly add tasks or entire task bundles, with the option to adjust the budgeted hours in the task details if needed.

Other changes and refinements in v2 of the Task Selection screens are annotated below:

Design Pivot

Right-side Panel View

In the last week before handoff, engineers found they could integrate a right-side panel, which had initially been deemed unfeasible. We quickly iterated the design to incorporate this feature, improving the product's functionality.

  • Increased efficiency: Users can access important information and actions without leaving the current screen.
  • Better organization: The panel displays additional project or task details, helping users better organize their project information.

This addition consolidated two screens into one, streamlining the user experience.

Visual Design

UI, Branding & Starting a System

When building the brand and UI for ArkiTask, we prioritized simplicity, intuitiveness, and a native feel for users. A limited color palette was used to avoid visual clutter, aligning with the brand while maintaining a clean interface.

At this early stage, we created a basic style guide covering typography, colors, and UI components to streamline the design process while ensuring consistency. Components were designed to be flexible and scalable, allowing the system to adapt and grow with the product while maintaining a cohesive user experience.

Dark mode exploration

I also explored a dark mode design for ArkiTask. While not an immediate priority, it showcased the product’s adaptability and offered a foundation for future development.

Final Product

Streamlining the project creation process

By leveraging historical data, the tool recommends which tasks users should undertake within a project and provides accurate time estimates, streamlining project planning and boosting team efficiency.

01. Starting a New Project with AI Assistance

Users start by creating a new project with the help of ArkiTask AI, which suggests relevant projects based on its data and aids in crafting project descriptions. These suggestions can then be fully customizable to meet the user’s specific needs.

02. Creating Tasks

After generating a project, ArkiTask AI suggests similar projects from the organization’s database that may fit the user’s needs. Users can add tasks from these suggestions or create new ones from scratch, with AI assistance to quickly generate them.

03. Turning task creation to task selection

Users can add entire suggested task bundles or pick individual ones for their list.

Once they select a suggested task, users can adjust its details as needed and receive a customized time estimate reflecting their modifications.

04. Exporting to Third party

Users can easily export or share their projects with third-party task management software to enhance workflow and collaboration.

final

Impact

A very happy client thrilled with the final design. The product was a major success as they were able to expand their customer waitlist by 2x and were able to secure the first round of funding with the help of our design.

view prototype -->

Conclusion

Project Takeaways

  • Learned the importance of close collaboration with engineers and considering technical constraints in design.
  • Faced challenges working within these limitations and an early-stage product, which led to creative solutions and improved my problem-solving skills.
  • The project pushed me to think outside the box and further develop my design approach.

Next Steps

If I were to continue, I would refine the UI to a higher fidelity based on insights from additional user testing, deepening our understanding of user interactions and further enhancing the design.