Nick Butcher (Developer Advocate at Google) recently published the source code for Plaid, an app meant to showcase material design on Android with playful animations, impeccable typography, and a simple, bold aesthetic. The code will provide useful examples for developers, but the app itself is worth keeping installed too - Plaid pulls stories from Designer News, Dribbble, and Product Hunt to serve up design news and inspiration, catered to your preferences.


Besides more standard material elements, the app has a few unique tricks. Specifically, the toolbar is behind the content rather than lying on top of it, making the scrolling action on the main grid a little more elegant. Floating action buttons animate into dialogs when necessary. Swiping down at the top of a screen gets you back to the main grid (similar to Inbox). Header imagery gets to reserve its own chunk of real estate when the user scrolls down, and Plaid uses Chrome custom tabs for news articles.

Oh, and it solves the 4dp baseline grid issue. For those unfamiliar, Google suggests aligning text baselines to a 4dp grid on Android. But this isn't easy out of the box. Roboto's default line height won't align consistently to a 4dp grid on every device, and Android only provides android:lineSpacingExtra and android:lineSpacingMultiplier to adjust lineheight on the normal TextView (so simply setting the lineheight to a specific dp value and calling it a day is out of the question). Plaid extends the TextView to solve this problem, and the result is beautiful.


Screenshot made with Keyline Pushing

Whether you're a designer, a developer, or both, Plaid is worth a look. You can grab it (in beta) from the Play Store or check out the code on Github.