Upgrade to PRO for Only $50/Year—Limited-Time Offer! 🔥

Material Design Components in Flutter

Avatar for Maureen Josephine Maureen Josephine
August 08, 2019
Programming
0
54

Material Design Components in Flutter

A session to cover material design components and how to make them useful in a Flutter App

Avatar for Maureen Josephine

Maureen Josephine

August 08, 2019
Tweet

More Decks by Maureen Josephine

See All by Maureen Josephine
My Flutter Journey
Avatar for Maureen Josephine maureenjosephine
0
70
Setting Lint Rules in Flutter
Avatar for Maureen Josephine maureenjosephine
0
110
Testing Flutter Apps-DevfestTanzania
Avatar for Maureen Josephine maureenjosephine
0
30
Internationalizing Flutter Apps
Avatar for Maureen Josephine maureenjosephine
0
35
Atlassian Forge
Avatar for Maureen Josephine maureenjosephine
0
31
Building your First Flutter for Web App
Avatar for Maureen Josephine maureenjosephine
0
71
Atlassian Codegeist - Forge
Avatar for Maureen Josephine maureenjosephine
0
140
Trello Uses Cases - Atlassian
Avatar for Maureen Josephine maureenjosephine
0
22
Getting Started with Flutter
Avatar for Maureen Josephine maureenjosephine
0
36

Other Decks in Programming

See All in Programming
大体よく分かるscala.collection.immutable.HashMap ~ Compressed Hash-Array Mapped Prefix-tree (CHAMP) ~
Avatar for matsu_chara matsu_chara
1
200
JJUG CCC 2025 Fall Javaコミュニティの歩き方 〜参加から貢献まで、すべて教えます〜
Avatar for Sugiyama Takaaki takasyou
0
620
Atomics APIを知る / Understanding Atomics API
Avatar for TOMIKAWA Sotaro ssssota
1
240
エディターってAIで操作できるんだぜ
Avatar for kis9a kis9a
0
540
Media Capture and Streams: W3C仕様と現場での知見
Avatar for Ryota Nakamura nowaki28
0
120
『実践MLOps』から学ぶ DevOps for ML
Avatar for Satsuki Nagae nsakki55
2
500
[SF Ruby Conf 2025] Rails X
Avatar for Vladimir Dementyev palkan
0
400
AIエージェントを活かすPM術 AI駆動開発の現場から
Avatar for gyuta gyuta
0
140
手が足りない！兼業データエンジニアに必要だったアーキテクチャと立ち回り
Avatar for zinkosuke zinkosuke
0
190
Full-Cycle Reactivity in Angular: SignalStore mit Signal Forms und Resources
Avatar for Manfred Steyer manfredsteyer
PRO
0
170
Socio-Technical Evolution: Growing an Architecture and Its Organization for Fast Flow
Avatar for Chris Richardson cer
PRO
0
170
WebRTC と Rust と 8K 60fps
Avatar for tnoho tnoho
2
1.7k

Featured

See All Featured
Distributed Sagas: A Protocol for Coordinating Microservices
Avatar for Caitie McCaffrey caitiem20
333
22k
I Don’t Have Time: Getting Over the Fear to Launch Your Podcast
Avatar for Joe Casabona jcasabona
34
2.5k
Performance Is Good for Brains [We Love Speed 2024]
Avatar for Tammy Everts tammyeverts
12
1.3k
RailsConf & Balkan Ruby 2019: The Past, Present, and Future of Rails at GitHub
Avatar for Eileen M. Uchitelle eileencodes
140
34k
How STYLIGHT went responsive
Avatar for nonsquared nonsquared
100
5.9k
Embracing the Ebb and Flow
Avatar for Simon Collison colly
88
4.9k
Visualizing Your Data: Incorporating Mongo into Loggly Infrastructure
Avatar for mongodb mongodb
48
9.8k
Code Review Best Practice
Avatar for Trisha Gee trishagee
73
19k
Building a Scalable Design System with Sketch
Avatar for Laura Van Doore lauravandoore
463
34k
Dealing with People You Can't Stand - Big Design 2015
Avatar for Cassini Nazir cassininazir
367
27k
YesSQL, Process and Tooling at Scale
Avatar for Rocio Delgado rocio
174
15k
Building Flexible Design Systems
Avatar for Yesenia Perez-Cruz yeseniaperezcruz
329
39k

Transcript

  1. MATERIAL DESIGN COMPONENTS IN FLUTTER

  2. MAUREEN JOSEPHINE Twitter: @J_Akello

  3. MATERIAL DESIGN?

  4. None

  5. Material design is a visual language that synthesizes the classic

    principles of good design with the innovation of technology and science.

  6. FIRST IMPRESSION ON MESSY ROOM?

  7. IMPRESSION ON A WELL ARRANGED ROOM

  8. WHY MATERIAL DESIGN? • Helps in delivering high quality outputs

    consistently across all platforms • Produces pleasant looking components that behave like real world objects. • Enhances user experience

  9. FACTORS TO CONSIDER • Brand • Color • Layout •

    Content doesn’t have to bore • Data

  10. FLUTTER APPROACH IN MATERIAL DESIGN Flutter is a technology developed

    by Google that can run on Android and iOS devices from a single codebase.

  11. MATERIAL COMPONENTS WIDGETS These are visual,behavioral and motion rich widgets

    implementing Material Design Guidelines. • App structure and navigation • Buttons • Input and selections • Dialogs, alerts and panels • Layouts.
  12. None
  13. None
  14. None
  15. None
  16. None
  17. None

  18. SAMPLE APP WITH MATERIAL DESIGN COMPONENTS

  19. None