Design UI to show users analysis findings

[stanleymarkman]

Kiryl, I'm assigning this to you for the future even though we don't yet have enough data logged. The idea is to look at a large amount of logged privacy flag data, and from that data devise some method of giving the user a discrete and simple recommendation about their data- i.e., "we think this site sells your data" or "we think this site is complying". Warnings about selling data should not happen all the time, there should be some threshold- otherwise the user would have no reason to heed constant warnings on their favorite sites.

I think the 'algorithm' here should probably be pretty simple, even maybe as simple as coming up with some numerical threshold/percentage for allowed number of unset (falsy) data privacy flags.

[SebastianZimmeck]

Warnings about selling data should not happen all the time, there should be some threshold- otherwise the user would have no reason to heed constant warnings on their favorite sites.

A few possibilities and comments.

• Log all (potential) violations to a background page. In addition, show the result for the current page in the popup --- violation or not. That way, it is up to the user whether they want to see what is going on (or go back to the logged violations in the background page).
• Alternatively/in addition, change the little green circle for the OptMeowt icon @kalicki1 introduced to yellow when we see a violation. E.g., currently it is turning briefly full green when visiting a site with .well-known (e.g., try for the NYTimes). Similarly, the icon could be briefly turning full yellow (red and green would not be ideal colors because they look the same grey for color-blind people).
• There is the usability issue of altert fatigue you mention, @stanleymarkman. Maybe the above could be some ways to address that. Another usability issue is that we may be sometimes not correct, e.g., we incorrectly detect a flag. We will have to figure out how often that happens. But the easiest way to resolve that point is to just include an explanation in the settings page or elsewhere that the analysis may be incorrect sometimes.

[SebastianZimmeck]

@stanleymarkman, I renamed this issue. Feel free to change with something that captures your idea better.

[stanleymarkman]

Sounds good- I think the final UI will end up being very similar to the ideas we discussed in lab meeting:

-First layer: simple color notification in the icon (with colorblind support) -Second layer: a 1-2 sentence description in the Optmeowt dropdown, with a link to the background/settings page -Third layer: Detailed breakdown of the privacy flags with specific resources linking to each legislation/implementation. For example: "This website ran 8 ad requests to Google AdSense without Google's RDP setting, despite the GPC cookie being set."

There's two challenges I'll work on here: first, getting the UI to the point where it's giving the user useful info without constantly bothering them, which will require some testing; and second familiarizing myself with the Chrome/Firefox extension UI APIs. I'll start experimenting and see what works!

[SebastianZimmeck]

Excellent, @stanleymarkman!

