Add a "Featured" tab on the homepage #4234

chadwhitacre · 2016-12-15T22:56:45Z

Following up from slack ...

Right now the homepage lists all approved projects by default, most recently created first. This doesn't give a great first impression, because we end up seeing mostly little projects nobody has ever heard of or is giving to. We don't want to hide such projects per se (we want to be careful of "the rich get richer"), but when people are hitting Gratipay for the first time, they want to see, "Who is on here that I recognize?"

I had an idea to incrementally improve the situation without too much trouble (hopefully), and it seemed to @JessaWitzel like a good next project. So here we are! 💃

Basically I propose that we add a "Featured" tab in addition to the others on the homepage. It would be the default tab, and would show ten projects. Seven of the projects would be drawn randomly from a pool of the most popular projects (maybe ngivers >= 5, I think? We're so sad), and three would be taken randomly from amongst the rest. (Gratipay itself should never be a featured project.) Once we have those 10, I think maybe we randomize the order we list them on the Featured tab, for freshness and because otherwise how would we sort them without burying the new/unpopular projects at the bottom?

Apart from an icon (blue ribbon?) for Featured to match the other tabs, I think we should be able to do this only changing www/index.html.spt (plus tests?), because we already load all of the teams every time someone hits the homepage (that's an optimization problem we can worry about later).

Mockup

We Are Sad

gratipay::MAROON=> select name, nreceiving_from from teams where nreceiving_from >= 5 order by nreceiving_from desc;
┌──────────────────────────┬─────────────────┐
│           name           │ nreceiving_from │
├──────────────────────────┼─────────────────┤
│ Gratipay                 │             265 │
│ sqlalchemy               │              21 │
│ DevDocs                  │              19 │
│ CIDER                    │              18 │
│ Nuvola Player            │              17 │
│ jsbin                    │              16 │
│ PylonsProject            │              13 │
│ Internet of Ownership    │              13 │
│ Org-mode                 │              12 │
│ Magit                    │              11 │
│ Shields                  │              11 │
│ WDRL                     │               9 │
│ Chocolatey               │               9 │
│ RuboCop                  │               9 │
│ webpack                  │               8 │
│ Mojolicious              │               8 │
│ catapultpgh              │               7 │
│ Pillow                   │               7 │
│ Font Awesome             │               7 │
│ PerlWeekly               │               7 │
│ sudo room                │               7 │
│ simplytest.me            │               6 │
│ Reddit Enhancement Suite │               6 │
│ weblog.sh                │               6 │
│ dokku                    │               5 │
│ SublimeLinter            │               5 │
│ OpenLP                   │               5 │
└──────────────────────────┴─────────────────┘
(27 rows)

chadwhitacre · 2016-12-15T22:57:46Z

Does that give you enough to get started, @JessaWitzel? Anything jump out at you that needs to be better-specified?

chadwhitacre · 2016-12-15T23:05:08Z

Maybe constrain to only list one per owner among the 10?

JessaWitzel · 2016-12-20T18:49:33Z

If this is all about the projects and being able to support a project and the team working on that project what benefit is there to limiting it to one project per owner? Especially if it's random. Are we worried how it will look if 5/10 of them are owned by one person?

chadwhitacre · 2016-12-20T20:47:29Z

Are we worried how it will look if 5/10 of them are owned by one person?

Yeah, that was my only thought. I'm not proposing we limit the whole website to one project per owner, just the rotating featured 10 on the homepage. Eh?

mattbk · 2016-12-31T20:42:33Z

Can it reset weekly rather than daily or on pageview? That might jive better with the weekly focus of Gratipay (and reduce overhead vs on pageview, especially).

JessaWitzel · 2017-01-05T21:33:55Z

I was originally thinking about resetting daily but I like the idea of resetting weekly. I have no clue how to do that but will explore once I get this tab working. :)

chadwhitacre · 2017-01-06T15:54:33Z

Resetting either weekly or daily is going to be a fair bit more work, because we'll need to store the featured listing somewhere other than in memory. My suggestion would be that we get it working on this PR with generated-every-request, and work on persisting the list in a separate PR.

chadwhitacre · 2017-01-10T01:03:59Z

slack

JessaWitzel · 2017-01-17T04:15:08Z

I am still having a hard time making enough fake data to test this properly so would LOVE a set of eyes on this before I move forward and some feedback. The icon isn't right, I'm still trying to figure that out. And I haven't written specific tests yet. @mattbk or @whit537 or anyone would you mind taking a look and giving me feedback?

mattbk · 2017-01-17T14:53:56Z

Is it only showing the tab when there are enough projects that match certain criteria?

JessaWitzel · 2017-01-17T19:54:00Z

@mattbk Yes. I had to make it that way because of the way our testing environment works but also I think it's smart because we are open source so if someone wants to copy our tabs situation but has less teams it will still work for them.

nobodxbodon · 2017-01-17T20:21:07Z

@JessaWitzel I don't think the tab should be hidden when there are fewer than 7 popular + 3 unpopular. IMO it's shown when there's at least one and we show up to 7 popular and 3 unpopular.

JessaWitzel · 2017-01-17T20:46:03Z

@nobodxbodon Well if there is only one or two teams then they will all just show up on the Approved tab. What is the benefit of a featured tab if it just shows the Approved tab in a random order?

nobodxbodon · 2017-01-17T21:09:53Z

As we have much more than 2 teams now, I suppose you are thinking of reusing it by some other projects. I'd say suit our needs first, and I don't think it's a big task for other project maintainers to customize it to their needs.

Besides, in case we have only 5 or 6 popular, is it better to still show the 'featured' tab?

JessaWitzel · 2017-01-17T22:35:57Z

Ah, I see what you mean. Like if we have 30 projects but only 5 popular. Ok thanks! I will make that change. This works for us currently but I think it makes sense to make that change in case projects fall. I can do that tonight. Any other feedback?

mattbk · 2017-01-17T22:53:33Z

As a workaround for fake data, you can just modify fake_data.py locally to change nreceiving_from=3 to whatever you want.

I changed it to 5 and ran make fake a few times to get enough teams. If we need this going forward, it's probably possible to create a distribution of ngiving during make fake so it ranges from 1 to 10, for example.

mattbk · 2017-01-17T22:56:25Z

The icon isn't right,

Can you explain? Just that it's a piece of paper rather than a different icon?

Looks like it's working for me. 👍

For things like #4234, would be more realistic to have a range for `nreceiving_from` rather than a constant value.

nobodxbodon · 2017-01-18T00:11:04Z

To make sure we are on the same page, here are some cases in my mind. Could you check?

existing projects	result
no project at all	tab is hidden
1 unpopular project only	tab shows the 1 project
1 popular project only	tab shows the 1 project
2 populars, 2 unpopulars	tab shows the 2 populars, 2 unpopulars
2 populars, 10 unpopulars	tab shows the 2 populars, 8 unpopulars
8 populars, 1 unpopulars	tab shows 7 populars, 1 unpopular
10 populars, 10 unpopulars	tab shows 7 populars, 3 unpopular

JessaWitzel · 2017-01-18T02:00:46Z

@nobodxbodon The way I wrote it if the total number of approved projects is less than 10 there is no featured tab because it will just be a randomized version of the approved tab. If, however there are more than 10 projects total then the rest of your logic is true. Does that work?

So 2 populars, 10 unpopulars = tab shows 2 populars, 8 unpopulars
0 populars, 30 unpopulars = tab shows 10 unpopulars
30 populars, 1 unpopular = tab shows 9 populars, 1 unpopular
10 and 10 = tab shows 7 populars, 3 unpopular

nobodxbodon · 2017-01-18T02:07:47Z

@JessaWitzel sounds good to me. Thanks.

JessaWitzel · 2017-01-18T02:09:19Z

@mattbk yes! I want it to be a star. :( I totally looked up the icon and used the right SVG code and everything.

JessaWitzel · 2017-01-18T02:27:27Z

I requested reviews but should probably write tests, yeah? Where would those go?

nobodxbodon · 2017-01-18T04:16:03Z

www/index.html.spt

+      else:
+        unpopular.append(project)
+
+if len(teams) < 10:


To make the part more testable, maybe better to create a utility method like get_featured_projects(popular, unpopular) to wrap line 48-56.

Also, please create constant variables for 10 and 7, especially if the same value is used in many places.

And seems here 10 should be compared with number of approved projects?

a utility method like get_featured_projects(popular, unpopular)

A good place for it might be gratipay/utils/__init__.py, right below get_team.

nobodxbodon · 2017-01-18T05:07:25Z

www/index.html.spt

+    elif unpopular_sample_size == 0:
+        featured_projects = random.sample(popular, min(10, len(popular)))
+    else:
+        featured_projects = random.sample(popular, popular_sample_size) + random.sample(unpopular, unpopular_sample_size)


Below seems to be an alternative of L48-55 block:

popular_sample_size = min(10 if (len(unpopular) == 0) else 7, len(popular)) unpopular_sample_size = min(len(unpopular), 10-popular_sample_size) featured_projects = random.sample(popular, popular_sample_size) + random.sample(unpopular, unpopular_sample_size)

Please add tests first, if you decide to do some refactoring of this part, to avoid changing original logic.

@mattbk I'm not certain where the test cases should go. Could you advise?

@whit537 indicated they should be in test_homepage.py on Slack

Thank you for the review!

Let's go with test_utils.py since utils seems the natural place to add the function we're talking about. I've added dd0b8ce to bring the test_utils.py file up to modern standards of organization (one class per function). Hopefully that gives you enough to go on to add tests for the new function.

chadwhitacre · 2017-02-01T20:06:10Z

Rebased again, was 4fcaa25.

chadwhitacre · 2017-02-01T20:09:00Z

I see a star! ⭐️ 🔵 💃

chadwhitacre · 2017-02-01T20:43:20Z

How about "Unreviewed" to keep the tabs on one line? cc45990

chadwhitacre · 2017-02-01T20:44:02Z

Do we want to include Gratipay in the pool of featured projects? Is that too forward?

chadwhitacre · 2017-02-01T20:44:14Z

Or does it help communicate that Gratipay is funded on Gratipay?

JessaWitzel · 2017-02-01T21:00:02Z

I think it should be like any other project, included when it is chosen at random.

mattbk · 2017-02-01T22:09:15Z

How about "Unreviewed" to keep the tabs on one line?
Does "In review" fit?

chadwhitacre · 2017-02-01T22:24:52Z

I'm ready to merge and deploy when you are, @JessaWitzel @mattbk @TravisCI.

chadwhitacre · 2017-02-01T22:25:41Z

Does "In review" fit?

Probably. You think "Unreviewed" is that bad?

chadwhitacre · 2017-02-01T22:26:02Z

"Unreviewed" is actually more parallel to "Approved" and "Rejected," isn't it?

Recommendations were implemented.

chadwhitacre · 2017-02-01T22:31:00Z

/me preps a tweet ...

We've added a "⭐️ Featured" tab to https://gratipay.com/—mix of popular & up-and-coming projects. (Thanks to @/JessaCarpenter for the PR!)

chadwhitacre · 2017-02-01T22:32:46Z

We have a +1 from @JessaWitzel in slack.

You good, @mattbk? I'm thinking we can tweak the tab after the fact if need be ...

chadwhitacre · 2017-02-01T22:37:19Z

Alright, I'm holding off until tomorrow. I was the last to commit, so I shouldn't be the one to merge.

@mattbk I believe the merge is yours, unless the tab name is a blocker for you.

mattbk · 2017-02-01T22:57:33Z

"Unreviewed" is actually more parallel to "Approved" and "Rejected," isn't it?

"Approved" and "Rejected" are end-members, "In Review" is transitional. Not a blocker for me.

JessaWitzel · 2017-02-01T23:40:49Z

FIREWORKS!!

JessaWitzel self-assigned this Dec 20, 2016

This was referenced Dec 24, 2016

Full performance report #4262

Closed

Tighten up the banner on the homepage #4268

Merged

mattbk added a commit that referenced this pull request Jan 17, 2017

Create a range of nreceiving_from values

14cc3cd

For things like #4234, would be more realistic to have a range for `nreceiving_from` rather than a constant value.

mattbk mentioned this pull request Jan 17, 2017

Create a range of nreceiving_from values #4298

Closed

JessaWitzel requested review from nobodxbodon and mattbk January 18, 2017 02:25

nobodxbodon previously requested changes Jan 18, 2017

View reviewed changes

JessaWitzel added 5 commits February 1, 2017 15:05

create get_featured_projects function

8b72f3b

four space indents

848152a

add tests, move function to utils, fix imports

7855639

replace with mattbks code

f8c226c

fix font files to include star

aa23f35

chadwhitacre force-pushed the featured-tab branch from 4fcaa25 to aa23f35 Compare February 1, 2017 20:06

"Under Review" → "Unreviewed" to save space

cc45990

Wrap lines for 100-char line length

9d0f128

Round out the test suite -- finds a failure

e201d41

Fix failing test in get_featured_projects

3c3a241

mattbk merged commit 07ec3b1 into master Feb 1, 2017

mattbk deleted the featured-tab branch February 1, 2017 22:56

chadwhitacre mentioned this pull request Feb 2, 2017

Reset featured projects daily #4319

Closed

chadwhitacre mentioned this pull request Aug 31, 2017

Update Medium icon in footer #4336

Closed

Add a "Featured" tab on the homepage #4234

Add a "Featured" tab on the homepage #4234

Conversation

chadwhitacre commented Dec 15, 2016

Mockup

We Are Sad

chadwhitacre commented Dec 15, 2016

chadwhitacre commented Dec 15, 2016 • edited Loading

JessaWitzel commented Dec 20, 2016

chadwhitacre commented Dec 20, 2016

mattbk commented Dec 31, 2016

JessaWitzel commented Jan 5, 2017

chadwhitacre commented Jan 6, 2017

chadwhitacre commented Jan 10, 2017

JessaWitzel commented Jan 17, 2017

mattbk commented Jan 17, 2017

JessaWitzel commented Jan 17, 2017

nobodxbodon commented Jan 17, 2017

JessaWitzel commented Jan 17, 2017 • edited Loading

nobodxbodon commented Jan 17, 2017

JessaWitzel commented Jan 17, 2017

mattbk commented Jan 17, 2017 • edited Loading

mattbk commented Jan 17, 2017 • edited Loading

nobodxbodon commented Jan 18, 2017

JessaWitzel commented Jan 18, 2017 • edited Loading

nobodxbodon commented Jan 18, 2017

JessaWitzel commented Jan 18, 2017

JessaWitzel commented Jan 18, 2017 • edited Loading

nobodxbodon Jan 18, 2017

Choose a reason for hiding this comment

nobodxbodon Jan 18, 2017

Choose a reason for hiding this comment

chadwhitacre Jan 18, 2017

Choose a reason for hiding this comment

nobodxbodon Jan 18, 2017

Choose a reason for hiding this comment

nobodxbodon Jan 18, 2017

Choose a reason for hiding this comment

JessaWitzel Jan 18, 2017

Choose a reason for hiding this comment

JessaWitzel Jan 18, 2017

Choose a reason for hiding this comment

chadwhitacre Jan 18, 2017 • edited Loading

Choose a reason for hiding this comment

chadwhitacre commented Feb 1, 2017

chadwhitacre commented Feb 1, 2017

chadwhitacre commented Feb 1, 2017

chadwhitacre commented Feb 1, 2017

chadwhitacre commented Feb 1, 2017

JessaWitzel commented Feb 1, 2017

mattbk commented Feb 1, 2017

chadwhitacre commented Feb 1, 2017

chadwhitacre commented Feb 1, 2017

chadwhitacre commented Feb 1, 2017

chadwhitacre commented Feb 1, 2017

chadwhitacre commented Feb 1, 2017

chadwhitacre commented Feb 1, 2017

mattbk commented Feb 1, 2017

JessaWitzel commented Feb 1, 2017

chadwhitacre commented Dec 15, 2016 •

edited

Loading

JessaWitzel commented Jan 17, 2017 •

edited

Loading

mattbk commented Jan 17, 2017 •

edited

Loading

mattbk commented Jan 17, 2017 •

edited

Loading

JessaWitzel commented Jan 18, 2017 •

edited

Loading

JessaWitzel commented Jan 18, 2017 •

edited

Loading

chadwhitacre Jan 18, 2017 •

edited

Loading