Category: Web

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.

Standardizing Application End User Licenses

If you have installed an application lately chances are that one of the first screens you have run into is an End User License Agreement (EULA). While it may not be as gargantuan as say the iTunes one, most people don’t bother reading it, and just click on the accept. This numbness to the EULA screen has been bothering me lately. Even though I do it, I have very little idea about what I am agreeing to. I make an assumption that its fair hoping that if it goes beyond what it needs to, I would have heard about that on the internet.

As an app developer, I also worry from the other side of the fence. I want users to know exactly what they are getting and only use my apps if they are comfortable with sharing information with my apps. Additionally I am not a lawyer and I don’t really want to make my own EULA. My apps usually do things very similar to other apps and I just want my users to know that.

Whats interesting is that there is another domain developers work in that licensing comes across often: using third party libraries. However there isn’t that much confusion there anymore. There are a handful of popular licenses out there: The MIT license, the Apache license and GPL are the ones that I run into most often and I am careful to only use the appropriate licensed libraries in my software. However no such named licenses seemed to be shared across multiple end user products today.

I would love to see a few standard licenses appear that encompass certain rights and privileges. For example, an Apache Standard App License that will not hold any user data but the developer is not responsible for damages to the device or injury to user while using the app, or an Apache Social App License that says it will store my friends data and photos for a certain period of time. These would also be great as guidelines for independent developers as well on how they should hold and use end user data.

 

Open for Value

My friend Orian has been posting a bunch of interesting entries on his blog on the need for an open alternative to the social services we use today. Personally I am a big fan of open source having released a bunch of projects and UI frameworks under the MIT license. I have a lot of strong thoughts on that so I figured its worth a post.

The conversation is not very new of course, there have been a bunch of attempts at open alternatives to the services we use today. The ones that immediately come to mind include:

In fact, if you google “Open source version of <insert-service-here>” you’ll find a bunch of projects and sometimes even companies that have tried to deliver on the promise of the open web. There have even been academics who have tried to come up with the next evolution of the internet as a whole where our data and connections isn’t held captive by companies who see that as a source of corporate value. These specs unfortunately often become so complex that any company looking to build a new product just chooses to ignore them (think RDF/OWL and the mess that is the semantic web specs). But as I see it, there are still a bunch of problems:

Closed is profitable
At least the way companies are evaluated today, closed services tend to be considered very valuable.  So “product companies” will never support a spec that may truly open data if they can help it. Even Google, which has a strong profit motive for an open internet, is building a walled Google+ experience. At this point the people who seem to really be trying to build open systems and “change the world” are those with personal convictions to build open applications where there desire to profit is outweighed by a desire for improving the world we live in.

 

Will regular people pay for “open”?
People like Dalton Caldwell seem to think so, but I’d disagree. At least the vast majority (non technical) of people probably won’t unless they feel its hugely valuable, and these services can only succeed if a majority of a user’s social network are on the network. Unfortunately, openness isnt so much a product feature a lot of folks care about, its a nice to have. Its like computer backups. Noone cares till the day you lose it all and then its too late. If you are truly going to get people to move to a new product from a product that they have invested a lot of time and effort in, whats the reward? Where is the excitement?

 

Better > Open
I wish folks would look beyond trying to build open services towards building better services that are open. Differentiate by doing well what the existing service does poorly. A lot of people consider open just a philosophical medal of honor, but its actually a very strong business strategy to disrupt established businesses. Think of Android, Apache, Webkit, Red Hat (the first billion dollar company based on open source). If you do open the right way, you can accelerate beyond your competitors even (especially?) if you arrive late to the party.

 

A different business model
Over the last few years we have been conditioned for free services and products. What I’d really like to see is true innovation in business models. Something beyond a simple pay or ad-supported service. For example:

  1. Pay for a group: Instead of a service fee of $5 per person maybe its $10 but for 5 invites (don’t have the single user option at all so people actually invite friends who won’t get on otherwise)
  2. Pay for the pipe: Think of a social network based on top of a connectivity service like Dropbox. Pay for the sync service and get a lot of apps on top of it. Apps get a share of the revenue from the service based on usage of the app.
  3. Bid for app extensions: Pay the developers for additions to the app so we don’t have another “I paid startup x but they sold themselves to company y” (ex: Sparrow)

My point is that there may be something really new that we really need to think about instead of just the “ad support” and “pay” model that we currently discuss.

 

 

Friending non-humans: A lazy foodie’s hack for the Android address book

Probably not one my best characteristics but I do tend to order in a lot of food from a variety of places near my apartment. There are also enough places around where I live that I end up trying a bunch of different places and then when a familiar menu comes up again I am often left wondering “what did I eat there the last time, and how good was it?”.

I was half tempted to create a food journal app specifically for delivery food. Think of it as a Foodspotting / Foursquare app but more like a personal diary than a social app. Neat idea I guess, except I have almost no time these days. But then I got thinking: the People app on Android exposes a bunch of new social apis that I felt I could maybe use in some manner. Could I use the Android People app be used to “friend” my favorite delivery places?

