Closed Bug 1040282 Opened 6 years ago Closed 6 years ago

[UX] Design Spike: sponsored indication for enhanced and directory tiles

Categories

(Tracking Graveyard :: Firefox Operations, defect)

defect
Not set
normal

Tracking

(Not tracked)

RESOLVED FIXED

People

(Reporter: clarkbw, Assigned: athornburgh)

References

Details

(Whiteboard: [ux] [qa-])

Attachments

(4 files)

As a product owner I need any tiles which have partner ties to Mozilla to have a clearly indicated sponsorship text label such that there is text saying “Sponsored” or "Enhanced" directly associated with those tiles.

Acceptance Criteria

* Every sponsored Directory Tile has the text “Sponsored” directly associate with it.
* Every Enhanced Tile displays has the text “Enhanced” directly associated with it.
* Icons such as the arrow and related popup message are not acceptable indicators.

"Enhanced" text is waiting on full approval, for now "Sponsored" can be assumed everywhere.
Flags: firefox-backlog+
Blocks: 1040369
From dcrobot:

1.) No more message bar

2.) New header ("Site you visit most often" - suggestion from Mary Ellen)

3.) New corner radius

4.) More subtle glow effect on rollover

5.) New "Sponsored" label

6.) Show 1 sponsor vs. 3 sponsors (always on the right of the last row)

7.) New "What is this page?" text link (subsequent interaction TBD, depending on amount of text required)

8.) No more "toggle"... New cog with dropdown options for Enhanced view, Classic view and Blank page
Attached image Interactions.png
Attached image Tiles - 1 Sponsor.png
Attached image Tiles - 3 Sponsors.png
Unlisted change is moving the pin button back to the top left.
(In reply to Ed Lee :Mardak from comment #1)
> 6.) Show 1 sponsor vs. 3 sponsors (always on the right of the last row)
Any reason why this needs to be the last row towards the right instead of anywhere in the grid? Nightly currently has a sponsored tile in the top right.
Blocks bug 1036284 where there's style changes from the previous spec.
Blocks: 1036284
(In reply to Ed Lee :Mardak from comment #3)
> Created attachment 8458886 [details]
> Tiles - 1 Sponsor.png
The WIRED tile here seems to be enhanced, yet there's no indication. Is that intended?
Proposed treatment for enhanced history tiles vs. placed ads
I misunderstood the original request. The PNG attached above shows a label for every enhanced tile. I suggest that we label enhanced history tiles as "sponsored" because that would make a lot more sense to more people than "enhanced". If the tile is placed/recommended/paid-to-be-there, then it's an "ad".

I thought it was important to make the distinction between the two labels immediately apparent - especially wait is paid advertising content. Therefore, "ad" labels are in blue, and "sponsored" labels a subtle gray.
(In reply to Aaron from comment #10)
> I suggest that we label enhanced history tiles as
> "sponsored" because that would make a lot more sense to more people than
> "enhanced". If the tile is placed/recommended/paid-to-be-there, then it's an
> "ad".
To be clear, for people with enough history to push out directory tiles, the only indicators they'll see is [sponsored] (and no [ad]) if some tiles are enhanced. The current functionality is to only show history and enhance them if possible if the user has enough history, so no [ad] tiles.

If there's not enough history and non-organic/affiliate, i.e., "sponsored", directory tiles are shown, it'll be labeled [ad] (whether it's enhanced or not because it's showing a site not from the user's browsing history).
The difference between »Sponsored« and »Ad« seems to be hard to communicate.
From a users perspective, both words mean »This is here because someone paid for it«.
While that is technically true, the tiles that are currently called »Sponsored« would be there anyway. Only the enhancment is sponsored.

I think we should do one of the following:
1) Don't label organic enhanced tiles (the enhancement is pretty apparent by itself) and only label actual ads as »Ad« or »Sponsored«.
2) Use the same label on both kinds of tiles.

I'd greatly prefer 1. Maybe we could use the little arrow that were in some of the earlier mockups where the user can disable the enhancement so he is in control and still has an indicator.

As for the wording, there seems to be a preference towards the word »Ad« in the industry. Google, Bing and Yahoo all call their paid results »Ads«. Duckduckgo uses »Sponsored«, Twitter uses »Promoted«.
Either is fine I think, but we should settle on one or the other.
(In reply to Philipp Sackl [:phlsa] from comment #12)
> 1) Don't label organic enhanced tiles (the enhancement is pretty apparent by
> itself) and only label actual ads as »Ad« or »Sponsored«.
I believe the enhancement is technically an ad, therefore we'll need to label it.

