PhlAI talk: Building AI with Emotional Intelligence

Last week I gave a talk at the PhlAI conference on building systems with emotional intelligence, a subfield of Artificial Intelligence called Affective Computing. The presentation is embedded below and can be found on my SpeakerDeck page

I have been looking into this space for the last 4 months or so and it is a really fascinating space. I am a big believer in the need for assistive systems to mediate an increasingly complex world for us and that these assistants would need to be not only competent but also empathetic. However as with most new technologies, Affective Computing has a lot of potential for abuse as well if these technologies are used to emotionally manipulate or deceive people. It is definitely a path we must tread very carefully.

In general I really did enjoy the PHLAI conference and met some really interesting people and saw some very impressive technical talks and demos by IBM, Tableau , H2O, SaS and Ascend. Thank you to the organizers for putting on a great event. Definitely looking forward to the next one!

I made one of FullStack Academy’s “Developers to Follow” list

It’s always nice to be recognized. And since part of the purpose of this blog is to serve as a historical record of my professional life, figured I should post about it here before I lost the link to the sands of time 😉

https://www.fullstackacademy.com/blog/developers-that-work-in-media

GDG Philly’s 100th meetup: a retrospective

Drumroll!!! The next GDG Philly meetup will the 🎉100th official meetup!!!

And we have a good one lined up with some of the biggest tech leaders in Philly on a panel on managing your career as a technologist. If you are a developer or are looking to become one, you should definitely sign up.

For me it’s certainly a time for some celebration and reflection. Corey and I started Philly GDG, or rather its previous incarnation, AndroidPhilly, in 2011 when both of us had just about started working on Android and realized there wasn’t a local community where we could learn from each other. And considering how minimal technical documentation and user experience guidelines were back then, a local community was sorely needed. The group transitioned to an official GDG at some point which meant we got a lot more support from Google in terms of speakers and schwag.

Thinking back, there are a lot of things that worked well. The consistency of the day (last Wed of every month) and location (Comcast Center) every month definitely was a good idea and built up a monthly habit for the regular members. Comcast was great about sponsoring this event every month since it’s inception, and my managers, former and current, were very supportive of letting me run this. Other companies in Philly have been fantastic supporters as well including Promptworks, Chariot, Candidate and others who have hosted or supported us with food and beverages over time.

We are also a better balanced community as far as gender goes with more women participation than a lot of other communities. A lot of credit there goes to Corey for leading the outreach in early days, and always making sure we had women as part of the leads. It’s something the current leads, Yash, John and Ruthie, continue to champion.

There have also always been a lot of challenges, some similar to those faced by other groups while others unique to our own. Sourcing speakers every month is hard, specially when your community is much smaller than those in cities like SF and NY. Creating a channel for the community to keep the conversation going has also been challenging with Slack becoming a defacto communities platform that doesn’t really work if you aren’t paying for it (I am starting to look at other platforms like Discord, but a lot of people may not be willing to install another app). Trying to balance the level of talks has also been a concern: we want to have intro level talks to bring new people in but also more advanced sessions for folks who have been coming here for a while. If you have ideas on any of these, I am all ears.

I made a lot of friends thanks to our group. From other past (Corey, Chuck, Dallas) and present (Yash, John, Ruthie and Kenny) fellow organizers who helped run this group to regular members who have been attending our monthly meetup for years.

Hanging out with past and present Philly GDG leads at Google IO 2018

I am looking forward to how the group evolves going forward. In the meanwhile, if you are in the neighborhood, join us for our 🎉100th event. It promises to be a great one

Adventures in working with JavaScript, Dart and Emojis

I spent the whole day today working with Strings being sent between a JavaScript serverside app and a Dart clientside app. As an industry we have been doing this forever, so you’d think it’d be easy but then along came emojis to muck up my day 🤬

Instead of writing my own primer on Strings here (and doing a bad job), let me just link to Joel Spolsky’s excellent post on the subject

This really old post still does a great job of bringing us up to speed to the Unicode world we live in today. And then came Emojis

There are numerous posts of the pain of dealing with Emojis whenever you have to because it does screwy things like combining neighboring characters to form a single emoji. This means that the length of a string, if it is just a measure of the unicode CodePoints used is different from what you would count on the screen.

This gives you whacky results like “💩”.length == 2 and generally makes working with strings just a pain even to the extent of crashing your iPhone. On the flip side some things like being able to delete family members from the 4 member family emoji with every backspace are kinda amusing, since it is it’s actually 7 characters: 4 ‘normal’ people characters and 3 invisible ‘joining’ characters in between.

Which brings me to today. I am playing around with moving a client/server app from JavaScript everywhere to JavaScript server and a Dart client app. In the previous iteration, strings that needed to be sent had special characters that needed to be escaped and sent across: no problem. JavaScript’s escape/unescape worked pretty well.

Moving to Dart though was a challenge, because there is no escape/unescape method. Turns out escape/unescape is best avoided anyway, and encodeURI/decodeURI is a better option. Dart has a decodeFull method on the Uri class that does the job pretty well.

