One apk for tablet and phone? - Design, Prototyping, UI, Graphics

Hi,
What is the best approach to implement different designs for tablets and phones. I have an application which has a totally different design on tablet than phone. Is it advisable to keep both in the same apk? or make separate APKs?
Thanks in advance

Use a single apk. It's not a good practice on Android to publish a "HD" version of your app as it is often seen in iOS. You can easily create to different xml layout files and put the one for Tablets in the layout-large folder.

Yeah, use resource modifiers and flexible layouts using Fragments.
Google has got a great documentation on that topic.
Google for "android designing for different screens".

Check this answer I posted in another thread:
nikwen said:
Read this: http://developer.android.com/guide/practices/screens_support.html
And this: http://developer.android.com/training/multiscreen/screendensities.html
Click to expand...
Click to collapse

Thanks alot for your answers... Even if the design is totally different for each application!!
Sent from my Nexus 7 using Tapatalk 4 Beta

The best approach if you have custom images is to make different images sizes for each image and put them in the corresponding dpi folder in the res folder so that the app pulls the nearest image size from the dpi folder that it needs to do that same with the layout make a low medium high and xdpi layout file so that the app can layout its elements in the correct way for each dpi setting

karimaelo said:
Thanks alot for your answers... Even if the design is totally different for each application!!
Sent from my Nexus 7 using Tapatalk 4 Beta
Click to expand...
Click to collapse
Yes, you can. As long as you know when it is tablet or not and you will carefully defining and crafting the UI on the java code. There are some techniques to define if the current device is tablet or not (but not 100% true if let say later there are android phones has full hd with 1080p or more). One of the technique is by defining value on the res/values (for phone) with boolean value isTablet = false; define value on res/value-large and values-swXXXdp (where XXX is your target pixel for tablet) with boolean value of isTablet = true.
From the java code you can simply get the values and start from there.

Related

Read/Write Settings?

I am looking to read and write system settings. I have already found out how to Read the current theme style (Dark or Light), but is it possible to programmatically change it?
I have also looked everywhere for an API to be able to grab the current wallpaper file, and write in a different one, but no luck.
Can anybody point me in the right direction?
Thanks!
afaik I don't think you can change the user's theme, but you can override it.
Download either the DarkStyles.xaml or LightStyles.xaml:
http://www.windowsphonegeek.com/news/theme-forcing-for-windows-phone-7
Then you can merge the xaml file into the resource dictonary of the resources of app.xaml:
Code:
<ResourceDictionary>
<ResourceDictionary.MergedDictionaries>
<ResourceDictionary Source="Resources/DarkStyles.xaml"></ResourceDictionary>
</ResourceDictionary.MergedDictionaries>
</ResourceDictionary>
I don't think there's an api for grabbing the current wallpaper, but u can use MediaLibrary to check out the currently saved pictures if I remember correctly, otherwise there might be something related to Tasks.
Don't know about wallpaper but I have a thread for adding customs accents and 3 extra themes. Yu could also make your own but im on my phone and it would take forever to type out how.
Sent from my HD7 using XDA Windows Phone 7 App

Creating simple contacts' application

