Android User Interface Design: Implementing Material Design for Developers, Second Edition

Android User Interface Design: Implementing Material Design for Developers, Second Edition

Released November 2015
Publisher(s): Addison-Wesley Professional
ISBN: 9780134191942

Read it now on the O’Reilly learning platform with a 10-day free trial.

O’Reilly members get unlimited access to books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.

Start your free trial

Book description

Build Android 6 Material Design Apps That Are Stunningly Attractive, Functional, and Intuitive

As Android development has matured and grown increasingly competitive, developers have recognized the crucial importance of good design. With Material Design, Google introduced its most radical visual changes ever, and made effective design even more essential. Android 6 and the design support library continue to push mobile design forward.

In Android User Interface Design, Second Edition, leading Android developer and user experience (UX) advocate Ian G. Clifton shows how to combine exceptional usability and outstanding visual appeal. Clifton helps you build apps that new users can succeed with instantly: apps that leverage users’ previous experience previous experience, reflect platform conventions, and never test their patience.

You won’t need any design experience: Clifton walks you through the entire process, from wireframes and flowcharts to finished apps with polished animations and advanced compositing. You’ll find hands-on case studies and extensive downloadable sample code, including complete finished apps.

• Integrate Material Design into backward compatible Android 6 apps
• Understand views, the building blocks of Android user interfaces
• Make the most of wireframes and conceptual prototypes
• Apply user-centered design throughout
• Master the essentials of typography and iconography
• Use custom themes and styles for consistent visuals
• Handle inputs and scrolling
• Create beautiful transition animations
• Use advanced components like spans and image caches
• Work with the canvas, color filters, shaders, and image compositing
• Combine multiple views into efficient custom components
• Customize views to meet unique drawing or interaction requirements
• Maximize downloads by designing compelling app store assets

Step by step, this guide bridges the gap between Android developers and designers, so you can collaborate on world-class app designs...or do it all yourself!

“This well-presented, easy-to-grasp book gets to the heart of Android User Interface Design. Well worth the reading time!”
--Dr. Adam Porter, University of Maryland, Fraunhofer Center for Experimental Software Engineering

"Ian's grasp of Android is fantastic, and this book is a great read for any developer or designer. I've personally worked on 30+ Android applications, and I was learning new tips with every chapter."
--Cameron Banga, Lead Designer, 9magnets, LLC

