How to make 2d character selection screen using new ui in 4.6?

Hey i wanna make a character selection screen something like this using 4.6. Can anyone give me some hints to make it?

Reference: https://drive.google.com/open?id=0B3EbNCs5Jk2bSEZDMm9wel9XQjA&authuser=0

 

Well, what do you up until now?

If you haven't started yet: Use Panels, The character buttons on the left would be inside a panel with a grid layout, the buttons themselves should be buttons, with an animation as transition mode. They will also need layout elements, and to control their aspect ratio, you could use the aspect ratio fitter (Even though it will give you a warning that you shouldn't use it, when being in a layout group). On the right side there could be a panel with an animator. Then you would add an onclick event to the buttons which would set a trigger in the panel animator on the right side.

And also try to get the ratio stuff right the first time, so that it looks good at every resolution ratio.

Does this answer your question? Otherwise try to answer more specific questions.

 

I have made everything now i want to fit every resolution and show an image when u click the button just like in the video.

 

You have to do this first. Then you can create an animation, where first the sprite/panel fades out, and then you could switch the sprite and let it fade in again.

For this, as well as for resolution independency I recommend this video:

 

I have completed the resolution by myself. I did not wanted to make animation for the menu. Now only the showing image on click event is left thanks. That one is a really nice tutorial btw.