Fennec/Features/disc
Status
| Better first-run / Browser discoverability | |
| Stage | Shipped |
| Status | ` |
| Release target | Firefox 6 |
| Health | OK |
| Status note | ` |
{{#set:Feature name=Better first-run / Browser discoverability
|Feature stage=Shipped |Feature status=` |Feature version=Firefox 6 |Feature health=OK |Feature status note=` }}
Team
| Product manager | Thomas Arend |
| Directly Responsible Individual | Thomas Arend |
| Lead engineer | ` |
| Security lead | ` |
| Privacy lead | ` |
| Localization lead | ` |
| Accessibility lead | ` |
| QA lead | Aaron Train |
| UX lead | Brian Dils, Madhava Enros |
| Product marketing lead | ` |
| Operations lead | ` |
| Additional members | ` |
{{#set:Feature product manager=Thomas Arend
|Feature feature manager=Thomas Arend |Feature lead engineer=` |Feature security lead=` |Feature privacy lead=` |Feature localization lead=` |Feature accessibility lead=` |Feature qa lead=Aaron Train |Feature ux lead=Brian Dils, Madhava Enros |Feature product marketing lead=` |Feature operations lead=` |Feature additional members=` }}
Open issues/risks
`
Stage 1: Definition
1. Feature overview
Guide users on first run. Help them discover and understand features like side panels, awesome screen, sync, bookmarks, gestures, etc.
2. Users & use cases
`
3. Dependencies
`
4. Requirements
`
Non-goals
`
Stage 2: Design
5. Functional specification
`
6. User experience design
There are several different concepts we can explore for first-run discoverability, as well as a few other ideas that might aid discoverability while the users are in product.
First-run Concepts
Idea #1:
http://www.youtube.com/watch?v=1Ph3s2Zu2Xo
The idea here would be to show the user a walk-through video with a dummy hand. This would be the most failsafe idea because we would show users exactly how to operate the UI. The negative here, is that it is very heavy-handed and assumes that our users don't know how to operate a touchscreen.
Idea #2:
http://www.youtube.com/watch?v=Jem7CgbM034
Essentially the same as idea #1, except we wouldn't show the dummy hand.
Idea #3:
http://www.youtube.com/watch?v=49Yh3UcoPS4
The idea here would be to take out any extraneous elements of the tutorial, such as the hands and/or notes. This idea is necessary because the notes are going to be hard to localize.
Idea #4:
http://www.youtube.com/watch?v=xmxQw_RExbo
This idea is basically the same as #3, except we show the sidebar coming out of the same time. The advantage here is that it is much quicker, however it illustrates a state of the why they can never actually happened.
UX Recommendation: Idea #3
Additional Concepts
Translucent Sidebars:
http://www.youtube.com/watch?v=NzXPju5nW6o
One of the reasons the sidebars are so hard to find is because they are pinned all the way to the side of the webpage. In addition to discoverability, this is also a problem because the user has to move away from the spot in the page they're currently looking at just to get to the sidebars. The idea here is that an "accelerator gesture", such as a double finger swipe, will bring a sidebar out in a translucent state. This would not conflict with the way the sidebars usually act. As you can see from the video, as the user swipes to the side, the translucency goes away.
New tab animation:
http://www.youtube.com/watch?v=n9XrI_DIEbQ
Another discoverability problem that we have is that users don't know where their tabs are. We could add "new tab" to the android menu. When the users opens a new tab from the android menu, we would show this interstitial animation that would message to the user where their new tab resides.
Stage 3: Planning
7. Implementation plan
`
8. Reviews
Security review
`
Privacy review
`
Localization review
`
Accessibility
`
Quality Assurance review
Operations review
`
Stage 4: Development
9. Implementation
bug 625229(FIXED) - Make side panes easier to discover on first-run
Stage 5: Release
10. Landing criteria
` {{#set:Feature open issues and risks=` |Feature overview=Guide users on first run. Help them discover and understand features like side panels, awesome screen, sync, bookmarks, gestures, etc. |Feature users and use cases=` |Feature dependencies=` |Feature requirements=` |Feature non-goals=` |Feature functional spec=` |Feature ux design=There are several different concepts we can explore for first-run discoverability, as well as a few other ideas that might aid discoverability while the users are in product.
First-run Concepts
Idea #1:
http://www.youtube.com/watch?v=1Ph3s2Zu2Xo
The idea here would be to show the user a walk-through video with a dummy hand. This would be the most failsafe idea because we would show users exactly how to operate the UI. The negative here, is that it is very heavy-handed and assumes that our users don't know how to operate a touchscreen.
Idea #2:
http://www.youtube.com/watch?v=Jem7CgbM034
Essentially the same as idea #1, except we wouldn't show the dummy hand.
Idea #3:
http://www.youtube.com/watch?v=49Yh3UcoPS4
The idea here would be to take out any extraneous elements of the tutorial, such as the hands and/or notes. This idea is necessary because the notes are going to be hard to localize.
Idea #4:
http://www.youtube.com/watch?v=xmxQw_RExbo
This idea is basically the same as #3, except we show the sidebar coming out of the same time. The advantage here is that it is much quicker, however it illustrates a state of the why they can never actually happened.
UX Recommendation: Idea #3
Additional Concepts
Translucent Sidebars:
http://www.youtube.com/watch?v=NzXPju5nW6o
One of the reasons the sidebars are so hard to find is because they are pinned all the way to the side of the webpage. In addition to discoverability, this is also a problem because the user has to move away from the spot in the page they're currently looking at just to get to the sidebars. The idea here is that an "accelerator gesture", such as a double finger swipe, will bring a sidebar out in a translucent state. This would not conflict with the way the sidebars usually act. As you can see from the video, as the user swipes to the side, the translucency goes away.
New tab animation:
http://www.youtube.com/watch?v=n9XrI_DIEbQ
Another discoverability problem that we have is that users don't know where their tabs are. We could add "new tab" to the android menu. When the users opens a new tab from the android menu, we would show this interstitial animation that would message to the user where their new tab resides.
|Feature implementation plan=`
|Feature security review=`
|Feature privacy review=`
|Feature localization review=`
|Feature accessibility review=`
|Feature qa review=* QA Test Plan
|Feature operations review=`
|Feature implementation notes=* bug 625229 (FIXED) - Make side panes easier to discover on first-run
|Feature landing criteria=`
}}
Feature details
| Priority | P1 |
| Rank | 999 |
| Theme / Goal | ` |
| Roadmap | Firefox Mobile |
| Secondary roadmap | ` |
| Feature list | Mobile |
| Project | ` |
| Engineering team | Mobile front-end |
{{#set:Feature priority=P1
|Feature rank=999 |Feature theme=` |Feature roadmap=Firefox Mobile |Feature secondary roadmap=` |Feature list=Mobile |Feature project=` |Feature engineering team=Mobile front-end }}
Team status notes
| status | notes | |
| Products | ` | ` |
| Engineering | ` | ` |
| Security | sec-review-unnecessary | ` |
| Privacy | ` | ` |
| Localization | ` | ` |
| Accessibility | ` | ` |
| Quality assurance | ` | ` |
| User experience | ` | ` |
| Product marketing | ` | ` |
| Operations | ` | ` |
{{#set:Feature products status=`
|Feature products notes=` |Feature engineering status=` |Feature engineering notes=` |Feature security status=sec-review-unnecessary |Feature security health=OK |Feature security notes=` |Feature privacy status=` |Feature privacy notes=` |Feature localization status=` |Feature localization notes=` |Feature accessibility status=` |Feature accessibility notes=` |Feature qa status=` |Feature qa notes=` |Feature ux status=` |Feature ux notes=` |Feature product marketing status=` |Feature product marketing notes=` |Feature operations status=` |Feature operations notes=` }}