bug#25227: [Website] Package-related pages redesign proposal

[Alex Sassmannshausen <alex@pompo.co>]

Hi Luis,

Luis Felipe López Acevedo writes:

> Hi,
>
> I was thinking on improving the package-related pages, and made these 
> mockups:
>
>
> Figure 1. Package list page.
> https://multimedialib.files.wordpress.com/2016/12/guixsd-package-list-view-v0.png

Overall, I really like this design.  My only immediate concern would be
that it's only showing 6 packages at a time.  Though this probably
somewhat a subjective isuse, especially as the search form would allow
far better paging of results than the current static paging.

After thinking about it some more, I felt it would be a shame to lose
build status indicators on the "overview page".  Do you think it would
be possible/desirable to retain the current build status indicators
beneath each package div?

> Notes:
>
> - The gray circles indicate package logos.
> - The red tag next to the name of a package indicates it has issues (I 
> don't know if just issues as in 
> https://www.gnu.org/software/guix/packages/issues.html or building 
> problems as well).

I like this.  Very intuitive.

> - Packages are grouped in numbered pages because displaying a given set 
> of packages in one page may bring back the page size issue. For example, 
> the current page with packages that start with G is already ~1 MiB.

Agreed.  The P page is problematic too (we already have quite a few perl
packages!).

> - The option to browse by category is something I'd like to have, but I 
> don't see categories in package definitions, so I don't know if we could 
> use that.

Previous discussions centered around how difficult it is to maintain
categories for packages.  I think if we went this way we'd want to
implement some form of deductive faceting, where we parse
description/synopsis and try to generate keywords.  But that sounds like
it could quite easily become a can of worms…

> - The option to browse by architecture... I just put it there, I don't 
> know if that's needed.
>
>
> Figure 2. Package detail page.
> https://multimedialib.files.wordpress.com/2016/12/guixsd-package-detail-view-v0.png
>
> Notes:
>
> - The screenshots is something I'd like to have, but I don't know how 
> that can be done.

In fact, how would the logos work?  Short of having metadata fields in
package definitions (which probably is not desirable) I can't help but
think that these would have to be manual additions somehow, which would
not scale.

Though having logos and screenshots would be huge UI wins!

What about having some form of way to "mine" screenshots/logos (e.g.,
naive implementation: try $homepage/logo.{png,jpg}, else try
$homepage/images/logo.{png,jpg}), and caching those?  Again, quite
elaborate, but perhaps something that could be played with iteratively?

One could try something similar for screenshots, as a lot of package
homepages already contain an "image gallery" anyway.  We'd need to find
a way to automatically locate those, and probably cache those too…

WDYT?  Might be over-engineering this problem… ;-)

> - The issues for a package would be in the package page, so the current 
> issues page would be removed.

I like this.

> URL paths
> =========
>
> Implementing this would create web resources in paths like these:
>
> /packages/
> (Packages home page)
>
> /packages/z/
> (First page of the list of packages starting with letter Z)
>
> /packages/z/page/N/
> (Page N of the list of packages starting with letter Z)

So /packages/z/ is an alias for /packages/z/page/1/?

> /packages/categories/algebra/
> (First page of the list of packages for algebra)
>
> /packages/icecat-X.Y.Z/
> (Page with details about IceCat version X.Y.Z)
>
> This static pagination and filtering would generate A LOT of pages, but 
> of reasonable size for web browsers to load.

Indeed.  In general, I'm a fan of static pages.  Here, we'd be
generating:
- 1 page per package
- 1 page per 6 packages (paginated overview pages)
- 1 page per 6 packages per category
- 1 page per 6 packages per architecture

(probably a few more than that).

That is indeed a *lot* of pages…

> Possible problems with the implementation
> =========================================
>
> I mentioned this proposal in bug #25045, and it seems that the amount of 
> pages generated for the filtering part of this implementation could 
> choke CVS, which is used as the deployment repository of the website 
> (see https://debbugs.gnu.org/cgi/bugreport.cgi?bug=25045#17).
>
> I quote Ludovic from that bug report:
>
>> Sounds like a good plan as well, though that’s indeed a lot of web 
>> pages
>> for that rusty CVS repo to handle…
>> 
>> Medium-term, I think we should consider a solution involving pages
>> generated on the fly server-side, with a caching proxy (nginx!) in 
>> front
>> of it.  We’ll have to seek assistance from the gnu.org web masters, but
>> ISTR they were not against that idea.
>
> That said, the proposed design, if useful, could be used independent of 
> the nature of the website (static or dynamic).

How would the search work with statically generated pages?  Unless
there's an approach that I haven't come across yet, you'd *need*
dynamically generated pages for this anyway (and the search would be a
requirement for useability in this design) — so it looks like we may
have to go dynamic from day 1 here?

> What do you think?

Overall, I think this is a great initiative and effort.  I love the
clean and elegant design and think it would be a great win for Guix.
Excellent work.

HTH,

Alex