On your subsequent facet venture, make a browser extension

In a previous post I’ve written about why browser extensions are a tremendous platform for customizing current software program. As a result of the browser DOM will be hacked in open-ended methods, it’s attainable to construct extensions that modify the conduct of an app in ways in which the unique creators by no means anticipated or supposed to help.

At present I’ll make that time extra concrete by sharing the story of a facet venture I made. Over the previous couple years, I constructed a browser extension referred to as Twemex that helps individuals discover fascinating concepts on Twitter. Twemex began as a tiny utility to enhance my very own Twitter expertise, but it surely grew to have tens of 1000’s of customers, and finally I bought the extension to Tweet Hunter in a latest acquisition.

On this put up, I’ll mirror on that have and share a few of the distinctive benefits (and tradeoffs) of constructing an extension as a substitute of constructing a whole new app. I’ll additionally share a couple of of the ways I used to create a profitable extension.

Most significantly, I’ll argue that making an extension is a enjoyable and environment friendly solution to create helpful software program, particularly when you possibly can solely make investments restricted effort and time. As a substitute of ranging from a clean slate, you can begin by tailoring some piece of current software program to higher serve your personal wants, after which share your work with different individuals dealing with related issues. No have to brainstorm bizarre startup concepts or hunt for markets—simply discover limitations within the software program you already use, and patch them your self.

Past these advantages for the developer, extensions will be superior for end-users too. As a substitute of needing to modify to a distinct app, customers can easily combine new performance into their current expertise. Extensions can even help area of interest use instances that might by no means be prioritized by the unique developer.

The start

In 2020, I used to be a reasonably heavy Twitter addict consumer. I obtained actually into an odd fashion of Twitter utilization popularized by @visakanv and @Conaw. They’d use Twitter as a type of note-taking app or memex: weaving intricate webs of concepts, utilizing Twitter’s quote-tweet and linking mechanisms for connecting associated ideas.

Constructing threads (with assist from search) causes you to come across outdated concepts, which is a good way to have new ones.

You’re totally different now.

The previous is a overseas nation.

Your outdated self is a distinct particular person, however a fantastic collaborator.

Shock your self.

— Conor White-Sullivan ???????????????? (@Conaw) May 18, 2019

Utilizing Twitter this fashion was type of a hack, and it required some gentle creativity with the platform’s options. One significantly essential one was discovering outdated tweets utilizing Twitter’s superior search. For instance, if I wished to hyperlink to an older tweet I had written about spreadsheets, I would want to open a brand new tab and search from:geoffreylitt spreadsheets. I rapidly discovered that Twitter’s superior search provided tons of helpful capabilities like this, however they weren’t conveniently uncovered.

I made a decision to take issues into my palms, and spent a day hacking on a easy little extension to enhance the state of affairs. It added a sidebar the place I might sort in a search time period, and get instant search outcomes from my very own previous tweets as I typed. This manner, I might simply discover previous tweets to hyperlink to in my very own threads as I wrote them.

The implementation was useless easy. All it did was prepend from:<my username> to the start of the search time period and ship requests to the search API utilized by the net shopper. I discovered that the search API was quick sufficient to energy a stay search expertise because the consumer typed, although this stay search UX wasn’t uncovered wherever within the Twitter shopper itself.

Launch

After I used this device for a couple of months and occassionally shared screenshots, a couple of individuals requested me if they may use it too. I shared the prototype, and thru conversations with these early customers, rapidly obtained a bunch of concepts for extra options to construct on high of Twitter’s search.

I added a couple of widgets that might reply to the energetic searching context and passively present fascinating context, with none interplay wanted from the consumer. Probably the most thrilling one was “Highlights”: a solution to see the most-liked tweets from the account presently being seen. This allow you to get a broader view of a brand new account, as a substitute of simply seeing their newest posts.

I additionally added a richer search key phrase language which simplified the Twitter search key phrases and made it simple to include the present searching context: for instance, /me would search your personal tweets, and /consumer would search inside the tweets of the consumer presently being seen.

One characteristic I discovered ridiculously helpful was /follows, which might search tweets from individuals you comply with. This let me deal with Twitter as a private search engine, the place I might see opinions from individuals I trusted about any matter. This key phrase was merely a shortcut for an current Twitter search key phrase, filter:follows—however saving the few further keystrokes made an enormous distinction in usability.

As soon as this preliminary characteristic set solidified sufficient, I obtained some buzz with a delicate launch tweet, and expanded the beta to over 100 customers. Every little thing was duct taped collectively: I posted the extension supply on a Notion web page and DM’d the hyperlink to individuals to sideload into their browsers.

In hindsight, this handbook distribution technique turned out to be a fantastic thought, as a result of DMs had been the proper solution to collect early suggestions. Nearly all of early customers truly despatched significant suggestions, and I believe it’s as a result of we already had an informal messaging channel opened once I initially despatched the app. I additionally discovered that casual DMs had been an environment friendly means of gathering suggestions in comparison with calls or formal emails; I might simply maintain conversations going with dozens of customers with out a lot overhead.

Incomes the pixels

Now that I had extra customers, my #1 precedence was to “earn the pixels”: that’s, to make the extension really feel native to Twitter, by no means trigger glitches, and customarily supply a high-quality expertise. I wished to verify individuals by no means had a motive to disable the extension.

It seems the bar for that is fairly excessive, as a result of individuals have sturdy current habits and expectations. I needed to construct my very own copy of the Twitter UI for displaying tweets, and align it as intently as attainable with the true UI. When Twemex was lacking options like a retweet button, individuals would get confused as a result of they anticipated issues to behave similar to the native UI.

Generally options that is perhaps decrease precedence in a standalone app develop into crucial in an extension. For instance: take into account darkish mode. An excellent white sidebar on a darkish Twitter website seems to be ridiculous. Implementing shade modes, and correctly syncing with the consumer’s show preferences on the Twitter web page, was a non-negotiable characteristic for Twemex.

I used to be solely engaged on Twemex as a facet venture, so I had restricted time on nights and weekends to repair all these items. For some time, virtually my total growth finances was spent on high quality and polish, with basically no characteristic growth. I feel that was the proper name for offering a pleasant expertise although. Fortunately I didn’t have any managers trying over my shoulder asking me to ship sellable options.

One factor that did assist with incomes the pixels on this case is that the true property I used to be changing on Twitter was the “What’s occurring” sidebar, which I (and apparently many different customers) discovered pointless and actively distracting.

Anyway, finally issues stabilized, and I shipped a correct public beta by way of the Chrome retailer. At this level lots of people began actually loving the Twemex expertise. I obtained dozens of evaluations like:

Quickly turned one among my core options when searching Twitter. Cuts by way of the noise and finds high quality so properly.

and

I can not consider how damaged twitter feels with out twemex

and

In the event you aren’t utilizing @TwemexApp, you’re utilizing the “flip cellphone” model of Twitter.

Right here’s a brief demo video of Twemex if you wish to see extra of the cool issues it does. Discover how all through the demo, it actually feels just like the extension is simply a part of the app:

Progress + acquisition

As soon as the extension shipped, I didn’t replace it very a lot. I might sometimes repair bugs or make minor tweaks, however I didn’t have time for any extra, since I used to be busy with my day job of doing research on user agency in computing. I additionally made somewhat web site for the device, however didn’t make any critical efforts at advertising and marketing…

…and but, someway, it saved rising by itself. Customers had been rising reliably round 10-15% per thirty days; after a yr or two, that had constructed as much as over 20,000 customers. (That is simply Chrome’s report of the variety of customers who’ve the extension put in; I didn’t have analytics measuring any extra detailed stats on exercise.)

