FTUE Splash carousel MVP #4727

ouchadam · 2021-12-15T16:26:11Z

Part of #4584

Adds a MVP splash carousel behind a WIP flag
Will add a changelog once all the TODOs are done and the feature is enabled

TODO

Style the title fullstops
Automatic rotation of the carousel pages
Dark mode gradient (+ gradient tweaks from design)
Add phone landscape support
Replace temporary images

GIF

10" TABLET PORTRAIT	10" TABLET LANDSCAPE

3.4" PHONE SMALL	6.5" PHONE MID/LARGE

github-actions · 2021-12-15T16:52:07Z

Unit Test Results

  66 files ±0   66 suites ±0 50s ⏱️ -5s
135 tests ±0 135 ✔️ ±0 0 💤 ±0 0 ❌ ±0
418 runs ±0 418 ✔️ ±0 0 💤 ±0 0 ❌ ±0

Results for commit 785a142. ± Comparison against base commit f24c962.

♻️ This comment has been updated with latest results.

bmarty · 2021-12-15T17:23:29Z

...r/src/main/java/im/vector/app/features/onboarding/ftueauth/FtueAuthSplashCarouselFragment.kt

+    @Inject lateinit var vectorPreferences: VectorPreferences
+    @Inject lateinit var vectorFeatures: VectorFeatures
+    @Inject lateinit var carouselController: SplashCarouselController
+    @Inject lateinit var stringProvider: StringProvider


Why not injected in the constructor?

(Also a stringProvider here is a bit useless)

wasn't sure if we wanted to use it for consistency (can be helpful if the string provider ends up with extra behaviour)

didn't realise we had setup fragment constructor injection, will try it

1- You are directly using getString() later in the file :)
2- Cool thanks

done and done! 311474d cb88bfd

bmarty · 2021-12-16T08:59:22Z

Maybe update this file to explain how to generate webp image and in which case?

ouchadam · 2022-01-05T11:35:46Z

Maybe update this file to explain how to generate webp image and in which case?

design doc updated bb356ba

ouchadam · 2022-01-06T14:21:46Z

