Home · Case study

Plan. Track. Achieve.
UI / UX case study · B2B SaaS

Autovella, the all-in-one project & service platform

From lead to invoice on one connected system. Here's the whole story: the logo, the product, the problem it solves, every feature, the flows behind each screen, and the design system that ties it all together.

Role  Product & UI/UX Design Platform  Web & Mobile Scope  13+ modules Year  2026
app.autovella.cloud/dashboard
Autovella dashboard
13+
native modules
1
connected data model
2
platforms · web & mobile
0
per-seat fees
The logo

A mark built on momentum

The Autovella mark is an A formed from two ascending strokes: a climb, a rising chart, forward motion. Tucked inside its base is a small play triangle, a quiet nod to progress in motion.

The ascending A

Two strokes rising to a peak: growth, progress, and the climb every team is on.

The play triangle

A play mark inside the base, for software in motion and work that keeps moving forward.

Trust-blue gradient

A #1E5FE0 → #62A6FA gradient: clarity, dependability and digital precision.

Product story

Built to end the tool-juggling

“The work flows in a straight line. The software never did, so we built one that finally matches the work.”

Autovella started with a simple observation. The teams who sell time and expertise (agencies, consultancies, software and IT shops) run their business across five or six disconnected apps. The work flows in a straight line; the tools don't.

Every seam between those apps is a place where work leaks. A won deal gets re-typed into a project tool. Hours sit in a spreadsheet until someone reconciles them. Status reports get rebuilt by hand every week. And the one number every owner actually cares about, are we making money on this engagement?, only shows up after the month closes, far too late to change the outcome.

So we built Autovella the other way around. Instead of bolting integrations between separate products, it starts with one schema underneath everything. CRM, projects, sprints and Gantt, timesheets, attendance, expenses, invoicing and analytics all read and write the same records. A deal doesn't sync to a project; it becomes one. Logged time isn't exported to billing; it already is billing.

The result is a platform where sales, delivery, project leads and finance all see the same truth at the same moment. Pipeline, plan, capacity, margin and cash stay in sync by design, not by manual effort. Plan. Track. Achieve.

1One shared data model under every module 13+Native modules, a single login 0Re-keying between sales, delivery & finance
01 · CONCEPT

The problem, named

Map the lead-to-invoice lifecycle and the gaps between siloed tools.

02 · ARCHITECTURE

One data model

Design a shared schema so CRM, delivery, time and billing speak one language.

03 · SYSTEM

The design language

A blue, calm, dense-where-needed UI system spanning 13+ modules.

04 · 2026

Live platform

Web & mobile, role-based security, automations. Plan. Track. Achieve.

Problem statement

What we're resolving

For a service business, revenue flows in a line: lead → project → time → invoice. The software doesn't. Each stage lives in its own app, so people end up being the integration, re-keying records, reconciling spreadsheets, and finding money problems only after the month has closed.

It isn't a tooling gap. It's a connection gap. Every app is capable on its own; the cost hides in the spaces between them. A deal closed in the CRM means nothing to the project tool until a human retypes it. Hours approved in a timesheet mean nothing to an invoice until someone exports, reconciles and re-checks them. Each seam adds latency, errors, and a little more doubt about which number is the real one.

5+ disconnected tools

A CRM, a project tracker, a timesheet app, an invoicing tool and a BI dashboard, none of them in sync.

Context lost at every hand-off

Sales wins a deal, delivery re-keys it, time lives in spreadsheets, finance chases what's billable.

Margin is a mystery

Profitability surfaces weeks late, long after you could have saved a project that's already slipping.

An admin tax on every project

Status updates, re-entry and reconciliation eat the hours that should have been billed.

5+
apps stitched together to run one pipeline
4
lossy hand-offs that re-key the same record
30+
days until true project margin is visible
0
shared sources of truth across the stack

How might we connect the entire service-delivery lifecycle on one data model, without overwhelming the people who use it every day?

The gap

Before Autovella vs. with Autovella

The same eight things every service team does, and how the experience changes once the platform becomes the integration.

Without Autovella

  • Re-key the won deal into the project tool
  • Chase time across spreadsheets
  • Build status reports by hand
  • Reconcile billable hours at month-end
  • Guess at project margin
  • Stitch five subscriptions & logins
  • Hunt for the latest file or number
  • Find problems after they cost money

With Autovella

  • One click turns a won deal into a project
  • Time logs straight onto tasks
  • Reports build themselves, live
  • Billable time flows into invoices
  • Margin updates the moment work happens
  • One platform, one login, one data model
  • A single source of truth for everyone
  • Catch slippage while you can still act
The solution

Make the platform the integration

Every module writes to one shared data model, so the moment work happens it shows up everywhere. Pipeline, plan, timesheet, invoice and report stay in sync by design, not by manual effort.

