There are currently no items in your shopping cart.

User Panel

Forgot your password?.

Android App UI Design with Adobe Photoshop & Material Design

Video Introducing this tutorial

Understanding Google Material Design concepts :
Introduction to the Course
What is Screen Resolution and Screen Density?
What is DP (Device Independent Pixels) and how its different from PX?
DP to PX conversion Online Tools
What are Android Density Buckets?
Online Tools for Screen Resolution, Density and Device Sizes
What are SP type sizes in Google Material Design?
How DP works and calculated in Adobe Photoshop?
Material Concepts Quiz
Section 1→ Links to Tools and Resources
Design your Introduction Screen using Photohop Android Template

Material Design Specs, Sizes and Metrics :
UI Regions of Android Apps
How Material Design works (Base of Material Design)?
What are Material Shadows?
Google Material 8-point Grid in Photoshop
Metrics and Vertical Spacings in Google Material Design
Buttons and Icon Sizes in Material Design
Types and Specs of Tabs in Android App Design
App Bar in Android Material Design
Sizes and Types of Lists in Android App Design
Specs and usage of Bottom Navigation Bar
Side Nav Drawer in Material Design
Android Type Scale in Photoshop
Section 2 → Link to tool and Resources

Mastering Material Color Schemes and how to build one :
How to build a superb Color Scheme in Material Design 2.0?
Online Color Scheme tools for Material Colors
Section 3 → Links and Resources for Material Colors

Design Android App using Adobe Photoshop (Exercise) :
Download UI kits and Assets before starting design
Using XXHDPI template in Photohsop for your Android App Design
Design Signup Screen Part 1
Design Signup Screen Part 2
Design Signup Screen Part 3
Design Login Screen for Android Medical App
Dashboard Tabbar Design for Android App
Dashboard Top Content Area Design
Dashboard Card Design top section
Dashboard Card Design bottom section
Activities Screen Design using Lists of Material Design
Sync Files Screen Design
Side Nav Drawer Design using Material Design Specs
Create 3 Screen Messaging SMS App using Google Material Design

Exporting Assets and Design HandOff :
Using Zeplin to HandOff your Design to Developer
What are 9-patch images and how to generate them?
What is the science behind 9-patch graphical assets?
Using Photoshop Export As panel to export all Density Bucket assets
Section 5 → Links and Resources 9 patch assets

What's New in Google Material 2.0? :
What's New in Material 2.0
New Design Options, new shapes and a lot more
Spacing Grid in Material 2.0
Button Types, emphasis levels and button states in Material Design 2.0
List items in Material 2.0
Bottom and Top App Bar
Material Tabs 2.0
Material Cards Specs in 2.0
Type System Material 2.0
Section 6 → Links to resources in depth Material 2.0
What to do NEXT?