Used to check for browser translation.
用于检测浏览器翻译。
ブラウザの翻訳を検出する

Blocklet Store v0.14.10: New UI and interactive experience

Pengfei Zhu
Oct 23, 2024 · edited
B
Blogs
cover


We have redesigned the Blocklet Store and reorganized the UI layout and Blocklet introduction. Check it out:

Homepage changes#

New "Explore" Page#

image.png

We will also showcase some applications on the homepage. If you know of an app or want to recommend something, let us know.

Quick classification and filtering#

image.png

  • The "All" category helps you quickly browse all Blocklets.
  • We simplified the filter criteria style, making filtering and sorting easier.
  • Larger list card, showing more content and descriptions.


  • Automatically enter the search status when entering the homepage; you can search by entering content directly.
  • When browsing the page, you can use the keyboard shortcuts Ctrl / CMD + K to focus the input box.
  • Global search input box allows you to quickly search for Blocklets globally.

Detail page changes#

Details section#

image.png

Improved navigation and highlighted areas with important information.

  1. Added a back button that allows you to quickly return to the previous page.
  2. Add shortcut buttons to facilitate users to quickly perform some portable operations.
  3. Highlight some fields that users often view.

Screenshot section#

image.png

  • Display Blocklet usage screenshots in a flat manner.
  • Button and scroll bars can quickly and easily switch between screenshots.
  • Preview UI and interaction upgrade.

image.png

Brief display introduction#

image.png

Briefly show the introduction information of Blocklet; you can click the expand button to view all the introduction content.

Evaluation section#

image.png

Here, we will briefly display the first three comments and provide some convenient operations.

  1. Write a reviews: Quickly pop up the review dialog, enter review information.
  2. See All Reviews: Quickly jump to view all comment information

Version section#

image.png

Display the latest update information, click view history button, and quickly see all update information.

Dependencies#

image.png

The list displays all dependent Blocklet and supports a series of interactive operations.

Detail information#

image.png

Expand to see more details; you can easily see all the information.

More authors' Blocklet#

image.png

Show the author's other Blocklets, and click ① View All to display more lists.

More similar category of Blocklets#

image.png

Show more Blocklets of the same type; click ① View All to display more listings.

Store of admin page changes#

image.png

We have also updated the UI of the back end to make the display of the Blocklet list more user-friendly, making it easier for you to manage back end Blocklets.

  1. Display the category list synchronously, showing all categories.
  2. The top search bar and filter options are more concise.

Performance optimization#

We have done a lot of work in improving page load speed and user interaction experience, focusing on the following key points:

  • No-refresh jump: Page jumping no longer refreshes the entire page, but only refreshes the necessary data parts, reducing unnecessary network requests, greatly improving the page response speed, and users no longer need to wait for the complete reload of the page.
  • Dynamic Loading: By loading components and modules on demand, the initial loading time is reduced, and the loading performance of the homepage is improved.
  • Dynamic rendering of search results: When users filter or sort search results, only the changed parts will be re-rendered, improving fluency.


Let's improve together: (Community-driven updates)#

  1. bounty hunter💰 fatych
  2. bounty hunter💰 fatych
  3. bounty hunter💰 fatych
  4. bounty hunter💰 fatych
  5. bounty hunter💰 fatych
  6. 月牙湖畔
  7. harumi
  8. bounty hunter💰 fatych

Help us improve#

We look forward to you enjoying a better user experience in the new version of Blocklet Store!

Finally, thank you for your attention and support. If you have any needs, suggestions, or problems using our new store experience, please go to the community for feedback.


2.1.18