Every now and then I might take into consideration getting extra critical concerning the venture, however I used to be busy with my analysis, and in addition wasn’t keen to speculate critical time with out some type of compensation. Many customers had advised me they might pay $5/month for the device, so I contemplated making the product paid, however didn’t love that choice for customers.

Then, in late 2022, a pair groups constructing Twitter-related merchandise reached out to me with curiosity in buying the extension. I made a decision it was a good suggestion to promote, as a result of a devoted crew might do a greater job sustaining and rising the extension than I might with my spare time. I ended up promoting it to Tweet Hunter.

I used to be significantly excited that they had been longtime customers of the extension and deeply understood its worth. I used to be additionally completely happy that they deliberate to maintain the present performance free, since they may use Twemex to assist develop their current product. In fact, the monetary final result was additionally useful for me, since I’m presently a grad scholar foregoing a tech business wage to do extra speculative analysis.

The advantages of extensions

Wanting again on my work on Twemex, I’m struck by how enjoyable and environment friendly it was as a venture.

I didn’t set out with ambitions of making a broadly used device, I simply began with a customization for myself. And I by no means gave Twemex a lot consideration; it all the time remained a low-priority facet venture under different issues. And but, I used to be nonetheless in a position to create one thing invaluable that different individuals benefited from. I credit score a whole lot of these advantages to the truth that it was a browser extension relatively than a standalone app.

Listed below are three key ways in which extensions are good for a facet venture:

Straightforward to search out an thought

Transformational concepts for software program—those that might develop into big companies and alter the world—are uncommon and laborious to identify. Even after they do work out, they typically take super effort and require an urge for food for danger.

In distinction, incremental enhancements to current software program are far simpler to search out. In the event you’re opinionated about software program and have style in design, day-after-day spent in browser apps is assured to yield a flood of small complaints, every of which could possibly be the seed for an extension.

It’s additionally completely okay if the complaints are fairly area of interest or particular. My start line for Twemex got here from an esoteric utilization sample, and even after I added some extra generic options, it’s very removed from having mass enchantment. Twemex is utilized by one thing like 0.01% of Twitter’s total userbase, and that’s completely nice.

See Also

Electrifying.com New Automobile Awards 2024: Innovation of the Yr: BYD Blade Battery

Clearly, this line of pondering can solely yield small enhancements to current instruments, and it received’t result in the following large revolutionary factor. However typically little tweaks could make an enormous distinction, and I discover this to be an acceptable and humble mentality for a small facet venture.

Straightforward operations

I had a strict rule for this venture: no operational stress. This meant no servers, and no knowledge storage.

The device was shipped as a purely client-side browser extension, utilizing Twitter’s backend for search. I didn’t have my very own consumer accounts; the extension would simply ship requests from the consumer’s browser utilizing their authentication credentials.

I additionally averted constructing any options that might require storing knowledge on my finish. Knowledge is a legal responsibility; it requires cautious dealing with to protect privateness, and to keep away from knowledge loss. If I had constructed knowledge storage options, I in all probability would have tried a local-first strategy to keep away from operational stress.

These guidelines made it far simpler to maintain the venture operating with out investing a lot ongoing effort. In fact, these aren’t essentially affordable constraints for a bigger or extra critical venture, however they labored for this one.

Straightforward progress

Getting individuals to make use of a brand new factor is tough, and getting them to maintain utilizing it’s even tougher.

The good information is, with an extension, the flywheel isn’t ranging from scratch. As soon as a consumer put in Twemex, they might routinely see the brand new sidebar each time they visited Twitter. For the ability customers who had been the almost definitely to make use of Twemex anyway, this meant that their current habits would seamlessly develop to incorporate Twemex.

Fairly often, individuals would inform me that they had forgotten that Twemex wasn’t a part of Twitter itself. I feel this additionally factors to the advantages for customers: would you relatively need to be taught an entire new interface, or simply have your current one seamlessly improved?

The flip facet of that is that the extension has to earn the pixels. Any glitchiness or high quality issues that might mess up the core Twitter expertise would result in an uninstall. Most of my time engaged on the extension went into making it really feel native and eradicating any issues that might actively degrade from the expertise.