Hello all!
I am looking into development of something which is similar to people's list in people hub. What I want is a huge list of people on one page with (of course) LonglistSelector. When I tap a member of the list, I want the user to be navigated to the details page of that item. User needs to be able to manipulate and modify the data on the details page. The list is going to be real huge. I have a few question about the approach.
1. What is the best way to store data? I am thinking of creating local database with a few columns with person's name in one column, age in another etc.
If this is the approach to go for, can anyone provide me detailed description about the databases? I have deeply gone through the MSDN, WindowsPhoneGeek and many other documentations. I feel dumb about the whole database scenario.
2. Is XML list as database a good approach for large amounts of data or it will be pain?
i would say SQL CE is your best bet to store huge amounts of data. XML is slow at large volumes of data when compared to JSON. I would prefer JSON over XML.
darthveda said:
i would say SQL CE is your best bet to store huge amounts of data. XML is slow at large volumes of data when compared to JSON. I would prefer JSON over XML.
Click to expand...
Click to collapse
So basically, I need to go with the local database using LINQ. Now, how do I do that? As I mentioned, I have read intensively. However, I just don't seem to get hang of it.
akshay2000 said:
So basically, I need to go with the local database using LINQ. Now, how do I do that? As I mentioned, I have read intensively. However, I just don't seem to get hang of it.
Click to expand...
Click to collapse
I created my local database with LINQ based off this sample:
http://msdn.microsoft.com/en-us/library/windowsphone/develop/hh286405(v=vs.92).aspx
First define the columns which you would want to create and then modify the sample code to suit your needs.
For contacts, there is an excellent sample available:
http://msdn.microsoft.com/en-us/library/windowsphone/develop/hh286416(v=vs.92)
if you are stuck with some particular piece of code then let me know, i would be glad to help you out
darthveda said:
I created my local database with LINQ based off this sample:
http://msdn.microsoft.com/en-us/library/windowsphone/develop/hh286405(v=vs.92).aspx
First define the columns which you would want to create and then modify the sample code to suit your needs.
For contacts, there is an excellent sample available:
http://msdn.microsoft.com/en-us/library/windowsphone/develop/hh286416(v=vs.92)
if you are stuck with some particular piece of code then let me know, i would be glad to help you out
Click to expand...
Click to collapse
I had gone through those links earlier! Back then, they made very little sense to me. I have researched a bit by now. I will update here if I get stuck somewhere.
hi
i had read the thread now and maybe this example of MS can help you... it's not based on local database, but uses ASP.NET Web API!
so maybe this is a way for you..
darthveda said:
if you are stuck with some particular piece of code then let me know, i would be glad to help you out
Click to expand...
Click to collapse
I'm attaching my code file to the post. When I try to run the app and click the button (it tries to add an item to the observablecollection) I get NullReferenceException error. Apparently, the collection's instant hasn't been created. But I tried to instantiate it using 'new' keyword - no luck. Am I doing anything wrong?
akshay2000 said:
I'm attaching my code file to the post. When I try to run the app and click the button (it tries to add an item to the observablecollection) I get NullReferenceException error. Apparently, the collection's instant hasn't been created. But I tried to instantiate it using 'new' keyword - no luck. Am I doing anything wrong?
Click to expand...
Click to collapse
solution folder will be better, you are using telerik controls, i can't recreate your solution.
It's done!
darthveda said:
solution folder will be better, you are using telerik controls, i can't recreate your solution.
Click to expand...
Click to collapse
Thanks for the response! After a lot of debugging and (almost literally) adding Debug.writeline after each line of code, I managed to solve it. It had nothing to do with the Database or the ObservableCollection. It was totally different - GroupDescriptor issue! More details here: http://stackoverflow.com/questions/...ion-while-adding-item-to-observablecollection
I'll post here if I get stuck with something again.
Again, thanks a lot!
Any reason you are using telerik controls? for starters and very simple programs, you can use controls from silverlight toolkit or coding4fun toolkit. i am using longlist selector which does the job just like the jumplist from telerik controls does.
darthveda said:
Any reason you are using telerik controls? for starters and very simple programs, you can use controls from silverlight toolkit or coding4fun toolkit. i am using longlist selector which does the job just like the jumplist from telerik controls does.
Click to expand...
Click to collapse
No specific reasons except that the Jumplist provides StickyHeader functionality. And animation framework seems nice addition too!

App to view/edit code

Looking for a good light app that can view code and colour text accordingly.
DroidEdit is what I've been using as of late. They offer both free and paid versions on the market.
Sent from my Nexus 4 using CFX
+1 DroidEdit
One of most well designed Syntax Highlight app I've used.
Cool exactly what I'm looking for.
Doesn't seen to be many options out there.
one better: AIDE
bamsbamx said:
one better: AIDE
Click to expand...
Click to collapse
Looks great but that's only or java.
Looks like you gotta have the paid version of droid edit to view system files...
monkeying. around said:
Cool exactly what I'm looking for.
Doesn't seen to be many options out there.
Click to expand...
Click to collapse
Nope, not many. Probably 'cause coding on a small screen seems a bit challenging.
On a tablet it would be easier. Plus, its nearly impossible to test/debug directly from the phone or tablet.
Coding is easier and more effective on a computer.
I just use DroidEdit for when I need to make quick changes to a web coding... when a client says I need this or that.
DroidEdit let me do it it quickly (and with an FTP mounted, I can make live changes)

