Member-only story
The Killer Flutter 3 Product, Animating Material Layers
So how could I get you to buy my first small Flutter UI-kit? How about taking Material Design 3 into new directions?
Material Design 3 New Directions
Okay, so the general direction of Material Design 3 over Material Design 2 is a new color space named HCT and ways to inject that into the normal widget UX patterns. Here is the re-implementation of MD3 cards:
But there are two problems:
1. The new MD3 cards has not been implemented in Flutter 3 SDK as of May 2022.
2. It’s not enough visual distinction in that the state opacity differences between user states is only on terms of 0.03 to 0.05 which just is not enough of a visual difference that a user will catch.
Sure I could just override the standard opacities via setting different elevation state which would translate to more visual differences but unlike MD2 we only have 6 elevation states instead of 12. Thus, that really is not adding more design power.
Let me show you via states: