Boutique product development company
It is amazing what you can accomplish when you have a client-centric team to deliver ...
Boutique product development company
It is amazing what you can accomplish when you have a client-centric team to deliver ...
“Good design is good business.”
— Thomas J. Watson Jr
Design Guideline for Mobile Developers
• Design Principles
• Bad des...
Design Principles
Supporting Multiple Screens on Android
Arslan Anwar | Android Mentor
• In past we have cover basic intro...
Design Principles
Simplify My Life
• Keep it brief
Use short phrases with simple words. People are likely to skip
sentence...
Design Principles
Simplify My Life
• Pictures are faster than words
Consider using pictures to explain ideas. They get peo...
Design Principles
Simplify My Life
• Decide for me but let me have the final say
Take your best guess and act rather than ...
Design Principles
Simplify My Life
• Only show what I need when I need it
People get overwhelmed when they see too much at...
Design Principles
Simplify My Life
• I should always know where I am
Give people confidence that they know their way aroun...
Design Principles
Simplify My Life
• Never lose my stuff
Save what people took time to create and let them access it from
...
Design Principles
Simplify My Life
• If it looks the same, it should act the same
Help people discern functional differenc...
Design Principles
Simplify My Life
• Only interrupt me if it's important
Like a good personal assistant, shield people fro...
Design Principles
Simplify My Life
• Get to know me
Learn peoples' preferences over time. Rather than asking them to
make ...
Design Principles
Make Me Amazing
• Give me tricks that work everywhere
People feel great when they figure things out for ...
Design Principles
Make Me Amazing
• It's not my fault
Be gentle in how you prompt people to make corrections. They want to...
Design Principles
Make Me Amazing
• Sprinkle encouragement
Break complex tasks into smaller steps that can be easily
accom...
Design Principles
Make Me Amazing
• Do the heavy lifting for me
Make novices feel like experts by enabling them to do thin...
Design Principles
Make Me Amazing
• Make important things fast
Not all actions are equal. Decide what's most important in ...
Design Principles
Touch Feedback
• Use color and illumination to respond to touches, reinforce the
resulting behaviors of ...
Design Principles
Communication
• When your objects react to more complex gestures, help users
understand what the outcome...
Design Principles
Writing Style
• Keep it brief
Be concise, simple and precise. Start with a 30 character limit
(including...
Design Principles
Writing Style
• Be friendly
Use contractions. Talk directly to the reader using second person
("you"). I...
Design Principles
Writing Style
• Put the most important thing first
The first two words (around 11 characters, including ...
Design Principles
Writing Style
• Describe only what's necessary, and no more
Don't try to explain subtle differences. The...
Design Principles
Writing Style
• Avoid repetition
If a significant term gets repeated within a screen or block of text, f...
Design Principles
Confirming & Acknowledging
• Confirming
is asking the user to verify that they truly want to proceed wit...
Design Principles
Confirming & Acknowledging
• Acknowledging
is displaying text to let the user know that the action they ...
Design Principles
Confirming & Acknowledging
• Confirmation is unnecessary
If the user +1'd by accident, it's not a big de...
Design Principles
Confirming & Acknowledging
Arslan Anwar | Android Mentor
Design Principles
Confirming & Acknowledging
Arslan Anwar | Android Mentor
Design Principles
Bad design approach for Android
Most developers want to distribute their apps on multiple platforms. As
...
Design Principles
Bad design approach for Android
• Do not stuck user
Do not stuck user to wait until your background task...
Design Principles
Bad design approach for Android
• Don't mimic UI elements from other platforms
As you build your app for...
Design Principles
Bad design approach for Android
• Don't carry over platform-specific icons
Platforms typically provide s...
Design Principles
Bad design approach for Android
• Don't use bottom tab bars
Other platforms use the bottom tab bar to sw...
Design Principles
Bad design approach for Android
• Don't hardcode links to other apps
In some cases you might want your a...
Design Principles
Bad design approach for Android
• Don't use labeled back buttons on action bars
Arslan Anwar | Android M...
Design Principles
Bad design approach for Android
• Don't use labeled back buttons on action bars
Other platforms use an e...
Design Principles
Bad design approach for Android
• Don't use right-pointing carets on line items
A common pattern on othe...
Design Principles
Bad design approach for Android
• Don't use right-pointing carets on line items
Arslan Anwar | Android M...
Design Principles
Best Design approach for Android
Arslan Anwar | Android Mentor
Best Design approach
for Android
Coming S...
Design Principles
Questions
Arslan Anwar | Android Mentor
Design Principles
Thank You
Arslan Anwar | Android Mentor
Design Principles
Reference
• Android Design
http://developer.android.com/design/index.html
• Design Principles
http://dev...
Upcoming SlideShare
Loading in …5
×

Design guidelines for mobile developers update.

819 views
693 views

Published on

Design Guide for mobile developers

Published in: Technology, Design
0 Comments
2 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
819
On SlideShare
0
From Embeds
0
Number of Embeds
1
Actions
Shares
0
Downloads
41
Comments
0
Likes
2
Embeds 0
No embeds

No notes for slide

Design guidelines for mobile developers update.

  1. 1. Boutique product development company It is amazing what you can accomplish when you have a client-centric team to deliver outstanding products.
  2. 2. Boutique product development company It is amazing what you can accomplish when you have a client-centric team to deliver outstanding products. Design Guidelines for Mobile Developers Arslan Anwar | Software Engineer
  3. 3. “Good design is good business.” — Thomas J. Watson Jr Design Guideline for Mobile Developers • Design Principles • Bad design approach for Android • Best design approach for Android <Full Name> | <Technology Role>
  4. 4. Design Principles Supporting Multiple Screens on Android Arslan Anwar | Android Mentor • In past we have cover basic introduction to android design. We discuss about • Android Devices • Dimensions • Density Independence • Screen Sizes • Alternative Resources • Range of screens supported • Create Bitmaps, Gradient via XML • Nine Patch Images • Styles, Dimensions, and Layouts Source: http://www.confiz.com/blog/android-supporting-multiple-screens
  5. 5. Design Principles Simplify My Life • Keep it brief Use short phrases with simple words. People are likely to skip sentences if they're long. Arslan Anwar | Android Mentor
  6. 6. Design Principles Simplify My Life • Pictures are faster than words Consider using pictures to explain ideas. They get people's attention and can be much more efficient than words. Arslan Anwar | Android Mentor
  7. 7. Design Principles Simplify My Life • Decide for me but let me have the final say Take your best guess and act rather than asking first. Too many choices and decisions make people unhappy. Just in case you get it wrong, allow for 'undo'. Arslan Anwar | Android Mentor
  8. 8. Design Principles Simplify My Life • Only show what I need when I need it People get overwhelmed when they see too much at once. Break tasks and information into small, digestible chunks. Hide options that aren't essential at the moment, and teach people as they go. Arslan Anwar | Android Mentor
  9. 9. Design Principles Simplify My Life • I should always know where I am Give people confidence that they know their way around. Make places in your app look distinct and use transitions to show relationships among screens. Provide feedback on tasks in progress. Arslan Anwar | Android Mentor
  10. 10. Design Principles Simplify My Life • Never lose my stuff Save what people took time to create and let them access it from anywhere. Remember settings, personal touches, and creations across phones, tablets, and computers. It makes upgrading the easiest thing in the world. Arslan Anwar | Android Mentor
  11. 11. Design Principles Simplify My Life • If it looks the same, it should act the same Help people discern functional differences by making them visually distinct rather than subtle. Avoid modes, which are places that look similar but act differently on the same input. Arslan Anwar | Android Mentor
  12. 12. Design Principles Simplify My Life • Only interrupt me if it's important Like a good personal assistant, shield people from unimportant minutiae. People want to stay focused, and unless it's critical and time- sensitive, an interruption can be taxing and frustrating. Arslan Anwar | Android Mentor
  13. 13. Design Principles Simplify My Life • Get to know me Learn peoples' preferences over time. Rather than asking them to make the same choices over and over, place previous choices within easy reach. Arslan Anwar | Android Mentor
  14. 14. Design Principles Make Me Amazing • Give me tricks that work everywhere People feel great when they figure things out for themselves. Make your app easier to learn by leveraging visual patterns and muscle memory from other Android apps. For example, the swipe gesture may be a good navigational shortcut. Arslan Anwar | Android Mentor
  15. 15. Design Principles Make Me Amazing • It's not my fault Be gentle in how you prompt people to make corrections. They want to feel smart when they use your app. If something goes wrong, give clear recovery instructions but spare them the technical details. If you can fix it behind the scenes, even better. Arslan Anwar | Android Mentor
  16. 16. Design Principles Make Me Amazing • Sprinkle encouragement Break complex tasks into smaller steps that can be easily accomplished. Give feedback on actions, even if it's just a subtle glow. Arslan Anwar | Android Mentor
  17. 17. Design Principles Make Me Amazing • Do the heavy lifting for me Make novices feel like experts by enabling them to do things they never thought they could. For example, shortcuts that combine multiple photo effects can make amateur photographs look amazing in only a few steps. Arslan Anwar | Android Mentor
  18. 18. Design Principles Make Me Amazing • Make important things fast Not all actions are equal. Decide what's most important in your app and make it easy to find and fast to use, like the shutter button in a camera, or the pause button in a music player. Arslan Anwar | Android Mentor
  19. 19. Design Principles Touch Feedback • Use color and illumination to respond to touches, reinforce the resulting behaviors of gestures, and indicate what actions are enabled and disabled. • Whenever a user touches an actionable area in your app, provide a visual response. This lets the user know which object was touched and that your app is "listening". Arslan Anwar | Android Mentor
  20. 20. Design Principles Communication • When your objects react to more complex gestures, help users understand what the outcome of the operation will be. For example, in Recents, when you start swiping a thumbnail left or right, it starts to dim. This helps the user understand that swiping will cause the item to be removed. Arslan Anwar | Android Mentor
  21. 21. Design Principles Writing Style • Keep it brief Be concise, simple and precise. Start with a 30 character limit (including spaces), and don't use more unless absolutely necessary. Arslan Anwar | Android Mentor
  22. 22. Design Principles Writing Style • Be friendly Use contractions. Talk directly to the reader using second person ("you"). If your text doesn't read the way you'd say it in casual conversation, it's probably not the way you should write it. Don't be abrupt or annoying and make. Arslan Anwar | Android Mentor
  23. 23. Design Principles Writing Style • Put the most important thing first The first two words (around 11 characters, including spaces) should include at least a taste of the most important information in the string. If they don't, start over. Arslan Anwar | Android Mentor
  24. 24. Design Principles Writing Style • Describe only what's necessary, and no more Don't try to explain subtle differences. They will be lost on most users. Arslan Anwar | Android Mentor
  25. 25. Design Principles Writing Style • Avoid repetition If a significant term gets repeated within a screen or block of text, find a way to use it just once. Arslan Anwar | Android Mentor
  26. 26. Design Principles Confirming & Acknowledging • Confirming is asking the user to verify that they truly want to proceed with an action they just invoked. In some cases, the confirmation is presented along with a warning or critical information related to the action that they need to consider. Arslan Anwar | Android Mentor
  27. 27. Design Principles Confirming & Acknowledging • Acknowledging is displaying text to let the user know that the action they just invoked has been completed. This removes uncertainty about implicit operations that the system is taking. In some cases, the acknowledgment is presented along with an option to undo the action Arslan Anwar | Android Mentor
  28. 28. Design Principles Confirming & Acknowledging • Confirmation is unnecessary If the user +1'd by accident, it's not a big deal. They can just touch the button again to undo the action. • Acknowledgment is unnecessary The user will see the +1 button bounce and turn red. That's a very clear signal. Arslan Anwar | Android Mentor
  29. 29. Design Principles Confirming & Acknowledging Arslan Anwar | Android Mentor
  30. 30. Design Principles Confirming & Acknowledging Arslan Anwar | Android Mentor
  31. 31. Design Principles Bad design approach for Android Most developers want to distribute their apps on multiple platforms. As you plan your app for Android, keep in mind that different platforms play by different rules and conventions. Design decisions that make perfect sense on one platform will look and feel misplaced in the context of a different platform. While a "design once, ship anywhere" approach might save you time up-front, you run the very real risk of creating inconsistent apps that alienate users. Arslan Anwar | Android Mentor
  32. 32. Design Principles Bad design approach for Android • Do not stuck user Do not stuck user to wait until your background task completed. This not only waste user time but also irritate user. Keep your app simple and efficient so that user can perform other operations while you do your task in background Arslan Anwar | Android Mentor
  33. 33. Design Principles Bad design approach for Android • Don't mimic UI elements from other platforms As you build your app for Android, don't carry over themed UI elements from other platforms and don't mimic their specific behaviors. Android's most important UI elements and the way they look in the system default themes. Also examine Android's platform apps to get a sense of how elements are applied in the context of an app. Arslan Anwar | Android Mentor
  34. 34. Design Principles Bad design approach for Android • Don't carry over platform-specific icons Platforms typically provide sets of icons for common functionality, such as sharing, creating a new document or deleting. As you are migrating your app to Android, please swap out platform- specific icons with their Android counterparts. Arslan Anwar | Android Mentor
  35. 35. Design Principles Bad design approach for Android • Don't use bottom tab bars Other platforms use the bottom tab bar to switch between the app's views. Per platform convention, Android's tabs for view control are shown in action bars at the top of the screen instead. In addition, Android apps may use a bottom bar to display actions on a split action bar. Arslan Anwar | Android Mentor
  36. 36. Design Principles Bad design approach for Android • Don't hardcode links to other apps In some cases you might want your app to take advantage of another app's feature set. For example, you may want to share the content that your app created via a social network or messaging app, or view the content of a weblink in a browser. Don't use hard-coded, explicit links to particular apps to achieve this. Instead, use Android's intent API to launch an activity chooser which lists all applications that are set up to handle the particular request. This lets the user complete the task with their preferred app. Arslan Anwar | Android Mentor
  37. 37. Design Principles Bad design approach for Android • Don't use labeled back buttons on action bars Arslan Anwar | Android Mentor
  38. 38. Design Principles Bad design approach for Android • Don't use labeled back buttons on action bars Other platforms use an explicit back button with label to allow the user to navigate up the application's hierarchy. Instead, Android uses the main action bar's app icon for hierarchical navigation and the navigation bar's back button for temporal navigation. Arslan Anwar | Android Mentor
  39. 39. Design Principles Bad design approach for Android • Don't use right-pointing carets on line items A common pattern on other platforms is the display of right-pointing carets on line items that allow the user to drill deeper into additional content. Android does not use such indicators on drill-down line items. Avoid them to stay consistent with the platform and in order to not have the user guess as to what the meaning of those carets may be. Arslan Anwar | Android Mentor
  40. 40. Design Principles Bad design approach for Android • Don't use right-pointing carets on line items Arslan Anwar | Android Mentor
  41. 41. Design Principles Best Design approach for Android Arslan Anwar | Android Mentor Best Design approach for Android Coming Soon… 
  42. 42. Design Principles Questions Arslan Anwar | Android Mentor
  43. 43. Design Principles Thank You Arslan Anwar | Android Mentor
  44. 44. Design Principles Reference • Android Design http://developer.android.com/design/index.html • Design Principles http://developer.android.com/design/get-started/principles.html • Pure Android http://developer.android.com/design/patterns/pure-android.html Arslan Anwar | Android Mentor

×