In abstract, constructing an extension gave me entry to a simple thought, simple operations, and straightforward progress, relative to constructing a bigger utility. It nonetheless took cautious design work and many iterations to achieve product, however the leverage from the hours I put in was fairly excessive.

The drawbacks

I additionally discovered that there are some key tradeoffs to grapple with in extension growth.

Platform danger

With any extension or plugin, there’s all the time platform danger because you’re constructing on high of another person’s app. This might vary from day-to-day instability, to getting fully shut out or changed by a first-party characteristic. Twitter particularly has an notorious historical past of treating third-party builders poorly.

Apparently, Twemex doesn’t truly use the official Twitter API, so it’s topic to a distinct type of danger than official third-party apps. On the one hand, there’s no API key, and Twemex can entry all of the APIs utilized by the first-party shopper, which is tremendous handy. Alternatively, as a result of it’s constructing on an unofficial, reverse-engineered basis, there aren’t any ensures in any respect about when issues may change beneath.

Fortunately, I didn’t have too many points, maybe as a result of Twitter didn’t change its core options very a lot whereas I used to be engaged on the device. I usually tried laborious to reduce the coupling of my UI and Twitter’s DOM, and did barely fancy issues in some issues in service of reliability—for instance, my code for detecting shade themes from the positioning makes use of ranges of colours relatively than actual hex values, to be resilient in case Twitter had been to barely tweak their colours.

In some methods although, possibly this platform danger will be a bonus for a facet venture. The platform danger is perhaps too nice to construct an entire enterprise on high of, however for a lower-stakes extension it’s nice.

One other factor value mentioning is that it’s getting tougher to engineer browser extensions properly as net frontends develop into compiled artifacts which are ever additional faraway from their authentic supply code. Semantic CSS lessons are principally gone today; stably addressing UI components is tough.

The Chrome extension platform is flawed

I’m used to constructing net functions the place you possibly can ship an replace anytime, particularly when one thing is damaged.

In distinction, I discovered that distribution is depressing on the extension platform. Reaching most customers requires going by way of the Chrome Net Retailer, which has an opaque handbook assessment course of that may take wherever from a pair hours to some weeks. Not having the ability to ship updates rapidly meant I needed to be way more diligent about QAing releases.

It looks as if Chrome could also be bettering this example just lately but it surely’s laborious to inform. I discovered it actually useful being in Taylor Nieman’s Slack channel for browser extension devs to ask for recommendation and customarily commiserate.

There’s additionally been a ton of angst just lately across the transfer to a brand new extension format, Manifest V3, which has additionally been delayed as a result of a few of the turmoil. I received’t go into the main points right here, however the total impression I get is of a platform with super potential, however considerably disorganized and uncared for below present administration.

Conclusion

Software program ought to be a malleable medium, the place anybody can edit their instruments to higher match their private wants. The legal guidelines of physics aren’t related right here; all we want is to search out methods to architect techniques in such a means that they are often tweaked at runtime, and provides everybody the instruments to take action.

Past the pragmatic effectivity advantages of constructing a browser extension, I might argue that it’s merely extra enjoyable to interact with the digital world in a read-write means, to see an issue and truly take into account it fixable by tweaking from the surface.

So, in the event you’re a programmer: the following time you come throughout an annoying drawback on an internet app frontend, possibly take into account writing a browser extension to make it higher, after which share it in order that different individuals can profit too.

• I gave a chat referred to as Using Twitter to Cultivate Ideas, the place I went into extra depth on a few of the philosophy behind Twemex.
• I’ve written earlier than concerning the promise of browser extensions as a platform, and democratizing the ability of extensions
• I’m enthusiastic about Arc Boosts, an try to combine consumer scripting and customization deeply into a brand new net browser
• A Twemex consumer recorded a nice demo displaying off and reviewing the extension in additional depth