vector/src/main/java/im/vector/app/features/VectorFeatures.kt

 }

 class DefaultVectorFeatures : VectorFeatures {
    override fun onboardingVariant(): VectorFeatures.OnboardingVariant = BuildConfig.ONBOARDING_VARIANT
    override fun isAlreadyHaveAccountSplashEnabled() = true
+    override fun isSplashCarouselEnabled() = false


whilst the carousel is still WIP it's not enabled by default for the FTUE_AUTH variant

ouchadam · 2022-01-06T14:21:56Z

vector/src/main/java/im/vector/app/features/VectorFeatures.kt

    enum class OnboardingVariant {
        LEGACY,
        LOGIN_2,
        FTUE_AUTH
    }
-
-    enum class NotificationSettingsVersion {


this was unused

- also coverts the carousel pages to constraint layout and makes use of gutters to provide percentage based sizing

…ctor for project consistent

…e have the final images before creating separate densities

bmarty

Nice work thanks. Just a few minor remarks

bmarty · 2022-01-06T20:11:31Z

docs/design.md

+ - right clicking the image file within the project file explorer
+ - select `Convert to WebP`
+
+https://developer.android.com/studio/write/convert-webp


bmarty · 2022-01-06T20:17:47Z

...r/src/main/java/im/vector/app/features/onboarding/ftueauth/FtueAuthSplashCarouselFragment.kt

+        views.splashCarousel.adapter = carouselController.adapter
+        TabLayoutMediator(views.carouselIndicator, views.splashCarousel) { _, _ -> }.attach()
+        carouselController.setData(SplashCarouselState(
+                items = listOf(


Since this state is static, maybe move all this to the constructor of SplashCarouselState?

bmarty · 2022-01-06T20:22:37Z

vector/src/main/res/drawable/bg_carousel_page_1.xml

+    <gradient
+        android:endColor="#3372C7DA"
+        android:startColor="#33BBE7CF" />
+</shape>


I do not have a strong opinion on it, but maybe move the new drawables to the module ui-styles? The webp images could stay in the vector project. IDK...

sounds good to me 👍
785a142

bmarty · 2022-01-06T20:24:10Z

vector/src/main/res/values/strings.xml

+    <string name="ftue_auth_carousel_2_body">Element lets you choose where you messages are stored, keeping you in control of your data.</string>
+    <string name="ftue_auth_carousel_3_title">Connect with anyone.</string>
+    <string name="ftue_auth_carousel_3_body">Element works with all Matrix-based apps and can even bridge into proprietary messengers.</string>
+    <string name="ftue_auth_carousel_4_title">Cut the slack from teams.</string>


it's very subtle 😂

bmarty · 2022-01-06T20:27:39Z

As a side remark, I am wondering if we could have some sort of parallax effect for the background gradient. It looks a bit too simple like this.

ouchadam · 2022-01-07T09:19:55Z

As a side remark, I am wondering if we could have some sort of parallax effect for the background gradient. It looks a bit too simple like this.

it's definitely something we could iterate on

ouchadam added the Z-FTUE Issue is relevant to the first time use project or experience label Dec 15, 2021

ouchadam closed this Dec 15, 2021

ouchadam reopened this Dec 15, 2021

ouchadam marked this pull request as draft December 15, 2021 16:31

bmarty reviewed Dec 15, 2021

View reviewed changes

ouchadam force-pushed the feature/adm/i-already-have-an-account branch from 6846cf2 to 4d02621 Compare December 16, 2021 10:35

ouchadam force-pushed the feature/adm/splash-carousel branch from fa6f098 to 9a71aea Compare December 16, 2021 10:46

ouchadam force-pushed the feature/adm/i-already-have-an-account branch from 4d02621 to 8814cd4 Compare December 16, 2021 11:14

ouchadam force-pushed the feature/adm/splash-carousel branch from 9a71aea to 5fafbff Compare December 16, 2021 11:33

ouchadam force-pushed the feature/adm/i-already-have-an-account branch from 854953e to 801a02e Compare December 16, 2021 12:22

ouchadam force-pushed the feature/adm/splash-carousel branch from 5fafbff to cb88bfd Compare December 16, 2021 12:30

This was referenced Dec 16, 2021

Automatic carousel rotation #4740

Merged

Build FTUE Splash screens #4584

Closed

ouchadam force-pushed the feature/adm/i-already-have-an-account branch from 801a02e to 6fbf8fa Compare January 6, 2022 10:03

ouchadam force-pushed the feature/adm/splash-carousel branch from bb356ba to b5501a2 Compare January 6, 2022 11:29

ouchadam commented Jan 6, 2022

View reviewed changes

Base automatically changed from feature/adm/i-already-have-an-account to develop January 6, 2022 17:11

ouchadam mentioned this pull request Jan 6, 2022

Enabling FTUE_AUTH onboarding variant #4872

Merged

ouchadam added 4 commits January 6, 2022 17:50

renaming the ftue domain to onboarding and ftue to ftue auth

e757646

cloning the splash fragment into the onboarding

fa939a2

adding I already have an account functionality to the ftue auth splash

16ed3f7

copying all of the login fragments into the ftue auth domain

2541c3f

ouchadam force-pushed the feature/adm/splash-carousel branch from b5501a2 to cb1baea Compare January 6, 2022 18:10

ouchadam marked this pull request as ready for review January 6, 2022 18:12

adding debug feature flag for the splash carousel

773d335

ouchadam added 12 commits January 6, 2022 19:54

adding barebones splash carousel fragment, based on feature flag

955fb03

adding carousel content, images are temporary

a2f780b

adding gradient backgrounds to the carousel pages

6929c94

- also coverts the carousel pages to constraint layout and makes use of gutters to provide percentage based sizing

converting temporary carousel images to webp

c0db9f7

extracting the inner carousel fragment classes

633f495

disabling ftue auth carousel whilst its in dev

d719309

reverting rebased named change

5df47fb

adding missing super

58d9da5

using fragment module provided injections to enable using the constru…

f62ebbc

…ctor for project consistent

removing redundant strings provider

313a2a8

deleting tmp carousel images from the hdpi package, will wait until w…

0868ca9

…e have the final images before creating separate densities

updating design doc to mention converting images to webp

7ad0e25

ouchadam force-pushed the feature/adm/splash-carousel branch from cb1baea to 7ad0e25 Compare January 6, 2022 19:55

bmarty approved these changes Jan 6, 2022

View reviewed changes

ouchadam added 2 commits January 7, 2022 11:16

moving the static carousel state creation to the state constructor

8a3652a

moving the carousel backgrounds to the ui-styles module

785a142

bmarty approved these changes Jan 7, 2022

View reviewed changes

ouchadam merged commit 28f6d10 into develop Jan 7, 2022

ouchadam deleted the feature/adm/splash-carousel branch January 7, 2022 13:36

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

FTUE Splash carousel MVP #4727

FTUE Splash carousel MVP #4727

ouchadam commented Dec 15, 2021 •

edited

Loading

github-actions bot commented Dec 15, 2021 •

edited

Loading

bmarty Dec 15, 2021

bmarty Dec 15, 2021

ouchadam Dec 15, 2021

bmarty Dec 16, 2021

ouchadam Jan 5, 2022

bmarty commented Dec 16, 2021

ouchadam commented Jan 5, 2022

ouchadam Jan 6, 2022

ouchadam Jan 6, 2022

bmarty left a comment

bmarty Jan 6, 2022

bmarty Jan 6, 2022

ouchadam Jan 7, 2022

bmarty Jan 6, 2022

ouchadam Jan 7, 2022

bmarty Jan 6, 2022

ouchadam Jan 7, 2022

bmarty commented Jan 6, 2022

ouchadam commented Jan 7, 2022

FTUE Splash carousel MVP #4727

FTUE Splash carousel MVP #4727

Conversation

ouchadam commented Dec 15, 2021 • edited Loading

github-actions bot commented Dec 15, 2021 • edited Loading

Unit Test Results

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

bmarty commented Dec 16, 2021

ouchadam commented Jan 5, 2022

Choose a reason for hiding this comment

Choose a reason for hiding this comment

bmarty left a comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

bmarty commented Jan 6, 2022

ouchadam commented Jan 7, 2022

ouchadam commented Dec 15, 2021 •

edited

Loading

github-actions bot commented Dec 15, 2021 •

edited

Loading