Redesign of russian president's website
Alex Bakalov
UX/UI designer
Hello, my name is Alexander Bakalov. In this case, I want to tell you in details about concept of redesign the website of the President of Russia

About the project
This project is a redesign of the website of the presidential Administration of Russia. In this site you can find official information about the President's visits, articles. But also here you can find laws signed by the President and decrees. Those who want to write a letter to the president Administration can also do this.

One day, I was reading a news article, I visited in the site kremlin.ru for the first time. After I immediately started to research this site from the UX point of view. After walking around the site for about 10-15 minutes, I found several places that could be improved and forgot about this site.

But recently I came across a design case on Behance where a person was redesigning the website of one of the leading US news agencies. After that, I remembered my visit to the website of the President of the Russian Federation and decided to design its interface and logic in my free time, which eventually led to the writing of this case.
Audience
Detailed portrait of target audience allows you to create an interface for the site that is most convenient for a particular user
Federal and regional statesmen
They look for for legal acts about their area of responsibility
Pain: it is difficult to find the necessary legal act (signed law, presidential decree, presidential instruction). To get information about the release of a new document in the field of interest. They have to go to the site every time

Need: quickly get all the necessary information in one place, have a simple and intuitive interface to search for the necessary documentation. Keep up to date with all updates to the legal basis in a particular area.

How do we solve this need? We create a simple and clear filter that allows you to quickly find a document by keyword, specific area of government activity, responsible person, etc. We allow you to enable notifications on email or messengers about new documents that appear in this filter. You can also change or further configure notifications in the personal account.
Journalists of federal TV channels and magazines
They look for information in the original source
Pain: it is too late to receive information about any news on the Kremlin's website, since it is not possible to enable notifications about the release of news that is related to any area of the state's life. Because of this, the journalist is late with the release of material on any news. There is no convenient filter that allows you to find photos and videos in the news.

Need: to get news quickly thanks to notifications on email or messengers. It is very important to have opportunity to set up notifications about news output in a messenger or email, as well as to segment news on the necessary topics (so that they only get notifications about the areas of news that the journalist needs).

How do we solve this need? We create a simple and intuitive search filter that allows you to search by keyword and by area of news. An additional filter allows you to search only for content containing video, audio, or text. This makes it easier for a journalist to search for needed information. You can also change or further configure notifications in the personal account.
Russian sitizens
They want to write a request to the President or the presidential Administration
Pain: now it is very difficult to find a section on the site where they can send a letter. For an inexperienced person, the searching may take a long time.

Need: write a letter to the presidential administration quickly, without a long search for the necessary section. They want to have opportunity to attach all the necessary documents to the email, as well as follow the reaction to their request in the profile and receive notifications about answers.

How we solve this need? We bring the "write a letter" item to the main menu, which will immediately help you find this section. When writing a message, we give the person the opportunity to enable notifications about the answer by email or in messengers. All emails and responses to them are stored in the personal account. You can also configure notifications in your personal account.
Main tasks of the website
The main task for journalists and statemen is the most important to quickly find the necessary information using a convenient filter. For this I added opportunity to search by keyword and select the responsible person (subject), the sphere of state activity, dates, and many other functions.

In addition to searching for current information, it is also very important to notify a person about published news or documents on the site. For performing this function, I added the option to save the filter and set up notifications about new content that will match the filter settings. A person will be able to receive notifications by email and in any of the 5 messengers and social networks. When setting up notifications for a person, a personal account is automatically created using their email or a person simply logs by messenger. In the personal account person has opportunity to change filter and configure notifications.


For those who sent a letter to the President, it is very important to promptly notify them of the receipt of a answer to the letter. For this, at the end of writing the letter, the person is asked about choosing a method for receiving notifications, as well as create a personal account. In the personal account, a person can see all emails sent from this account, as well as answers to them. Notifications are received not only in the dashboard itself, but also on email or the selected messenger.
Fonts and colors
Added elements of the website
Corners in the design. I decided to refuse the angular design of the current presidential website and make the edges slightly rounded.

I chose a radius of rounding equal to 7:
This radius looks good on large elements and very small parts.
Arrows to go to the main news post. On the main page, I decided not to make standard buttons that show you need to click on it to open the news. I decided to make this kind of arrows:
This kind of arrows are emphasized in color, so they also create a vertical rhythm on this page and add the symmetry
The profile window. When a person is logged in, he can go to their profile settings and configure filters, notifications, or view information about emails to the president Administrations. For this, first click on the icon in the upper-right corner. For convenience, clicking opens a modal window where a person can choose where he wants to go: to the profile settings, to the page with filters and emails, or to log out of the account.
Icons for photos, videos, and text when searching for information. For convenience of searching for information, each entry shows media materials that are contained inside: text, photos, or videos. This will help journalists a lot.
Site menu. If you analyze the menu on the current site, you will find many secondary items that are placed in the main menu:
1. The first mistake on the current site. The "events" and "videos and photos" sections are separated, although the photos and videos are in any case related to a news item:
So I decided to create a single section "news" where I combined photos, videos, and information on all news events.
2. The Second mistake – the secondary section "structure" for some reason is on the main menu, although this section is not as popular as all the others.
In my redesign, I suggest to move the item "structure" to the "Contacts" section, since it is the most logical place to show the structure of the presidential Administration.
The main solutions
1. Easy content filtering
One of the mail goals why I decided to redesign the website of the President of the Russian Federation is to create a convenient and understandable search filter with the feature to subscribe to updates of this filter. So, let's start in order.

A person wants to find some material and goes through the item on the main menu to the item "Search":
He sees all the latest news on the site, including documents and regular events.