Table of contents

  1. About This E-Book
  2. Title Page
  3. Copyright Page
  4. Dedication Page
  5. Contents at a Glance
  6. Contents
  7. Preface
  8. Acknowledgments
  9. About the Author
  10. Introduction
    1. Audience for This Book
    2. Organization of This Book
    3. How to Use This Book
    4. This Book’s Website
    5. Conventions Used in This Book
  11. Part I: The Basics of Android User Interfaces
    1. Chapter 1. Android UI and Material Design
      1. A Brief History of Android Design
      2. Material Design
        1. General Concepts
        2. Interaction and Animation
        3. Typography
        4. Metrics and Alignment
      3. The Android Design Website
      4. Core Principles
        1. Do One Thing and Do It Well
        2. Play Nicely with Others
        3. Visuals, Visuals, Visuals
        4. Easy but Powerful
        5. Platform Consistency
        6. Bend to the User
      5. Standard Components
        1. System Bars
        2. Notifications
        3. App Bar
        4. Tabs and Navigation Drawer
        5. The FAB
      6. Supporting Multiple Devices
      7. Avoiding Painful Mistakes
        1. Menu Button
        2. Long Press
        3. Notification Icons
        4. Styles from Other Platforms
      8. Summary
    2. Chapter 2. Understanding Views—The UI Building Blocks
      1. What Is a View?
        1. View IDs
        2. Understanding View Dimensions
      2. Displaying Text
        1. TextView
        2. EditText
        3. Button
      3. Displaying Images
        1. Backgrounds
        2. ImageView
        3. ImageButton
      4. Views for Gathering User Input
      5. Other Notable Views
      6. Listening to Events
        1. OnClickListener
        2. OnLongClickListener
        3. OnTouchListener
      7. Other Listeners
      8. Summary
    3. Chapter 3. Creating Full Layouts With View Groups and Fragments
      1. Understanding ViewGroup and the Common Implementations
        1. FrameLayout
        2. LinearLayout
        3. RelativeLayout
        4. AdapterView
        5. Toolbar
        6. Other Notable ViewGroups
      2. Encapsulating View Logic with Fragments
        1. The Fragment Lifecycle
        2. Giving Fragments Data
        3. Talking to the Activity
        4. Fragment Transactions
        5. Controversy
      3. The Support Library
        1. The CardView Library
        2. Design Library
        3. GridLayout Library
        4. Leanback Library
        5. MediaRouter Library
        6. Palette Library
        7. RecyclerView Library
        8. Support Annotations Library
      4. Summary
    4. Chapter 4. Adding App Graphics and Resources
      1. Introduction to Resources in Android
      2. Resource Qualifiers
      3. Understanding Density
      4. Supported Image Files
        1. Raster Images
        2. Vector Images
      5. Nine-Patch Images
      6. XML Drawables
        1. Layer List
        2. State List
        3. Level List
        4. TransitionDrawable
        5. InsetDrawable
        6. ClipDrawable
        7. ScaleDrawable
        8. ShapeDrawable
        9. VectorDrawable
        10. AnimatedVectorDrawable
        11. RippleDrawable
      7. Other Resources
        1. Strings
        2. Arrays
        3. Colors
        4. Dimensions
        5. Animations
        6. IDs
        7. Menus
      8. Summary
  12. Part II: The Full Design and Development Process
    1. Chapter 5. Starting A New App
      1. Design Methods
        1. Common Methods
        2. User-Centered Design
      2. Defining Goals
        1. User Goals
        2. User Personas
        3. Product Goals
        4. Device and Configuration Support
      3. High-Level Flow
      4. Wireframes
        1. Starting with Navigation
      5. Continuing with Content Pieces
        1. Wireframing a Detail Page
        2. Supporting Multiple Devices
        3. Naming Conventions
        4. Crude Resources
      6. Summary
    2. Chapter 6. Prototyping and Developing the App Foundation
      1. Organizing into Activities and Fragments
      2. Creating the First Prototype
        1. Tabs
        2. Navigation Drawer
        3. Tool Representation
        4. Tab Fragments
        5. Tool Details
      3. Evaluating the First Prototype
        1. Working with Users
        2. Open-Ended
        3. Specific Goal
        4. Dynamic Goal
        5. Real User Feedback
        6. Next Steps
      4. Summary
    3. Chapter 7. Designing the Visuals
      1. Wireframes and Graphical Design
      2. Tools
      3. Styles
        1. Skeuomorphism
        2. Minimalism
        3. Flat Design
        4. Material Design
      4. Lighting
      5. Colors
        1. The Science
        2. Choosing Colors
        3. The Woodworking App
      6. Text Considerations
        1. Text Contrast
        2. Text Sizes, Styles, and Capitalization
        3. Text Spacing
        4. Text Shadows
        5. Custom Fonts
        6. Accessible Vocabulary
      7. Other Considerations
        1. Varying Text Lengths
        2. Image Availability and Size
        3. Transparency and the 3× Rule
        4. Standard Icons
        5. Navigation and Transitions
        6. Error Cases
      8. Designing Step-by-Step
      9. Summary
    4. Chapter 8. Applying the Design
      1. Working with the Designer
      2. Slicing the Graphics Assets
        1. The Easy Slices
        2. Nine-Patch Images
        3. Generating Alternate Sizes
      3. Themes and Styles
      4. Breaking Comps into Views
      5. Developing the Woodworking App
        1. The Main Screen
        2. The Tool List
        3. The Tool Details
      6. Basic Testing Across Device Types
      7. Summary
    5. Chapter 9. Polishing with Animations
      1. Purpose of Animations
      2. View Animations
      3. Property Animations
      4. Property Animation Control
        1. Listeners
        2. Type Evaluators
        3. Time Interpolators
        4. Key Frames
      5. ViewPropertyAnimator
      6. Animating Form Errors
      7. Animating Icons
        1. Animating Vector Icons
        2. Animating Raster Icons
      8. Simple Transitions
        1. Scene Transitions
        2. Activity Transitions
        3. Circular Reveal Transitions
      9. Summary
  13. Part III: Advanced Topics for Android User Interfaces
    1. Chapter 10. Using Advanced Techniques
      1. Identifying Jank
      2. Using Systrace to Understand Jank
      3. Optimizing Images
        1. Shrinking Images
        2. Using the Right Sizes
        3. Using an Image Cache
      4. Additional Performance Improvements
        1. Controlling Garbage Collection
        2. View Holder Pattern
        3. Eliminating Overdraw
      5. Hierarchy Viewer
        1. Finding Missing Views
        2. Eliminating Unnecessary Views
        3. Exporting to PSD
      6. Custom Fonts
      7. Complex TextViews
        1. Existing Spans
        2. Using Spans for Complex Text
      8. RecyclerView
        1. Layout Manager
        2. Adapter
        3. Item Animator
        4. Item Decoration
      9. Summary
    2. Chapter 11. Working with the Canvas and Advanced Drawing
      1. Creating Custom Drawables
        1. General Concept
        2. Additional Important Methods
      2. Paint
      3. Canvas
      4. Working with Text
        1. A Simple Text Drawable
        2. A Better Text Drawable
      5. Working with Images
      6. Color Filters
        1. Lighting Color Filter
        2. Color Matrix
        3. PorterDuff Image Compositing
      7. Shaders
        1. Round Images
        2. Gradient Fades
      8. Summary
    3. Chapter 12. Developing Custom Views
      1. General Concepts
      2. Measurement
      3. Layout
      4. Drawing
      5. Saving and Restoring State
      6. Creating a Custom View
        1. Measuring
        2. Handling Layout
        3. Building the Bitmap
        4. Saving and Restoring State
      7. Summary
    4. Chapter 13. Handling Input and Scrolling
      1. Touch Input
      2. Other Forms of Input
      3. Creating a Custom View
        1. Creating the Initial Custom View Files
        2. Measuring
        3. Drawing
        4. Preparing for Touch Input
        5. Handling Touch Input
        6. Other Considerations
      4. Summary
  14. Appendix A. Google Play Assets
    1. Application Description
    2. The Change Log
    3. Application Icon
      1. Creating an Icon the Easy Way
      2. Creating an Icon Manually
    4. Screenshots
    5. Feature Graphic
    6. Promotional Graphic
    7. Video (YouTube)
    8. Promoting Your App
    9. Amazon Appstore
  15. Appendix B. Common Task Reference
    1. Dismissing the Software Keyboard
    2. Using Full Screen Mode
    3. Keeping the Screen On
    4. Determining the Device’s Physical Screen Size
    5. Determining the Device’s Screen Size in Pixels
    6. Determining the Device DPI
    7. Checking for a Network Connection
    8. Checking if the Current Thread Is the UI Thread
    9. Custom View Attributes
  16. Index
  17. Code Snippets

Product information

  • Title: Android User Interface Design: Implementing Material Design for Developers, Second Edition
  • Author(s):
  • Release date: November 2015
  • Publisher(s): Addison-Wesley Professional
  • ISBN: 9780134191942