Sitemap

Dispatch from the SAP Service Moments Hackathon

4 min readJan 10, 2020

--

Come to Palo Alto for a Hackathon, meet good people, and build apps for the new SAP Service Moments product — how much sweeter can an invitation get? Naturally, our Engineering team jumped at the opportunity (it was an intense game of rock, paper, scissors to determine who got to go represent MindTouch). We’d like to share with you what we built over the two-day hackathon, as well as some takeaways your own teams might use.

Pre-hackathon prep: framework, use cases, and strategy

Thankfully, we had a bit of lead time and advanced notice to prepare for our trip up to SAP. Amith Kumar, Director Of Engineering for SAP Service Cloud, and the Service Moments team gave us a detailed architectural overview of the framework a week prior to the hackathon.

Because the SAP development library is available (open source) on GitHub, our team was able to review our options and strategize around possible use cases, as well as how we could integrate them with the Service Moments platform.

Get Spencer Kittleson’s stories in your inbox

Join Medium for free to get updates from this writer.

Of course, we were able to move faster during the hackathon because of all this advanced prep, which was a huge leg up.

Press enter or click to view image in full size
Our winning team at the SAP Service Moments hackathon
Our winning team at the SAP Service Moments hackathon

A look at what we built (and how we did it)

Once we’d made the short trip from San Diego to Palo Alto, the Service Moments team provided us with a development framework that could run directly on our machines. With the ability to simulate an SAP Service Moments environment in an isolated workflow engine, we were ready to hit the ground running. Here are some of the highlights:

  • We spent the first half of the day listening to the presentation, asking more questions about the framework, and creating an outline of tasks with the MindTouch product team.
  • We spent the second half of the day developing a simple template, which we would use to build our “Service Moments” apps. We knew we had big ambitions, and it would be worth it to invest in a template, so we could crank out a lot of “moments”. The original template provided to us was in Angular, but we decided that vanilla javascript would be faster and with less dependencies (so we converted it).
  • Using the new template, the Engineering team created five apps on the first day. These apps utilized MindTouch Touchpoints and various frameworks.
  • On day two, our team built four more “Service Moments” apps.
  • We worked with leaders from sales and product marketing, to create and record a demo and product vision. Our demo stitched together nine apps into a workflow covering two use cases using the “Service Moments” apps.
  • We open sourced all of our work for free! All of it was written in a hurry, of course, but you can take a look at all the code on GitHub.

It’s worth noting that the SAP team used an event driven pattern using the common `window.postMessage`(https://developer.mozilla.org/en-US/docs/Web/API/Window/postMessage) for the “Service Moments” framework. This allowed us to securely pass messages to- and from the Service Moments host, an important best practice and a big thumbs-up.

Context could be passed to each Service Moments app as well, easily sending events at the end of a service moment app. Also nice was the fact that it simplified integrations for third-party services using the JSON context events to the Service Moments host. This allowed the apps to be hosted anywhere.

Finally, we pushed all of our Service Moments to GitHub pages and MindTouch sites. This was particularly beneficial because the security state was set to those domains (cookies, JWTs, session storage, and local storage). This allows any third-party service to easily integrate with the Service Moments framework, while creating a visible seam between them: A tremendous benefit of the SAP framework.

What these apps looked like to the end-user

From the outside looking in, these apps efficiently support a more seamless customer service journey. More specifically, they take disparate “moments” in the journey, from purchasing a product, to requesting field service and looking up documentation, and stitches them together with content powered by the MindTouch platform. Although these moments are independent mini-apps, and hosted on different systems, the user wouldn’t know, because the framework ties them nicely together into a single experience.

We’d be remiss if we didn’t give a shoutout to everybody we had the chance to work with at the Hackathon. Throughout the event, we collaborated with our hosts and other attendees on the functionality of the framework and the process itself, providing some feedback in areas we considered important as the MindTouch Engineering team.

--

--