Pouring Polymer onto TRIRIGA docs


Google Polymer! What am I talking about? First, let me ask you this: Have you ever designed your own websites in HTML, CSS, and JavaScript? Or edited your own blog posts and switched from rich-text view to HTML view? In any case, if you’re a technical writer or developer, you’re probably familiar with HTML tags — tags like [a], [div], [img], and [p] — the basic building blocks of traditional HTML.

But what if a new web standard emerged where HTML tags were no longer the basic building blocks? What if the new building blocks were widget-like components that rendered visual effects in a single custom tag or attribute that formerly required dozens or hundreds of tags and attributes? This is where Web Components step in, a new set of W3C standards being developed by Google.

Polymer Topeka Demo

Polymer Topeka Demo

Hi, my name is Jay, and I’m an IBM TRIRIGA information developer at IBM. Next, let me ask: Where does Polymer step in? Based on these Web Components standards, Polymer is a growing library of pre-built reusable components also being developed by Google. Can you imagine a sliding or rippling tap effect added to your app with a single custom tag, instead of dozens of traditional tags?

How does Polymer impact TRIRIGA?

Let’s explore this impact. Last year, in a bouncing post, I highlighted the battle between mobile web design and mobile app design, and the crossroads that many IBM teams would eventually be facing.

Right now, the best defense for desktop websites — and thus standalone web browsers — to stay relevant in our mobile society is to pursue reflowable and responsive web design. Meanwhile, the best offense for mobile apps — and thus mobile devices and app stores — is to outrun the evolution of web browsers and outgun their processing power. As it stands, websites might lose this battle.

What can IBM do? Since IBM probably fits the old guard of website design more than the new guard of mobile-app design, there’s no reason it can’t continue to pursue RWD with a head-on assault and hedge its bets with mobile-app tactics on the side, like the IBM MobileFirst for iOS partnership with Apple. How does this affect web or mobile-app developers? To be blunt, they’ll have to choose sides.

Among the thousands of teams at IBM, which side did our IBM TRIRIGA team choose? Actually, this question is a bit unfair, since our team is pursuing both paths. But in terms of the majority of our development resources, which side did we choose? Here’s a hint. As recent as last week on May 13, during a TRIRIGA presentation, I was exposed to an exploratory Polymer demo for the very first time.

It’s hard to deny the Polymer claim: “Web Components usher in a new era of web development based on encapsulated and interoperable custom elements that extend HTML itself. Built atop these new standards, Polymer makes it easier and faster to create anything from a button to a complete application across desktop, mobile, and beyond.” Of course, Polymer practices responsive design.

By now you should have a basic app, but there’s something subtle to notice. Thanks to Polymer’s layout attributes and the default styles provided by each element, you’ve achieved a responsive app without writing a lick of CSS! Of course, with a little inspiration from the material design color palette, less than 10 CSS rules turns the app into something beautiful…

By now you should understand the basic structure of building a single page app using Polymer and web components. It may feel a bit different than building a tradition app, but ultimately, components make things a lot simpler. When you reuse (core) elements and leverage Polymer’s data-binding features, the amount of CSS/JS you have to wire up is minimal. Writing less code feels good!

So if we follow this “new era of web development”, what would a Polymer-flavored IBM TRIRIGA application look like? Well, if this Topeka demo is any guide, I’ll let your imagination run wild and free!

Polymer Topeka Demo

Polymer Topeka Demo

Polymer Topeka Demo

Polymer Topeka Demo

Polymer Topeka Demo

Polymer Topeka Demo

Polymer Topeka Demo

Polymer Topeka Demo

How does Polymer impact TRIRIGA documentation?

Naturally, as an information developer, my greatest interest in the battle between mobile approaches, lies in its collateral impact on our future IBM TRIRIGA documentation path, as I also explored last year.

Next, from the poorest example, we skyrocket to the most striking example — the IBM Bluemix Docs website! Despite the “schizophrenic” nature of the overall IBM Bluemix website, if you select the Platform area, its mobile version switches to a pleasing RWD. Even better, when you reach the Docs area, its RWD approach delivers tight integration, bold innovation, and fantastic flow. Its Docs rock!…

Overall, by comparing these 3 documentation-based IBM examples, it’s easy to see how engaging and effective an RWD approach can be. It’s also easy to see how a tight integration between the application and documentation can be far more natural and powerful than tossing the documentation into a detached and disconnected super-library. Finally, a social-media style can add some humanity.

After being exposed to my first Polymer demo, I began to dive deeper into the Polymer approach, including Google presentations by Matt McNulty, Eric Bidelman, and Rob Dodson (my favorite video). I’m now convinced that there’s no reason why IBM TRIRIGA can’t achieve “a tight integration between the application and documentation” that’s even more natural and powerful than IBM Bluemix Docs.

Similarly, if we follow this “new era”, what would Polymer-flavored IBM TRIRIGA documentation look like? After seeing this Paper Elements demo, especially the Dialog, I can’t wait to try Polymer myself!

What are my final thoughts?

Returning to the battle between mobile web design and mobile app design, I wrote last year: “As it stands, websites might lose this battle.” And yet, they might not. Many visual drag-and-drop tools like WordPress “hid” the code because HTML, CSS, and JavaScript grew too cumbersome. But now, with the rise of Polymer, web development has “rebooted” and become simpler again. Yet more powerful.

I suppose my final question is: When will we get to see a Polymer-flavored IBM TRIRIGA application with integrated documentation? Well, that’s difficult to say. But it’s nice to dream of the possibilities.

Polymer Paper Elements

Polymer Paper Elements

Polymer Paper Elements

Polymer Paper Elements

Polymer Paper Elements

Polymer Paper Elements

Polymer Paper Elements

Polymer Paper Elements

Polymer Paper Elements

Polymer Paper Elements

Polymer Paper Elements

Polymer Paper Elements

Polymer Paper Elements

Polymer Paper Elements

Polymer Paper Elements

Polymer Paper Elements

Polymer Paper Elements

Polymer Paper Elements

Do I have an update?

Seven months after pouring Polymer onto TRIRIGA docs, I rewrote the rules for TRIRIGA docs!

TRIRIGA UX Article 1

TRIRIGA UX Article 1

Related articles

5 thoughts on “Pouring Polymer onto TRIRIGA docs

  1. Pingback: Bouncing into responsive IBM design | jay.manaloto.ibm

  2. Pingback: Killing XML authoring with IBM apples | jay.manaloto.ibm

  3. Pingback: STC Southern Nevada | What is Google Polymer?

  4. Pingback: What is TRIRIGA code name Shift? | TRIRIGAFEEDIA

  5. Pingback: Rewriting the rules for TRIRIGA docs | jay.manaloto.ibm

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s