top of page

Tablet and mobile are still on the way, I’m designing for you night and day!

Sorry 😔

Device Management Module 2.0

This case study details the redesign of WinWorker's mobile device management module, aimed at modernizing the interface and improving functionality for craftsmen and tradespeople.

Agenda

User Flow Insight

A definitive, simplified version of the original, designed to showcase the tasks within the usability studies.

Project Outline

Overview of the project objectives, methodologies, and outcomes to establish the purpose and scope.

Project Recap

Reflective analysis of the challenges encountered, lessons learned, and areas identified for enhancement.

Research Methods

Examination of the methodologies and data analysis techniques used to gather and interpret user insights.

Project Outline

  • ​My Position
  • Outcome
  • UX-Roadmap
  • Secondary research
  • Primary research

My Position

The WinWorker mobile app comprises many modules that have remained unchanged since their initial implementation. As a UI/UX designer, I undertook the redesign of the mobile device management module, analyzing user data, collaborating with team members, and conducting usability studies to develop an effective solution.

Outcome

The redesigned module is visually appealing and significantly streamlines the user journey, making it more intuitive and efficient. Key pain points were addressed, and user feedback was incorporated to create a cohesive and engaging interface. Multiple high-fidelity user flows now guide users through various tasks.

UX-Roadmap

The design process for the device management module was guided by a structured UX roadmap, ensuring the final design meets user needs. Continuous research and analysis were integral, progressing from low-fidelity prototypes to the final MVP prototype.

Secondary research

  • Analyzed module functionalities and structure comprehensively.

  • Evaluated customer feedback from the support team, prioritizing key issues.

  • Analyzed user interaction statistics to assess engagement with module features and interface elements.

  • Collaborated with developers for insights into module design and potential implementation strategies.

Primary research

  • Conducted usability testing on early lo-fi prototypes to identify areas for improvement.

  • Collaborated with quality assurance to do a multivariate testing (MVT) and iterate on multiple screen designs, gathering valuable feedback to inform design decisions.

  • Performed additional usability studies to validate design decisions and refine the interface.

User Flow Insight

  • Reserve/Borrow
  • Return/Rebook
  • Filter Settings
  • NFC & Barcode Scan
  • Device Data Profile
  • ​Viewport Difference

Reserve/Borrow

The user selects a device to reserve or borrow, customizes the allocation, and views the updated information. The device is then added to their personal list. Upon opening the module, the user is directed to a filtered device list showing only available devices, with an option to view 'not available' devices. If the personal list is empty, it remains hidden.

User Flow 1

Multi Reserve/Borrow

The user selects multiple devices by pressing and holding to mark them. A reserve and borrow button appears. After defining the allocation, the devices are added to the dynamically updated personal list. Subsequent multiple selections can be made with a single tap. Lists default to alphabetical sorting.

User Flow 2

Return/Rebook

The user accesses their personal list, selects a device, and chooses to return or rebook it. If returned, the device is removed from the list. If rebooked, the user reallocates it to another user or project. Ludwig Haverkate navigates the system.

User Flow 3

Multi Return/Rebook

The user selects multiple devices from their personal list by pressing and holding. Marked devices prompt return and rebooking actions. The user defines the allocation before confirmation, and the devices are removed from the list. Multiple selections ensure rebooking sets the status to borrowed. Users cannot return or rebook devices without the necessary rights.

User Flow 4

Filter Settings

The user navigates device, project, and employee lists, filtering with radio buttons, dropdowns, chips, and search bars. Filters reset upon closing the Device Management Module, but the initial selection remains fixed for subsequent filtering. Active chips can be closed by tapping them.

User Flow 5

NFC & Barcode Scan

The user accesses NFC and Barcode Scan options from the burger menu in the top app bar of the device list. They select the appropriate option to scan the barcode or use NFC, opening the device profile. If the action is initiated with a preselected device, the new device is automatically chosen instead of opening the selected device profile.

User Flow 6

Device Data Profile

The user manages device details in the device profile, including reassigning them to projects or team members with permissions. Devices in sets offer additional features. Blue interactive tables aid navigation, while grey tables are for data entry and modification.

User Flow 7

​Viewport Difference

The user flow demonstrates the module's adaptive interface across different screen sizes. To ensure a consistent display, set the zoom level to 75%. The initial prototype screens are designed for an iPhone 13 Mini with a 5.4-inch display and a resolution of 1080px × 2340px (375px × 812px).

User Flow 0

Research Methods

  • Multivariate Testing
  • Usability Study Plan
  • Excel Data Analysis

Multivariate Testing

  • Created design variations in Adobe XD for key screens, such as the device and personal list.

  • Developed a structured survey in Google Forms to gather user preferences.

  • Distributed the survey to our QA team and selected users.

  • Analyzed responses to identify preferred design elements.

  • Integrated these popular elements into the high-fidelity prototype for the final usability study.

card component b_4

card component e_1

Usability Study Plan

I developed usability study plans to conduct two remote unmoderated usability tests. The first round guided the design from low-fidelity to high-fidelity prototypes, while the second round identified areas for refinement. The study plans included evaluation goals, research questions, and key performance indicators (KPIs) such as time on task, user error rates, and system usability scale (SUS) scores. Participants received a brief introduction to the script and were then asked to complete tasks independently, following detailed prompts.

Excel Data Analysis

Excel was used to organize and interpret findings. Data from key performance indicators (KPIs) was coded and categorized, then analyzed with pivot tables to identify patterns and themes. This streamlined the analysis process, enabling efficient extraction of actionable insights.

Project Recap

  • Challenges
  • ​Forward Plans

Challenges

Throughout the redesign process, I encountered several significant challenges. Balancing a comprehensive feature set with a user-friendly interface required careful planning and iterative testing. Integrating new functionalities without overwhelming users was crucial. Additionally, technical constraints related to the legacy system architecture necessitated close collaboration with the development team to find viable solutions.

Forward Plans

WinWorker plans to enhance its software suite by redesigning other modules and providing craftsmen and tradespeople with comprehensive and user-friendly solutions. Insights from the mobile device management module redesign will be applied to ensure a cohesive user experience across the platform

Start Over

Case Study 2

bottom of page