In the "Select category" section, the "All" item is highlighted:
In the front are the most frequent search items: a string for entering keywords, as well as the feature to select a category for search: "News", "Documents", "Instructions" or "All":
These items are demand, so they are always in a visible place. However, if a person wants to create a more detaled filter, then he can always click on the filter icon on the left to open additional search parameters.

Thanks to its size and contrasting dark blue color, this element has a good visulal weight on this page. Due to unprepared person can easy to notice it.
When you click on the icon, the filter opens:
The content and the search bar are slightly shifted to the right:
When you open the detaled filter, by default, only the sorting card for search results by date is visible, since this is one of the most popular functions used when searching for content:
Second after sorting is a filter with a selection of selection dates. Because very often when searching for archived records, a person knows the approximate interval of news output.
The third is a filter that helps you choose the subject of the publication. This is also one of the most popular filters that allows you to find a record about any area of society. You can coose topic, like "foreign policy", "parliament" and ect.
In this case, a person can use the "or" parameter by selecting several topics at once.
The fourth is a filter that allows you to show only those results that contain certain media files: text, photos, or videos. In this case a person can choose several items at once:
The fifth and sixth filters allow you to select the document number or responsible person (subject):
Two last filters are only available when you select the "all ", "instructions" and "documents" search category:
When you open the filter and select the "news" search item, such filters are not needed. Filter by search time in the "news" section":
However, when you select the search category "documents" or "instructions", these items appear in the filter again.

Filter during the search in the "Documents" section":
After selecting all the filter items, the person has a choice:

  • just see the search results - click on "Apply filter".
In this case, you will just see the search results for the filter. This result is ideal if you need to find some information once.

  • Or you can see the search results, but you subscribe to notifications about updates in this filter, click "Subscribe to this filter".
In this case, you will receive notifications about new things that match the parameters of this filter. Notifications can be sent by email or in one of the messengers.
So, you decided to subscribe to filter notifications after all. To do this, you need to:

1. Set filter parameters and click the "Subscribe to this filter" button at the end:
2. Then you will see a modal window where you will need to enter the name of this filter:
3. After entering the name and clicking "next", you will need to select the place where you want to receive notifications. This can be email address or one of the messengers:
4. After selecting the place to receive notifications, you log in the service selected for receiving notifications.

In the case of email, you confirm it an email sent to your email address:
If you choose one of the messengers or social networks, then you simply log in thanks to the messenger:
5. After confirmation, the page is updated and the filter looks like this:
6. Person can quickly switch between filters that have already been created. This can be useful if you have different filters for different topics:
7. If Person want to create a new filter and he is authorized he wants to use the option to add new filter by the click on the "add" button:
8. When you click on the "Add" button, above on of settings for filter selection appears, the detailed filter:
The filter is getting wider, just like when you create a filter from scratch.

When you save a new filter, it also appears in this block after the page is updated:
3. Creating of personal account

Your personal account allows you to manage filters and get information about sent emails to the presidential Administration in one place. Your personal account is created automatically when you save the filter and subscribe to its notifications. This makes it much easier to manage subscriptions from the dashboard and allows the person to do so if necessary:

  • To change the filter parameters
  • Edit the place of notifications (for example, choose Telegram instead of email)
  • Remove an unnecessary filter
However, in addition to automatically creating an account, a person can simply create a personal account. To do this, they need to click on this icon:
2. When you click on this icon, a modal window opens in front. And the person can coose to log in or register:
3. Personal account

To log in, you need to be logged in on the site. Then you need to click on the icon in the right corner of the site and a small modal window will open:
From this modal window, you can immediately get to the two most popular sections:
  • General settings
  • The section with the letters and created filters
You can also log out of your account. This is classic account management formula, so most people should be comfortable and familiar with it.
2.When you are on to the main page of your personal account, you can see your username, email, and phone number. If necessary, you can change them immediately and after that to click on the "Save changes":
3. If you are on the page"Notifications", you can enable or disable notifications about emails or filters:
Below a person can connect social networks and messengers to receive notifications:
4. Go to the section "Filters and emails". Here you can:

  • Change the filter name
  • Edit its settings
  • Enable or disable notifications for a separate filter in one click
  • Remove filter
These actions are indicated by icons that are subconsciously understandable for a person, which greatly saves space on the page and makes the interface more clean and pleasant.
Also in this section you can see all the letters to the President or the presidential Administration. You can also view the date when the message was sent and read the answer to the message:
5. In the section "Change password" you can change the password of your account. To do this, you need to enter the old password and repeat the new password twice.
3. Section "News"

The "news" section allows you to quickly search for news using a filter. This section has its own small differences from other sections.

In particular, this section has a publication with a photo in the search results:
The filter is also slightly different – the filter here does not have the option to select the document number or responsible person:
Self-criticism and conclusions
In this section, I will criticize my work a little. Because at a distance the project and many solutions look different
Of course, I haven't worked through every page of the section, like "write an letter" or "contacts". This was done by me specifically, because I wanted to focus on the main tasks of the site – filters, notifications, and personal account. These main functions and determine the usability of the site.

Thank you for reading my case to the end. I will be glad to receive feedback and constructive criticism! You can write feedback to the comments:
Ответьте на все вопросы, чтобы рассчитать стоимость создания сайта
Вы ответили на все вопросы. Осталось только указать телефон!
Сколько страниц должно быть на вашем сайте?
Какой тип сайта вам нужен?
Есть ли у вас фирменный цвет и корпоративные цвета?
Нужно ли мне написать тексты для сайта?
Нужно ли вам подключить CRM-систему?
Какой тип дизайна вы хотите?
Перечислите разделы (блоки), которые должны быть на вашем сайте
Нужна ли вам анимация на сайте?
Введите ваш номер телефона
Я перезвоню вам, чтобы сказать цену на сайт, а также отвечу на все ваши вопросы