Logo animation on Input Screen

[joshliebe]

Task/Issue URL: https://app.asana.com/1/137249556945/project/488551667048375/task/1210978319570196?focus=true

Description

• Animates the logo when moving between search and Duck.ai on the Input Screen

Steps to test this PR

Empty state

• Open the Input Screen
• Swipe between tabs
• Verify that the logo and tab indicator animate as expected
• Tap the tabs
• Verify that the logo animates as expected

Favorites

• Add some favorites
• Open the Input Screen
• Swipe between tabs
• Verify that the Duck.ai logo fades in (no animation)
• Tap the tabs
• Verify that the Duck.ai logo fades in (no animation)

UI changes

before.mp4

after.mp4

[joshliebe]

• Logo animation on Input Screen #6821 👈 (View in Graphite)
• develop

This stack of pull requests is managed by Graphite. Learn more about stacking.

[LukasPaczos]

One questions above and I also found a minor issue:

1. Open Input Screen.
2. Go to Duck.ai tab.
3. Type some text.
4. Manually scroll to search tab.
5. Delete the text.
6. Expected to see the regular logo but the AI logo is shown instead.

Screen_recording_20250922_103208.mp4

[LukasPaczos]

@joshliebe I still see a similar issue but now when text is cleared in Duck.ai mode.

1. Open Input Screen.
2. Go to Duck.ai tab.
3. Type some text.
4. Clear text.
5. Expected to see the AI logo but got regular one instead.

Screen_recording_20250922_124756.mp4

Another minor issue where the transition is a little jumbled. Adding a slowed-down recording below, but it's easily noticeable with a physical device.

1. Open Input Screen.
2. Type some text.
3. Go to Duck.ai tab.
4. Clear text.
5. Click on the search tab.

Screen_recording_20250922_125806_slow3x.mp4

[LukasPaczos]

Thanks for the updates!

I found one more edge case where the transition doesn't look great:

Screen_recording_20250922_165339_slow3x.mp4

That said, in search mode, the regular logo appears when the input has empty lines, while in chat mode the AI logo doesn’t. Since this also happens on develop, I wouldn’t treat it as a blocker, as the issue should resolve independently.

I dropped some additional comments below that'd be great to address, from the testing standpoint all LGTM!

[joshliebe]

Thanks for the updates!

I found one more edge case where the transition doesn't look great:

Screen_recording_20250922_165339_slow3x.mp4

That said, in search mode, the regular logo appears when the input has empty lines, while in chat mode the AI logo doesn’t. Since this also happens on develop, I wouldn’t treat it as a blocker, as the issue should resolve independently.

I dropped some additional comments below that'd be great to address, from the testing standpoint all LGTM!

This is an existing issue, it shouldn’t show the logo when expanding with new line. Will address separately.

[Copilot]

Pull Request Overview

This PR implements logo animation functionality for the Input Screen, adding smooth transitions between search and Duck.ai modes when users interact with tabs.

Key Changes

• Replaced static logo with animated Lottie view that transitions between "DuckDuckGo" and "Duck.ai" states
• Added scroll-based animation progress calculation with easing functions for smooth transitions
• Implemented tab tap detection to trigger targeted logo animations with different behavior than scroll animations

Reviewed Changes

Copilot reviewed 10 out of 10 changed files in this pull request and generated 3 comments.

Show a summary per file

File	Description
InputScreenViewModelTest.kt	Added comprehensive test coverage for logo animation logic including scroll calculations and tap behavior
styles.xml	Changed tab indicator animation from "elastic" to "linear" for consistent animation timing
duckduckgo_ai_transition_light.json	Added light theme Lottie animation file for logo transitions
duckduckgo_ai_transition_dark.json	Added dark theme Lottie animation file for logo transitions
fragment_input_screen.xml	Replaced ImageView with LottieAnimationView wrapped in FrameLayout for animation support
InputScreenViewModel.kt	Implemented core animation logic with scroll tracking, progress calculations, and command emission
InputModeWidget.kt	Added tab click detection and scroll position synchronization functionality
Command.kt	Added new command types for logo progress setting and animation triggering
InputScreenFragment.kt	Integrated Lottie animation handling, command processing, and lifecycle management
build.gradle	Added AndroidX archCore testing dependency for LiveData testing support

[LukasPaczos]

LGTM and works as expected, thanks for addressing the comments!

[LukasPaczos]

We already have the userSelectedMode field, could that be re-used?

[joshliebe]

I need to think about this a little, will fix in a follow-up.