UX patrol: disassembling the interface of the vc.ru website

Analysis of the interfaces of the site vc.ru.

In previous issues of the patrol, the following were considered: YouTube, FL.ru, VKontakte, online clothing stores, electronic mail services.

Creating an article

1. Adding items under the photo

When writing an article, I first throw in the structure: headings, a short description and a photo. Then you need to open the points and here the difficulty awaits.

If a situation arises when the image is followed by a heading or other element other than text, inserting a paragraph between them becomes a task for quick wits.

UX patrol: disassembling the interface of the vc.ru website

How to solve

For example, the Tilda interface: it becomes possible to add any element between the blocks.

UX patrol: disassembling the interface of the vc.ru website

Well, or at least when you press Enter from the “Author” field – create a new paragraph, and do not just transfer it to the next block.

2. Image replacement

It happens that you upload an image, and then you notice that the proportions are not the same, there is some kind of jamb, or you just need to replace it with something else. But it won’t be easy. There is currently no photo replacement function. Therefore, you need to either delete the block and insert it again, or use this trick:

UX patrol: disassembling the interface of the vc.ru website

How to solve

UX patrol: disassembling the interface of the vc.ru website

And add two more ways: double click on the image and through the gear. Or make another button next to “Create Gallery”.

Plus it would be cool to paste images from the clipboard via Ctrl + V. The editor of articles on VKontakte knows how, you can take a look there ๐Ÿ™‚

UX patrol: disassembling the interface of the vc.ru website
And you can also change the display there – a cool feature

3. Ctrl + Z

Now this combination only works for the entered text. The inserted blocks are not deleted by this combination, adding a background of the text or pasting via Ctrl + V is also not considered an action. This can cause the following situations:

UX patrol: disassembling the interface of the vc.ru website

The selected and pasted text is not missing. The cut did not come back. The separator also remained.

And sometimes you wrote a text somewhere at the top, then add elements or decorate the text, press Ctrl + Z, and somewhere at the top, whole pieces of text disappear. Even the transfer to another paragraph is not canceled …

Minor remarks

Moving heading levels

My article uses H2 and H3 headings. If you enter a title, then press Enter, then the controls for changing the title level will appear on a new line, but they do not work as you expect:

UX patrol: disassembling the interface of the vc.ru website

Links

The window for adding a link does not contain a control for saving. You can mistakenly click on the icon, which will simply close the window:

UX patrol: disassembling the interface of the vc.ru website
What is the โ€œBackโ€ action on this icon, if there is an arrow next to it?

For example, in Word both scenarios are processed – with Enter and with a button.

Drafts

You can write articles in the mobile application, but there is no “Drafts” section. When a thought comes and you want to add it from the application to the draft that you wrote on the computer, nothing will come of it.

Although if you open the site from a mobile device, you can edit drafts.

UX patrol: disassembling the interface of the vc.ru website

Subscriptions

1. Subscription management

In the subscription management section, you can unsubscribe or subscribe to sub-sites and companies. When you have a lot of subscriptions, the problem arises – they cannot be sorted. If, for example, you subscribe to some company, it will be at the very bottom of the list.

UX patrol: disassembling the interface of the vc.ru website

But there is a favorites feature that only appears when you open a user, company, or sub-site page.

UX patrol: disassembling the interface of the vc.ru website

It would be more convenient if this feature was available on hover for all subscriptions, and items could be sorted by priority.

2. Behavior of the subscription block when visiting pages

When you enter a user page, it appears in the subscriptions menu. It can be mistakenly assumed that auto-subscription is set for those you visit. Why show the user you just opened there? Well, at least if it was possible to subscribe from this block, but no, you can only fix it in the “Subscriptions” block, remaining unsigned.

UX patrol: disassembling the interface of the vc.ru website

And if you go to the “Companies” section, the subscriptions disappear altogether. And if you want to go to a sub-site, then go first to “Popular”, and only then select a sub-site.

UX patrol: disassembling the interface of the vc.ru website

3. Subsites

UX patrol: disassembling the interface of the vc.ru website

