mozilla-mobile / fenix

⚠️ Fenix (Firefox for Android) moved to a new repository. It is now developed and maintained as part of: https://github.com/mozilla-mobile/firefox-android
https://github.com/mozilla-mobile/firefox-android
Mozilla Public License 2.0
6.47k stars 1.27k forks source link

[UX] Animations & Motion Milestone 2 #167

Closed lime124 closed 4 years ago

lime124 commented 5 years ago

Multitasking Animations (GH #353):

Private Browsing

Other

┆Issue is synchronized with this Jira Task

bbinto commented 5 years ago

What is this ticket about? All app animations?

vesta0 commented 5 years ago

@AmyYLee would you please provide an estimate for this work? S/M/L

colintheshots commented 5 years ago

Should we move this to Milestone 3?

bbinto commented 5 years ago

@colintheshots - why?

@AmyYLee and @lime124 to provide update please.

Thanks

lime124 commented 5 years ago

Amy is out today but will be back tomorrow. I'll check with her about this.

AmyYLee commented 5 years ago

@colintheshots Hi, can you direct me to which developer is working on this? Thanks

bbinto commented 5 years ago

Let's also please get some estimates, @AmyYLee (once you've talked to the engineer)

AmyYLee commented 5 years ago

1. Opening an existing tab from the home screen - Transition duration 120ms

• Apply Android ripple overlay on release of pressed state on tab. • After ripple animation, tab moves up and simultaneously fades out to 0% opacity. • Browser chrome and website screen moves up and simultaneously fades in to 100% opacity.

2. Closing a tab - Transition duration 120ms

• Animation is reversed (website screen slides down and fades out, tab slides down and fades in).

Animation reference: https://drive.google.com/file/d/1gg-tCqAKrI08ANVpekGmnltCqvS0o6RS/view?usp=sharing

3. Tab switching (from reference browser: mozilla-mobile/reference-browser#511)

• Slide screen in from bottom to top

Animation reference: https://drive.google.com/file/d/1e_vgEos5luLWp2ZFuHr-4dUlkwhL5BdR/view?usp=sharing

4. Tapping search bar from home screen - Transition duration 150ms

• Search bar slides up and transitions in size and colour (search bar height is condensed, search field goes grey, text changes colour). • Fenix logo slides up with search bar • Fenix logo fades out along with options/PBM icons once it reaches the top of the screen • Contents below the search bar fade out at the same time as search bar slides up • Keyboard fades in and slides up at the same time as content fades out.

Animation reference: https://drive.google.com/file/d/1gPL3JO3uNgl9LmpJ8P2cnEey3YsLGyGL/view?usp=sharing

5. Private Browsing Switching the home view from normal to private mode (namely the background gradient) #181

• Current fade transition is fine - shorten the duration to 100ms.

6. Saving a collection confirmation

Confirmation of saved collection https://drive.google.com/file/d/1mtg3KDfu5tQQpFPnKArVbvYNYfR4HVDo/view?usp=sharing

colintheshots commented 5 years ago

This looks good from an engineering standpoint to me.

lime124 commented 5 years ago

there doesn't seem to be any eng tickets with this. how should we get this in to that backlog of work? @bifleming @mheubusch @st3fan

bifleming commented 5 years ago

IS this another one like Telemetry, where we need to go back to every feature and add an animations story? Or would we rather do this one differently -- add a bunch of user stories under an Animations Meta.

On Wed, Mar 27, 2019 at 1:06 PM Tiffanie Shakespeare < notifications@github.com> wrote:

there doesn't seem to be any eng tickets with this. how should we get this in to that backlog of work? @bifleming https://github.com/bifleming @mheubusch https://github.com/mheubusch @st3fan https://github.com/st3fan

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub https://github.com/mozilla-mobile/fenix/issues/167#issuecomment-477327249, or mute the thread https://github.com/notifications/unsubscribe-auth/AtYB4P2CCDp9hT3wZnHn_VZpzja8Tn1eks5va89jgaJpZM4aEIOI .

-- Regards, Betty


Betty Fleming | bfleming@mozilla.com | Engineering Program Manager, Firefox Mobile

sblatz commented 5 years ago

@AmyYLee, @lime124 can we close this? Seems like it's done.

Please re-open if I'm mistaken :)