I think we can make more use of this distinction of "sponsored" = from history vs "ad" = not from history down the line as well. E.g., showing related pages/articles or similar sites as sponsored from history vs ads from unvisited.
Summary: Design Spike: sponsored indication for enhanced and directory tiles → [UX] Design Spike: sponsored indication for enhanced and directory tiles
Whiteboard: [ux] [qa-]
Status: NEW → ASSIGNED
Iteration: --- → 34.1
(In reply to Ed Lee :Mardak from comment #13)
> I think we can make more use of this distinction of "sponsored" = from
> history vs "ad" = not from history down the line as well. E.g., showing
> related pages/articles or similar sites as sponsored from history vs ads
> from unvisited.

My concern is that exactly that distinction will be very hard to communicate.
In the users mind sponsored === ad. So we should either unify the label or label one of them in a way different enough that there is no confusion about *how* they are different (the latter one would be my preferred option).
(In reply to Philipp Sackl [:phlsa] from comment #14)
> My concern is that exactly that distinction will be very hard to communicate.
> In the users mind sponsored === ad. So we should either unify the label
The actual label probably doesn't matter that much -- just that the user can simply understand and make the connection to the content being shown is "sponsored" in some way.

I've attached a video and stills that normally just shows a blue square no matter enhanced or sponsored or ad or whatever those mean to you. This lets us put whatever label behind the hover action, but the user already sees the blue square indicating "sponsored."

webm: https://bug1040369.bugzilla.mozilla.org/attachment.cgi?id=8461274
 png: https://bug1040369.bugzilla.mozilla.org/attachment.cgi?id=8461277

It has a benefit of working with whatever the words get localized to (which could have varying text lengths).
(In reply to Ed Lee :Mardak from comment #15)
> (In reply to Philipp Sackl [:phlsa] from comment #14)
> > My concern is that exactly that distinction will be very hard to communicate.
> > In the users mind sponsored === ad. So we should either unify the label
> The actual label probably doesn't matter that much -- just that the user can
> simply understand and make the connection to the content being shown is
> "sponsored" in some way.

Let's stick with simply "sponsored" for either sponsored Directory Tiles or Enhanced Tiles, it's simple and avoids excess explanations of the variations of other labels.

> I've attached a video and stills that normally just shows a blue square no
> matter enhanced or sponsored or ad or whatever those mean to you. This lets
> us put whatever label behind the hover action, but the user already sees the
> blue square indicating "sponsored."
> 
> webm: https://bug1040369.bugzilla.mozilla.org/attachment.cgi?id=8461274
>  png: https://bug1040369.bugzilla.mozilla.org/attachment.cgi?id=8461277
> 
> It has a benefit of working with whatever the words get localized to (which
> could have varying text lengths).

I'll look into using a hover option for showing the text.
Iteration: 34.1 → 34.2
Points: --- → 5
Iteration: 34.2 → ---
dcrobot, is there anything left for this bug or can you resolve it?
How can I see the final product? I just updated nightly and it looks the same it did a week ago. Please advise.
Nightly is the same because the implementation bug 1040369 hasn't landed yet as the decisions in this design bug block that bug. Are the design of what you want the for the sponsored indicator appropriately discussed in this bug?
The specs for the Sponsored indicator are as follows:

Labels should say "SPONSORED" 4px side padding - total height = 21px
Paid tile text/treatment
use enhanced title replacing history title
overlay sponsored text: #333333 background, white text
Static label: Border = 1, #DCDCDC, corner = 2, fill = #F9F9F9, text = Arial, Regular, 10 px, #9B9B9B
Rollover: fill = #DCDCDC, text = #666666
Yeah, those notes have been in bug 1040369. I was asking if there was anything else before you can resolve this design bug as fixed?
All design work has been accounted for at this point. Thank you.
Status: ASSIGNED → RESOLVED
Closed: 6 years ago
Resolution: --- → FIXED
Need info GMC for verification of this design bug.
Iteration: --- → 34.2
Flags: needinfo?(madhava)
Flags: needinfo?(gavin.sharp)
Flags: needinfo?(cweiner)
Flags: needinfo?(madhava)
Flags: needinfo?(gavin.sharp)
Flags: needinfo?(cweiner)
Product: Tracking → Tracking Graveyard
You need to log in before you can comment on or make changes to this bug.