webapis-playground icon indicating copy to clipboard operation
webapis-playground copied to clipboard

💡 [Feature]: Add categories for the APIs

Open koustov opened this issue 4 years ago • 8 comments

Is your feature request related to a problem? Please describe. As the list will grow over time, we need a smarter mechanism to handle the heap. An easy and convenient way is to categorize them.

Describe the solution you'd like A radio button-based category listing.

Describe alternatives you've considered Tabs, accordion

Additional context

koustov avatar Oct 21 '21 13:10 koustov

@atapas can you assign it to me?

koustov avatar Oct 21 '21 13:10 koustov

@koustov please come up with the design first and share.

atapas avatar Oct 22 '21 11:10 atapas

@koustov please come up with the design first and share.

High-level wireframe https://app.moqups.com/LEsZyn0fKfPUmXVeSDgn7qN3JetBc5oi/view/page/aa9df7b72

image

Note:

  1. Short of icons, please use your imagination
  2. In the list of the filters, the first one is for "ALL"

koustov avatar Oct 22 '21 13:10 koustov

One quick question @koustov => How does the icons related to the demo?

atapas avatar Oct 23 '21 04:10 atapas

One quick question @koustov => How does the icons related to the demo?

The icons are carefully chosen categories (e,g,: "screen" for all screen-related demos). We can start with any popular icon library (which can give something around 70% impression) however eventually we would go for a custom set.

Note: On hovering category icons will render the category name

koustov avatar Oct 25 '21 05:10 koustov

Yes, a categorization is surely required. I liked the idea. However, I am not fully sure if this UX is the best one. The categorization(some of them, not all) That I can think of are,

  • Screen
  • DOM
  • Camera
  • Location
  • Connectivity
  • Operating System

Check out https://whatwebcando.today/ site. It has some categorization but it is not very useful either. Can we go for a low-fidelity wireframe with actual categorization?

@koustov @max-programming @niteshseram @mverissimo What are your thoughts?

atapas avatar Oct 27 '21 05:10 atapas

I like the idea, but we don't have much content for this, and about the layout, the reference sent by @atapas looks good, just needs a little enhancement.

mverissimo avatar Oct 27 '21 17:10 mverissimo

I like the idea, but we don't have much content for this, and about the layout, the reference sent by @atapas looks good, just needs a little enhancement.

To start with, we can keep the framework ready. It is ok if for some category it shows no demo available. That in fact drive us to create one sooner :).

Question to you @mverissimo => As you are planning the next PR to bring the rest of the demo inside the module and aesthetic, we can take up categorization right after that. What say? Or do we need to think about it togerger?

atapas avatar Oct 28 '21 03:10 atapas