Closed Bug 1073654 Opened 8 years ago Closed 8 years ago

[UX] Visual Design for editing panel for tiles on about:newtab

Categories

(Firefox :: New Tab Page, defect)

33 Branch
x86
All
defect
Not set
normal
Points:
5

Tracking

()

RESOLVED FIXED
Iteration:
35.3

People

(Reporter: sevaan, Assigned: mmaslaney)

References

Details

(Whiteboard: [ux])

Attachments

(3 files)

This bug is for visual design for the "Edit Tile" panel on about:newtab detailed in Bug 1065313
Flags: firefox-backlog+
Since the tile flips over, it might be cool to show a frosted reverse of the original tile in the background of the edit panel.
Flags: qe-verify-
Whiteboard: [ux]
Assignee: nobody → mmaslaney
Status: NEW → ASSIGNED
Iteration: --- → 35.3
Points: --- → 5
Please find the Visual Design mockup here: http://people.mozilla.org/~mmaslaney/tile/FX-Tile-Editing.png

Pinging Sevaan and Aaron for a UX/UI review.
Flags: needinfo?(sfranks)
Flags: needinfo?(athornburgh)
Looks good!
Couple notes:

- Your dropdown menu when clicking the edit icon says "Enhanced" and "Remove". I think you mean for "Enhanced" to be "Edit" (or "Edit Tile", but seem my additional thought below regarding this)
- You mention the "Undo" prompt...do we want to include that? Or is there a standard visual we use in other places?
- Because the tile is automatically pinned after you edit it, you should include that pin icon on the newtab page you have at the end of the flow.
- Just wondering if the Edit gear could be a little larger (or the pin a little smaller)...they seem just slightly misbalanced.

And one other thought...when the tile flips over the title says "Edit Tile - <Current Tile Title>"...but no where else do we ever mention the word Tile and Bill Selman's research suggests that most users wouldn't call it a tile in the first place. How do you feel about removing the word "Tile" and just making it "Edit: <Current Tile Title>"? This would also allow for slightly longer tiles before they disappear into elipses (and maybe we should make a note of that too).
Flags: needinfo?(sfranks)
Nice work Maslaney. A few comments...

1.) Cog icon > I would like to reserve the "cog" explicitly for the page-level controls. Can you come up with another option or two? Perhaps a pen.

2.) Edit menu > Options don't make sense. The tile is already "enhanced". I suggest that the options be "Edit" and "Delete tile".

3.) Rollover > Do we need the gray bg and rule? I think it would look crisper with an all-white bg.

4.) Rollover Buttons > Perhaps make the "Done" button light up in blue once a URL has been selected?
Flags: needinfo?(athornburgh)
one more...

5.) Include the favicon of the URL selected (or a dotted outline if none is available)
Thanks for the feedback Sevaan and Aaron. Please find the updated mock here: http://people.mozilla.org/~mmaslaney/tile/Title-editing-v2.png
Flags: needinfo?(sfranks)
Flags: needinfo?(athornburgh)
This looks great, Mike. Thanks for making those changes!
Flags: needinfo?(athornburgh)
+1
Flags: needinfo?(sfranks)
Attached file Tile-edit-assets.zip
Attached assets
Status: ASSIGNED → RESOLVED
Closed: 8 years ago
Resolution: --- → FIXED
You need to log in before you can comment on or make changes to this bug.