Loading presentation...

Present Remotely

Send the link below via email or IM

Copy

Present to your audience

Start remote presentation

  • Invited audience members will follow you as you navigate and present
  • People invited to a presentation do not need a Prezi account
  • This link expires 10 minutes after you close the presentation
  • A maximum of 30 users can follow your presentation
  • Learn more about this feature in our knowledge base article

Do you really want to delete this prezi?

Neither you, nor the coeditors you shared it with will be able to recover it again.

DeleteCancel

Make your likes visible on Facebook?

Connect your Facebook account to Prezi and let your likes appear on your timeline.
You can change this under Settings & Account at any time.

No, thanks

Android Design for UI Developers - GDays, June 2013

No description
by

Tunde Olabenjo

on 12 July 2014

Comments (0)

Please log in to add your comment.

Report abuse

Transcript of Android Design for UI Developers - GDays, June 2013

Google Resources
Google Android Design guidelines
Sites to look at

http://holoeverywhere.com
- Holoeverywhere
http://androiduipatterns.com

- Android UI Patterns
http://androidniceties.tumblr.com
- Beautiful Android apps
http://develop-android.tumblr.com/
- UI Design tips
http://androiduiux.com/
- Inspiration source for Android Designers
http://www.androidpatterns.com/
- Android design patterns
Android Asset Studio
http://android-ui-utils.googlecode.com/hg/asset-studio/dist/
Things to do before designing your UI
Look at other similar apps with great designs online
Holo Visual Style
ActionBar
List / Grids
Dialogs
Look
For Android 3.0+
Fonts
ViewPager
Feel
The default xxx.keystore in your computer is named debug.keystore,

and it locate at the path "
C:\Users\your_user_name\.android\
".
Thanks!
Android Design for UI Developers
By: Tunde Olabenjo
About me
Co-founder / Developer at StackArena
Android, Blackberry, IOS and J2me Developer
Web app Developer
Tutorials and Articles
for developers
www.stackarena.com
Agenda
Before you begin
Look & Feel
Demo
Resources
Before you begin
Sites to look at
Google resources
Android Asset Studio
ActionBar
Holo Visual Style
Lists / Grid
Dialogs
Fonts
ViewPager
Responsive Design
SlidingPane Layout
Mobile Apps:
AkposJokes
Android Sound Meter
PraiseWorld Radio:
https://play.google.com/store/apps/details?id=com.stackarena.akposjokes
https://play.google.com/store/apps/details?id=com.edgewalk.soundmeter
https://play.google.com/store/apps/details?id=com.stackarena.praiseworldradio
Look & Feel
Resources
http://www.android-app-patterns.com/
- Design Inspiration
my favourite
Inspiration
Implementation
Android Patterns
http://developer.android.com/design/
http://developer.android.com/design/downloads/
Google Android UI Stencils
The UI Stencils provides various android UI
components to help you design a prototype
of your app.
Design
Product
@tbenjis
Questions?
Making your app
look great!
The action bar is a window feature that identifies the application and user location, and provides user actions and navigation modes.
Works on Android 3.0+ (API level 11)
App Icon
The app icon establishes your app's identity. It can be replaced with a different logo or branding if you wish.
View control
allows users to switch views
Action buttons
Shows the most important actions of your app
Action overflow
More like a menu overflow
ActionBarSherlock
http://actionbarsherlock.com/
For Android 2.0+
Theme.Sherlock, Theme.Sherlock.Light,
or
Theme.Sherlock.Light.DarkActionBar
public

class
MyActivity
extends
SherlockActivity {
@Override
public void
onCreate
(Bundle savedInstanceState) {
super
.onCreate(savedInstanceState);
setContentView(R.layout.
activity_about
);
getSupportActionBar().setDisplayHomeAsUpEnabled(
true
);
...
}
JakeWharton
Styles:
HoloLight
HoloDark
HoloLight with Dark ActionBar
HoloEverywhere
https://github.com/Prototik/HoloEverywhere/
Android 2.1+
Great tool for creating Holo Style themed app for lower-end devices
Great with ActionBarSherlock
http://android-holo-colors.com/
Sergey & Christophe
DEMO
Application Manifest .xml
style.xml
Activity.java
Before
After
When using the holo theme on API 7-10, you can also use the Roboto fonts on Ice Cream Sandwich by downloading the fonts and adding it to your project
http://developer.android.com/design/style/typography.html
Adding the font to an Activity
A dialog is a small window that prompts the user to make a decision or enter additional information
List Dialog
Full transcript