winning with modular content, the redesign story of the ncaa - ux strategy summit 2014

WINNING WITH CONTENT

the NCAA.com redesign story

Klemens [email protected] | @kwengert1

!Hi I am Klemens, I work for Turners internal consulting team on all of the Turner Brands CNN, CNN Money, TBS, TNT, etc. I also work support the HCI program at GA Tech, and UX Mentors !Lets first go over what the NCAA is and what its relationship is with Turner !As you can see that is my picture down there and of course I would like to continue the conversation on twitter or email. however, if you follow me you will see a lot of UX rants and A LOT of pictures of my son Thor (because I am one of those )

mailto:[email protected]


As I said Prodigious amount of photos of Thor But he is not here just to delight me and hopefully you, research indicate… that his presence will get you to rate this presentation more favorably :-)



AGENDA• Definition of UX Strategy

• The NCAA Example & Solution

• Accelerating the Innovation of Your Team

• Key Take Aways

• Q+A

So lets go through the agenda



UX STRATEGY?A Process of Aligning the User Experience to the

Business Strategy

What is UX strategy, it is a way of developing guiding principles for UX that support the business strategy.



SMART BUSINESS GOALS• Simple

• Measurable

• Attainable

• Relevant

• Tim Bound

How do you write smart business goals if you do not get any from your business team



SEASONS

CHAMPIONSHIPSDIVISIONS

Who is the NCAA? they cover 3 seasons over 30 sports in 3 divisions with mens and women's series for 1300 schools. the content is wide. !Stakeholder interviews: Business wants - Sponsorship and traffic generation Editorial wants - Pigeonholed in the a layout, no champs, sports, schools Design wants - More consistency and a better design framework


FLEXIBILITY


SOLVE FOR

Flexibility becomes the guiding principle that solves the problems for all groups. The Content blocks big idea is to adapt to the space that is given. Business team gets their sponsorship ops in there, the editorial team can rearrange the layout at any time, design team can focus on creating more content tiles instead of making one offs.



150x300

300x300 300x600 300x900

600x600 600x900

900x1200

900x900

150x150

TILE SIZES

All content types such as articles, videos scores schools etc. that are featured on NCAA.com needs to exist in a multitude of different sizes. to be able to be rearranged



LAYOUT SAMPLES

grid example



LAYOUT SAMPLES

resized grid example



LAYOUT SAMPLES

so here are all the different sizes, but as we all know wireframes do not make for great presentation material, so lets look at what the system looks like when our friends in visual design have taken a pass.



show of the different modules and how the page was constructed



But what about other devices? Cover the eco system problem - a ever expanding system of devices and consumption processes at this conference you see people with glass, pebbles, smart watches and phones of every size. there will be more devices. and for this you again need flexibility.



Example of the mobile site for the NCAA and the mobile app: By creating a system that helps display the content you increases the velocity of all parties as they can focus on solving for the device of channel as opposed to setting up a system. this sets the brand up for a future where they can provide designs for the next device, whatever it may be.



Example of how your coworkers can invent new ways of using the content in different ways. this is a application of the NCAA content blocks used inside of the March Madness on Demand Apps.


ACCELERATEINNOVATION


You heard Kelly and Julie talk about the cross functional teams this morning here is where it comes together. If you focus on creating a system inside of which the content lives you are empowering your coworkers to invent new ways of using the content.



WHY IS THIS IMPORTANT?

it will also Increases the velocity of the team as they are mor connected to the product. You unlocks creativity of the team and it sets the brand up for a future next device



KEY TAKE AWAYThink content first to future proof

Modular content increases team velocity Control the system not the usage

recap



THANK YOU


QA



winning with modular content, the redesign story of the ncaa - ux strategy summit 2014

Software