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.
How to solve
For example, the Tilda interface: it becomes possible to add any element between the blocks.
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:
How to solve
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 🙂
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:
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:
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:
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.
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.
But there is a favorites feature that only appears when you open a user, company, or sub-site page.
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.
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.
3. Subsites
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.
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.
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:
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.
It s easy to add:
3. Search
If a colon is used in the title of an article, it won t work.
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 🙂
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:
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
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)
Dark theme
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