Building Material Apps on Android
•Télécharger en tant que PPTX, PDF•
1 j'aime•352 vues
The presentation gives an Introduction to Material Design Guidelines for designing beautiful UI/UX and how to design Material apps on Android using various libraries and bunch of protips to design beautiful apps. a. Introduction to Material Design (What is Material Design) b. Benefits of using Material Design in Android c. Using Android Support Library (1st party libraries) to build Material apps d. Using 3rd party to build Material apps e. Protips
Recommandé
Contenu connexe
En vedette
Similaire à Building Material Apps on Android
Similaire à Building Material Apps on Android (20)
Dernier
Dernier (20)
Building Material Apps on Android
- 2. Building Material Apps on Android Get relaxed, the fun is about to begin!
- 3. Quick Intro ~3.5 years of Android Development Experience Akshay Chordiya +AkshayChordiya Solutions Pvt. Ltd
- 4. Material Design Material Design is a Google’s design philosophy or guidelines that outlines how apps should provide a coherent cross-platform experience
- 7. Material Design ● Material Design, when done right, could help your app to become more friendly to your users. ● Aimed to deliver a clean, modern, unified solution ● It defines the way that apps should look and behave
- 8. Material is Metaphor Bold, graphic, intentional Motion provides Meaning
- 9. Material is Metaphor Bold, graphic, intentional Motion provides Meaning
- 10. Material is Metaphor Bold, graphic, intentional Motion provides Meaning
- 11. Material is Metaphor Bold, graphic, intentional Motion provides Meaning
- 12. Material is the Metaphor Bold, graphic, intentional Motion provides meaning
- 13. Benefits of using Material Design Consistency across different platforms and devices Enriched end user’s experience Gives user a sense of familiarity
- 15. VS
- 16. google.com/design Read more about Material Design
- 18. Using Android Libraries First party
- 19. Using AppCompat
- 20. Major delights of AppCompat 1. Easier theming and tinting 2. Support Widgets. (Toolbar, a lot more custom widgets) 3. Elevation 4. Backward compatibility
- 22. Demo
- 24. UI Components in Design Library Navigation Drawer Floating Text Field Tabs Floating Button
- 25. Snack barScrolling App Bar Collapsing App Bar
- 26. Newly added components Bottom Sheet Bottom Navigation
- 28. Demo
- 29. Using 3rd Party Libraries
- 30. Using Material Dialog library
- 31. Demo
- 32. And a lot more 3rd party libraries..
- 33. Bunch of
- 35. Material Design is guideline for design not rules so you can go out of the box Always search for library before reinventing the wheel #ProTip
- 36. Further Links All the images and logos used are trademarks of respective companies. Material Design Material IO Material Design Video Android Support Library Blog Android Support Library Docs Material Dialog Library
- 37. Questions?
Notes de l'éditeur
- Slide to show before starting with presentation
- Welcome everyone to this tech talk. I’m glad to see all of you over here. How many of you have worked on Android before? I’ll try to explain as easy as possible.
- A quick intro about me. I’m Akshay Chordiya. I have been working on Android for more than 3 years. I have enjoyed working on it, though sometimes it has been messy 😜
- Let’s begin with the technical definition of Material Design
- I’m pretty sure that definition didn’t help much to understand what Material Design is about. Probably you remembered your school days, LOL
- Let’s watch this video which should clear up what Material Design is about
- Principles of Material Design. Let’s understand them.
- Material is Metaphor means //TODO
- Imagery plays an important role in Material Design. The emphasis is on user actions which makes core functionality immediately apparent and provides waypoints for the user
- Motion should be meaningful and appropriate. It be should be continued i.e it should not break the user's’ attention. Like our real world where things do not come out of nowhere and disappear into nowhere.
- There are 3 key principles of Material Design that I will be discussing. As I talk about them, I’m going to leave this animation running, and use it to illustrate them. As you can probably guess by the name, Material Design has something to do with materials. The point here is that Material Design is all about looking at your components as objects, and to imagine them in the real world, governed in many ways by the rules of physics. These objects move about naturally, they expand and they contract. They’re not limited by the rules of physics, but follow them in many ways. A big focus of Material Design is to dial up the visuals. Imagery plays an important role and I’ll be spending some time dedicated to this just to share some best practices. The colours are completely unlike Android 1.0, serving a key purpose. Animations show acceleration, the transitions begin where the touch event occurs or where the item already existed.
- You may or may not use Material Design
- Choose yourself which one looks better
- There is so much about Material Design. Please check out the following link to read more about it.
- We have learned what Material Design is and are now convinced about why to use it. Now we will learn how to apply Material Design to our apps. The newbie way is to check material design guidelines and build the material UI required for the app, which is surely going to take time. Instead of building the app and matching the design with guidelines given by Material Design. It is recommended to use libraries to immediately start with building the app and meanwhile seeing the guidelines to understand if we are heading in the right direction.
- First party libraries are libraries provided by Android itself.
- Nowadays AppCompat library is added by default on creating new project in Android Studio. It’s one of the most used library in Android.
- There are plenty of things in AppCompat. It’s so huge that we can have a whole tech talk only about AppCompat.
- Demo: Create new project in Android Studio Show added dependency of AppCompat in gradle Added a button in the UI Initially show UI without using AppCompat Later show UI while using AppCompat
- Demo: Add dependency of Design library in gradle Create new activity with FAB
- The libraries are build by other developers to speed up building material design
- dependencies { // ... other dependencies here compile 'com.afollestad.material-dialogs:core:0.9.1.0' }
- Demo: Add dependency of Material Dialog in gradle Show dialog using the library
- You’ll find most of the libraries on GitHub
- Protips are tips and tricks which are gained over the years of experience. I’d like to share some of the protips which I have gained.
- Your HOLO ICS dialog will automatically change to Material Dialog without any significant code change
- Add this lib https://github.com/DreaminginCodeZH/MaterialColdStart
- Thank you everyone for coming and so patiently listening to this talk. I hope you enjoyed this session. Hoping to see you all again. I’ll be sharing the presentation probably on SlideShare.