CBC New Media Offers Better Brackets and More for NCAA Tourney

WRAL Hoops HeadquartersWRAL.com and WRALSportsFan.com are THE team for online coverage of the NCAA Tournaments.

“We’re fortunate to live at the epicenter of great college basketball,” said WRAL.com General Manager John Conway.  “We have four teams in the NCAA tournament field, so we have to treat this like election night or a hurricane headed for our coast. We deploy a lot of resources, and I am proud of our multi-platform coverage.”

WRAL.com Director of Content Jodi Gluso shared the digital efforts of the award-winning local news website:

When online visitors click on the new and improved interactive bracket, you get an instant view of the latest standings.  But a lot of work and planning went behind that instant gratification. Reconceiving the brackets in a responsive design and pulling in live data was a big undertaking for CBC New Media.

CBC New Media Director of Technology Jason Priebe told Capcom about the nuts and bolts of bringing this new bracket to life.

Our interactive bracket has always been a centerpiece of our tournament coverage.  This is really the third iteration of the bracket.  

We originally started with a Flash-based bracket, which was great, but with the advent of the iPad, we realized that we couldn’t rely on Flash for something so important.  So we redesigned the bracket using HTML and Javascript a couple of years ago.  

This served us well until we redesigned all of WRALSportsFan using responsive web design.  With RWD, our full site is available to all sorts of devices from phones up to desktop computers, and it reformats itself accordingly.

Our HTML bracket was too wide and inflexible to be used with the new design.  It would not have displayed properly on iPads, and it would have been useless on a phone.  So we had to come up with a new bracket design that would resize itself flexibly, and then for very small devices, it needed a completely different presentation.

You can see how this works by opening the bracket in your desktop browser;  if you resize your browser window to smaller sizes, you can see the bracket entries shrink gradually until you hit the phone breakpoint.  At this small screen size, we replace the traditional bracket layout with a round-by-round view that is optimized for use on phones.

Just as important as the design is the tooling to allow our team to set up the brackets quickly on Selection Sunday.  This is software that has been in the works for a few years.  An editor can follow along with the announcements on TV and plug in the teams and regions via a back-end web tool.  This allows us to have our bracket up and running within minutes after the last team is announced.

 During the tournament, live game results are fed into the bracket via a feed we get from The Sports Network.  We’re using monitoring software to ensure that this feed is getting updated in a timely fashion throughout the games.


Comments are closed.