Foundation.mozilla.org: Define Creepiness Service

Created on 6 Sep 2018  ·  14Comments  ·  Source: mozilla/foundation.mozilla.org

API Outline:

POST /privacynotincluded/vote

{
    attribute: "creepiness" (or "confidence")
    rating: 0-99, // can be boolean by sending "true" or "false"
    id: 235325
}

Requires CSRF

Response codes:
201 is created.
400 is error (will return error text).

GET /privacynotincluded/product/235325

{
    id: 235325,
    name: “Smart Thermostat”,
    votes: [{
        attribute: "creepiness",
        rating: 45, // average of all votes
        votes: 3245,
        vote_breakdown: { // This can be an array
            "1": 34, // 0-19 vote
            "2": 355, // 20-39 vote
            "3": 34, // etc...
            "4": 355,
            "5": 23
        }
    }, {
        attribute: "confidence",
        rating: 1,
        votes: 345,
        vote_breakdown: {
            "true": 34, // "would buy"
            "false": 355
        }       
    }]
}

GET /products

Returns ranked product list array (most to least creepy?). Use same schema-per-item as individual /product above.

General Questions:

  • What level of rate limiting should we enforce? (via @cadecairos)

CC: @alanmoo

engineering

Most helpful comment

@kristinashu thanks! I'm going to look over the designs and propose any changes I can think of to @gvn's initial API proposal

Lets (you, @gvn, and I) sync up early next week to make sure we're confident that the service will support the design before I get started on it.

All 14 comments

Related: #1739

@kristinashu We're trying to get a better sense of how the vote tallying works.

Is it total or per product?
Is it votes on creepiness and/or confidence?

It's the total votes for that specific product on that specific question.

cc @taisdesouzalessa

Ok, I updated the outline above to reflect that.

@kristinashu Is there a design mockup I could comment on and reference to help finalize this proposed API before we start coding?

We have comps for the Product detail page. This is where users can vote on a product and see how other people voted on for that product. Here are the steps:
red-pen-0cc70402-4983-4162-c519-94b00acce0b4

We are still exploring home page ideas but this is where people will be able to see an overview of all the results. For example, all the products listed in order of creepiest to least creepy.

Happy to hop on vidyo if you need more clarification.

For the "found it creepy"/"would buy" percentages...how is that determined?

My thought is that we round the vote to the nearest choice (eg: 74% on the creep-o-meter would be "not creepy").

@kristinashu thanks! I'm going to look over the designs and propose any changes I can think of to @gvn's initial API proposal

Lets (you, @gvn, and I) sync up early next week to make sure we're confident that the service will support the design before I get started on it.

@gvn I am thinking about the interaction part of this component and so far I thought we could have 3 or 5 points of stickiness. When you slide, it sticks to the nearest point, like the example below. I wanted to avoid granular results. It is still a work in progress and I'll present the interactions to the designers first to hear their thoughts on it but I just wanted to flag my thinking so far to see what you think as well.
cc: @kristinashu @natalieworth

slider_4

@cadecairos I will revise above schema once homepage design has been approved.

@kristinashu can you let me know when that happens?

@taisdesouzalessa is still fine tuning but here is an updated version then above.

Creepy slider:

  • for user: smooth continuous slider, user can stop at any point
  • for results on product page: averaged/rounded into 5 buckets
  • for home page: all products listed from least creepy to creep (and is filterable)

Buy buttons:

  • for user: user selects Yes (thumbs up) or No (thumbs down) (sorry but this is not final, we might need 4 buttons - will decide asap)
  • for home page: put thumb up or thumb down over each product (and can filter by thumbs up, thumbs down, or see all)

Product page overview:
creep-o-meter 2x

Home page wireframe:
red-pen-f218306a-f595-42c3-f4ff-c6f026cf1e5c

cc @beccaklam

All comps and wireframes https://redpen.io/p/qz6bdb2811e058ffb1

~### Re: Homepage Interaction and Functionality requirements:~

~Animated smiley face that changes as products scroll correlating the state of the face to the level of the products' creepiness~

~Products are ordered according to level of creepiness (probably from least creepy to most creepy)~

~Products display their aggregated score of likelihood to buy by users (thumbs up for likely to buy or thumbs down for unlikely to buy)~

~Filter 'bubble' that expands (animation opportunity!) upon click into a larger bubble containing filtering options based on 'creepiness' and 'likelihood to buy' example: https://teatrlalka.pl/en/kalendarz~

~User is able to filter products according to aggregated scores of creepiness (creep-o-meter slider with range) and likelihood to buy (radio buttons)~

~Website is fully responsive~

~Top nav bar (the row including the mozilla logo) hides on scroll to give more vertical room~

Moved to homepage ticket https://github.com/mozilla/foundation.mozilla.org/issues/1820

Creepiness has been defined lol!

Closing this but please reopen if anyone still needs it.

Was this page helpful?
0 / 5 - 0 ratings

Related issues

sabrinang picture sabrinang  ·  5Comments

alanmoo picture alanmoo  ·  3Comments

kristinashu picture kristinashu  ·  3Comments

kristinashu picture kristinashu  ·  5Comments

kristinashu picture kristinashu  ·  5Comments