×
Namespaces

Variants
Actions

Talk:Developing Metro or Panorama UI for Series 40 full touch

From Nokia Developer Wiki
Jump to: navigation, search

Contents

Pooja 1650 - Cool

Can't say anything technically as I am not into S40 but it looks good - concept wise.

pooja_1650 10:14, 18 July 2012 (EEST)

Hamishwillee - Feedback

Hi Adarsha

I've re-instated this in the competition and improved the introduction. In particular you will note that the screenshots are now up the top and linked to Panorama control information - this picture provides a much clearer view of what your control is supposed to do than the wireframe, which I've moved down into the "Design" section.

A few specific points:

  • Code example didn't work for me on the latest beta SDK simulator - I copied it into the project and ran as a MIDLET - got "ALERT: java/lang/ClassFormatError: Bad version information."
  • It would be good to add the SDK you used, platforms, devices to the ArticleMetaData - that way in future people can work out whether the article is relevant
  • A short video would be good - understand this is hard to produce.

In terms of documentation, I think this needs work in terms of both style and content. For style, its OK to have the occasional smiley face. However wiki is mostly for hard facts - its not a blog - readers want mostly great information, quickly. I would strip out "If you are with me raise a smile else scroll down! and "So are you thinking what I'm thinking" etc

The content is where I see the most flaws.

  1. Design section - what are you trying to achieve with this? It looks like a list of components you might want to use with links, not a section explaining "design".
    • The category bar section for example mentions that "I guess you all know, Soft keys are not displayed on full screen Canvas. But fortunately Category Bars are displayed anywhere, I mean it is visible for both Form and Canvas, wow, this sounds good."
    • ... but I don't actually understand this is supposed to tell me. Are therethere are issues with working with Category bars on canvas? What are they? Should I use them or not (a design question). If so, then how can I make them work? The same questions can be asked on the other topics in this section

To reiterate - what is this section supposed to be teaching?

  1. Design and Implementing Panorama Page - this doesn't really tell me much about what I need to do
    • Don't ever have a heading if all you're going to include is a link - e.g. "Metro UI Design Principles" - include the link as a "See Also", or as part of your text.
    • "Inherited principles which suits best for Series 40" - as far as I'm concerned this is just a list. It means nothing to me - I can't use it to better understand what I need to do to create this component
    • "Sliding the page" - the code in this section looks good and interesting. Could use some explanation and documentation. It doesn't need much - just a sentence or two. I would start with the design overview - "I have implemented the component as a set of pages on a large canvas. The following sections show how I detect the gesture and then how I handle the sliding effect when the XXX event is received"

Overall, as a reader I want to understand

  1. What I need to think about if I am implementing my own Panorama
  2. Architecturally, how this can be achieved - ie Canvas, owning a number of X elements etc. How I move the various pieces around, and who owns what
  3. What will provide difficulties - ie if category bar should or can be used, and if so, how I do so on canvas

A really "great" article would also provide the code as a "component" that people can reuse. Ie they specify pages and a background to a component, and all the work of layout etc is done for them.

Regards

Hamish

hamishwillee 03:58, 24 July 2012 (EEST)

Adarsha saraff - Thanks

Hi Hamish,

Thanks for your valuable feedback. I hope, I had improved at-least 40%. I guess, your are happy with the Component. However, you still need to code, but the component saves most of your time.

-Adarsha.

adarsha_saraff 10:21, 25 July 2012 (EEST)

Croozeus - Hey

Hi Adarsha,

I updated the article metadata with SDK and source code. Also moved the article to a shorter title.

Check if OK?

/Pankaj

croozeus 08:46, 26 July 2012 (EEST)

Hamishwillee - Still needs better comments

Hi Adarsha

I think Croozeus name change is good, although now you're delivering a component you could call it just "Metro or Panorama UI for Series 40 full touch"

Thanks for your valuable feedback. I hope, I had improved at-least 40%. 
I guess, your are happy with the Component. 
However, you still need to code, but the component saves most of your time.

Making this into a reusable component is great. Thanks!

However my points for the documentation still stand - the design section doesn't really cover the design and someone reading this will not learn anything from this. It isn't clear to me what points you're making about the category bar etc.

Also you've added the new component, but not mentioned it in the introductory sections. This is a massive big deal you need to mention up front.

Regards

Hamish

hamishwillee 09:13, 27 July 2012 (EEST)

Adarsha saraff - How about now?

Hi Hamish,

I have removed some confusing statements and made it simple. Now I guess, someone reading this will understand a bit?? I am poor in English and writing this much is a big deal for me. :D

adarsha_saraff 22:05, 27 July 2012 (EEST)

Hamishwillee - A little better!