As this plan will likely require quite a number of changes, consider first bringing what you currently have into the main branch (issue #163). Feel free to decide however you see fit, though.

[SebastianZimmeck]

@kbeliauski suggested that the compliance analysis functionality works the way that a user can enter one or multiple websites to analyze, hit a start button, OptMeowt will then silently do the analysis (via headless browsing; is that possible?), and generate a report (say, a CSV file) with the analysis results. This change in functionality also necessitates a different approach to the UI.

I think we would need to further evolve the UI from what @stanleymarkman described. Essentially, the third layer could be what goes into the CSV file. The UI would be a button to start the analysis functionality, e.g., in the settings, some notification that the analysis is finished, an button for exporting the results (the functionality and design could be similar to the import and export of the domain list).

Maybe, this could be a separate Compliance Analysis Settings page (in addition to Settings, Domain List, and About). This Compliance Analysis Settings page would only be present in the Firefox version of OptMeowt (and, in terms of the codebase, is a separate Firefox module).

[kbeliauski]

I think that the way to go is, like @SebastianZimmeck said, to have a separate tab in the settings page for the multiple page analysis mode, but also keep a simpler version in the popup. The simpler version will just do what @stanleymarkman described and only for the website the user is currently on.

[SebastianZimmeck]

We can revive our mockup folder and put the mockups there.

[kalicki1]

I drew up a quick sketch of a popup design specifically for the US privacy string analysis functionality. This is very flexible and final decisions are TBD but let's use this as a starting point. A lot more has been mentioned above on more intricate design ideas and for more flags, especially with a settings page, so this is definitely a small starting point.

As a small note, I drew this up with a "browsing" use case in mind, where one site is visited and an analysis is done without any other input, so this may be reason to change the designs as well.

[SebastianZimmeck]

Nice!

• I like the analysis and protection labels and their symbols in Proposal 1. (As a side note, I feel the more prominently we advertise the analysis mode, the more flawless the transition from and to it has to be as it will be used more frequently.)
• Can users click on the analysis and protection labels? If so, what happens when they do?
• It seems you envision reusing in the Analysis Breakdown a good amount of structure and code that we already have in place for the approximately corresponding Domain List. That is great!
• Not sure if we need a separate Analysis Settings label/button. Maybe, this can be done through the normal top right settings icon. Maybe, if you are in the analysis popup, the link goes to the analysis settings page (or analysis section of the settings page). And if you are in the protection popup, the link goes to the protection settings page (or protection section of the settings page).
• We also still need a mockup for the analysis page, which I think can be an extended or just bigger version of your Analysis Breakdown.

[OliverWang13]

Great job!

• I was wondering how much we need the number of compliant sites ("4/15" on the example), because I feel like the user might expect the popup to be more site specific.
• Another idea is that possibly after one of the step fails, all following steps could become grayed out to illustrate the order (unless we would still like to check for US Privacy String even without a DNS link present)
• We could also toy around with the idea of checkboxes or other custom yes/no indicators (happy cat/sad cat, if we are feeling fun with it)
• While I am also unsure if we completely need the Analysis Settings button, I think that it is more important in this popup than the protection mode popup. Perhaps it could be renamed to "Analyzed Site List" or something like that, and link straight to the list of visited sites.
• I really like the idea of displaying the specific strings found for US Privacy, as it adds a useful layer of transparency.
• The analysis tag could have a magnifying glass instead of a lightning bolt, but either works.

[OliverWang13]

Additionally, if 3rd party sites are counted in the CCPA compliant ration (4/15 in the mockup), it could artificially inflate the denominator. This issue could be circumnavigated by using a modified counting code or removing the ratio altogether.

[SebastianZimmeck]

@kalicki1 or @OliverWang13, do you have suggestions or a mockup for the analysis page? I imagine something along the lines of the domain list page.

[OliverWang13]

Here is my quick, roughly drawn mockup. I like the idea of having the domains with a drop down list that shows the specific information that is shown in the popup. @kalicki1 should also feel free to upload his own version.

[SebastianZimmeck]

@OliverWang13, that is a good! As you are showing it, we can reuse the code from the popup. On the left side, in addition to Settings and About, we would have Domain List and maybe Compliance List or something like that.

[kalicki1]

@OliverWang13, I am a fan of your options page mockup! I think we should shoot for something along those lines.

@SebastianZimmeck, about your original thoughts on my popup mockup,

Can users click on the analysis and protection labels? If so, what happens when they do?

I imagine them as buttons yes, and then assuming we have a perfect implementation, we can switch back and forth between analysis and protection mode as we discussed in our call. With warnings as necessary of course.

Not sure if we need a separate Analysis Settings label/button.

I agree with what you said for the most part, I thought that the Analysis Settings button could link to the analysis-specific options page as you said. This button could be renamed something along the lines of "more detailed breakdown," implying that users can get more info about that specific domain's analysis and others as well (which is what we will do according to @OliverWang13's mockup).

@OliverWang13, about your points on my popup mockup,

Another idea is that possibly after one of the step fails, all following steps could become grayed out to illustrate the order

I like this idea, we could also make sure to only generate our actions responsively until a step fails, then load the conclusion.

[SebastianZimmeck]

I imagine them as buttons yes, and then assuming we have a perfect implementation, we can switch back and forth between analysis and protection mode ...

OK, yes, that would be great, indeed. Though, if it turns out to be too tricky, I am personally also fine with omitting the buttons and functionality. But, yes, give it a shot, and see how it goes.

I agree with what you said for the most part, I thought that the Analysis Settings button could link to the analysis-specific options page as you said.

OK, to keep it in the same style, in protection mode we should also have a button to the protection-specific options page (or domain list if we do not have a protection-specific options page).

[OliverWang13]

I think that having the analysis and protection labels being buttons could be a little complicated. Depending on our implementation, I am unsure how smoothly we could make the transition between them. Additionally, a portion of our users will have no use or interest for the analysis mode, so perhaps the way to switch could be a little less convenient, if that makes sense. I could see some users accidentally switching modes without knowing the difference and disrupting the functionality of the extension.

[SebastianZimmeck]

Let's discuss this later today.

[SebastianZimmeck]

In terms of the switching from analysis to protection mode or vice versa, let's not implement the buttons and functionality immediately. Maybe, we will do it later.

In principle, the UI is good as is as shown in the mockup. Maybe, add some tooltips or do some smaller modifications.