please help me to create ui screens

Hi All,
am knew to CAf, please guide me to develope the untitled attached screens,i need which controls i need to use to achieve left side panel and items ,if i click items i need to open the respective form.
please help me on this, in untitled1 attached file having carimage,if i place mouse or click on image ,it has to list the items, if i click on listed item ,need to open respective portlet.

please suggest me on this, please explain me step by step controls.
Thanks and Regards,
Anil Kumar Ellendula

please have a look into for samples on CAF.
One of the samples is an “accordion” which may be similar to what you want to achieve

Hope it helps,

i have developed sample u sent me, here it is dispalying like slide show effect, not as a page load effect like web application look , if i click left side table link it has to disaplay on right side, how can i get the web application look and feel , it should like a loading the page not like slide effect, how can i get this functionality

anil kuma e

hi javier,

to get this screen fuctionality do i need to develop portlet application or webapplication, please tell me portlet supports all functionalities of webapplication and please suggest me before stating screens development how can decide to develop screens in webapplication or portlet application.

anil kumar e

development of a portlet or web application is a question that cannot be answered in a forum post (in the end this is a decission you need to make by yourself, not by third persons). Google a bit about what is the purpose of portlets vs webapps, check if the functionality of a Portal (MWS in this case) is something you need or if you prefer to develop all you need on you own, check if it’s possible that some of the portlets will be reused for other projects…

Developing the UI in you screenshot can be done both with webapps as well as with a portlet application. In a portlet application you need to think a bit in a different way, since the screen is divided in areas defined in the Shell. Have a look at the existing shells to see how that works.
The “accordion” are on the left side is already there in v8, in the “noodle” shell (this is one of the advantages of using portlet apps… you can reuse your portlets for other ‘applications’).
A portlet application can use almost all controls (i believe only 4 are “non-portlet” controls). On the other hand, there are some other controls that cannot be used in a web application, like ‘People Picker’, mostly related to MWS functionality.

hope this helps,