One of the things Android has going for it for something like this is the Intents system and inter-app communication that are very core to the OS. This means quite a few applications are open to external data or expose their own data to external apps. My end “hack” basically involved creating a contact to represent each of my more regular delivery places and wiring it to different apps via URL patterns registered by some apps that I could find online. Since you can add many web links to each contact, I added a couple:

  1. A link to the mobile foursquare URL for the location. Since the Foursquare app registers itself as a handler to those links, clicking on the link on the contacts app launches the foursquare app for that location.
  2. A Google Docs file url where I can write about the dishes I ate at that place. Once again, since the Google Docs (now Drive) app registers itself as a handler for those urls, using that on the phone works well enough.

Check out the video below to see it in action:

 


 

My original goal was to tie it to my Foodspotting profile but that app does is completely closed and does not respond to any local intents or URLs.

For the most part this does let me do what I wanted to do. Look up the latest reviews/tips about a place, put down my thoughts about different dishes I tried there and then call them if I feel like it. In a more complete app that leveraged the people app social apis even more, the photos representing the places could also change, maybe representing a special dish or something.

But it does make me think the idea of contacts really does need to expand beyond the people in my life. I mean by definition, isn’t anything you can call or contact for more information a contact? Why can’t I  save a particular restaurant from Foursquare directly as a contact to my address-book since I usually call the place and not really a person there? Extend this thinking and you realize there are a bunch of “things” you often call: the taxi service, the hospital, the utility company, etc.

A lot of these thoughts are also probably a result of my reading reading a particular thesis by  John Kestner, an MIT student on creating “A Social Network for Lonely Objects“. Its a fascinating read and I definitely recommend it.

All of this also involves a rethinking of fundamental parts of the data that define a contact. VCards are a very human concept but we need to morph that construct into a more unstructured form, so that a contact of a particular type can create data fields relevant to it. The internet is already evolving to embrace unstructured data with NoSQL databases and such.

Kinda ironic that Android recently renamed the Contacts app to the People app in ICS 😉

On APIs, Platforms and Predatory Evolution

There are few technical events that send as many people into frenzy than WWDC. The keynote at Apple’s big developer event is always fascinating to watch on the many sites liveblogging it (my favorite remains Engadget).

Today’s keynote though was unlike the previous ones. While updates to iOS5 were definitely not trivial, they felt more evolutionary than revolutionary, lacking any real “whoa” moments (iike the one I had when Google announced Android’s Accessory Device Kit and Android@home at GoogleIO this year). Worse still, most of the updates seemed more co-opted than invented. Ideas of Notification Systems and “Cloud AppStore” seemed to have been taken directly from Android and a bunch of other features were taken directly from apps already on the iOS platform like mentioned in this NYTimes article

This once again prompted conversations on the whole idea of building a business on someone else’s platform, a conversation that keeps coming up all the time (recently with Twitter and other such players). I have had a bunch of thoughts on this so I thought I’d share

Revisiting a platform’s need for APIs

Creating and running a developer API is a fair amount of strain on any company’s resources and also calls for a realization that at some level they will be giving up some control on the user experience (and may be potential revenue) from their product. Companies that do realize the need for an API do it for one core reason: increase the diversity of the interfaces to the end users. Its a very biological-evolutionary tactic to stave off potential extinction and find the “fittest” application for the core audience. At the minimum it may allow a part of the long tail of your audience to interact more with your service, but at best may make you discover a better way to serve your core audience. Ideas on the latter end of the spectrum tend to get absorbed into the core product either through buyouts or blatant rip offs.

Platform evolution and the death of the idea germinator:

The gut reaction when the platform absorbs the idea that was germinated by some app on their platform is to start counting down to the app’s inescapable demise. Historically though, these apps live or die based on the following factors:

  • The platform’s seriousness in owning that feature
  • The percent overlap of the feature set
  • The market size and diversity

If the platform is really serious about being the only solution for that problem, the  app developer is shit out of luck. This is what happened with Microsoft and IE vs Netscape. IE won out because MS was determined to let it be the only way to get to the internet. Same story (kinda) why OpenFient decided to accelerate its plans for Android when Apple announced Game Center.  For some apps, Apple may not be as determined to own that behavior, but rather have that enabled for its entire audience (when they are determined to own that behavior, the competitive apps get rejected from the AppStore). The seriousness also comes into question on the updates on version 1.1 or 2 of the product. Will Apple have a team dedicated to improving Reading Lists or the Todo App? Probably not, its been checked off as a feature and will be on a lot of marketing materials but may not evolve as fast as the third party apps (think of the updates on the Notes/Weather/Stocks apps for example)

Percent overlap of the feature set is also an good metric to look at. Thats what pushed Konfabulator off OSX when dashboard widgets were announced. With an app like Instapaper for example, does more than reading lists, it also lets me get to them from any other platform and other browsers. Readability on the other hand overlaps a lot more significantly.

Market size is of course relevant, but more than size, diversity and size of the long tail is a big deal. Todo apps for example are an infinite market because almost no-one agrees with the other on which app works for them. The platform can only target the big head there and cannot add any complexity (specially if you are known for that). This allows app makers to compete for the long tail

The Good News:

