skip to Main Content

The information portal for National Police of Ukraine

We create a portal with an optimal structure for a large amount of content, and 24 separate regional sites with combined management

The Evergreen team has developed a new format for the information portal of the National Police of Ukraine. We’d already had experience of interaction with the state service of Ukraine and The European Union Advisory Mission. However, this project took a special place in our portfolio, since we had to take into account a number of difficult technical issues:

Complex architecture
Huge amunt of content
Desining 24 separate regional websites

Client & Customer

In addition to technical difficulties, there was an administrative implication in this project: the client isn’t the customer. Therefore, for getting approval, dozens of authorizing signatures from different instances of both parties were required.

Client : public service, National Police of Ukraine.
Requirements:  to create an appealing and intuitive website – the information portal of the National Police and all its regional offices.
Customer, and the sponsor at the same time: The European Union Advisory Mission (EUAM).
Main objective of EUAM: to support the improvement of the civil security sector as a whole, including National Police.
Source of funding: EUAM from the EU budget.

The aim and objectives of the project

Project Goals

Create a website
Police
Create a website

Create a website of the National Police of Ukraine. Make it easy-to-use and consistent

Police

Create a website of the National Police of Ukraine. Make it easy-to-use and consistent

Enhance the image and perception of the police

Tasks

1
1

Solve all technical problems and inconveniences represented on the old website:
migrate from Oracle to a more straightforward solution:

  • change the website administration software from an existing desktop client to a web platform (CMS);
  • provide the ability to add news quickly;
  • develop an adaptive version of the portal and all regional sites.
2
2

Configurate the website sections for

  • better search results;
  • convenient and clear navigation.
3
3

Think over the new design according to the brand book of the New Police and its needs

4
4

Provide the possibility of filling websites with the following types of media content:

  • youtube video;
  • visuals;
  • live broadcasts;
  • news feed;
  • blog with a significant number of articles.

Evergreen Solution: creating a website creating a website that is readable and convenient for all users

Functional and mobile website. 24 sites with one admin panel

For the convenience of employees of the National Police of Ukraine, we changed the site administration software to an easy-to-use CMS. It is great for websites with large masses of information. CMS connects regional sites to the main one (npu.gov.ua). Furthermore, we have replaced the Oracle database management system (DBMS) with MySQL, which is manageable to use.

NPU home page

We created a basic model of regional websites, from which each following regional site is inherited. Also, placed regional sites were replaced on subdomains, for example, hk.npu.gov.ua (Kharkiv region). Within the framework of the created system, the portal administrator can create a new site, select a regional administrator and content managers. The platform alters the scope of activities of local managers and regulates their rights. Each administrator sees and manages only own site and can adjust the content of the site of any area from a basic admin panel. The new website is created from the admin panel with a few mouse clicks.

All websites are available in Ukrainian, Russian, and English.

NPU infographics

All regional versions of the National Police of Ukraine website have the same design and structure, but different content. For the operational content of the site from the scene of an accident, we created an autonomous mobile version. Employees of the press services of different areas have the opportunity to sign in the administrative panel from a mobile phone and quickly update the information. News can be exported promptly from word format and converted in the editor to HTML or text format.

All sites in the portal are adapted to any desktop and mobile devices. This website is accessible to every user (including people with visual disability).

adaptive design
User-friendly website, simplified structure, intuitive navigation, thoughtful UX design

The old website was extremely overloaded with unnecessary categories and menu items, which made navigation extremely difficult. We changed the site structure, clarified, prioritized categories. All necessary information is now accessible in a few clicks.

NPU Heder

Outcomes:

  • 6 categories instead of 12;
  • 41 items instead of 63;
  • 3 seconds instead of 10 search time.
NPUI infographics results

Important

In the header of the main page you can find:

  • hotline;
  • quick application button;
  • regional websites’ navigation map.
NPU news

Extremely important

Application is the prime goal for many users:

  • The application button is duplicated four times;
  • Hotline – twice.

These components are repeated at the bottom of the site. Also in the footer:

  • Q&A;
  • Career;
  • Reforms.
  • detailed site map.
NPU footer
The public image of the police and the trust of Ukrainians are achieved by consistent UI

The website, designed according to the Guideline of the new police, contains the same styles, colors, and font pairs that are represented on all special marks, boards, and documents.

npu_en_8

The basis of the aesthetics of the new design is simplicity and conciseness. To improve the perception of information is used micro animation. Essential text blocks are optimized and submitted as infographics.

NPU structure

The UI architectural solution allows users to ergonomically arrange a considerable number of articles, news, photo/video materials. It efficiently merges news from 24 regions onto a news feed on the main site.
Improved news feed:

  • news categories;
  • search by date;
  • tag tips;
  • icons which indicate the presence of photo/video materials in the article.
NPU news display

Tech Stack

  • Open source CMS + multidomain modules
  • MySQL
  • NodeJS
  • Gulp

Usability Audit - Approved UX by society

The evergreen team managed to create a convenient and simple website for three categories of users:

1. Citizens of Ukraine

Residents

2. Police officers

Police

3. Press services

Press services

Each menu item has been approved and examined for acceptability by the related department. The menu and the entire site navigation has been tested by users several times; and as a result, improved.

The main tests and their results:
1

Is it easy to find a police website in another region?

Task: to find the website of the police in Vinnitsa Region. Click Search History:

Map of Ukraine

dotmdpi

Link “regional websites” in the right corner of the header

dotmdpi

Menu item “Contacts”

dotmdpi

Search

Any of these options leads to the desired link.

Conclusion: problems in finding the site of another area were not detected.

Test 1
two

Is it clear how to complain about a policeman service?

Task: “Do you want to complain of a policeman by writing a claim directly on the website. Your steps …”

The result: according to the number of clicks in the open menu, the “request” column was moved to the left side of the screen, since the menu items were replaced from left to right. This item is critical, therefore, it has priority in the location.

Test 2
3

How to return to the main police website?

Task: to go from the regional to the main police site.

Conclusion: no difficulty found.

Test 3
Is it possible to blow any progress UX developers achieved by clumsily adding content?

P.S. After the project was handed over, a member of the press service, who did not have the skill of working with the new website, posted the information in the form with the previous parameters. The result – the design of the site was disordered, and its functioning was hampered. The Evergreen team conducted briefings and training about the page content filling with the press staff. Nowadays, there are some open issues, but in general, the website looks almost like designers developed it.

We provide advisory support to the press service of NPU and are satisfied that our cooperation helps to maintain and develop the website.

In the next project, we have implemented a new version of NPU website for people with visual disability.

Do you need to create a large portal or site with complex architecture? Structure of a large number of sections? Or do you want to manage a mobile site right from your phone? Write, we can and more.

29.12.2018
Рейтинг: 0 / 5 (0)
Цей сайт є українською мовою. Ви можете переключити мову у меню, або зробити це зараз.