Record Development Meetings with Hangouts On Air

At Oasis Digital, our project teams coordinate in numerous ways, sometimes by meeting “live”. At these meetings we discuss, we plan, we model, we code, we review. For teams/projects where everyone is physically present at headquarters, this is readily done by plugging in to a large TV re-purposed as a computer monitor. (Proposed bumper sticker: “My other monitor is a 60 inch Samsung”.)

For some teams and projects, though, not everyone is at our St. Louis office. Some of our developers are around the US, and occasionally projects include developers around the world. Therefore, some of our development meetings take place online, using a variety of meeting tools. Mostly these meetings are useful only at the moment they occur, but it is useful to record them for developers who are unable to attend “live”.

There are countless tools to choose from. We have had particularly good results with Google Hangouts. Unfortunately normal Hangouts has no recording feature – the recording capability is available only in the form of “Hangsout On Air”, which is more typically used to “broadcast” an online meeting. Google Apps customers, though, can use Hangouts on Air, decline to broadcast to anyone at all, then share the recording privately.

The process is not obvious. Here is how to use Hangouts On Air to privately record and share online meetings:

  1. Consider performing all of these steps in a dedicated browser. For example, use Chrome for Hangouts, while using Firefox for other browsing. This reduces the opportunity for Hangouts (which is irritatingly bound to the browser) to interfere with other use of your computer.
  2. Log in to YouTube. Use the Google account selector in the upper right to select your company Google Apps account, if you are logged in an more than one account.
  3. If you don’t already have a YouTube “Channel”, which you probably don’t, click to create one. It is harmless, since for this Hangouts On Air purpose you don’t need to every actually publish anything to your “channel”.
  4. Click “Video Manager”. The button for this is not in the most obvious place (the left navigation), rather it is along the top, and small.
  5. Click Live Events.
  6. Click to create a new live event.
  7. Give your meeting event a name.
  8. The description, keywords, etc. do not matter, since you won’t be publishing.
  9. Adjust the setting to make it Private. This is a vital step, don’t miss it.
  10. Don’t share it with anyone yet. That comes later.
  11. Choose the default Quick settings, there is nothing important to adjust in the Custom settings.
  12. Click to start the Hangout On Air. This will launch the same Hangouts app as any other Hangout – almost. As of December 2014, the features for Hangouts on Air are somewhat behind the normals Hangouts app in features and screen layout.
  13. Click the invitation/add button in the Hangouts controls at the top of the Hangouts window.
  14. Copy the link. Paste it in group chat so that other developers (meeting attendees) can join.
  15. Wait for everyone to get in the meeting. Adjust microphones, webcams, speakere, etc.
  16. Remind everyone to turn on their webcam and keep it on if possible. This provides a much better experience for anyone watching the video later – they get more of a sense of having “been there” for the meeting.
  17. Discuss anything that isn’t part of the project in question, etc. while waiting for everyone to be ready.
  18. Click Start Broadcast. This will start the “broadcast” to noone (because this HoA is private and not shared with anyone), and more importantly, start the recording.
  19. During the meeting, remember that whatever is visible in the Hangouts app window, will be recorded. Adjust this regularly to keep it relevant to the discussion. Often the default behavior of switching to whoever is speaking, works well.
  20. Remember that Hangouts On Air recordings are limited to pseudo-high-def, “720p”. Keep screen share window sizes moderate, so that text can be easily read by others in the meeting and on the recording. Sharing a full-screen at 1920×1080 or higher resolution will yield unreadable results.
  21. When the meeting is done, Click Stop Broadcast.
  22. Back in the Youtube Video manager, paste in the email addresses of those with whom the recording should be shared.
  23. Don’t trust Google/YouTube to maintain privacy settings over the long term – leave the recording there until it has outlived its usefulness (a week or so in a typical project, maybe longer in a slow-paced project) then delete it.

Ouch, a 22-step process. That is the price of using Hangouts On Air in for an atypical purpose. The payoffs:

  • HoA works well across all major platforms, including Windows, Mac, Linux, Android, Chromebook, and more. This is the hardest thing to replace, many other meeting tools don’t come close.
  • The recording is immediately available privately on YouTube, all transcoding and hosting is seamless and effortless.
  • Google / YouTube is infinitely scalable, for all practical purposes.
  • No cost, for either the tools or the hosting.
  • Part of software (Chrome) that most developers have already installed.

 

More CSS in JavaScript, this time with React

In September I mentioned a talk at Strange Loop 2014 where the speaker described a technique for writing CSS in the form of JavaScript which then executes to produce the actual CSS. This avoids a server-side build process, it knows more about the browser while operating, it avoids a HTTP round-trip, and has various other advantages. However, the tooling the speaker was talking about was closed source inside of the conference speaker’s product.

Today I encountered a presentation online by a React expert at Facebook, who uses React’s mapping from JavaScript to HTML+CSS, to accomplish many of the same things and more – using tools openly available.

If anyone knows of a audio or video recording of the talk, I would appreciate a link very much.

My own experiments with programmatic CSS also react, but behind ClojureScript, so I’m writing Clojure code which turns into CSS. It is not as mature as what is described in the slides above, but it adds yet another layer of abstraction in the form of a higher-level language.