Deal with huge amount of designs

[selfthinker]

As the designs are getting more and new PRs come in (hopefully) there needs to be a way to deal with that. I don't know how yet. Any ideas?

The minimum could be simply to re-order the items. But based on what?
Some kind of tagging could help (maybe as classes on the links to the designs), e.g. if something is also responsive or if it is experimental or only works in one specific browser...

Some kind of voting system would be perfect and to order them by popularity. But that would either require something on a different page or more radical changes in the HTML.

[emzinnia]

I think alphabetically is what I would prefer to reorganize it is.

Yeah, I think a kind of voting system would be nice.

It might even be of use to go more radical like CSS Zen Garden did, removing most of the designs from the home page and just leaving the really attractive ones. Just a possibility.

A drop-down list would break a lot of the submissions, but would at least allow for some breathing room.

[mufid]

just leaving the really attractive ones

Seems like we need additional backend layer. How about we add a special section, such as:

• Trending theme
• Most viewed theme (24h, 2d, 1w, 1m)
• Most shared theme (24h, 2d, 1w, 1m)
• Bring me to random theme

[selfthinker]

I like most of those ideas.
I would be fine with adding some backend layer. Although I'd first like to explore all potential simple JS-only options.

The bigger question for me is how this is supposed to behave and look like (not design- or code-wise).

It might even be of use to go more radical like CSS Zen Garden did, removing most of the designs from the home page and just leaving the really attractive ones.

From what I can see that's not what they've done. All 218 designs are still accessible on the home page, they're only showing 8 per page and let you navigate to the the next 8 etc.

[emzinnia]

Yeah, sorry, I did mean the fact that they have 8 designs (created after they updated the site), with the other 210 older designs in an archive. Creating something like an archive is an option, I would say.

[SelenIT]

There may be a problem that all existing designs have only one navigational section with links to all existing designs. Some newer designs (e.g. 'Typewriter' or 'Facetime') tended to make this section the central part of the design, as it had more content than other sections. Changing the structure of navigation may make such designs look not as good as it's been intended.

[selfthinker]

I just implemented a simple version of an archive (not live yet, see #5).
Only 9 designs break slightly. e.g. often due to links being preceded by "by".

Regarding the effect of the amount of nav items to the design, many look bad with so many items, some would look bad with just a few. We should think of a good amount that makes a good balance and then keep it that way (i.e. moving designs to the archive when new featured submissions come in).
My change so far reduces the "featured" designs to 50 (so the archived designs are 32). Of the designs which concentrate on the nav items (gardenof3den, typewriter, bookshelf, facetime, cloudy) all work well enough with less than 50 except gardenof3den (well, the plants just don't reach the earth). The next to be troublesome would be typewriter and facetime, both would probably need an amount higher than 40. That makes me want to settle on 42 (and potentially make changes to gardenof3den).

I wrote the JS so that it is easy to add more filters later on. I could think of what a design supports (responsive, keyboard, touchscreen, etc), what the design is mainly styling (typography, background/shapes, nav items, containers, etc) and if it contains animation or is experimental. (I would want to at least mark all inaccessible designs as "experimental".)

What do you think?

[SelenIT]

I agree that most designs look better with less nav items and that 42 items seems enough for most of them. But since JS comes into play, maybe it would make sence to make this number configurable individually per design, with, e.g., 42 as default value and special values for designs that look better with more/less nav items?