03-01-2013 06:41 AM
Hello BlackBerry Developer Community,
I bet many of you are having fun making applications with Cascades. At least I find myself enjoying it more than usual! It's hard to find such cool UI framework to work with. But sometimes, I also have some Cascades nightmares. Nothing is perfect, right?
But if we work hard together, we can get closer and closer to perfection until a point that we are so close, sooo close that it's considered perfection. And this is achievable! The more we use the tools, more problems and limitations will be found. The most important part in my opinion is providing a good feedback to BlackBerry regarding those bad experiences.
From my experience, after attending to two BlackBerry JAMs in Amsterdam and developing 3 BlackBerry apps, I can confirm that they do really listen to their developer community and even on a individual basis! Off course, not always but most of the time. That's the main reason I believe in BB10: knowing that BlackBerry is my business partner and will do as much as possible for my business to succeed so we can succeed together.
OK, here's my feedback. I hope it's useful:
The designers on my team are having a hard time specifying the final UI specs from our app because they don't know the default dimensions of the UI components. This problem is getting even worse now that we started supporting the Q10 and some of the default components have different dimensions than from the Z10's.
We found this here on the forums which was already really helpful but it's not complete.
The only way we came up with was to create a small sample app with all the default components, UI navigation (NavigationPane, Sheets, TabbedPane, etc), menus (ActionBar, NavigationBar, ContextMenu). Run this app on Dev Alpha and Dev Alpha C, take screen shots on those devices of all the UI components that we need, send the screen shots via the device email account to the designer so she can cut them all on PhotoShop and save as individual assets. But of course we didn't have the time to do this.
As you can imagine, this solution is far from good. We need detailed information of the precise height of all default UI components. In both active and inactive state (for instance, when you start interaction with the Slider, the "blue glow" of the handler is very big so margins and paddings have to be optimized). We also need the height values from all navigation bars like the NavigationPane, Sheets with ActionItems and so-forth.
We can do basic mockups but without this information the final UI specification is just impossible to achieve!
When the designers first saw their UI design implemented and running on the device, they almost panicked because it was not pixel perfect and we actually need pixel perfect precision for some parts of our app.
Fellow developers, if you have the same issues as we do, if you liked the proposed solution and have more things to add, please speak up your mind and Like this post and share on Twitter. Lets discuss what could be the ideal solution.
Internal BlackBerry Developers, I hope you take this feedback in consideration and take action! And please join the solution discussion. Let's solve this!
Thanks for reading. Looking forward to our discussion.
03-01-2013 07:45 AM - edited 03-01-2013 07:49 AM
Sorry I won't be able to 'like' your suggestion.
For me it goes against 20 years of design improvement, long gone are the days when UI elements were fixed size and rightly so as they were exclusionary to certain users.
Take the example of the sight-impaired who with modern day design are able to change font sizes to a larger size and therefore influence the 'default' size of any components with text in.
So I doubt any amount of campaigning will give you want you want as there is no 'default' size anymore and rightly so in my opinion.
The variety of screen sizes, form factors and resolution also make this pretty unfeasible.
"Design for the Majority, test for the Minority"
03-01-2013 07:59 AM
I also suggest that you get some new designers as the ones you have seem to be working backwards, the designers should design the concept then it's up to the UI guys to approximate the actual design to that as near as possible.
And pixel perfection is also just not feasible on modern devices as screens are not always single pixel single point based, what on earth do you need to do this for?
I suggest you read up on modern day screen technology, if in your app I have to hit a single pixel accurately with a finger that is roughly half an inch on a display that uses 330 ppi I'm REALLY going to struggle!
03-01-2013 09:36 AM
thanks for joining the discussion! Bu can you add anything more concrete and constructive to it? Saying "get new designers" is not really helpful. Do you have any link with some material of good practices for Cascades UI development? Our designers are new to it and even after studying the whole UI Guidelines, they find too difficult to create the perfect UI.
For instance, when a new Page is shown on the NavigationPane, what's the height of the bottom toolbar with the "back" button?
For sure there's specification for it somewhere since TAT guys are really perfectionist with their work. This is important because the total usable area of a Page is less than the total screen height thus, all the margins, paddings and heights have to be adjusted.
03-01-2013 12:21 PM - edited 03-01-2013 12:22 PM
I'm sorry you found none of that constructive, I thought explaining that your design methodology was 20 years old should have been helpful.
Have you read this
Modern design frowns on placing controls at absolute positions for the reasons given in my posts above and those mentioned in the link.
You shouldn't need to know the height of the bar when you can place a scrollview above it and avoid having to fit your controls precisely in to that space.
With already three form factors to consider with BB10 (Z10, Q10 and (hopefully soon) PlayBook), your method of designing will quickly become untenable, every new release requiring a reworking of your design.
You seem hellbent on going down this route, however, and haven't given the reasons why you need to be so accurate so best of luck.
03-01-2013 03:50 PM
when designing custom controls, knowing the dimensions of system UI elements is very useful especially with flow in mind. There's nothing wrong with using the static asset selctor and having to change a few lines of code for the 3-4 different screen sizes that the OS supports, that's why it's there. What the OP is asking for is in the building for BB10 UI guidelines something like this to be shown so that they didnt have to use the current screenshot method
(I did this using the screenshot method)
Having them pre-defined would save a few minutes, but figuring them out wasn't very hard either.
I tested this against the "Modern Design Theory" & used an increased font size as well, both action bars had the same height of 140 px, a use case for the usefullness of this information: if the developer wanted a menu that didnt cover the action bar they would need to its height in order to build accordingly
03-01-2013 06:01 PM
03-01-2013 06:03 PM
Having come most recently from the Android world I'm familiar with static asset selectors and go out of my way to implement my design so as not to have release new code every time a new form factor comes out, something that seems to happen every week.
This is still exponentially better than the align to a pixel world that was windows app design 20 years ago, something the original OP seems to be advocating.
What I think I'm trying to avoid here is that new designers coming along look at this article and decide to base their design on 'pixel perfection'.
As for menus, I can see your argument but still consider this the last design choice that should be made, there are always alternatives. AFAIK BB10 menus cannot be controlled to this level so we would be talking about designing your own custom menu opening up even more possibilites of having to rework not only assets but now your custom code as well every time a new BB device form factor is released.
03-03-2013 05:59 AM
Don't forget that the element sizes differ a bit on the square-screen devices. If you *really* want to see what sizes are good approximations, might I suggest looking in bbUI.js?
As for Cascades, you don't need to know more than "your icon should be 81x81 px", since the framework takes care of any further details for us.
Perhaps you can give specific examples of what you need to know, and why?
10-08-2013 01:47 PM - edited 10-08-2013 01:47 PM
Despite some views on the matter, Since this topic has been brough up a few times I went ahead and created a ticket so we can see where BlackBerry stands on the issue
UI element pixel guidelines
Please vote iff this is something you're interested in. The more votes the more likely it is that we will get this information.
It may take a few days for the ticket to be accessible