Closed Bug 1132552 Opened 6 years ago Closed 2 years ago

Prototype related tiles designs

Categories

(Content Services Graveyard :: Tiles, defect)

defect
Not set
normal

Tracking

(Not tracked)

RESOLVED WONTFIX

People

(Reporter: Mardak, Assigned: athornburgh)

References

Details

(Whiteboard: .?)

dcrobot has put together a design prototype of related tiles that existing/current (as opposed to new users) could see:

http://tyk8e9.axshare.com/#c=2

Not a complete list of changes:
- showing a related/recommended tile based on browsing behavior
- messaging "because.." and [ad] styling
- consolidated tile actions into a gear menu
- unpinning from left of title
- new tab options menu reworked
phlsa, are there things to keep in mind when moving things around? In particular, for the prototype the pin/block tile actions are moved under another menu so there's an additional click to get to those existing functionality. The new gear menu makes sense for adding in additional actions as we run out of corners to put actions (that would also cover up the tile being shown).

For the messaging below the related tile, we've had some previous discussion in bug 1126188 about the actual text. There's also a separate question that we hope to answer through user testing of whether users can quickly understand a category label that we come up with ("because you like automotive") vs just showing the specific site the user visited ("because you visited cars.com").

For the new tab options menu, are there standard UI elements for toggleable items vs selecting one of a set? The current prototype has different types of checkmarks that seem confusing to me, e.g., you can't have both a blank page and a page that shows sites, and "learn" isn't a state.
Flags: needinfo?(philipp)
Oh, I forgot to comment on the "Find similar site" option as it seems to only trigger from the GEICO related tile. It's a neat view, but a couple concerns

- there's a lot of data that needs to be put together to populate that view
- it's a sub sub sub view 1) hover tile 2) click menu 3) select similar

With that, I would guess that there would need to be a really strong business need or user demand to make it a priority to implement that view.

So if the tile menu doesn't have the "similar" option, it would have the original pin and block plus extra messaging. I'm not sure if it makes sense to move the 2 items into the menu now in preparation for additional items or leave them as is for now assuming we can place the messaging somewhere else. If it is indeed critical to have per-tile additional messaging in a sub view, that could be a good reason to have the tile menu.
Hey, sorry for the slow turnaround here...

(In reply to Ed Lee :Mardak from comment #1)
> phlsa, are there things to keep in mind when moving things around? In
> particular, for the prototype the pin/block tile actions are moved under
> another menu so there's an additional click to get to those existing
> functionality. The new gear menu makes sense for adding in additional
> actions as we run out of corners to put actions (that would also cover up
> the tile being shown).
That's all fine in my opinion. Aaron and I looked at the changes a few weeks ago :)


> For the messaging below the related tile, we've had some previous discussion
> in bug 1126188 about the actual text. There's also a separate question that
> we hope to answer through user testing of whether users can quickly
> understand a category label that we come up with ("because you like
> automotive") vs just showing the specific site the user visited ("because
> you visited cars.com").
No real opinion here - user testing sounds good!

> For the new tab options menu, are there standard UI elements for toggleable
> items vs selecting one of a set? The current prototype has different types
> of checkmarks that seem confusing to me, e.g., you can't have both a blank
> page and a page that shows sites, and "learn" isn't a state.
Hm, that's actually a tricky one. There are toggleable items in standard menus (e.g. View > Toolbars), but the situation here is a little more complex. I think there are two possible approaches here:

1) Stay close to native menus
That means a checkmark in front of the item that appears and disappears. All entries would always be visible, but "Show ads" would be disabled and turned off when the user has selected showing a blank page.

2) Stay close to panel UI
We actually use those arrowpanels for more complex UIs. In this case, we could use radio buttons for the top sites / blank page toggle and make the "show ads" checkbox a sub-item of the former. You can look at the forget button for an example of a vaguely similar UI.

Aaron, what's your take here?
Flags: needinfo?(philipp) → needinfo?(athornburgh)
1) This is how the "Show ads..." option works already. The text is always there... only the checkmark appear or disappears.

What is the actual issue?
Flags: needinfo?(athornburgh)
(In reply to Philipp Sackl [:phlsa] please use needinfo to make me respond from comment #3)
> We actually use those arrowpanels for more complex UIs. In this case, we
> could use radio buttons for the top sites / blank page toggle and make the
> "show ads" checkbox a sub-item of the former. You can look at the forget
> button for an example of a vaguely similar UI.
So this would look something like.. ?

turned on:

⦿ Show top sites
   ✓ Show ads
◯ Show blank page
  Learn about new tab

turned off:

⦿ Show top sites
   ☐ Show ads
◯ Show blank page
  Learn about new tab
This is something I would like to test (as soon as possible), before deviating from what's shown in the design. The page controls are the first piece MS will be working on, and making changes now (without any data) would delay things.  

If "Learn about New Tab" remains in the menu, then it seems like the only substantive difference is that you'd like me to move the option to hide ads to beneath the "Show my top sites" menu item... and add radio buttons. Radio buttons are reasonable/necessary in forms, but not so much in the main page menu - they're redundant and will literally make the browser feel decided old-school as opposed to new and fresh.
Flags: needinfo?(philipp)
Flags: needinfo?(kghim)
Flags: needinfo?(edilee)
Blocks: 1121549
Flags: needinfo?(kghim)
I don't have a strong opinion on using checkmarks or radio buttons. The radio button/selection on the Forget button looks nice. 

Another option, if you want to stick with the current mock up, is to only have the "Suggeted sites" option appear in the same bottom location if "Show your top sites" is selected.

All users to start off: 
✓ Show your top sites (auto checked)
  Show a blank page
  Learn about New Tab
✓ Show Suggested Tiles

Users that turn off Suggested Tiles: 
✓ Show your top sites
  Show a blank page
  Learn about New Tab
☐ Show Suggested Tiles

Users that select blank: 
  Show your top sites
✓ Show a blank page
  Learn about New Tab

Users that click on About new tab (top two selected item remains the same): 
✓ Show your top sites
  Show a blank page
  Learn about New Tab (opens new tab)

Users that re-select top sites: 
✓ Show your top sites
  Show a blank page
  Learn about New Tab
✓ Show Suggested Tiles
(In reply to Aaron from comment #6)
> This is something I would like to test (as soon as possible), before
> deviating from what's shown in the design. The page controls are the first
> piece MS will be working on, and making changes now (without any data) would
> delay things.  
> 
> If "Learn about New Tab" remains in the menu, then it seems like the only
> substantive difference is that you'd like me to move the option to hide ads
> to beneath the "Show my top sites" menu item... and add radio buttons. Radio
> buttons are reasonable/necessary in forms, but not so much in the main page
> menu - they're redundant and will literally make the browser feel decided
> old-school as opposed to new and fresh.

I was mostly summarizing what we have elsewhere rather than being prescriptive here :)
We can absolutely use checkmarks and in your latest mockups they are a lot closer to the other menus we have in the product and the nesting of Show top sites and Show suggested tiles also works IMO.

Since you mentioned testing: are there specific things you'd like to test for?

One last thing that I didn't realize when I looked at this earlier:
What's the reason for dimming the page when opening the menu? It seems like a lot of changing pixels for a pattern that users use quite often (clicking a button to open a menu).
Flags: needinfo?(philipp) → needinfo?(athornburgh)
No more related tiles of this format.
Status: NEW → RESOLVED
Closed: 2 years ago
Flags: needinfo?(edilee)
Flags: needinfo?(athornburgh)
Resolution: --- → WONTFIX
You need to log in before you can comment on or make changes to this bug.