Hi Adarsha

English is tough - but I think you're saying too little because you're hoping the code will speak for you ... and it doesn't (enough) for me. Its great you've introduced the component in the introduction and I think the new image is pretty good. I like that you've said what components can be used. I would say this is quite a lot better, but still some way to go.

First problem is that I still get app error in simulator - do you get this on the version attached? That makes it hard for me to get a great feel for how this works since I can't try it out.

In general I still can't work out what the design sections do for the reader - how they should use this information or how it related to the component. One useful bit is that they have to draw content on the canvas - can they use LWUIT components (also drawn on canvas) as that would make lists etc easier?

In terms of the categorybar - I WAS going to ask when you'd use this - since a category bar implies view based navigation. Perhaps for use on a non-touch device?

In the Component section, you've created the object like this:

panoramapage p1 = new panoramapage("Test Application","/background.png","/title.png");

So my questions are

  • what does this give you? I guess a page with title Test application, an image to the left of the title and a big background image? I am also guessing that the component out of the box would have no other view - it is worth explaining.
    • So what is the width of the panorama? The width of the background image? What if I want more views, does the background image extend?
  • What are the parameters (kind of similar question to the above)
  • How do I add more views/pages? I'm guessing from the code, "manually". That's not good design, but its fine here as long as you explain it - otherwise people will expect it in a reusable component. If I were implementing something like this I'd define a page object that held properties of the page, and was owned by a panorama object that managed it.
  • Can I change the scroll speed?

In summary "if this is a reusable component, explain to people what they get out of the box, and what they need to do to extend it".

Regards

H

hamishwillee 08:52, 30 July 2012 (EEST)

Adarsha saraff - Thanks - Fixed a bit.

Hello Hamish,

"In terms of the categorybar - I WAS going to ask when you'd use this - since a category bar implies view based navigation. Perhaps for use on a non-touch device?"

Metro UI design is not suitable for non-touch device, as the principle says "Animation plays a large part, with transitions, and user interactions such as presses or swipes recommended to always be acknowledged by some form of natural animation or motion." As non-touch devices does supports gesture events.

-I have added a note saying this in Introduction.

"In general I still can't work out what the design sections do for the reader - how they should use this information or how it related to the component. One useful bit is that they have to draw content on the canvas - can they use LWUIT components (also drawn on canvas) as that would make lists etc easier?"

I have added the link to UI components, so that you can get Idea about designing components in terms of size (in width and height). -I have added note about this in UI components.

"If I were implementing something like this I'd define a page object that held properties of the page, and was owned by a panorama object that managed it."

Since component is designed to give full freedom of modifying, I have not used any classes to manage item and control. I feel that will restrict the developers in modifying the component, as they need to modify all the supporting classes too. So I left that part for them, so they can implement in their own way.

-I have added some lines about this too.


And regarding Creating of Component Object - I have added comment giving the brief of parameter used.

adarsha_saraff 11:47, 30 July 2012 (EEST)

Hamishwillee - Fixed a lot

Hi Adarsha

Actually I think you fixed this quite a lot. I have also further subedited/restructured this to improve the appearance and readability. I particularly like the fact you've provided some UI components that work with your control.

First, some specific feedback:

  • You now have three specific examples listed: Media:MetroApp.zip, File:Panoramapage.zip, File:SampleMetroUIComponentApp.zip. Last time I tried MetroApp it didn't work - did you fix this?
    • Its also not clear what each file contains - you might want to add a section "Downloads" which contains three bullets, listing each file and an explanation of what is in it. ie SPELL it out!
  • Category Bar section still looks odd to me - I can't see where you would use it. Unless you can find a use case you might want to add a note explaining that the category bar "works" but but is not particularly useful with metro
  • RAD and RDA section seems pretty pointless to me - RDA should be somewhere completely different - possibly in a tip somewhere - certainly not in a "Design" section. Similarly the RAD part contains useful information about the fact that there are further examples elsewhere - I wouldn't put this under a section called RAD though, because that really isn't useful or helpful.

In general I think this is much improved. I still think that it could be better written to make it easier for a person to do this themselves, but I can't explain further how to do that without doing it myself. Certainly now though the main sections make more sense.

Thank you.

Regards

Hamish

hamishwillee 04:30, 31 July 2012 (EEST)

Adarsha saraff - :D

Hello Hamish,

I am going to removes all pointless section, because I need to write more about component and Using component to make their job simple. I have updated the all the files, pls check again, if the problem still arises, let me know.

adarsha_saraff 08:16, 31 July 2012 (EEST)

 

Was this page helpful?

Your feedback about this content is important. Let us know what you think.

 

Thank you!

We appreciate your feedback.

×