Bagaimana cara membuat aplikasi Android yang menarik? Apakah kita harus menyediakan resource gambar untuk setiap resolusi device?

1. Android UI
Implementation
By Ibnu Sina Wardy (Twitter: @iboen)
CEO of PT GITS Indonesia
www.gits.co.id

3. Background
• Banyaknya workshop pemrograman Android
• Aplikasi lokal yang masuk ke market banyak yang kurang
sentuhan desain
• Desainer perlu diberi pencerahan, tentang apa saja yang
harus dibuat
• Kurangnya kemampuan programmer untuk
mengimplementasikan desain yang telah dibuat desainer

4. Design Tools
• Adobe Photoshop
• Adobe Ilustrator
• Corel Draw
• Inkscape
• Paint?

5. Design: Photoshop

6. Design: Slicing

7. Design: Nine Patch
Tanpa 9-patch
Sudah dikecilkan
Dengan 9-patch

8. Demo: Photoshop

9. Android XML

10. Padding & Margin
• Sederhana tapi terlupakan
• Padding = jarak ke dalam
• Margin = jarak ke luar

11. Padding vs Margin
Padding Margin

12. The Implementation of Space
Tanpa padding dan margin Dengan padding dan margin

13. DIMENSION

14. Dimension for Tablet
Nexus S Galaxy Tab 10.1

15. dimens.xml
/values/dimens.xml
/values-sw600dp/dimens.xml

16. Dimension compatibility
Nexus S Galaxy Tab 10.1

17. IMAGE RESOURCE

18. Provide multiple images
• res/drawable-ldpi/my_icon.png
• Gambar untuk low-density (Galaxy Mini)
• res/drawable-mdpi/my_icon.png
• Gambar untuk medium-density (HTC Hero)
• res/drawable-hdpi/my_icon.png
• Gambar untuk high-density (HTC Desire)
• res/drawable-xhdpi/my_icon.png
• Gambar untuk extra-high-density (Tablet)

19. If you are lazy…
• res/drawable-xhdpi/my_icon.png
• Gambar untuk extra-high-density (Tablet)
• Hanya sediakan untuk resolusi tablet
• Umumnya, ukurannya dua kali dari mdpi
• Ukuran splash screen: 1280 x 800 pixel
• res/drawable-xhdpi/ic_pesawat.png
• Ukuran file yang dibuat adalah: 80px x 120px

20. FRAGMENT & VIEW PAGER

21. View Pager

22. View Pager

23. View Pager Library
• JakeWharton / Android-ViewPagerIndicator
• https://github.com/JakeWharton/Android-ViewPagerIndicator/
• astuetz / ViewPagerExtensions
• https://github.com/astuetz/ViewPagerExtensions

24. ACTION BAR

25. Good Bye Option Menu
• ActionBar hanya support untuk Honeycomb dan ke atas

26. Action Bar Library
Agar support untuk Honeycomb ke bawah, dapat gunakan
library:
• Holo Everywhere
• http://www.holoeverywhere.com/
• ActionBarSherlock
• http://actionbarsherlock.com/

27. DESIGN REFERENCE

28. Useful for you
• Android App Patterns
• http://www.android-app-patterns.com
• android pttrns
• http://androidpttrns.com/

29. PT GITS Indonesia.
Address: Jl Jatimulya 1 No. 14. Bandung. Email: www.gits.co.id