The Stage

Enterprise Software™

We can't build a useful website until

• A host is chosen
• The creative direction is defined
• This has to happen before technical work can start.

Six Weeks

The Guests

Decompose the system

Our Non-Blocking Approach

The two biggest components are:

• A COPE decoupled technology stack
• Semantic content model

So...Semantic what now?

So...Semantic what now?

...

The Dawn of the Semantic Content Model

The Dawn of the Semantic Content Model

The Dawn of the Semantic Content Model

• Content structures resemble real-life
• For the Tonight Show that meant content types would look like elements of the show

Semantic BUT Abstract

Semantic BUT Abstract

Setting the correct resolution for semantics is important.

Addresses volatility in trends and interests - gives you flexibility

The Science of Semantics

Thinking Semantically

In Practice

We ended up with a Semantic content model...MOSTLY

In Practice

Semantic Content Modeling Benefits

Semantic Content Modeling Benefits

• Shared Language for all teams
• Sustainable
• Looked like any other editorial process at NBC Digital
• The business is final driving

The Second Part of our Non-blocking approach: The API

The Second Part of our Non-blocking approach: The API

• Establish Outputs
• Decoupled - faster itterations and deployment
• Leverage a pre-existing API framework
• Consistent editorial experience

More than meets the API

The System is the Architect

The System is the Architect

IF decoupled development needs a lynch pin - Why not make it your API?

• The API as a commitment of behavior
• Versionless, backwards compatible, and dependency free.

API Concerns

That's no API, it's a PHPOOPAPI

That's no API, it's a PHPOOPAPI

• Let us utilize available strong PHP OOP resources
• OOP inheritence let us shift complexity down and simplify implementing classes
• Simpler implementations gave us cleaner asynchronous workflows.

The API In practice.

• The API was structured similarly so that calls could be placed in reliable ways.
• An API call to a display centric resource looks something like this:

episodes?id=15

The API In practice.

You might get something back like this:

{
    "episodes": [
        {
            "type": "episode",
            "episodeNumber": "15",
            "name": "Jimmy and Justin",
            "season": "1",
            "airDate": "2014-03-05T00:00:00-05:00",
            "guests": [ {"id": "123"},{"id": "124"} ],
            "merlinId": "",
            "images":[
                {
                    "id":"642",
                    "description":"Scenes from the Tonight Show with Jimmy Fallon.",
                    "orientation":"portrait",
                    "emphasized":false,
                    "isGif":false,
                    "url":"http://tonightshowpath.com/files/images/2014/02/05/img_20130309_140147_1.jpg",
                    "bitImageStacked":"http://tonightshowpath.com/files/styles/bit_stacked_resized/public/images/2014/02/05/img_20130309_140147_1.jpg?itok=NUKlRWNu",
                    "detailImageSmall":"http://tonightshowpath.com/files/styles/detail_image_small_portrait/public/images/2014/02/05/img_20130309_140147_1.jpg?itok=ApiJp4Od",
                    "detailImageMedium":"http://tonightshowpath.com/files/styles/detail_image_medium_portrait/public/images/2014/02/05/img_20130309_140147_1.jpg?itok=WakkI2CC",
                    "detailImageLarge":"http://tonightshowpath.com/files/styles/detail_image_large_portrait/public/images/2014/02/05/img_20130309_140147_1.jpg?itok=3s6NWs-A"
                }
            ]
        },
            

The API In practice.

An API call to a semantic resource looks something like this:

guests/124

The API In practice.

{
    "id": "127",
    "name": "Britney Spears",
    "headshotImage": [{
        "id": "123",
        "title": "Slim Shady image",
        "description": "Jimmy and Justin do Eminem image",
        "orientation": "landscape",
        "emphasized": false,
        "isGif": false,
        "bitStacked": "http://path.image.com/app2/img/144x81xS/scet/episode/6/9/3/6/9/rok_504_sm.jpg",
        "androidLdpi": "http://path.image.com/image2.png",
        "androidMdpi": "http://path.image.com/image2.png",
        "androidHdpi": "http://path.image.com/image2.png",
        "androidXhdpi": "http://path.image.com/image2.png",
        "androidXxhdpi": "http://path.image.com/image2.png",
        "iphone": "http://path.image.com/image2.png",
        "iphoneRetina": "http://path.image.com/image2.png",
        "ipad": "http://path.image.com/image2.png",
        "ipadRetina": "http://path.image.com/image2.png"

            

Drupal as content provider - challenges

Drupal as content provider - challenges

• Known unknowns - understand where you are drawing your boundaries
• Specialized resource delivery needs
• Be prepared for questions and training

The more you know...

• Don't forget the site preview experience
• Eschew soup-to-nuts solutions - you don't need the complexity
• Even less concessions for display

The Finale

On the next episode of nova... (twinkletwinklehollystarr)

The timeline, the approach hid something surprising, something unusual...

Consider the system as an architect

Decoupling

Constraints Inspire Innovation