Project Goal


This case study covers two interconnected projects: Cramer Connect, a mobile app, and Cramer Fleet, a web based platform that mirrors the app while offering additional features. Both products are continuously active and evolving. The primary objective was to deliver ongoing visual and UX improvements, while expanding the ecosystem by integrating new connected products and their full range of functionalities into both applications.

Project Overview

This case study covers two interconnected projects:

• Cramer Connect - A mobile app for connecting, controlling, and managing Cramer's smart products.
• Cramer Fleet – A web based platform that mirrors the mobile app’s functionality and adds fleet specific features.

Both products are continuously evolving. My role was to:

• Deliver ongoing UX and visual improvements.
• Add new connected products and their full functionality to both applications.


‍

1. Cramer Connect (Mobile App)

Goal

Provide users with a seamless way to connect and manage products such as robotic mowers, zero turn vehicles, and other smart devices.
 Users can:

• Control devices, adjust settings, and send commands.
• Track location, view errors, and monitor status.
• Add and manage multiple connected products.

My Approach

• Align with product owners on requirements, from small UI tweaks to entirely new product integrations.
• Assess the current app state before starting design work.
• Collaborate with engineering and IoT teams to understand technical constraints.
• Explore design concepts and validate ideas with stakeholders.
• Deliver final, approved designs with all components, assets, and interaction specifications for development.

Design Decisions

• Brand alignment – Follow Cramer’s brand guidelines for visual consistency.
• Modernize UI – Replace outdated visuals with a fresh, user friendly design.
• Consistency – Standardize layouts across product types.
• Clarity – Maintain clean, intuitive screens despite large data sets.

Key Challenges

• Designing for very different product types while keeping UI consistent.
• Balancing product owner requests for maximum data visibility with the need for clean, simple interfaces.
• Understanding each product’s functionality in depth to design effectively.

‍

‍

2. Cramer Fleet (Web Application)

Goal

Offer the same connected product management features as Cramer Connect, plus advanced fleet management tools.

Additional Features

• Map overview – See all products’ location and status at once.
• Fleet commands – Send actions (mow, park, pause, etc.) to multiple devices.
• Search & filter – Quickly find products by name or status.
• Product groups – Organize devices for easier management.
• Employee management – Add team members and assign roles.
• Maintenance tasks – Create, assign, and track service jobs.

My Approach

• Apply the same collaborative process as with the mobile app.
• Adapt mobile designs for a larger screen without losing usability.
• Maintain visual and functional consistency with the mobile experience.

Design Decisions

• UI translation – Transform mobile layouts into efficient web interfaces.
• Consistency – Keep visual patterns similar to the app to reduce learning time for users.

Key Challenges

• Scaling mobile designs to desktop while adding new features.
• Coordinating across global teams: developers in China, product owners in the US, and engineers in Europe.

‍

3. Connected Ecosystem

When the Cramer Connect app is linked to Cramer Fleet, additional features become available:

• Map based product overview with real time location and status.
• Maintenance task creation and tracking.
• Filtering and searching products by name or status.