Android App UI Design with Adobe Photoshop & Material Design
So this course will uncover the mysteries of Designing Android Apps using Material Design in Adobe Photoshop. You will learn
Read more
So this course will uncover the mysteries of Designing Android Apps using Material Design in Adobe Photoshop. You will learn
So this course will uncover the mysteries of Designing Android Apps using Material Design in Adobe Photoshop. You will learn
How to convert DPs and SP Material Design units to Pixels (PX)
Which template size to start with?
What are Density Buckets and how do we design for all the different Android Phone Resolutions?
How to theme your App using Google Material Colors?
Understand all the Specs and Sizes and Typographic Grids of Material Design
What's new and possible with Material Design 2.0?
Design a real world actual App using Photoshop art boards
Extract all your assets using Photoshop
Hand-off your Android Designs to your Developers using Zeplin
What are 9-patch PNG assets and how to generate them?
Generate Coded Style Guides for your Android Developers
Design 6 Android App Screens UI of a Medical App using Photoshop
So you will deep dive into Google Material Design using Adobe Photoshop and Handoff your designs using Zeplin to give your Developer coded Style Guides
So lets start learning together
What's inside
Learning objectives
- Ins and outs of android app design
- Master google material design sizes and specifications of design
- Understanding google material design colors
- Theme your android apps with your own colors
- Export all your assets using photoshop and 9 patch tools
- Handoff your designs to developers using zeplin
- What is dp, sp and how to convert them to pixels?
- How google material shadows & elevations work?
- Design sleek android apps using photoshop
- Understand pro level android app design process and workflow
- Learn what's new in google material design 2.0
- Show more
- Show less
- Ins and outs of android app design
- Master google material design sizes and specifications of design
- Understanding google material design colors
- Theme your android apps with your own colors
- Export all your assets using photoshop and 9 patch tools
- Handoff your designs to developers using zeplin
- What is dp, sp and how to convert them to pixels?
- How google material shadows & elevations work?
- Design sleek android apps using photoshop
- Understand pro level android app design process and workflow
- Learn what's new in google material design 2.0
- Show more
- Show less
Syllabus
Learn what is different Material Design sizing units like DP and SP and what is Screen Density and Resolution and how to convert DP to Pixels in Photoshop
Read more
Syllabus
Introduction to what this Android Design course will cover and who is this course for. If you are a beginner in Photoshop, take my other courses as this is not for novices in Photoshop
A lot of people get confused by Screen Resolution and Screen Density of Smart Devices. In this lesson you will learn the difference between the two and install a Free App to measure the screen resolution and density of your own Device
So what is DP (Device Independent Pixel) and how Material Design uses it for different sizing of its design elements. Also how the DPs will translate into Photoshop pixel sizes
Free online tools to convert DP to PX and convert Pixels to DPs
Learn about the 5 Density Buckets Android Material Design is using and learn why do we need to create multiple graphical assets for support all the Android Device Density Buckets
Online tool by Google to see the resolution, device sizes in inches and pixels along with Density of all the common smart devices we use
SP or Scale-able pixels are typography units used by Google Material Design to size text in Android Apps. Learn all about SP and how to get the accurate sizes in Photoshop
A little exercise on how to convert DP unit to Pixels in Photoshop. Once you understand the relationship of Pixels and Dp, you can design any Android App with ease
Lets see how much you have got the concepts of Material Design
Links to online tools and resources to study further
Learn about all the User Interface regions of Android Apps and what are their names and locations as it will help you design better
What is the science behind Material Design and how this whole Material Design actually works with Shadows and Elevations
Learn about different Material Shadows and their uses in Android App Design
Learn how to setup 8-point Grid system in Android Material Design and how you can set it up using Adobe Photoshop
What is the vertical rhythm of Google Material Design and how different vertical spacing and metrics work in Google Material Design?
What are the standard button and icon sizes a designer must use in Android App Design. Learn the principles of Material Design
Different Tabs of Material Design, their sizes, specs and when to use them. Learn all that in this lesson
What are the different App bar types and what are their heights and widths in DPs and when to use them. Learn all that in this lesson
Learn what are the different types of lists in Material Design and what are their sizes and when to use them
- Single Line Lists
- Two lines Lists
- Three Lines Lists
We also have Bottom fixed Navigation in Android Apps so in this lesson, you will learn what are the specs, sizes and when to use that in your design
SideNav or Navigation Drawer are used most often in Material Design and Android Apps. Learn about the sizes, specs and elevation of Nav Drawer in this lesson
How Type scale of Material design works in Photoshop. Learn how to convert SP sizes into Photoshop's pixels
Links and Tools used in this section
If you can theme your Android Material App accurately, you have done 50% of the design work. So learn all the ins and outs of color scheme of your Android App and how many colors you actually need
Few online tools that can help you build or test your color schemes and a little about accessibility issues
Links and resources to online tools and study material
Before starting any Design, you need all the necessary assets like Icons, UI Kits and necessary files. Download them in this lesson
In this lesson, we will use XXHPI template to design our whole exercise and the reason why I selected 3X to start with in Photoshop
Design the Signup Screen using Photoshop
Design Login Screen of your Medical Android App for Doctors
Design the Tab bar of your Android App in this lesson
Designing the dashboard top content area
Designing the Info Card for our Android App
Designing the activities screen of your Android App in Photoshop
Design Sync Files Screen of your Android App
Design the SideNav (Drawer) of your Android App
Handoff your Android App Design to your Developers using Zeplin and generate a coded style guide and text styles for your developers
Learn what are 9 patch tools and how to use one to create 9 patch images for your Android Developers
Deep dive into 9 patch tool and learn how these 9 patch graphics actually work
Learn how to use Photoshop to Export multiple assets for 1x, 1.5x, 2x, 3x and 4X using Export As feature of Photoshop. So you will extract multiple images for mdpi, hdpi, xhdpi, xxhdpi and xxxhdpi using Photoshop
Links to tools for creating 9 patch images
Learn what is new in Google Material 2.0. What they have included more? What are the new things in Material Design 2.0
Design limitations and new Shapes allowed in Material Design 2.0
Revision of Spacing and Grid in Material Design
How Material Design uses emphasis in Button Design and what are different types and states of Buttons
Lets revise the new Material Lists
A new pattern called Bottom App bar has been introduced in Material 2.0. Learn all about it here
A revision in the Tabs specs of Material Design
Material Card Specification and interactions. Expanding and collapsing cards and much more in this lesson
A new look to Material Typography system in Material Design 2.0
Links to Material 2.0 more in depth study links
What to do next after finishing this course
Discount coupons to take the next courses
Save this course
Save
Activities
Career center
Reading list
Save
Save
Save
Save
Save
Share
Similar courses
OpenCourser helps millions of learners each year. People visit us to learn workspace skills, ace their exams, and nurture their curiosity.
Our extensive catalog contains over 50,000 courses and twice as many books. Browse by search, by topic, or even by career interests. We'll match you to the right resources quickly.
Find this site helpful? Tell a friend about us.
We're supported by our community of learners. When you purchase or subscribe to courses and programs or purchase books, we may earn a commission from our partners.
Your purchases help us maintain our catalog and keep our servers humming without ads.
Thank you for supporting OpenCourser.
