Facebook of @HongKongPoliceForce · Law enforcement agency

Police App Redesign (practice)

Waisum Choy

--

While waiting for my Ironhack UX/UI Bootcamp to kick off in a week, I am trying to make my brain running after the prework. As an exercise, I have decided to redesign the app of my previous employer — the Hong Kong Police Force. For this self-initiated exercise, I will mainly focus on the app, and I am not going to include much content on political issues.

I joined the Police Force in 2012 as a Police Inspector, exactly when the app was launched. At that time, I was still in training when the instructors asked us to download the app. It was an adamant time, mentally and physically, but it is very very memorable.

The App

According to the official website, the Police launched the app in July 2012 with a view to achieving two main purposes: engaging the community and strengthening the communication with different sectors of the society. In its own app introduction, it states that the app provides people with instant, on-the-go access to the information of the Police.

Photo: https://www.police.gov.hk/offbeat/1000/eng/697.html

The app features a lot of functions:

(i) Wanted / Missing Persons;
(ii) Crime Prevention Advice;
(iii) Traffic Matters;
(iv) Notification of Public Meeting / Notification of Public Procession;
(v) Crime Statistics;
(vi) Force Vision, Common Purpose and Values;
(vii) Commissioner’s Operational Priorities;
(viii) Press Release;
(ix) Clarification / Response to Media Enquiry or Report;
(x) Recruitment;
(xi) e-Report Room;
(xii) Nearest Police Station and
(xiii) Contact Us

Let’s look at the app now. Having opened the app for the first time (after a while), I saw the following screens:

Opening screens 1–3 are the instructions as to how to operate this app. It appeared only once when I first opened the app for the first time.

Opening screen 1: Tap the menu button at the top left-hand corner to open the sliding menu. All information is included in the sliding menu.

Opening screens 2 and 3: These include two instructions: “Sliding menu will show from the left”, and “Select and view the content by sliding up and down”.

First impression…

It looks like an app with a lot of information, which may also mean it is difficult to find the information so that the app developer had to “teach” users how to use the app.

The menu button is very small, which also leads to “an instruction” to tell users to press it, and then the sliding menu will come from the left… and you can scroll the menu from top to down… which is something self-explantory…

Now it comes to the main pages of the app.

Screen 1: Opening page

Screen 2: It shows an animated banner on the top, showing all highlights relating to the Police. Under the banner, 6 favourite contents are preset on the screen, including Press Release, Clarification/Response to media Enquiry or Report, Contact us and Recruitment, etc. Users can press the “pen” button on the top right-hand corner to edit the favourite contents to be shown on this screen.

Screen 3: After one second in Screen 2, “What's New” pops out automatically, each time.

Screen 4: It shows what information, which is also all information which can be found in the sliding menu.

The Process

In redesigning, I have reminded myself of following design thinking process (without testing in this exercise).

Photo source: Google — Neurona Digital

Check app reviews

To understand the users’ needs, I have checked the app reviews in both Playstore and Apple Store:

And, these are the valuable reviews I have summarized:

Good:

  • GPS to find the nearest police station
  • Phone numbers to contact
  • Press release to get the latest information
  • Recruitment information
  • Wanted/missing persons’ info

Bad:

  • The “missions” part (i.e. Force Vision, Common Purpose and Values, and Commissioner’s Operational Priorities) are useless.
  • Enough, but useless information
  • Not being able to make a crime report online (There is actually a function to fill out an online report, but it is only for non-emergency cases. In case of urgency, always dial “999”!)

So, what’s the problem?

These are the problems I have identified:

A lot of information without a search function and proper catagorization in the sliding menu and the main page

Information is everywhere but difficult to find and use (small buttons at the corners)

The Police is a government body and in its perspective, the information is necessary as it is not just for a group of private users but for EVERYONE, i.e. all members of the public in Hong Kong and to tourists as well. Some think that this part is useless for them, some think it is a very good function. Everyone has a different purpose when they open the app.

Some Insights…

How to strike a balance between “necessary information” and “too much information”, which is actually not too much after all?

The items of selection in the sliding menu and the main page is somehow duplicated, and they also seem to be randomly placed in the sliding menu, as they are not even in alphabetical order. True, there is everything you can find, but it does look like a bunch of information without organization, which makes it also difficult to use.

The Police also use it as a platform promoting police work, defending the dignity of police officers by putting official information for the media’s interest (through the press releases), and clarifying/responding to media reports (some press houses tend to smear their reputation whatsoever… oops, no politics). Yet, they have also opened a Facebook page and IG to do the same work, which is actually more lively and dynamic. These new features shall be placed prominently in the app too.

Redesign!

In an attempt to find an equilibrium, I will redesign Screen 2 and add some new screens to categorize the information. I choose not to use a sliding menu but a better categorization for each tap. The animated banner will keep showing the highlights and most updated information.

The following information shall be grouped into a proper mother group:

Find police or the report a non-emergency case:

Nearest Police Station
e-Report Room
Contact Us

Police messages:

Press Release
Clarification / Response to Media Enquiry or Report

Police services (online application):

Notification of Public Meeting / Notification of Public Procession
Criminal record data access request
Sexual conviction record check
Personal data access request
Compliment on / complaint against police officers

Recruitment:

Recruitment (Vision, Common Purpose and Values & Commissioner’s Operational Priorities go under here)

Crime Information:

Wanted / Missing person info
Crime statistics
Crime Prevention advice

Traffic matters:

Traffic is a separate branch that is separated from the categorization.

Here are the wireframing screens of the redesign:

Prototype

Let's have a look at the simple prototype:

https://www.figma.com/proto/lRudB1fhWUwYF51bUpL9Mh/Police-app-redesign?node-id=3%3A6&viewport=2337%2C2656%2C0.31697845458984375&scaling=scale-down

Things I have learned from the exercise:

I have been looking at some tips as to how to practice with the skills I have learned. The police app I have chosen is a public app, so not just for a certain group of users. The fact is, whoever is an absolute supporter of the Police would say everything positive of the products and left five stars comments; on the contrary, everything, including the app itself and the contents, would just be seen as useless and depicted as a tool to please whoever.

It is not practicable to suit everyone’s wishes for an app like this. There are more concerns to pick the contents as a public service provider. This time I tried to strike a balance by the reorganization of information. Even though it is just an exercise, I still would like to document this entry!

--

--

Waisum Choy

Product Designer | UX/ UI Designer | Start-up | Agency