If we compare the number of subscribers on sub-sites, we can logically assume that a small percentage of the audience uses the subscription setting function, since everywhere the indicators are approximately equal: the maximum difference is 12 thousand users.

UX patrol: disassembling the interface of the vc.ru website

With this use of the function, is it reasonable to put such a strong emphasis on it, displaying it on all pages in the left menu, with color pictures, distracting from reading articles?

This is probably done in order to increase the popularity of sub-sites. But is this the function on which such an emphasis should be made, impairing the perception of information in articles? On the right is a live broadcast, which I have never used in three years, but at least you can hide it. On the left there are subscriptions with pictures … controversial.

Some users spoke negatively about this decision. There was also a survey and its results were 85% by 15%, where 85% were against the sidebar.

Personally, I read the general feed and sometimes visit the Design sub-site. I will not undertake to judge the rest without a metric ๐Ÿ™‚ Write your opinion in the comments.

We offer another option for displaying subscriptions, which is used in the adaptive and in the mobile application.

When scrolling down – hide the plate with sub-sites, when scrolling up – show it. It will be more pleasant to read, navigation will not deteriorate, and subscriptions are visible.

UX patrol: disassembling the interface of the vc.ru website

Trivia and suggestions

1. Profile

Sometimes you want to know what kind of person left a comment, where he works, what he does (where the hater lives), what interests he has, and so on. But in the profile, we usually see this:

UX patrol: disassembling the interface of the vc.ru website
Sometimes there is a link to the social network

In no case do I urge you to oblige users to fill out information, but it would be cool to give the opportunity to indicate, for example, the company in which they work, their position and contacts for communication.

2. Number of views

I donโ€™t know for what reasons the number of views of the material in the general list is not displayed, but this is not critical. But when you want to compare the indicators of your own articles, but you cannot do this from the profile, it is frustrating. You have to open all the articles in separate tabs and look inside.

UX patrol: disassembling the interface of the vc.ru website

It’s easy to add:

UX patrol: disassembling the interface of the vc.ru website
Location is inherited from the detail page of the article

3. Search

If a colon is used in the title of an article, it won’t work.

UX patrol: disassembling the interface of the vc.ru website

4. Demonstration of the article

When an article is in the “Draft” status, the author may have a need to let someone read it, for errors, typos and other things that the blurry eye no longer notices.

It would be very cool to do like on YouTube: “Access only by link”, in order to throw an article to colleagues before publishing. And if you then add the ability to leave comments to fragments of text, there will be fire ๐Ÿ™‚

UX patrol: disassembling the interface of the vc.ru website

Yes, someone prudently writes the text of the article first in Word, but we have so many layouts, gifs and other things that it’s easier to immediately collect everything here and watch the composition, change the structure to make it easier to perceive, and so on.

5. Layout

If you press “Enter” at the beginning of a paragraph, the following happens:

UX patrol: disassembling the interface of the vc.ru website

Neither here nor there ๐Ÿ™‚

Half a line appeared, it is not clear what to do with it. You press another Enter – then you seem to see a line, click on it, delete the extra one, and some kind of incomprehensible hole remains from it)

6. Completion of the article

UX patrol: disassembling the interface of the vc.ru website

Yes, if there is a text paragraph, you can put the cursor at the end and press Enter, but this is inconvenient when you are no longer working with that paragraph. You just want to insert trailing text or a separator, but you can’t do it on click or hover. You have to suffer.

The reference from Tilda is still valid. Well, on ux.pub everything is ok with this)

UX patrol: disassembling the interface of the vc.ru website

Dark theme

UX patrol: disassembling the interface of the vc.ru website

We drew a dark theme for desktop and mobile. In the mobile application, we were slightly ahead of us, and for the desktop, the layouts were sent to the developers)


This is how the vc.ru interface patrol turned out. Write what is inconvenient for you and suggest resources for future releases.

Amenities for everyone ๐Ÿ™‚

uxart.ru

Author: Clark Douglas

Leave a Reply

Your email address will not be published. Required fields are marked *