BBC: Development

Some development shots of applying a slightly altered grid, I'm no longer having a vertical side pane, I want to accentuate the horizontal movement more and want my live-feed to bleed off the edges so it's not all closed in with side panels to each side, the only issue is where do I put my left and right arrows for easy flicking through the separate BBC websites - I'll address this when I get there.

Colour strip at the top correlates with the page, the turquoise of BBC Weather. iPlayer Rollover, when clicking the existing page slides to the left and the iPlayer elements slide in from the right.

BBC Sport page with the yellow strip.

Gill Sans is BBC's font so I've used it too, 35 point for the website titles, 17 point for the navigation buttons and 7 point for the smaller details, I hope to be able to use 35, 17 and 7 pt for the news articles too to remain consistent and not too inconsistent in size, something that annoys us about news websites.

Weather/date and time in the top right of the page.

I've kept everything in proportion with each other with the grids and the pt size too as Phil has been showing us in the Type & Grid workshops, hopefully it pays off in the overall aesthetic. You can see here the relationship between the BBC logo and the Navigation text. The descenders of the text line up with the buttom of the BBC squares and the baseline lines up with the baseline of the BBC text

__Live Feed notches
Illustrations of the ability to have varying sizes of Live feed, I still need to add the content into the live feed and static white area yet. I'm still working on the overall design before I mock up all the possibilities.

1 Notch

2 notches

3 notches

4 notches

Full screen livefeed

Would be amazing on an iPad to just slide through all the content!

I wanted to have all the useful information needed at the top, similar to a home screen on a mobile or the notification centre on an iPhone

I'm still unsure about how to add the profile pic and favourite button for dragging and dropping articles into. I want the live feed to change into your feed when you click on the favourites icon. Sharing an article links to Facebook/Twitter, I'm not sure a newsfeed of friends updates like Facebook is really needed.

Now to apply the grid of content...

Here's how it'd look when viewing Match of The Day live, while news keeps pouring in next to it, looks like Wayne Rooney just knocked one in, you'd click to get the full story.

I need to add in mock-up content for the static white area, as a normal 'standard' news page but with more of a simple grid to it.

I think we REALLY need to submit a movie or some sort of animation as our concept just isn't done justice with static image as swiping through and seeing everything moving and coming to life with the transitions etc is such an important part of our project