Cascades Development

[360Degrees]

Hello,

I am a designer and I want to make app mock-ups. However I cannot find out the standard size for the UI elements in cascades. Could anyone tell me de size (width and height in pixels) of these custom elements:

• Title Bar
• Lower Action Bar
• Title bar font and font size
• The height of an element in a list (like in a contacts app)

Thank you for your help.

[timvito · Accepted solution]

Hello 360,
I'm not sure about exact pixel dimensions of all the elements you mentioned, but I can try and point you in the right direction when thinking about designing for BB10.  A good place to start is the design principles document found at http://docs.blackberry.com/en/developers/deliverables/41577/design_principles.jsp.

There is also a photoshop exporter plugin that may be helpful and can be found at https://developer.blackberry.com/cascades/documentation/design/cascades_exporter/install.html

Some documentation/information specifically focused on the items you mentioned:
Title bars: http://docs.blackberry.com/en/developers/deliverables/41577/title_bars.jsp

Action Bars: on my BB10 Alpha the lower action bars are around 140 pixels high and more info can be found at http://docs.blackberry.com/en/developers/deliverables/41577/action_bars.jsp

Fonts and font sizes: http://docs.blackberry.com/en/developers/deliverables/41577/typography.jsp

List Items: The default list items have a height of around 120 pixels (and width of the container the ListView is in unless otherwise specified)

Tim

[timvito]

Hey 360,

How are the mock-ups going? Let me know if you have any additional questions or if the information was helpful.

Thanks

Tim