There is some benefit to a platform making a play in your space as Instapaper developer Marco Arment notes on his blog. First of all it justifies that space as mainstream and not a fringe/power-user behavior. Marco feels that Apple’s move will only make more people move to Instapaper as they get used to the idea of deferred reading but may find Apple’s implementation lacking.

Just as a reference, check out this graph of Facebook’s entry into the geo-location space with their Places product and its impact on Foursquare:

http://www.businessinsider.com/embed?id=4d76a40bcadcbbd7020c0000&width=500&height=430

All the publicity doesn’t hurt either.

Conclusion:

It will be interesting to see how Apple’s new apps will impact the existing players there. What I did find a little disappointing today was the lack of anything really “new”. All the features mentioned seemed to come to par with features I already use on my iPhone and Android (My personal phone is an Android I love and I carry and iPhone 4 for work). Whats interesting to me is that iPhone and Android are almost coming to a point where they are so totally similar to each other in every way, that the only significant difference between them may be philosophy and programming language. It will be interesting to see if a closed curated system is better or worse than an open one in the long run.

 

Thoughts on an open Twitter replacement: Concentrate on what’s done poorly

Twitter’s recent about face regarding their API gave me a lot to think about. It was definitely upsetting since I never saw this coming. I have always pooh-poohed the Facebook crowd and their constant worry about privacy and worn my Twitter username proud ( The geeky circles I move in, your Twitter id is fast becoming your real world identity), but suddenly Facebook felt less an oppressive regime. For a platform that clearly benefited from a huge developer community around it, a “you are not welcome here” message left a bad taste in my mouth.

My immediate reaction was the “I can do it over a weekend” developer instinct. But in this case it has been tried before and failed (see Status.net and the Twitter clones like Pownce that came out when Fail Whales were a regular feature of the platform). So this time instead of starting a new project that I would probably leave half done as I found the next shiny object I tried to analyze why Twitter succeeded and if it had indeed reached a tipping point where it just was important enough that it just could not be replaced.

I have had quite a few conversations around it as well. Tom Boutell and I shared some ideas (over Twitter, hah!) and he wrote an excellent proposal to replace Twitter. I agree with a lot of points there but have some rather different thoughts of my own,

1) How is Twitter different from WordPress
Theoretically it isn’t, and yet psychologically it is. My blog goes weeks (months?) without an update and yet I am extremely vocal on Twitter every day. I have often been tempted to just post my thought on my blog and forward it to Twitter (enough blogs and Tumblrs do that). But I feel Twitter is to WordPress like Instagram is to Flickr. They both capture transient thoughts that may have no value over a longer period. Occasionally interesting links are shared but thats it. I almost never go through my Twitter history. They are less formal and so immediate. I have a friend who composes blog posts for a couple of weeks since they seem so permanent that she doesn’t want to get it wrong, but Tweets are casual. I don’t think a simple install of WordPress would cut it.

2) We should do it because its Open / Federated
Unfortunately no-one cares about that, something that I am sure Status.net found out. Open is not enough reason for me to get off something that works, and is theoretically free. The only way an open system can succeed is if it brings new capabilities to the system. And open systems do that often. But a direct clone of Twitter is pretty useless.

3) Give me what Twitter gives
A Twitter federated and open replacement will have to:

  • Require no installation for the casual user and an easy installation for anyone wishing to be a node
  • Give me a permanent URL that I can share with my friends.
  • Allow me to discover new users and be discovered
  • Route messages to my “inbox”

4) Concentrate on what Twitter does poorly
Actually there is a lot here, and the only way a new system can succeed by fixing some of this:

  • Aggregate conversation around a shared item/link. Replies right now are a pain in the ass to track.
  • Be extendible. One of the things I see a lot of is the “vertical twitters” or “The Twitter for …(design / entrepreneurs / programmers, etc). So allow the data model that is a “tweet” to be extendible. For example, I should be able to add a poll as a Tweet or something like that.
  • Allow groups: Right now there is no way to create a quick group and send a message to 4-5 people without having to direct message them individually
  • Implement annotations: Twitter introduced this concept but has never executed on it. There is a lot of value here. For example, if I want to see what people are talking about the movie “Milk” I dont really want to see the dairy results. Similarly if I dont care for my friends’ FourSquare updates, I can only do a filter on a client like Tweetdeck using some String pattern (“checked in to”). But what if I am only interested in a friend’s tweets on programming but not his interest in photography. While hashtags could be used, most people don’t add them since it takes away from their 140 character limit.

Case study: BelugaPods
As an case study I’d like to talk about BelugaPods, a mobile app that I fell in love with and wish more apps were done so well. Beluga is a group messaging app that allows you to message multiple users and keep the conversations within a “pod”. Very handy when you are trying to organize group events. But the cool thing is that Beluga starts with the premise that your friends are not on the app. Messages to non Beluga users are sent as SMS but a clear value is shown by using the Beluga app (the conversation grouping). Thereby the application is usable when your friends aren’t in the system but excellent when they are.

I have a few ideas on implementation but they aren’t baked in enough yet to add to the post. Maybe I’ll follow up this one with those ideas…if I am not distracted by the next new thing ;).