INFORMATION NOW

I live and work with two phrases in my head that are important to me:

“It’s the system, not the people” – Deming

 And, paradoxically:

“It’s all about the people” – a statement heard often at Protegra that we try to use to guide how we work together.

An event this weekend helped me to understand these seemingly contradictory ideas. My brother (as coach) and nephew (as player) are participating in the junior varsity (gr. 9/10) provincial basketball championships. Last night I was able to watch them play in the semi-finals and could see both of the quotes above at work.

“It’s the system, not the people”

After an exciting victory by my nephew’s team, I overheard a conversation between two neutral parties as they did a postmortem on the game. In their assessment they agreed that both teams were skilled, gave it everything that they had, and played with passion. The main difference between the two teams was that the winning team had a better defensive system – not better players, but a better system. While the opposing coach did his best to exhort his players to play smarter, take better shots, make better passes, avoid the red beads, and play harder defense, ultimately they were defeated by a better system. They didn’t lose this game because of “resources” (coaches, players and refs), they lost to a better system.

“It’s all about the people”

Let’s look at the game from another angle. It was my brother the coach (a person) who researched, introduced, and taught the system to the team. It was the players (people) who bought into and committed to playing within the system. Both the offensive and defensive systems used by the team are well chosen and effective because they depend on teamwork and collaboration. Their systems require all of them to act together – if one person steps outside of the system it breaks down. The systems do not rely on one or two heroes but on the team as a whole. The systems require people to learn together, improve together, and be engaged together. The systems are all about the people. A pretty neat life lesson for a group of gr. 10 boys.

So, yes “It’s the system, not the people”, and yes, “It’s all about the people.”

“We believe it’s all about people. We believe by systematically focusing on people, treating them as the heart of organizational systems, that success will follow for all.” – Protegra.

In an earlier blog post, we announced the Election Info sample app. We briefly talked about how we were able to use Apps Script to easily create a comprehensive sample application that provided timely voting information. This post shows just how easy it is to use Apps Script to get information from an external API and integrate with various Google services to create a rich web application and provide a meaningful user experience.

UrlFetch

First, we use UrlFetchApp to get JSON from the Google Civic Information API and use Utilities.jsonParse to convert it to a useful javascript object.

var url =
    https://www.googleapis.com/civicinfo/us_v1/voterinfo/2000/lookup;
var address = { "address" : "1263 Pacific Ave. Kansas City KS" };

var options =
 {
   method : "post",
   contentType : "application/json",
   payload: Utilities.jsonStringify(address)
 };
var responseText = UrlFetchApp.fetch(url, options).getContentText();
var response = Utilities.jsonParse(responseText);

After getting the response object, we can simply drill into it to access various data provided by the API.

Calendar Service

One of the things the response object provides us with is the election date. Using Apps Scripts Calendar service, it is really easy to create an event on voting day in the users calendar with the polling address. First, we create a Date object from the date string. We then create an all-day event on the default calendar on this date, passing along the polling address we get from the response object.

// create a Date object from the response date string 
// ("2012-11-6" --> Date object)
var [year, month, day] = response.election.electionDay.split(-);
// javascript months are zero-indexed
var electionDate = new Date(year, month-1, day); 
// get the first polling locations address
var pollAddress = response.pollingLocations[0].address;

var cal = CalendarApp.getDefaultCalendar();
cal.createAllDayEvent("Go Vote!", electionDate, {location:pollAddress});

Maps Service

Using the Maps service, we can generate static maps with the users home or polling address as shown in the following code snippet. We display these maps on the web app page, then embed them in the reminder email and bring-along document as we will show in the following sections.

var userAddress = response.normalizedInput;
var normalizedAddress = userAddress.line1 +   +
                        userAddress.city + ,  +
                        userAddress.state +   +
                        userAddress.zip;
// normalizedAddress looks like "501 Kildaire Rd Chapel Hill, NC 27516"
var staticMapUrl = Maps.newStaticMap().setSize(600, 300)
        .addMarker(normalizedAddress)
        .getMapUrl();

Gmail Service

We also provide a simple method for users to email themselves all of this information. Using the Gmail service, we can send an HTML email that embeds the voting information and the static maps we generated above. The Apps Script documentation contains great tutorials such as the Maps tutorial we used to generate the directions below.

var email = Session.getActiveUser().getEmail();
var body = Election Date:  + electionDate + <br/>
           + Your polling address:  + pollAddress + <br/>
           + Polling Hours:  + pollingHours + <br/>
           + <img src=" + directions.mapUrl + "/> <br/>
           + Directions:  + dirList;
MailApp.sendEmail(email, Upcoming Election Voting Information, 
    Voting Info, {htmlBody: body});

Document Service

Using the Document service, we were able to easily generate a bring-along document with polling address, hours, and directions. The follow code excerpt shows how easy it is to add different elements like headers, tables, and paragraphs to a document. Apps Script also provides an extensive list of methods to programmatically control the look and presentation of the various elements.

var title = "Voting Information";
var doc = DocumentApp.create(title + " for " + homeAddress);

var reportTitle = doc.appendParagraph(title);
reportTitle.setFontFamily(DocumentApp.FontFamily.ARIAL)
           .setFontSize(22).setForegroundColor(#4A86E8)
           .setBold(true)
           .setAlignment(DocumentApp.HorizontalAlignment.CENTER);
var header = doc.addHeader();
header.appendParagraph(Generated by the Election Info application  +
  built on Google Apps Script)
.setAlignment(DocumentApp.HorizontalAlignment.CENTER)
.setAttributes({ITALIC : true});

var tableStyle = {};
tableStyle[DocumentApp.Attribute.PADDING_BOTTOM] = 0;
tableStyle[DocumentApp.Attribute.PADDING_TOP] = 0;
tableStyle[DocumentApp.Attribute.PADDING_LEFT] = 0;
tableStyle[DocumentApp.Attribute.PADDING_RIGHT] = 0;
var addressTable = doc.appendTable([
  [Your address:  + homeAddress],
  [Your Polling Location:  + pollAddress],
  []
]).setAttributes(tableStyle);

// add appropriately sized poll location image
addressTable.getCell(1,0).appendImage(pollImg.getBlob())
    .setHeight(300).setWidth(600);

// populate last row of the table with polling hours
addressTable.getCell(2,0).clear().appendParagraph("Polling Hours: ");
addressTable.getCell(2,0).appendParagraph(
    UserProperties.getProperty(Keys.POLLING_HOURS));

Here is an image which shows the generated bring-along document embedded with static map images from the Maps service.

Apps Script allowed us to easily take information from an external API and tie it into various Google services to provide a great user experience. Stay tuned for an upcoming blog post showing how we created the front end!

Kalyan Reddy profile | Stack Overflow Kalyan is a Developer Programs Engineer on the Google Apps Script team based in NYC. He is committed to increasing developer productivity by helping them fully utilize the power of Apps Script. In his free time, he enjoys participating in the Maker community and hacking together robots.