• Share
  • Email
  • Embed
  • Like
  • Save
  • Private Content
Modern Android UI, or not by Action Bar alone
 

Modern Android UI, or not by Action Bar alone

on

  • 1,346 views

Android 4+ interface guidelines, core concepts, some tips for programmers and designers. Originally created for Mobile Optimized 2013 conference.

Android 4+ interface guidelines, core concepts, some tips for programmers and designers. Originally created for Mobile Optimized 2013 conference.

Statistics

Views

Total Views
1,346
Views on SlideShare
1,342
Embed Views
4

Actions

Likes
1
Downloads
15
Comments
0

2 Embeds 4

https://twitter.com 2
http://www.linkedin.com 2

Accessibility

Categories

Upload Details

Uploaded via as Microsoft PowerPoint

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

    Modern Android UI, or not by Action Bar alone Modern Android UI, or not by Action Bar alone Presentation Transcript

    • Modern Android UI,ornot by Action Bar aloneAnton Rutkevich,CTO at Boolba Labs
    • Intro
    • State of platformAndroid 2.3 still valid (~40%),but will disappear in 0.5 .. 1 yearAndroid 3x skippedAndroid 4 finally has design guidelines
    • Modern UI principles
    • Holo themeGives overall styleBackport: HoloEverywhere
    • Action BarMust be used for actionsUp buttonBackport: ActionBarSherlock,ActionBarCompat (soon)
    • ViewPagerLateral navigationGroup of similar screensBackport: android-support-library, ViewPagerIndicator
    • NavigationDrawerDashboard patternreplacementNavigation between appsections
    • AnimationMakes UI more dynamicMany animations already includedBackport: NineOldAndroids
    • Responsive design
    • ProblemsUnbalanced UI
    • IdeasDivide content into FragmentsUse different layouts
    • Master-detail view
    • Alternative master-detail layoutsHide Expand/CollapseSliding Pane
    • Macro reflow
    • Limit width
    • List to Grid
    • Programmer tips
    • CodingUse 9-patch and .xml drawablesUse sw<N>dp, w<N>dpto detect large screens (ex.sw600dp, w720dp)Define common settings instyle.xml, themes.xmlDefine dp values in dimens.xml(padding, text size, line spacing, …)
    • ToolsShow GPU overdraw Show layout bounds
    • ToolsMulti-screen preview
    • 3rd party librariesStaggered Grid View Showcase ViewParallax Scroll View
    • Designer tips
    • developer.android.com/designAndroid has more than one screen sizeIdeas behind the visual representationGood Holo style descriptionReady to use assets
    • Android Asset StudioAndroid Holo Colors Action Bar Style Generator
    • Android Asset StudioDevice Frame Generator
    • Linkshttp://developer.android.com/designhttp://android-ui-utils.googlecode.com/hg/asset-studio/dist/index.htmlGoogle I/O 2013 - Android Design for UIDevelopers (some illustrations are taken fromthere)http://www.androidviews.net/
    • Thank you for your attentionQuestions?anton.rutkevich@boolbalabs.comAnton Rutkevich at Google+http://www.linkedin.com/in/antonrutkevic