• H
  • O
  • M
  • E

Patrol Desktop App

Designed a web app that streamlined and automated patrol management, improving communication between security officers and management

patrol station app mockup

Overview

Patrol Station Desktop App

Link: Xd prototype

Length: 6 weeks

Company: easy.bi

Impact

Transformed security office scheduling from manual, rigid spreadsheets to a dynamic, interactive digital system, enabling real-time updates and improved communication with security guards.

My Role

Conducted user research, developed user personas, and translated insights into intuitive UI designs and high-fidelity prototypes.

mockup of the interface design for patrol station desktop app
Patrol Station desktop software mockup

Problem

Empowering Security Teams Through Digital Transformation

Problem

The security office's manual scheduling process was inflexible, time-consuming, and lacked real-time communication with guards. This hindered operational efficiency and visibility into task completion and employee locations.

Solution

I designed a desktop app for centralized, real-time schedule management and a mobile app giving guards instant access to schedules and updates. This integrated solution streamlined scheduling, improved communication, and increased operational efficiency.

mockup of the interface design for patrol station web, tablet and app
Patrol Station multi device design

Brainstorming

Ideation and Discovery: Collaborative Brainstorming

I initiated collaborative brainstorming sessions with the company owner and my manager to define the product vision and align on market needs. We explored diverse ideas and sketched potential solutions. This process laid a strong foundation for the subsequent user research phase.

Key Activities:

• Whiteboard brainstorming sessions to generate and refine ideas

• Feature prioritization to align with user needs and business goals

patrol station brainstorming on white board
Patrol Station brainstorming on the white board
patrol station brainstorming on white board
Patrol Station brainstorming on the white board
patrol station brainstorming on white board
Patrol Station brainstorming on the white board
patrol station brainstorming on white board
Patrol Station brainstorming on the white board

Personas

Defining Key User Roles

Based on user interviews and analysis of daily schedules, I developed two primary personas to ensure that the design addressed the specific needs and goals of each user group.

Patrol Planner Nika
• Works in the security office
• Uses both desktop and mobile app
• Primarily responsible for scheduling security guards and tracking their progress

Marjan from the Upper Management
• Stakeholder
• Primarily use the desktop app
• Need a high-level overview of completed patrols for business reporting

Nika patrol planner persona
Persona 1: Patrol Planner Nika
Marjan CEO persona
Persona 2: Upper Management Marjan

Lo-fi

Translating Ideas into Tangible Concepts

Taking the insights from our brainstorming sessions, I independently translated our ideas into lo-fi prototypes, sketching out initial concepts for the desktop app.

The following day, I presented these sketches to the project manager for feedback and iteration. The flexibility of pencil sketches enabled rapid feedback and easy modifications, accelerating the design process.

Key takeaways:

• The lo-fi prototyping stage was crucial for quickly visualizing and iterating on ideas.

• The use of pencil sketches allowed for rapid feedback and easy modifications.

• Collaboration with the project manager ensured that the design direction aligned with project goals and user needs.

patrol station sketch
Patrol Station sketch for task planner
patrol station sketch
Patrol Station sketch for schedule planner
patrol station sketch
Patrol Station sketch of functionalities

Style Guide

Ensuring Consistency and Brand Recognition

I maintained consistent typography and colors across platforms, with minor adjustments for optimal readability. Created custom SVG icons and an icon font for easy implementation and customization.

Key takeaways:

• Prioritized brand consistency and visual language.
• Optimized for different screen sizes.
• Acquired new technical proficiency in icon font creation.

style tile for patrol station desktop app
Patrol Station style guide

Hi-fi

Refinement and Validation through User-Centered Iteration

I developed interactive prototypes in Adobe XD to refine the design based on feedback from cross-functional team members and target users. This iterative process ensured the final design met user needs and business goals.

User-Driven Improvement: Collapsible Sidebar was implemented to maximize screen space based on user feedback.

Collaboration with cross-functional teams was essential for ensuring the design's feasibility and alignment with technical requirements.

scheduler patrol station design
Patrol Station scheduler prototype
patrol station desktop design
Patrol Station scheduler day overview prototype
patrol station desktop design
Patrol Station scheduler prototype
patrol station desktop design
Patrol Station scheduler modal prototype
patrol station desktop design
Patrol Station scheduler modal prototype
patrol station desktop design
Patrol station scheduler folded menu prototype
patrol station desktop design
Patrol Station adding new task prototype
patrol station desktop design
Patrol Station planing new task prototype
patrol station desktop design
Patrol Station location planner prototype
patrol station desktop design
Patrol Station task planner prototype

Sitemaps

Visuals Streamlining Development

After finalizing the high-fidelity prototypes, I proactively created detailed sitemaps to visualize the navigation flow and screen hierarchy within the desktop app. This initiative, new to easy.bi, proved invaluable for the development team by:

Improving understanding: Providing a clear visual reference of the app's structure and functionality, enabling developers to grasp the design intent more easily.

Facilitating navigation: Mapping out user journeys to ensure intuitive and logical pathways throughout the application.

Enhancing collaboration: BBridging the gap between design and development, leading to a smoother development process and a more user-friendly final product.


sitemap patrol desktop app
Patrol Station site map 1
sitemap patrol desktop app
Patrol Station site map 2
sitemap patrol desktop app
Patrol Station site map 3

Conclusion

User-Centered Design for Security Teams

The Patrol Station project was a rewarding opportunity to transform a manual, inefficient process into a streamlined, digital solution that empowered both security office management and security guards.

By prioritizing user research, collaboration, and iterative design, I was able to deliver a product that addressed key pain points, improved operational efficiency, and enhanced communication within the team.

This project not only demonstrates my ability to lead the design of a complex digital solution from concept to launch but also reinforces my commitment to creating user-centered products that deliver measurable value.

mockup of the interface design for patrol station desktop app
Patrol Station desktop software

App Prototype

Interactive task planner desktop app. Click through the task planner prototype.

view prototype mcokup view prototype mockup
VIEW PROTOTYPE