Skip to main content

Like system

Features for the Like-Dislike System on PrivateAI Platform

General Features:

  • Universal Rating System: All users can rate any open-sourced article.
  • Permission-Based Rating: Access-restricted articles can only be rated by users with appropriate permissions.
  • Single Rating per User: Users can like or dislike an article only once.
  • Real-Time Counters: Like and dislike counters are updated instantly upon user actions.
  • Flexible Action Control: Users can cancel their like or dislike at any time by clicking the respective button again.
  • Vote Adjustment: Users can switch their rating from like to dislike or vice versa, transferring the vote accordingly.

Display Features:

  • Visibility: Like and dislike counters are displayed prominently on the File Structure and Knowledge Base pages.
  • Highlighting Top and Bottom Performers: Articles are highlighted based on their ratings:
    • Green Highlight: When likes exceed dislikes by 5 times and both exceed 20.
    • Red Highlight: When dislikes exceed likes by 5 times and both exceed 20.

Wireframes

1. File structure page

The title “Article community review” and related buttons were added. The button logic and the principles of like accrual is mentioned above. The button state table is presented below.

2. Knowledge base page

Only displaying the likes and dislikes was added. These icons are clickable, their logic is the same as stated for File structure page buttons. The examples of highlighting the best rated and worst rated articles are shown as well.

In case a user has already liked or disliked the article, the corresponding icon is filled.

Button states table

Common articleMost-liked articleMost-disliked article
A user has no access to the article

- buttons are inactive

- buttons are inactive

- like button is outlined with green color

- buttons are inactive

- dislike button is outlined with red color

A user did not make rates of this article before

- button are active

- button are not highlighted

- buttons are active

- button are not highlighted

- like button is filled with green color

buttons are active

- button are not highlighted

- dislike button is filled with red color

A user liked the article

- button are active

- like button is highlighted

- buttons are active

- like button is highlighted

- like button is filled with green color

- like icon is filled with green color

- buttons are active

- like button is highlighted

- dislike button is filled with red color

- like icon is filled with gray color

A user disliked the article

- button are active

- dislike button is highlighted

- buttons are active

- dislike button is highlighted

- like button is filled with green color

- dislike icon is filled with gray color

- buttons are active

- dislike button is highlighted

- dislike button is filled with red color

- dislike icon is filled with red color