BBC Website

Hi Everyone

I have been asked to do a website similar in design and functionality to the BBC’s new site (http://www.bbc.co.uk/) with a “slider” with content. I appreciate that their budget was a little higher (to say the least!) but could I achieve a similar effect with Freeway?

Many thanks


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

The carousel action does just that…

http://actionsforge.com/actions/view/15-carousel


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

This is a textbook example of what you can build with Carousel. There is a subtle feature here that you cannot exactly duplicate – the headline staying still, but changing content. What you can do is compose the headline and content as a single unit, then duplicate and change that to create the alternate panes of the carousel effect. When you slide the content over, the headline will move with it. Then place the “you are here” (built with Carousel Tab) and the previous/next buttons (built with Carousel Button) as layers over the top of the main Carousel element.

Walter

On Aug 8, 2012, at 12:55 PM, MarkSmith wrote:

Hi Everyone

I have been asked to do a website similar in design and functionality to the BBC’s new site (http://www.bbc.co.uk/) with a “slider” with content. I appreciate that their budget was a little higher (to say the least!) but could I achieve a similar effect with Freeway?

Many thanks


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Yes, that was the bit that interested me. I thought it looked like it was effectively 5 carousels (BBC Online today, Entertainment, Knowledge, News &Sport) on top of one another?

Is that what you meant Walter? Not quite sure how to achieve this. Could I ask you to be a little more explicit (step by step) with the instructions?

Many thanks

…the headline staying still, but changing content.


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Sure. When you make the initial carousel element (the one that indicates where the effect will live on the page) and each of the panes (the alternate content for that effect), you can compose these elements out of multiple elements to get the effect you’re after.

You draw an HTML box the size that you want the effect to be. Then, while that box is still selected, you draw additional boxes over it (these become “child” elements of the main box) to hold the photo, headline, descriptive text, etc. You apply the Carousel or Carousel Pane Action to the outer main box, and the entire nested package becomes one element that you can animate.

The easiest way to make multiple elements that are all exactly the same size is to compose one set of grouped elements, then duplicate it by selecting the outer HTML box and choosing Item / Duplicate. Apply Carousel to the first one, and Carousel Pane to the second. Then (after you’ve added the CP Action) duplicate that second pane as many times as needed to make your complete set of options. Finally, edit each copy so it contains the correct content. These panes may be scattered on the page, off on the pasteboard, anywhere you can put them so you can see them. When the page is published, the Action will remove them from view and re-organize the page code so that the effect makes sense from a code standpoint. The only other thing you need to pay attention to is stacking order, as that is how you will control which element appears second, third, etc. (The Carousel element is always first.)

Finally, to add the “you are here” element, you build a set of Carousel Tab elements somewhere off on another part of the page. Select them all, use Item / Bring to Front to make sure they are above the Carousel, and drag them together so that they float over the top of the Carousel.

Do the same with the two Carousel Button graphics that you use to move forward and back.

To get the auto-change effect, just click on the main Carousel element and set the Auto-glide interval to whatever number of seconds you believe your users need to read through the headline and glance at the picture.

On Aug 8, 2012, at 1:42 PM, MarkSmith wrote:

Yes, that was the bit that interested me. I thought it looked like it was effectively 5 carousels (BBC Online today, Entertainment, Knowledge, News &Sport) on top of one another?

Is that what you meant Walter? Not quite sure how to achieve this. Could I ask you to be a little more explicit (step by step) with the instructions?

Many thanks

…the headline staying still, but changing content.


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Thank you so much Walter - I’m off to start it!

Your help is much appreciated.

Best

Mark


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Forgot to add, this is wonderful resource for custom Carousel effects: http://www.freewaystyle.com/category/carousels

Tim covers some expert-level tricks to customize the tabs, giving you a leg up to making these sorts of effects. There are downloadable Freeway files to dissect and learn from, too!

Walter

On Aug 8, 2012, at 1:52 PM, Walter Lee Davis wrote:

Finally, to add the “you are here” element, you build a set of Carousel Tab elements somewhere off on another part of the page. Select them all, use Item / Bring to Front to make sure they are above the Carousel, and drag them together so that they float over the top of the Carousel.


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options