Autovellaone data model
CRM & Deals
Projects
Sprints & Tasks
Calendar
Timesheets
Expenses
Invoicing
Analytics
Principle 01

Connected by default

Won deal → scoped project → logged time → invoice. The same record carries through, zero re-keying.

Principle 02

Real-time truth

Margin, utilization and status update the instant work changes, while you can still act on them.

Principle 03

Simple at the surface

Dense capability, calm UI. Progressive disclosure keeps complex workflows learnable.

Product tour

See it in motion

A real product film of the live platform. Every few seconds you see another part of Autovella, from dashboard to invoice.

app.autovella.cloud · product tour

A real 1080p product film, rendered from the live platform.

Features

Every module, one platform

13+ native modules on a single data model. Here are the ones teams live in every day, followed by everything else that ships in the box.

Dashboard

Your command center

Projects, tasks, time, pipeline and cash in a single role-aware home, where every headline number drills into the work behind it.

  • Live KPIs & workload
  • Deadlines & recent activity
  • Personalized per role
app.autovella.cloud · Dashboard
Dashboard
CRM · Pipeline

Pipeline that becomes delivery

Track deals by stage, value and probability, then turn a won deal into a scoped project in one click.

  • Accounts, contacts & deals
  • Visual drag-and-drop pipeline
  • One-click deal → project
app.autovella.cloud · CRM
CRM pipeline
Work management

Run delivery your way

Board, list, calendar and timeline over the same data, with subtasks, dependencies, custom fields and saved views.

  • Kanban, list, calendar & timeline
  • Subtasks, dependencies, custom fields
  • Filters, columns & saved views
app.autovella.cloud · Tasks
Task board
Timeline · Gantt

See the whole plan

Gantt timelines with dependencies and milestones make the critical path obvious. Drag to reschedule and the downstream work follows.

  • Dependencies & milestones
  • Critical-path visibility
  • Agile & waterfall, one dataset
app.autovella.cloud · Gantt
Gantt timeline
Analytics

Profitability, live

Margin, utilization, earned-value and schedule performance update as work happens, so you catch erosion while you can still act.

  • Margin & utilization by project
  • Earned-value & schedule performance
  • Velocity, throughput & delivery health
app.autovella.cloud · Analytics
Analytics
Invoicing

From logged time to paid

Generate multi-currency invoices straight from logged time and milestones; track billable, billed, paid and overdue.

  • Multi-currency billing
  • Invoices from logged time
  • Expenses & approvals built in
app.autovella.cloud · Invoicing
Invoicing

…and everything else in the box

All 13+ modules, each native to the platform.

Sprints

Sprints

Run agile delivery on the same records as everything else.

  • Scrum & kanban with a backlog
  • Burndown, burnup & velocity
  • Sprint planning & capacity
Accounts

Accounts

Company records that tie sales, delivery and billing together.

  • Relationship & activity history
  • Linked deals, projects & invoices
  • Custom fields per account
Contacts

Contacts

The people behind every account, in one address book.

  • Roles & communication log
  • Linked to deals and projects
  • Searchable across the workspace
Calendar

Calendar

Deadlines, milestones and capacity on one timeline.

  • Tasks, milestones & time-off overlaid
  • Team capacity at a glance
  • Month, week & agenda views
Timesheets

Timesheets

Billable time logged straight onto tasks and projects.

  • Timer or manual entry
  • Billable vs non-billable split
  • Submit → approve → invoice
Attendance

Attendance

Presence tracking that lives beside the work itself.

  • Check-in / check-out
  • Daily & monthly summaries
  • Feeds capacity planning
Time off

Time-off

Leave that the whole plan understands automatically.

  • Requests, balances & policies
  • Approval workflow
  • Reflected in calendar & capacity
Holidays

Holidays

Company and regional calendars that planning respects.

  • Multiple regional calendars
  • Auto-excluded from schedules
  • Upcoming-holiday visibility
Expenses

Expenses

Cost captured against the project margin it affects.

  • Categorized, receipt-attached
  • Billable vs internal
  • Flows into profitability
Approvals

Approvals

One queue for everything that needs a sign-off.

  • Expenses, timesheets & time-off
  • Role-based approver routing
  • Full audit trail
Automations

Automations

Trigger-based rules that move work without you.

  • When-this-then-that across modules
  • Status, assignment & notifications
  • Run history & toggles
Teams & roles

Teams & roles

Granular, field-level control over who sees what.

  • Custom roles & permissions
  • Field-level access
  • Team-based sharing

Templates

Reusable playbooks so every engagement starts right.

  • Project & task templates
  • Pre-built structures & checklists
  • One-click apply

Email integration

Turn conversations into tracked, attached work.

  • Email-to-task capture
  • Threads attached to records
  • Notifications back to inbox

Multi-currency

Quote, bill and report across borders cleanly.

  • Per-invoice currency
  • Maintained exchange rates
  • Consolidated reporting

Security