[GUIDE] App/Graphics Design Tips,Tricks & Warnings

Hi Guys This is a guide on app design guidelines.This can be applied everywhere and not only app design. I have seen many apps that perform awesome but their UI scares people away! This won't be a very detailed guide, only basic pointers on UI Design.
First off i would like to say that User experience and functionality of the app is equally or more important than it's UI. There's no point in a app that has a awesome looking UI but is very laggy or lacks functionality.
Lets begin with a few tips :
Try to make the UI simple and clean with no extra clutter.Hide extra functionality in menus. Keep the main function of the program in the front.
Make the UI flat.Use subtle gradients and shadows. Don't make it too flat like the metro ui,in which you can't distinguish an icon from a button
Use a specific color scheme. Select two to three lead colours. and select 1 or 2 background colours.
Either make it dark themed, or light themed, don't mix the two!
Use transitions. But not too fancy.
Split your app into different parts and provide a easy way to navigate
Fix Whatever you can behind the scenes
Use short Phrases, No one wants to read too much to do a simple task!
Use pastel colours or darker colours. ie. one shade lighter or darker than the original color.
Have contrast between the text color and the background color, making it easier to read.
Tricks :
Don't waste much time making animations. Use LayoutTransitions (android 3.0+)
Test your apps on different screen sizes.
Download the color swatches provided by google -click here
Google is your friend. Go to developer.android.com for more guidelines, application fundamentals etc.
Use good typography. Roboto and helvetica are some of the good fonts. Download roboto - click here
Guide on iconography - click here
Warnings! :
Do not use harsh gradients! for eg.. black to white , It makes the app feel cheap.
Try and stay away from putting ads
Do not let the app make decisions for itself, let it ask the user!
Do not make the app too colourful.
Make sure it runs smooth without jitter.
Don't put too much info. at once!
Don't use too flashy colors that hurt the eye.
Again, this isn't meant to be a very long guide, just a few basic things you should keep in mind while designing. For more detailed guidelines use developer.android.com
If i missed something important let me know! :good:
That's really helpful..
Thank you
wad!e said:
That's really helpful..
Thank you
Click to expand...
Click to collapse
Glad you liked it
Amazing guide! Thanks so much! I'm glad more people love great design.
Sent from my Galaxy Nexus using Tapatalk 4 Beta
Hello there, thanks for this guide.
I am no developer so I don't have to mess with the graphics, but I still often wonder : in android programming, where there will always be the probrem of multiple display size / resolution, why isn't the most primary & most basic guideline to use as much as possible vector graphics instead of bitmap based graphics ? wouldn't it save a huge amount of hassle of having to make gfx resources for different screen sizes ?
thx in advance
phentex said:
Hello there, thanks for this guide.
I am no developer so I don't have to mess with the graphics, but I still often wonder : in android programming, where there will always be the probrem of multiple display size / resolution, why isn't the most primary & most basic guideline to use as much as possible vector graphics instead of bitmap based graphics ? wouldn't it save a huge amount of hassle of having to make gfx resources for different screen sizes ?
thx in advance
Click to expand...
Click to collapse
Maybe it would be easier.
However, you would need a proper library to do that. Android does not support adding *.svg vector graphics by default. So all the conversion of the vector graphics need to be done manually. (There are some libs out there, but they do not support all features of *.svg graphics.)
For basic things there is support to do that using the standard Android development APIs provided by Google (declaring drawables in xml files) but it will not be enough for shapes which are more complicated than lines, rectangles or circles or a combination of those.
Addititionally the conversion of vector graphics to bitmaps (graphics consisting of single pixels) would need much processing power and would slow everything down.
Hence *.png and *.9.png files are still the standard way to do that.
@TechMasta: By the way, great guide.
TechMasta said:
Try and stay away from putting ads
Click to expand...
Click to collapse
No ads? How does one go about monetization then? Don't get me wrong. I'm a Windows and Windows Phone developer. I was thinking of porting my apps to Android. I'm just getting started. But I'm using Windows Azure for which I do have to pay for. How should I go about those expenses?
TechMasta said:
Do not let the app make decisions for itself, let it ask the user!
Click to expand...
Click to collapse
Sometimes it should. However, the user should be able to change the default behaviour. Or as the android design guidelines express it:
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'.
Click to expand...
Click to collapse
(http://developer.android.com/design/get-started/principles.html)
Great guide, though.
akshay2000 said:
No ads? How does one go about monetization then? Don't get me wrong. I'm a Windows and Windows Phone developer. I was thinking of porting my apps to Android. I'm just getting started. But I'm using Windows Azure for which I do have to pay for. How should I go about those expenses?
Click to expand...
Click to collapse
You can put ads if you want. Just don't bombard the user with them, place them in a way it does not interrupt or come in the way of the user when he is using your app
phentex said:
Hello there, thanks for this guide.
I am no developer so I don't have to mess with the graphics, but I still often wonder : in android programming, where there will always be the probrem of multiple display size / resolution, why isn't the most primary & most basic guideline to use as much as possible vector graphics instead of bitmap based graphics ? wouldn't it save a huge amount of hassle of having to make gfx resources for different screen sizes ?
thx in advance
Click to expand...
Click to collapse
With google's plugin for eclipse you can add your graphics in multiple resolutions by Copying your layout from "layout" folder of resources and paste it in the "layout-land", "layout-xlarge" etc.
SahilC said:
Amazing guide! Thanks so much! I'm glad more people love great design.
Sent from my Galaxy Nexus using Tapatalk 4 Beta
Click to expand...
Click to collapse
Glad you liked it
Thank you very much, very useful information.
Thx for it mate I will develop good think
Sent from my GT-I9100 using xda app-developers app
Looks good
graphics design
Thank you for this information about web design. Really nice.
Good set of tips for the first version of an app!
The next level of designing should ideally be with testing different design variations via split testing.
Making Decisions
TechMasta said:
Do not let the app make decisions for itself, let it ask the user!
Click to expand...
Click to collapse
Hai,
Thanks for your guide. But I am having a different opinion from one of your warnings.
Let the app make decisions by itself, for example when user deletes an item DELETE it. But do provide an option to UNDO it. Showing another dialog to confirm it, in your words "ask the user", is redundant.
Because providing too many options makes the user overwhelmed in an unexpected way. Choose the best/defaults for your app and provide some ways to configure them [Ex : Colors, Themes, Font size etc]
Ahamed.M said:
Hai,
Thanks for your guide. But I am having a different opinion from one of your warnings.
Let the app make decisions by itself, for example when user deletes an item DELETE it. But do provide an option to UNDO it. Showing another dialog to confirm it, in your words "ask the user", is redundant.
Because providing too many options makes the user overwhelmed in an unexpected way. Choose the best/defaults for your app and provide some ways to configure them [Ex : Colors, Themes, Font size etc]
Click to expand...
Click to collapse
True. This can also be found in the Android design guidelines:
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'.
Click to expand...
Click to collapse
(Source: http://developer.android.com/design/get-started/principles.html#simplify-my-life)
a
nice
Nice Tips
These tips are very useful. One should keep in mind while dealing with apps whether in Android or iPhone.

[RESOURCES] Useful Android Design Resources thread

Hey guys, I've recently been working hard on redesigning my app and here's a compilation of resources I found useful along the way.
Please post yours so I can add them to the OP.
Online Tools
Android Asset Studio by Roman Nurik
This is an awesome tool which allows you to generate pixel-perfect drawables for your app, directly downloadable and resized for all screen resolutions (xxhdpi/xhdpi/hdpi/mdpi/ldpi) including :
Launcher icons
Action Bar & Tab icons
Notification icons
Generic icons
Tabs icons for pre-honeycomb
Menu icons for pre-honeycomb
All icons can be created either from an image, from the provided cliparts, or even from text
An Alternative Device Frame Generator containing more devices and less strict in term of the original screenshot resolution than the official one
A very useful Nine Patch Generator
This tool is open source, too : http://code.google.com/p/android-ui-utils
-----------------------------------------------------------------------------------
Android Action Bar Style Generator by Jeff Gilfelt
This great tool allows you to generate all the necessary resources (xml, drawables, nine patches, you name it) for your custom ActionBar theme. The Holo guidelines recommend to style the ActionBar with your branding color as an accent for example, well it's never been so easy with this tool.
You can choose the color for all the components of the ActionBar :
ActionBar color & style (solid/transparent)
Stacked Color
Popup Color
Accent Color
Contextual Action Bar background color and highlight color
Oh, and it's compatible with ActionBarSherlock, too!
-----------------------------------------------------------------------------------
Android Holo Colors Generator by Jérôme Van Der Linden
This nifty tool allows you to generate a custom style for all the most usual UI components such as :
EditText
AutoComplete
Button
Colored Button
CheckBox
RadioButtons
Spinner
Colored Spinner
ProgressBar
SeekBar
RatingBar (normal/small/big)
Toggle
ListSelector
Fast Scroll
Switch
Just like the other Asset Studio-based tools, it generates a zipped res folder that you can directly merge into your app
-----------------------------------------------------------------------------------
Android DPI Calculator by Martin Cohen
A very useful tool, I use it all the time. Simply input a width and/or height and it will convert it for you to all screen resolutions (even tvdpi)
-----------------------------------------------------------------------------------
UX Metaphor Equivalents for iOS & Android by Kintek
If you're an iOS developer/designer and are converting your existing apps or making the switch to Android (or the other way around), this tool will allow you to compare both platform SDKs's native UI widgets and find the right equivalents for each component.
-----------------------------------------------------------------------------------
Offline Tools
The Photoshop Android Design Kit by Taylor Ling : a great tool to design mockups and wireframes for you app, and now, since last update, it even includes some popular custom views such as Google Now cards, Croutons, undo-bar etc...
Custom Views & Libraries
I'm not going to make a list of all the awesome open source libraries the android community has created, this would be impossible.
But I'm going to give you links to external websites and even apps who try to achieve this goal, really go take a look, this is very inspirational :
AndroidViews.net by Nadav Fima : the name says it all. It's a website which only feature libraries related to the UI and design. My favourite of this list.
DevAppsDirect by Kenneth Lewelling : a great little app which presents many libraries and allows you to directly launch their demos, very useful to find inspiration.
The Ultimate Android Library by Alexandre Gherschon : a website AND an app showcasing many great libraries (The app is here)
This article from vogella.com : a compilation of useful open source libraries, again
Websites & Blogs
THE ANDROID DESIGN GUIDELINES : I can't stress it enough, read this twice!
AndroidUiPatterns.com : a very nice blog about android design and ux
AndroidNiceties : a blog that's basically a collection of screenshots taken from beautiful, holo-compliant (most of the time) apps. Great source of inspiration.
Romain Guy's blog : Romain Guy is an Android engineer at Google, and his blog is full of very useful articles, like these two about improving the UI performance of your app -> here & here
AndroidDevWeekly.com : a great weekly (obviously) newsletter containing cool news and links about android development/design, I highly recommend to subscribe
The official Android Engineers's blog : says it all I guess^^
Chet Haase's blog : Chet Haase is an Android engineer at Google working particularly on animations and the animation framework, his blog is full of cool infos and snippets
Cyril Mottier's blog : a great resource by a great dev, he writes very good articles and libraries and his blog contains some really awesome posts (i.e : ListView tips & trick, Android app launching made gorgeous & Pull to refresh, an anti pattern)
StylingAndroid.com : great android design blog by Mark Allison
AndroidUIUX.com by Taylor Ling : the blog maintained by the creator of the Photoshop Android Design Kit
Lucas Rocha's blog (Android dev at Firefox) : http://lucasr.org/
Videos
Android Design in Action : an awesome weekly show held by Android engineers Roman Nurik, Adam Kosh & Nick Butcher. They often do redesigns of existing apps, give many great advices. They usually focus on one specific type of apps in each episode, maybe your type of app has already been treated!
Dev Bytes : Held by Android engineer Chet Haase (and sometimes Nick Butcher), Dev Bytes is a great series of short episodes showing you how to implement some nice animations and transitions to jazz up your apps
The App Clinic : Held by Android engineers Reto Meier & Ian Ni-Lewis, this is a weekly show which takes a look at existing apps and talk about what's good and bad in their UI/UX approach
Guides
THE ANDROID DESIGN GUIDELINES (Yeah I know, but I told you, read it twice! :silly
The Android Designer's Cheatsheet : great all-around guide to understanding the basics of Android design (including density buckets, how ninepatches work, 48dp rule & pattern, naming conventions, etc...)
Really awesome but is this for framework-res only?
dragonhustler said:
Really awesome but is this for framework-res only?
Click to expand...
Click to collapse
This is for app development. The res folder of an app's sources holds the image drawables, as well as xml layouts, strings, style declarations etc...
But I guess it could also be used to mod the android framework, idk, I'm not really into rom theming.
This is awesome! Thanks a lot!
Added two new entries :
Lucas Rocha's blog (Android dev at Firefox) : http://lucasr.org/
The Android Designer's Cheatsheet : great all-around guide to understanding the basics of Android design (including density buckets, how ninepatches work, 48dp rule & pattern, naming conventions, etc...). Really good one, go check it out!
ActionBar Sherlock not linked?! PREPOSTEROUS!
No mention of Android Design in Action on androiddevelopers youtube channel?EVEN MORE PREPOSTEROUS!
There's also AmbilWarna, Apache licensed, colour picker compatible with 2.1+ (I think). It's super nice.
For super nice colour schemes visit http://www.colorschemer.com/ or www.colourlovers.com/.
Pro tips for guys on Linux.
Install gPick. This way you can easily pick colours off the screen and plug them into the tools from above.
There is also Agave app that will create a colour scheme off of a one or more colours.
Create a custom launcher for ever website from Asset Studio.
Create a file with with desktop extension in
Code:
~/.local/share/applications
with these contents
Code:
[Desktop Entry]
Name=Android Asset Studio Launcher Icon Generator
Exec=google-chrome --app=http://android-ui-utils.googlecode.com/hg/asset-studio/dist/icons-launcher.html#foreground.space.trim=1&foreground.space.pad=0&foreColor=33b5e5%2C0&crop=0&backgroundShape=none&backColor=ffffff%2C100
Terminal=false
Version=1.0
Type=Application
It will launch it as it was an app.
If you are more of a Photoshop guy, try Pixlr for online image editing
el_bhm said:
ActionBar Sherlock not linked?! PREPOSTEROUS!
No mention of Android Design in Action on androiddevelopers youtube channel?EVEN MORE PREPOSTEROUS!
There's also AmbilWarna, Apache licensed, colour picker compatible with 2.1+ (I think). It's super nice.
For super nice colour schemes visit http://www.colorschemer.com/ or www.colourlovers.com/.
Pro tips for guys on Linux.
Install gPick. This way you can easily pick colours off the screen and plug them into the tools from above.
There is also Agave app that will create a colour scheme off of a one or more colours.
Create a custom launcher for ever website from Asset Studio.
Create a file with with desktop extension in
Code:
~/.local/share/applications
with these contents
Code:
[Desktop Entry]
Name=Android Asset Studio Launcher Icon Generator
Exec=google-chrome --app=http://android-ui-utils.googlecode.com/hg/asset-studio/dist/icons-launcher.html#foreground.space.trim=1&foreground.space.pad=0&foreColor=33b5e5%2C0&crop=0&backgroundShape=none&backColor=ffffff%2C100
Terminal=false
Version=1.0
Type=Application
It will launch it as it was an app.
If you are more of a Photoshop guy, try Pixlr for online image editing
Click to expand...
Click to collapse
I believe you should re-read the OP, Android design in action is mentioned, and as I said I'm not making a list of libraries, but ActionBarSherlock is featured on maybe 50% of the sites I linked.
The assets studio icons generator is featured too.
The size 7 was pretty unnecessary too
Androguide.fr said:
I believe you should re-read the OP, Android design in action is mentioned, and as I said I'm not making a list of libraries, but ActionBarSherlock is featured on maybe 50% of the sites I linked.
The assets studio icons generator is featured too.
The size 7 was pretty unnecessary too
Click to expand...
Click to collapse
I never said ASIG wasn't in there. Speaking of reading the OP?
Android Design in Action - fair.
Sherlock Actionbar should be here. Why? Because for once, it should be a one stop shop. Second, people still don't use it and use old look. Third, there are applications that are branded as Holo and are not compatible backwards as they don't use SAB, but latest API. As in there are still people not using it for no good reason.
The first useful post for real app development on this board.
These two videos from the Google I/O 2013 are related to Android UI design:
https://www.youtube.com/watch?v=s0HIP8EdlnE
https://www.youtube.com/watch?v=Jl3-lzlzOJI
nikwen said:
These two videos from the Google I/O 2013 are related to Android UI design:
https://www.youtube.com/watch?v=s0HIP8EdlnE
https://www.youtube.com/watch?v=Jl3-lzlzOJI
Click to expand...
Click to collapse
Thanks for those buddy
Thanks for the great thread!
Sent from my Galaxy Nexus using Tapatalk 2
We just released PortKit: UX Metaphor Equivalents for iOS & Android http://kintek.com.au/blog/portkit-ux-metaphor-equivalents-for-ios-and-android/ keen for comments/suggestions
madhavakintek said:
We just released PortKit: UX Metaphor Equivalents for iOS & Android http://kintek.com.au/blog/portkit-ux-metaphor-equivalents-for-ios-and-android/ keen for comments/suggestions
Click to expand...
Click to collapse
That's pretty nifty :good:
Having absolutely no experience with iOS development it's nice to see the equivalent UI widgets on this platform, and how much iOS7 got "Androidifyed", especially in terms of typography. (and also how thankful we can be for having Holo, IMO^^).
Adding this to the OP.
Forgive my n00bness but what does "Adding this to the OP" mean?
Yes, there are elements which are similar but if you watch the WWDC 2013 videos on whats new, youll see that iOS 7 is far more than Holo and the Android UI.
iOS has been hardware accelerated using OpenGL ES from the beginning which is why a the iPhone 3GS with barely any cpu or memory was able to provide a smooth experience better than most Android phones until Project Butter and dual core cpus on the Android Platform.
The truth is Android throws processing power at the problem rather than tackling it from an intelligent approach.
In iOS 7 the UI APIs have been rewritten and then the interface has been written with those APIs meaning that anyone can do exactly what apple does in their interfaces.
Every single view is backed by a CALayer which is an open gl surface. They have added some damn good Physics and advanced animation apis in iOS 7 so I expect to see some crazy interfaces a year from now.
Probably their greatest addition is keyframing and auto tweening between any two given collections creating a seemless transition between views.
The parallax stuff is pretty cool too. I dont expect Apple to release 3D screens any time soon but if they did iOS would have the best OS level support for depth within UI's.
I imagine its only a matter of time before passive 3D displays become the norm.
There are rumours that the Android Card style interface is what we will see in Key Lime Pie. If thats the case iOS 7 and Android 5 are going to look very similar.
Anyway, why not have the best of both worlds?
Despite Androids popularity, it would be nothing if it wasnt for iOS originally, and now vica versa, Google stepping up their game with ICS/JB has forced innovation around the market. I think they are both great.
madhavakintek said:
Forgive my n00bness but what does "Adding this to the OP" mean?
Yes, there are elements which are similar but if you watch the WWDC 2013 videos on whats new, youll see that iOS 7 is far more than Holo and the Android UI.
iOS has been hardware accelerated using OpenGL ES from the beginning which is why a the iPhone 3GS with barely any cpu or memory was able to provide a smooth experience better than most Android phones until Project Butter and dual core cpus on the Android Platform.
The truth is Android throws processing power at the problem rather than tackling it from an intelligent approach.
In iOS 7 the UI APIs have been rewritten and then the interface has been written with those APIs meaning that anyone can do exactly what apple does in their interfaces.
Every single view is backed by a CALayer which is an open gl surface. They have added some damn good Physics and advanced animation apis in iOS 7 so I expect to see some crazy interfaces a year from now.
Probably their greatest addition is keyframing and auto tweening between any two given collections creating a seemless transition between views.
The parallax stuff is pretty cool too. I dont expect Apple to release 3D screens any time soon but if they did iOS would have the best OS level support for depth within UI's.
I imagine its only a matter of time before passive 3D displays become the norm.
There are rumours that the Android Card style interface is what we will see in Key Lime Pie. If thats the case iOS 7 and Android 5 are going to look very similar.
Anyway, why not have the best of both worlds?
Despite Androids popularity, it would be nothing if it wasnt for iOS originally, and now vica versa, Google stepping up their game with ICS/JB has forced innovation around the market. I think they are both great.
Click to expand...
Click to collapse
The OP is the "original post" or the "original poster". In this case he means his list in the first post.
Please do not start another argument about which one is better.
Cool thanks.
Wasnt an argument just wanted to point out some facts about the underlying mechanisms in the new UI.
As I said at the end of my post im big fans of both.
madhavakintek said:
Forgive my n00bness but what does "Adding this to the OP" mean?
Yes, there are elements which are similar but if you watch the WWDC 2013 videos on whats new, youll see that iOS 7 is far more than Holo and the Android UI.
iOS has been hardware accelerated using OpenGL ES from the beginning which is why a the iPhone 3GS with barely any cpu or memory was able to provide a smooth experience better than most Android phones until Project Butter and dual core cpus on the Android Platform.
The truth is Android throws processing power at the problem rather than tackling it from an intelligent approach.
In iOS 7 the UI APIs have been rewritten and then the interface has been written with those APIs meaning that anyone can do exactly what apple does in their interfaces.
Every single view is backed by a CALayer which is an open gl surface. They have added some damn good Physics and advanced animation apis in iOS 7 so I expect to see some crazy interfaces a year from now.
Probably their greatest addition is keyframing and auto tweening between any two given collections creating a seemless transition between views.
The parallax stuff is pretty cool too. I dont expect Apple to release 3D screens any time soon but if they did iOS would have the best OS level support for depth within UI's.
I imagine its only a matter of time before passive 3D displays become the norm.
There are rumours that the Android Card style interface is what we will see in Key Lime Pie. If thats the case iOS 7 and Android 5 are going to look very similar.
Anyway, why not have the best of both worlds?
Despite Androids popularity, it would be nothing if it wasnt for iOS originally, and now vica versa, Google stepping up their game with ICS/JB has forced innovation around the market. I think they are both great.
Click to expand...
Click to collapse
I wasn't even fetching that far, just saying that strictly in terms of design, the Holo visual language seems much more appealing to me. But that's my personal opinion.
And yeah, as nikwen said, it meant "Adding an entry for this tool in the original post"
Hi Androguide.fr, thanks yeah I understand what you meant. I guess the thing is, I see a UI as more than the default interface thats provided but more as the capabilities of the UI for future apps. I watched all the WWDC videos and id say the physics and dynamic animation stuff is a vital element to the overall interface, one that screenshots do not convey.
If you consider what the original iOS looked like and compare that to some of the awesome interfaces that third party app developers created, and in the same token what users are able to do with the new Holo theme and its widgets compared with say 2.x.
I think its too early to tell if this visual style is a bad thing or if it will simply get out of the way of the user and provide 3rd party app developers with some great tools to create some really amazing interfaces.
The Windows 8 flat interface was laughed at quite a bit when it was first shown off, but it seems most interfaces are gravitating towards flat. All design goes through phases of vogue. I think were beginning to see the same thing that fashion has had for 50 years which is recycling of ideas and styles to provide brief periods of "re-freshness".
Anyway, thanks very much for putting our toolkit in your Pinned post.
I look forwards to creating some other great content or tutorials in the future which can be of value to the XDA community.
Hi Androidguide.fr, I just noticed your OP links to Taylor Ling's Android PSD file:
http://androiduiux.com/2013/03/12/android-ui-design-kit-psd-4-2-free-download/
It might not be obvious but we have our own linked from PortKit too:
http://kintek.com.au/blog/android-ui-design-psd-free-download/
They are not identical so there should be value in ours too. Especially because we have the icon set in there as well.
Cheers

Categories

Resources