Except that the characters in the list also included emojis and Dart’s Uri class doesn’t work with anything more than UTF-8 characters and crashes when encountering strings with emojis that are just ‘escaped’. This, as it turns out, is as per spec and all those fancy emoji domains that I thought used Unicode in the URI, use a different idea around Internationalized Resource Identifiers and Punycode. Thankfully passing in a URI encoded string with emojis seems to work fine and emojis come out 👍on the other side of the decode process.

While this seemed to work at that point, passing the decoded string to my Yaml loader crashes the app again (is Yaml supposed to be restricted to Ascii/Utf-8 ? ). But that is a problem for a different day.

For now, I have decided to just convert emojis to shortcodes for the transit and remap them to emojis on the other side. Its not pretty but it works.

Oh and in the meanwhile, if you want to know how to loop through a String with emojis in Dart, you can do that by looking through the Runes in a String:

A Quick 2018 Retrospective

I am a little behind on my 2018 review, seeing that its almost mid Jan already. But better late than never, so here goes

VR

2018 continued to be a year of tremendous education professionally. For a big part of the year I continued to work in the VR space, specifically using A-Frame and WebVR. I am definitely a fan of WebVR and I really do believe that the app model that is prevalent in the mobile ecosystems is a bad idea for VR. I completely agree with the vision of VR being a web of experiences, and the web technology stack has matured to a point where deploying a VR experience is trivial. Hopefully more people will take up building VR experiences in JavaScript and WebVR. What the community really needs is a diversity of ideas and to grow VR beyond its early base of gamers.

While it was a lot of fun, I am looking at other things beyond VR this year and am excited for certain new ideas I am playing with. Will share more on that later.

Blockchains

I did a fair bit of work on Blockchains in 2018, mostly at the Dapp level. Its early days for this space but I do believe they present a once in a generation opportunity for a step function change in how we use technology. There is a lot of pessimism about the space right now, after the unrealistic craziness that was the 2018 bubble when Bitcoin hit $19,000 but I am excited about where the tech is going.

I spoke at a panel at the Coinvention Conference on the Philly Blockchain scene (Thanks Mike) as well as at the inaugural session of the Drexel Blockchain club (Thanks Adit)

That’s me, that pink blob there!

Besides these, I did work on a LOT of JavaScript and Rails which has been pretty rewarding and learned a lot about Google’s cloud infrastructure, specially Firebase. I need to distill a lot of that into a future blogpost

Reading

I did a fair bit of reading this year but I did abandon a lot of books halfway. I am trying to be okay with that rather than pushing through a bad book, just to complete it. I wish there was a better app than Goodreads for books though

Misc

Some other things that happened this year:

  • Philly Google Developer Group (GDG) continues to go strong in its 8th (!) year since its start as AndroidPhilly in 2011. Its a great community that I look forward to meeting at least once a month and have made some great friends there.
  • I didn’t travel as much for work this year, which was good. My favorite event though was the MIT Media Lab’s Fall Member Event. I do like all the demos that the Media Labs groups present but the best part is the talks with other sponsors from different organizations.
  • I worked with a lot of interns and co-ops this year, mostly from Drexel, and I loved it. These guys and girls are smart, enthusiastic and I find conversations with them refreshing since they question a lot of assumptions I often have. Maybe I should consider some work in academia 😉

2019 is guaranteed to be a year of many changes and I am excited for most of them. Stay tuned.

On Rich Text Editors

In the last couple of years I have found myself in a couple of projects using web based rich text editors. Since these projects were written using React, I primarily focused on libraries that worked with that framework but have been keeping an eye on other projects as well. This post is a braindump of my thoughts on the space

Many years prior to that a few friends of mine and I had tried building a web-based Evernote clone that would do smart things based on patterns we could define in Regular Expressions. So for example, if I typed in an email address in my document, the JavaScript would recognize that and convert it to a mailto: link. With the advent of contentEditable, we thought this would be easy to do

We were totally wrong. Turned out contentEditable is a terrible API as documented in this article by the Medium engineering team. Modifying the underlying document while the user was editing it was just impossible to get right even on one browser. And for bonus pain points, every browser wrote different underlying HTML when the user edited a contentEditable element.

DraftJS

About 3 years ago I was assigned to work on an online CMS for an internal portal at work and started looking at RTEs again. Since the rest of the project was going to be in React, I started looking closely at React libraries. React had one advantage that didn’t exist when we had tried our earlier adventure: Since React keeps the document structure in its Virtual DOM, it didn’t have to fight with the browser specific implementations of contentEditable as well as fight the browser for things like cursor position and selections.

DraftJS seemed like the best choice at the time. It was (and still is) actively developed by Facebook and is used by them for text editors on Facebook.com.

Generally it worked well enough. We could have used more documentation but were able to get a default experience working. Draft comes with very few extensions and really tries to sell its “toolkit” nature by having you code behavior I’d have expected as default. There is a different project called DraftJS-Plugins that gives you a lot of that. Weirdly, DraftJS-Plugins requires you to use its Editor which seems to be a modified version of the DraftJS editor. Ideally Draft should support plugins out of the box.