Enterprise controls underneath every module.

  • SSO & SCIM provisioning
  • Field-level permissions
  • Audit logs & recycle bin
Flows

How the whole tool flows

From the master lifecycle down to a single task, these are the connected paths that make it feel like one system.

End-to-end tool flow

The revenue lifecycle, lead to invoice, as one continuous record

1
LeadCaptured in CRM
2
DealQualified
3
ProjectDeal → project
4
TasksExecute
5
TimeLogged
6
InvoiceBilled
7
InsightReported

User flow

Sign-in to action

Sign inSSO / email
DashboardRole home
NavigatePick module
ActCreate / update

Task flow

States a task moves through

To doAssigned
In progressTime logged
ReviewQA
DoneClosed

Project flow

Won deal to billed, closed engagement

ConvertDeal → project
ScopeTemplate & plan
AssignTeam & roles
ExecuteBoards & sprints
TrackMargin
Bill & closeInvoice

CRM / deal flow

Pipeline stages & outcomes

LeadCaptured
QualifyNeeds
ProposalQuote
NegotiateTerms
✓ Won → convert to project× Lost → nurture

Invoicing flow

Logged time to paid

Log timeOn tasks
BillableRate applied
InvoiceMulti-currency
PaidReconciled
By the numbers

The data, visualized

Live figures from an Autovella workspace, the kind of insight the platform surfaces automatically.

Task status

800 tasks across the workspace
To do200
In progress200
In review200
Done200

Expenses by category

₹51.1K tracked this period
Software₹24.5K
Travel₹16.6K
Training₹3.3K
Other₹2.0K
Equipment₹1.8K
Supplies₹1.8K

Invoice cash flow

this period
₹67.6K
Invoiced
₹57.0K
Paid
₹10.6K
Outstanding
100%
of 800 hours billable
46
active projects of 100
₹103.7M
portfolio budget
₹154.3M
open pipeline
Information architecture

13+ modules, one map

A flat, predictable structure grouped by intent, so people always know where work, clients, money and people live.

Autovellaworkspace
Dashboard
Projects
Tasks
CRM
Deals
Contacts
Sprints
Calendar
Accounts
Timesheets
Expenses
Invoicing
Analytics
Automations
Security
Work & clientsFinance & people
Plan & deliver

The day-to-day work surface, all on one timeline.

DashboardProjectsTasksSprintsCalendar
Sell & relate

Pipeline and the people behind every deal.

CRMDealsContactsAccounts
Time & money

Hours and cost flowing straight into billing.

TimesheetsExpensesInvoicingAnalytics
Run & secure

The controls that keep the workspace humming.

AutomationsTemplatesTeamsSecurity
Design system

A single visual language

A focused blue palette and one type scale keep 13+ modules feeling like one product: calm, dense where it needs to be, never noisy.

Color · palette & roles
Blue Deep
Primary actions
#1E5FE0
Blue
Brand & links
#2D7FF9
Sky
Accents
#62A6FA
Teal
Positive · billable
#16B8A6
Ink
Text
#0C1A30
Sky Tint
Surfaces
#EAF2FF
Typography · Inter
Display900 · -4%
Heading800 · -2%
Body copy · 1.65 line-height400–600
₹103.7M · #1042Mono · data
Radius
Gradient
100° · #1E5FE0 → #62A6FA
Components
PrimarySecondaryBadge
Type scale
Display / Heading / Body / Mono on one Inter ramp.
Responsive

Designed for every screen

The same connected data, tailored to the device: card layouts, a bottom tab bar and touch-first controls.

Autovella mobile dashboard Autovella mobile analytics
Development story

How it was designed & built

A research-led process: understand the lifecycle, model the data once, then design a system that scales across every module, on web and mobile.

1

Research & map

Interviewed service teams, mapped the lead-to-invoice lifecycle, and located every gap between siloed tools.

2

Model the data

Designed one shared schema so CRM, delivery, time and billing reference the same records, the backbone of the product.

3

Information architecture

Grouped 13+ modules by intent (Home, CRM, Work, People, Finance) into a flat, predictable structure.

4

Design system

Built a blue, token-driven UI kit: color, type, spacing, components, so every module feels like one product.

5

Flows & prototypes

Designed and tested the core flows (deal→project, task lifecycle, time→invoice) before building.

6

Build & ship

Responsive web and mobile, role-based field-level security, automations and real-time analytics, shipped in 2026.

What it handles

Built for real, busy workspaces

A live Autovella workspace running the full lifecycle on one platform.

100
projects on one model
800
tasks tracked
₹154M
open pipeline
13+
modules, one login

Screens captured from a live Autovella workspace. Figures reflect that workspace's data and illustrate platform scale, not a specific customer outcome.

Plan. Track. Achieve.

Autovella brings the whole service-delivery lifecycle onto a single, well-designed platform, from lead to invoice. See it on your own work.

Explore features