top of page
Group 7649.png
Top of Page

Rollkall Technologies

Who is Rollkall and who do we serve?

RollKall is a SaaS company that offers an online job scheduling platform which  makes it easy for law enforcement agencies to fulfill the off-duty needs of their community and businesses in an efficient and transparent way.

Features that the RollKall platform offers our users

  • Off-duty job scheduling

  • Streamline invoice management

  • Electronic payment processing and more

Project Overview

Project Title: RollKall Portal for Officers

The RollKall Portal for Officers is a brand-new RollKall product, which allows officers to browse, apply, clock in and out, and get paid for off duty jobs through an interface with high scalability. I want to take you through each stage of my design process that I used to created the RollKall Portal for officers.


I assumed the following roles designing this project:

  • User Experience (UX) Designer

  • User Exeprience (UX) Researcher

  • User Interface (UI) Designer


UX/UI Design:

  • User surveys and one-on-one interviews

  • Personas

  • User journeys and task flows

  • Site map

  • Low-fidelity wireframes

  • High-fidelity mockups and prototypes

  • Design system and UI kit

  • Usability tests and findings



  • Figma

  • Jira

  • Miro

  • Dribbble

  • Octopus



  • RollKall hasn't been able to onboard some LEA's due to not offering a full desktop experience for officers.

  • There is not a solid monetization plan in place for our current and future projects

  • Investors will withhold  funding if Rollkall doesn't generate more profits.

Proposed Solutions

  • Provide an officer interface that gives the same capabilities and user experience as the mobile app, with full desktop scalability.

  • Rollkall has to create a pricing plan that is low-cost, low-risk, and profitable annually. We can start generating annual revenue that will reassure our investors if we are able to develop products that meet the demands of LEA users, provide a better experience than our leading competitors, and are priced so competitively that our potential customers can't refuse our services.

Research Phase

There have been a few brief discussions in the past about creating a desktop version of the mobile app, however, there were no compelling reasons to actually build it. So why is this discussion being brought up again and given emphasis now?

Structuring a research plan

To get more information about this project I created a list of whom I needed insights from and then I scheduled one on one interviews to highlight the main points.

Points of Contact

  • RollKall Senior Leadership team

  • RollKall Marketing Team

  • RollKall Sales Team

  • RollKall Director of Engineering

  • Multiple Law Enforcement Agencies


Honolulu police department is currently using one of RollKall’s competitors to manage their off duty job scheduling; however Honolulu’s contract with their off duty job scheduling provider is ending March 2024. Throughout 2023, RollKall has been negotiating with Honolulu with the goal in mind to have Honolulu onboard with RollKall as their new service provider and not to re-sign with our competitor. RollKall was successful in establishing an unofficial agreement with Honolulu, however it was required that we provide a full desktop experience for officers in order to close the deal. RollKall currently offers the mobile app for officers but not a desktop version.

Group 9.png

My research led me to the conclusion that RollKall has a greater issue than just the narrow window of time we had to accomplish what we had promised to Honolulu. RollKall has a track record of not being able to construct lucrative contracts with LEAs. These poor contracts have put us in a precarious financial position.

Ideation Phase

Desmond Tutu once wisely said that “there is only one way to eat an elephant: a bite at a time.”

It was very clear to me what was needed from RollKall in regards to Honolulu, but there was a bigger issue that needed to be resolved internally. I had to cover every angle from each of my points of contact in my brainstorming.

Bite #1: LEA's

Group 12.png

I made a persona to make sure my designs suited the needs of the intended users. It was essential that I understand the mindsets and behaviors of those who will be  using this officer portal.

Bite #2: Marketing

Although the RollKall marketing team thought it would be good to improve the new portal's appearance, they are worried that I will stray too much from the RollKall branding  guidelines.

In order to maintain RollKall branding guidelines and deliver an updated aesthetic that also matched the other RollKall products, I have a RollKall design library that will ensure product consistency.

RollKall Design Library

Group 16.png
Group 13.png

Bite #3: Sales

We would be closer to achieving yearly profits, in my opinion, if we stopped providing any of our services for free and switched to a tiered pricing structure.

I planned on initiating conversations with SLT about exploring different pricing methods such as offering prospective customers a free trial together with a restricted amount of features per subscription plan which may help customers discover how much they're missing and upgrade to the highest tier package.

Tiered Pricing Model