We did make a mistake with storing the document though. Our thinking was that the document in the database should be saved as HTML and Draft should just re-render the HTML when the document needs to be edited. Turns out Draft really prefers saving and loading a serialized state of the document. This does make some sense but makes any future migrations to a different editor much harder. This brings me to the next library I looked at

Ghost

Ghost is a pretty interesting CMS. Visually its very polished and the editor interface there is pretty amazing. Earlier versions of Ghost used an editor that really was centered around Markdown, which is awesome but not a fit for the target audience of our system. Ghost also had very limited database support: basically SQLite for development and MySQL for production. Since we didn’t want to use MySQL it was a deal breaker.

But from the point of view of Text Editors, Ghost 2.0 that was recently released shipped with a new and much nicer editor. The editor is now part of the main Ghost repo but I imagine can/should be extracted to its own project.

Whats really interesting about the Ghost Editor is that they also released a library for building WYSIWYG editors supporting rich content via cards called MobileDoc-Kit and an open source spec for these documents called MobileDoc.  This addresses my issue with storing a proprietary format for a document in the database. So yay!

WordPress Gutenburg

Meanwhile WordPress has also been working on their own new editor that just shipped as part of WordPress 5.0 today. In a big departure from previous PHP centric WordPress editors, Gutenburg is written in ReactJS. Additionally, unlike Draft (as well as Ghost 2.0 editor I think), Gutenburg works on mobile devices. My biggest issue is that I really hate WordPress’s “HTML comments as a data structure” approach. And I am not the only one. Using Gutenburg has so far been pretty okay. If you’d like to learn more about it, read Matt Mullenweg’s post on it today

CKEditor

Other projects also crossed my path during this project. CKEditor for example looks promising but I have’t dug into it. What makes it really interesting is its newly added support for collaborative editing out of the box, something I’d love to add to my project but its not a big ask (yet)

Trix

If Rails is your thing, Rails 6.0 will include a Rich Text Editor out of the box which is really cool. The editor itself, Trix, is out right now and can be added to your project if you need it. 

Final Thoughts: Blocks

One interesting thing is that almost all the editors are starting to move into the concept of a rich document as a group of content blocks. This is a departure from earlier architectures that gave you the entire document as a rich document with all the formatting. One reason for this is the ability to export the content blocks in a variety of formats besides simple HTML (like Markdown). 

Blocks also let you use non-text elements within the document. These can be things like media or even rich widgets like photo galleries etc. Given a well defined document data-structure, these can also be supplied by third-parties.

For example, Elementor has released a bunch of widgets for WordPress’s Gutenburg

Modern word processor centric startups are taking these ideas even further. For example,Notion takes the same block based approach to a person notes app

AirTable, which takes a similar block centric approach to spreadsheets, was recently valued at $1 billion 

Both Notion and AirTable measure usage and price their plans not on the basis of number of documents but rather the number of blocks used.

Trying out Google’s Cloud Endpoints vs Amazon API Gateway

I was recently looking to scaling up an API currently hosted on Heroku.com. While adding dynos to Heroku was an option, I also thought it was a good excuse to get more familiar with Google Cloud Platform (GCP), which I have been curious about for a while and have had some really good conversations on at previous events at GDG Philly.

GCP’s Cloud Endpoints seemed to be the right answer, especially since they do claim to support hybrid cloud deployments.

After setting up the Google Cloud SDK   and enabling billing on my active project, I clicked on the Cloud Endpoints left nav item to get this screen…

Turns out, the Cloud Endpoints service has no user interface by default. To get started, you have to deploy your api spec (as a Swagger2 / OpenAPI document) to see anything at all. Maybe that works for folks that live and breathe the command line but I was kinda put off, specially since I was aware of how AWS API Gateway worked (we’ll look at that later)

Anyway, so clicking on “Learn more” and then a further link to the documentation takes you to this page with the following table:

So based on their documentation, it seems that the only JSON apis that Cloud Endpoints can front are those hosted on Google App Engine or Compute Engine.

Argh! (Though gRPC does look kinda interesting, just not for now)

At this point I actually debating deploying the Rails app on the App Engine. Ok, let me try out how hard that is. After all they have a blog post on how to do it.

After an hour of configuring, I was able to deploy my Rails app to Google Cloud, but it took me too much effort to connect it to the CloudSQL backend and even more to try to get migrations running (never did, and I finally gave up). Google does have a video on how to get rails migrations working using their Cloud SQL proxy   but I was kinda done by then. This was taking me down a path I wasn’t really planning to go down.

Getting it work on Amazon’s API Gateway was so much easier.

The AWS console for API Gateway actually has a fairly intuitive user interface for fronting any third party api with API Gateway. At the end, you end up with a nice UI that describes the flow from the client through the gateway to your api base URL (Screenshot below)

I generally was surprised how easy AWS made their service and hopefully Google Cloud Endpoints reach the same level of simplicity. I am sure given how much Google is investing in their cloud services, this post will be out of date in a couple of months but for now AWS API Gateway does seem to have the edge