Smashing Android UI Table of Contents Part I: Introduction to Android Design Chapter 1: Introduction to Usability and User Interface Design Considering Technology versus design Understanding the Mental Model Forming a mental model Platform consistency and user expectations Designing for users User Goals Don’t talk about features Determining user goals From goals to features No App will do everything; pick your battles You are the expert; users are not designers Know your users; design for real people Using Personas Getting into your user’s head Summary Chapter 2: Don’t Start Coding Just Yet Prototyping Wireframes High-fidelity prototypes Proof of Concept Tools for Design OmniGraffle and stencils WireframeSketcher and templates Balsamiq Android Eclipse plug-in GUI builder Pencil Additional Utilities User Testing SelectING your participants carefully Planning for A user test Stay neutral; don’t guide the users Don’t over-correct; are the findings real? Five users are enough Mobile user testing User Testing with paper prototypes Back to THE drawing board Summary Chapter 3: Considerations in Designing for Mobile and Touch Devices Designing for Mobile Use context of mobile devices Mobile multitasking Device constraints Battery power is not endless Rapid innovation Network connection will drop Data is not free Passionate users and opportunities Native apps versus web apps Hybrid apps with HTML wrappers Designing for Touch Interfaces IMPLEMENTING Gestures Gesture discovery Gesture confusion React to gestures immediately Touch interface, not so natural interface Summary Chapter 4: Exploring the Android Platform Challenges of the android platform Hardware Google’s control Tablets OEM distributions, skins, and themes Holo theme unifies Android app look Keyboard replacements Third-party home screen replacements Android versions Android on tablets Android Jelly Bean, the latest android release Nexus Devices Updates to older devices Which version should you target? Android app distribution The app stores Application safety and approval processes Which app store to use Make users feel safe What does open source mean? Access to source code Android community Custom ROMs Summary Part II: Android Platform Features and UI Components Chapter 5: Android App Structure and Online Guidelines Android app structure overview Android app basic building blocks Intents and broadcasts Services App Widgets Android project structure overview Component folders Libraries Official Android guidelines Android developer documentation Android design guidelines Google Play guidelines Summary Chapter 6: Android Intents Intents allow apps to work together Using Social Networks and Sharing Working with Browsers How do Android intents work? Types of Intents Technical example of sending intents Intent Filters: Actions, Data, and Categories Technical example of Receiving intents Creating your own Actions Intents are everywhere Intents Versus Third-party APIs Summary Chapter 7: Android App Navigation Structure Components of Android navigation, Activities, and Intents Modifying back stack behavior with intent flags Tasks Android Navigation controls The Home button The Back Button The Up button User Confusion Navigation Improvements in Android 4.1 Multitasking Where does an app start? Exiting an app Making sure that users know where they are Navigating to another app Navigating from notification Non-activity navigation Stopping running processes with the back button Using Transition animations Summary Chapter 8: Home Screen App Widgets Uses of Home Screen App Widgets Displaying relevant up-to-date information and being context aware Providing easy access to simple functions and toggle controls Providing Shortcuts to app functionality Developing App widgets for tablets Updating app widget data Automated Updates Updating Upon User Interaction Designing Setup activity App widget layout and functionality User Interaction with App Widgets Understanding the Home Screen Grid Defining Your App Widget’s Minimum Size Available Layouts and Components Resizable Widgets App widget preview Implementing an app widget Configuration XML App widget layout App Manifest file App widget provider Summary Chapter 9: Notifying and Informing Users Android Notification methods Inline/embedded notifications Toasts Status bar notifications Pop-up dialog boxes When to notify users Ongoing background tasks Events Errors When not to notify users Avoiding pop-ups Getting the most from status bar notifications Notification content Stacking notifications Be timely Ongoing tasks Implementing status bar notifications Summary Chapter 10: Designing for Hardware Buttons, Input Methods, and Sensors Designing for the Touch screen Resistive touch screens Capacitive touch screens The Future of touch screens Designing Phone hardware buttons The Menu button is dead Designing for the On-screen keyboard Input methods Input type Action button and IME options Third-Party Keyboards Designing for Hardware keyboards Designing for D-Pads and Trackballs Designing for the Stylus Designing for Voice control Designing for External Keyboards, mice, and touchpads Designing for Connected smart accessories Designing for Sensors Designing for a Second screen Summary Chapter 11: Designing Platform User Interface Components Using User interface widgets Text widgets Buttons Toggle Components Selection components Date and time widgets Progress bars Media widgets Sliding drawer Lists Customizing user interface widgets Colors Selectors Adjusting the Typography Fonts Typeface Text style Text size Text color and shadow Formatting from HTML Creating app-wide text styles Using Icons Dealing with screen densities Icon types Platform icons Icon packs Using Animations and transitions Activity transitions Tween Animations Frame animations Property animations Animation Interpolators Summary Part III: Scalable Android Design Chapter 12: Managing Android Resources Using Android resources Configuration qualifiers Combining Qualifiers Library Projects and Overriding Resources API Level Requirements Designing for Screen density What does screen density mean in practice? Why is screen density important? Screen density in Android terms Automatic graphics scaling vs. separate assets res/drawable/ folder is for XML only Preventing scaling Screen densities that matter Density independent pixels, dp Designing for Screen size and form Generalized size Fine grained screen size Aspect ratio Screen orientation Designing for Language and region Designing for Device controls Designing for Platform versions Designing for Device modes Summary Chapter 13: Android App Layouts Android layout strategy Fixed areas Resizable areas Combining fixed and resizable areas Layouts in Layouts Layouts from XML and code Layout managers Relative Layout Linear Layout Frame Layout Grid Layout and Table Layout Tabs Defining a layout size Scrolling Scroll View Z axis, layout order Padding and Margin Import and Merge layout files Custom layouts Android Development Tools user interface builder Debugging layouts Summary Chapter 14: Scalable Graphics Nine-patching Nine-patch structure in Android Using nine-patch images in code Nine-patch tool in SDK Nine-patch images from drawing tools Drawable XML Shapes Padding Gradients Color Bitmaps Composite drawables with layers Scale and Rotate Drawing from code Drawing on Canvas Paint object Shape-drawing Example Summary Chapter 15: Beyond Scalable – Responsive Design More Android devices than just phones Android tablets Google TV Understanding Responsive design How to approach responsive Android design Don’t Build a Tablet App: Design for Tablets Reusable components (fragments) Finding minimum and maximum size Cost-benefit evaluation Common ways to create responsive user interfaces Screens to columns Floating screens Optional content Adjusting components one for one Summary Chapter 16: Implementing Responsive User Interfaces Introduction to Fragments Creating fragments Fragment lifecycle Adding fragments to layouts FragmentManager and FragmentTransaction Fragment and Activity architecture Activities control the flow and layout Isolated fragment functionality increases modularity Migrating existing apps Moving slowly: An iterative approach to new design Get it over with: Full redesign at once Looking at an Example app App design Building the phone user interface with fragments From phone interface to two-and three-column interfaces Older Android versions Summary Part IV: Android UI Design Patterns Chapter 17: Introduction to User Interface Design Patterns User interface design patterns Designing the design When to use and when not to use design patterns Benefits of using UI design patterns Don’t reinvent the wheel Platform consistency Library support and ready components Design Patterns in Android design guidelines User Interface Design patterns found in this book Phones, tablets, and responsive design Example apps Example code Design pattern naming User interface design pattern categories Summary