Group 18.png
Group 17.png

Bite #4: Engineering

We needed to get a realistic estimate of the amount of work this project would require in order to meet the deadline. The engineering team and the project manager collaborated to create and refine Jira stories. The information was shared with the vice president of engineering and he considered the possibility of recruiting external engineers to ensure sure we had the resources to finish this job on time.

Jira Stories and Pointing

Bite #5: Senior Ledadership

Group 23.png
Group 20.png

The ultimate objective is to increase the company's profitability and carry on its market expansion. In order to achieve this, there has to be an internal paradigm shift on the way that we think about conducting business going forward. This new mentality has to start with the president of the company and work it's way down to all employees. 

"Teamwork makes the dream work"

image 3.png

Prototype Phase

Visualizing a User Centric Experience

I was now ready to start designing the wireframes but first I created a site map to visually display all the pages and architecture of the portal. I also used this sitemap to arrange my figma files to ensure that I covered all the areas in my design and left to gaps.

Site Map

Group 15_edited.png

Wireframe Process

Bootstrap Layouts

Group 234.png

Rollkall Products References

Group 233.png

Design Inspirations

Group 235.png

Low-Fidelity to Mid-Fidelity Mockups

Group 283.png
  • I first began by selecting the bootstrap grid layouts that would support mobile, tablet and desktop designs.

  • While creating my wireframes, I referenced back to both the mobile app and agency portal to ensure that I was maintaining visual consistency.

  • I gathered screenshots from sources like Behance and Pintrest to gain ideas for the possible look of this new portal.

  • Until I reached a point where I was satisfied with the design, I kept going through the cycle of trying out several mid-fidelity designs and then getting feedback from both product and engineering.


Testing & Iterating Cycle

I went through a tedious cycle of user testing with officers and receiving feedback from product and engineering members in order to arrive to my final designs. Below I have listed a few of the many critiques that I received and how I was able to address them.

Page Layout Responsiveness

  • While I was drafting my page layouts, I received feedback that I should be mindful of how my elements would behave as the screen sizes changed.

  • I modified my layout so that I could avoid any responsiveness issues as more elements were being added.

Find Jobs Page Iterations

  • Removed the search bar on the "find jobs" page because we don't display job numbers in the jobs list. Users wouldn't know what to search for.

  • Deleted the filter sidebar and added buttons that, when clicked, opened a modal. Officers requested to view more jobs during their browsing, and I was able to free up more space by deleting the side filter.

  • In order to maintain consistency with other pages that used tabs, I removed the breadcrumbs and changed them to center aligned page tabs.

  • To save more space on the job line items, I included text wrapping on the location and job date columns.


Notification Center Behavior

  • When the notification center was originally designed, it would drop down from beneath the navigation bar when activated, but one of my testers thought that behavior was unusual.

  • I analyzed a few more websites' examples, concentrating on the behavior of the navigation centers, and then I changed my design to reflect the typical user experience. The navigation center now drops down from the top, over laying the entire screen.

Final UI Designs

LEA Follow up

When my refining process came to a close, I set up a last interview with Honolulu to check for any design flaws and to make sure the user experience was satisfactory. Honolulu was very pleased with the design and stated that it accomplished everything that they were looking for.

SLT Follow up

Following up with Honolulu, I set up a demo of the new the portal with SLT, who was thrilled to hear that Honolulu was pleased with the project and who also thought it was fantastic.

Group 497.png

Project Conclusion

With a tight deadline to meet the developers and I worked really hard under the pressure. I had a great time working with the product and engineering teams; it improved my design skills and produced a memorable experience that we can all remember.

This project is just one of the many components that will change the way our business is carried out going forward. Aside from my project, RollKall has employed a chief revenue officer, who is now focusing on developing new strategies for closing new deals and developing a new pricing structure to make money from all of our services.

By leveraging the current market and expanding the business, all of our RollKall departments will continue to work together. Our goal is to guarantee investors that Rollkall was a wise investment and that they would look back on it with pride.

Untitled_Artwork 45.jpg

Next Steps

  • Sprint planning and development / design iterating

  • Quality assurance testing  /  design iterating

  • Project deployment

What I learned

  • New strategies to complete work within tight deadlines

  • Expanded my knowledge on selling products and various pricing modals

Want to get in touch? Let's connect!

Thanks for submitting!

bottom of page