Enterprise SAAS Design

Designing a Motorpool Application for AI-Supported Development

ROLE

Solo Designer

Solo Designer

Solo Designer

Team

UX/UI Design (me)

Developer

Head of Product

YEAR

2025

2025

2025

Project description

Project description

Project description

Our client needed a simple, effective way to manage internal vehicle rentals for their employees. I designed a Geotab-integrated tool that streamlined reservations, checkouts, returns and inventory management, all delivered quickly with AI-supported development.

I worked as the sole designer on a small team, collaborating with one developer and our Head of Product. We needed to move quickly, stay within the constraints of the Geotab platform, and build a fully functional tool that would be ready for real client use.

Constraints

Constraints

Constraints

Tight timeline

We had only a few weeks to design, build, and deploy an initial version of the product.

AI-assisted development

Our developer relied on Cursor and other AI coding tools to move faster, which meant we had to be very clear with our requirements and component logic.

Geotab platform limits

We had to work within the UI and architecture of an existing Geotab application, which limited how custom our design could be as well as limited its responsivity.

Understanding Users and Workflows

Understanding Users and Workflows

Understanding Users and Workflows

We started by interviewing the client’s internal operations team. Alongside of their pre-identified requirements, we wanted identify the ideal state for a workflow where their team uses our product.

Some these key insights included:

  • Employees needed to quickly see which vehicles were available without digging through spreadsheets or email threads.

  • Most reservations were made on short notice, so users valued speed and clarity in the booking process.

  • Administrators needed visibility into current inventory and upcoming reservations, and a simple way to approve or override bookings.

  • Vehicles needed to be able to be taken out of the pool on a temporary basis when being services.

  • Driver Request Workflows

    Workflows showing how a basic user would create a new request and manage their existing requests. Annotations in yellow from client feedback.

  • Admin Request Management

    Workflows showing how an admin would handle a new request for a rental. Annotations in yellow from client feedback.

Initial Wireframes for AI

Initial Wireframes for AI

Initial Wireframes for AI

I began my design work by creating wireframes and information architecture to define how the experience should work from both the employee and administrator sides.

These wireframes were less detailed than traditional wireframes, instead they focused on content organization paired with short written specs that described component behavior in plain language.

To make the design handoff AI-friendly, I:


  • Met frequently with developers to review progress, test prototypes, and refine requirements

  • Created a shared task board mapping design elements to AI input prompts, so our developer could generate code iteratively and accurately

  • Broke flows into small, discrete screens and worked with our developer to agree on clear inputs, expected outputs, and logic

  • Annotated edge cases and conditional states (e.g., overlapping reservations or when vehicles were out of service for maintenance)

This back-and-forth made it possible to catch issues early and avoid costly rework.

Example annotated wireframe for a vehicle request form provided to developers.

Refining AI Output for Final Deliverables

Refining AI Output for Final Deliverables

Refining AI Output for Final Deliverables

Our developer took the wireframes and used cursor to implement an initial build of the product. We continuously shared these builds with the client and incorporate their feedback into design revisions. I then finalized and polished the product UI manually in Figma and documented the changes for our developer.

Leverage Early Feedback

AI development allowed us to have a working prototype of the concept far earlier than a the traditional design process allows. Instead of building a prototype in Figma, we could take the AI coded version and show it directly to the client. This allowed us to review design iterations with them to confirm requirements, gather feedback, and make adjustments before development progressed too far.

Maintain Design Consistency

I used content from the Utilimarc main design system to create finalized UI out of the initial product generated by Cursor.

Document Design Changes

With the updated designs, I provided my developer with documented colors, sizing, spacing and layouts.

Provide Responsive Guidance

Within the limitations of the Geotab native system our product would live in, I adapted the design output to perform well across a range of screen sizes.

Before of initial build cursor output (left) and after incorporating finalized design inputs (right)

Results

Results

Results

We delivered a fully functioning internal vehicle rental application on time and with less overall project budget than our previous process. The application accomplished all of the defined requirements and by continuously getting early feedback from the client on our design we were able to meet their needs at launch.

The first version is already in use by the client’s internal team, and we are actively gathering feedback to improve the experience.

This real-world use has given us valuable insight into how the app performs in daily operations. We’re currently refining the design and preparing to release a broader version for additional clients in the coming months outside of the Geotab platform while still building with AI supported development.

  • Driver Request Workflows

    Employees quickly narrow down available rental vehicles and select their rental method before selecting and renting from available pool.

  • Rental Management Flow

    Employees with existing rental reservations can view their rentals and approval status as well as manage upcoming rentals.

  • Admin Management Flow

    Admins can view utilization metrics of their vehicle pools, see upcoming reservations as well as approve and edit them.

Reflection

Reflection

Reflection

This project was a great example of how focused collaboration and AI-accelerated development can deliver fast, effective solutions under tight constraints. By staying grounded in user needs and adapting to technical limitations, we shipped a tool that solves a real operational problem and sets the stage for future improvements.

This was my first time designing for a developer using AI tools and it was a great experience to adapt my normal workflow to their needs and to see our vision come to life so quickly.

© 2025 – Gabe Vespasiano

© 2025 – Gabe Vespasiano

© 2025 – Gabe Vespasiano

  • Driver Request Workflows

    Workflows showing how a basic user would create a new request and manage their existing requests. Annotations in yellow from client feedback.

  • Admin Request Management

    Workflows showing how an admin would handle a new request for a rental. Annotations in yellow from client feedback.

  • Driver Request Workflows

    Workflows showing how a basic user would create a new request and manage their existing requests. Annotations in yellow from client feedback.

  • Admin Request Management

    Workflows showing how an admin would handle a new request for a rental. Annotations in yellow from client feedback.

Create a free website with Framer, the website builder loved by startups, designers and agencies.