MVP Development: Building a Chrome Extension for a Transformed LinkedIn Experience
How NaNLABS’ MVP development experts built a successful Chrome extension, sparking immediate market buzz with a waitlist of 70+ LinkedIn users.
The right software can turn a cumbersome task into a seamless part of your workflow. That was the simple yet important reality behind Brian's brainchild, a Chrome extension called LI Folders that promises to tackle a pain point for many LinkedIn users — saving, organizing, and finding LinkedIn posts. But to transform this vision into a user-friendly reality, he needed a partner in MVP development. That's when NaNLABS stepped into the picture, to build a Chrome extension fit for the job.
Here's how we worked together to craft a tool that not only enhanced Brian’s own LinkedIn experience but also resonated with a growing user base, eager for efficiency and order in their professional networking.
Table of contents
The Brief: Organizing LinkedIn posts with efficiency and ease
Take the first step with NaNLABS: Your partner in MVP development
That sketch sitting in your library? It’s time to share it with the world. From idea to launch, we can design, architect and code your MVP vision into reality in 3 months or less.
The Client: LinkedIn power user, Brian Hamor
As part of his day job, Brian's routine involves regularly publishing and interacting with a wealth of content on LinkedIn. The problem? LinkedIn's native functionality for organizing saved content was, in his words, a "nightmare"—a chaotic scroll that seemed to have no end and no method to its madness.
Brian was far from alone. A quick LinkedIn search found 1,700 users with the same problem on a single post; his initiative represented a universal frustration among LinkedIn's extensive user base for a more efficient and manageable way to handle content.
Recognizing the need for a solution that could streamline the process, Brian envisioned a tool that would seamlessly integrate with the platform: LI Folders. This Chrome extension would enable users to easily categorize and retrieve saved posts and comments. But while the need was clear, the path to realization was not. "I knew what I wanted but didn't know how to get there," Brian reflected.
On a referral, Brian got in touch with the NaNLABS team, having no prior experience of working with a development agency. A simple request through the website and 24 hours later we had an initial call to talk through the vision as well as any concerns or questions he had about the MVP development process.
The Brief: Organizing LinkedIn posts with efficiency and ease
With an open mind to technical solutions and a reliance on NaNLABS' expertise, Brian laid down the challenge: To create a chrome extension that allows people to easily save, tag, and organize LinkedIn posts and comments to revisit later.
It was straightforward yet ambitious and would redefine the way professionals manage their LinkedIn content. Named "LI Folders", this extension needed three core functionalities:
The ability to save individual posts and comments;
a way to sort these posts into custom folders directly from the extension, and;
an efficient method of accessing the posts through either a free ‘Freemium’ or paid ‘Premium’ plan.
"The main goal was to get the extension up and running within 3 months, and also to a point where it could eventually become a paid service," Brian explained. His experience with freelancers had been time-consuming and labor-intensive, particularly due to the lack of technical guidance. This is where NaNLABS differed. As Brian put it, "With a freelancer, you need to guide them. But with NaNLABS, they very much try to guide you, which is what I needed during the MVP stage".
The Challenges: Overcoming technical hurdles
As is often the case with MVP development, creating the LI Folders Chrome extension was not without its trials. The NaNLABS MVP development team took on a set of challenges that tested their technical ability and innovative thinking.
Crafting an intuitive UI in confined spaces
The first hurdle was designing a user interface (UI) that could live within the limited real estate of LinkedIn’s interface. This UI needed to be detailed enough to provide a robust user experience yet minimalistic to avoid overwhelming the platform's existing layout. NaNLABS approached this by adopting a mobile design mentality, ensuring the application would be as sleek and unobtrusive as possible. The design phase involved meticulous planning in Figma, where every interaction and flow was carefully mapped out to ensure that the extension would feel like a natural part of LinkedIn’s ecosystem.
Overcoming LinkedIn's dynamic complexity
Interacting with LinkedIn presented the second major challenge. The platform’s content is not static; it is dynamically generated and displayed in various formats across different sections. To address this, NaNLABS engineered an "observer engine" that could track changes within LinkedIn and inject the LI Folders functionality seamlessly. This engine was crucial in enabling the extension to interact with LinkedIn’s Document Object Model (DOM) and maintain a high level of performance without disrupting the user’s navigation.
Ensuring efficient local development and testing
An additional technical challenge that was swiftly addressed was setting up a development environment for rapid and effective local testing. Thanks to the foresight of NaNLABS’ R&D team, a project template had already been established, specifically tailored for Chrome extension development. This template provided a solid foundation and significantly streamlined the development process, allowing the team to focus on innovation rather than getting bogged down with setup and configuration.
Through a combination of strategic MVP planning and scoping, technical innovation, and a proactive communication style, NaNLABS turned these challenges into a roadmap for success. This approach solved the immediate technical hurdles and laid the groundwork for future enhancements to the LI Folders extension.
The Solution: Aligning technology with objectives
In crafting the LI Folders Chrome extension, NaNLABS focused on three core objectives that defined the project's success: saving posts, organizing them effectively, and ensuring they could be easily found. Here's how the solutions were tailored to meet these pivotal goals:
Saving posts with precision
To facilitate the saving of posts and comments directly from LinkedIn, NaNLABS chose React for the front end of the extension. This decision ensured that the user interface was not only responsive but also capable of integrating seamlessly with LinkedIn's dynamic environment. TypeScript played a significant role here, allowing the development of the robust "observer engine" that could reliably interact with LinkedIn's ever-changing DOM and enable users to save posts simply.
Organizing posts intuitively
The organization of content was critical to Brian's vision. The solution needed to allow users to categorize saved posts into folders without leaving the LinkedIn interface.
Material UI provided the visual components to create an intuitive user experience, ensuring that organization was not only possible but straightforward and integrated. The use of AWS Amplify's suite, including Cognito, AppSync, DynamoDB, API Gateway and Lambda functions, facilitated the backend support required for managing the complex data structures.
Finding posts efficiently
For the all-important task of finding and retrieving saved posts, the extension required a communication channel between the Chrome extension and LinkedIn's interface. This was achieved through the innovative use of Vite to build a local development environment that could mimic the live conditions of LinkedIn for a seamless search and retrieval experience.
One of the defining moments in the project's life cycle was NaNLABS' proactive suggestion to improve how users interacted with LinkedIn content. Rather than the initial idea to copy and paste post/comment information, the team proposed integrating a button in LinkedIn's contextual menu.
This simple yet impactful enhancement significantly smoothed the end-user experience, a testament to NaNLABS' user-centric approach.
The final major consideration was payment. With Stripe integrated into the system, NaNLABS laid the groundwork for handling future subscriptions and payments.
"We fixed a lot of things in the UI, midway, to help improve the Chrome Extension, so that helped everything too" Brian remarked, acknowledging the iterative improvements that were made to enhance the functionality and usability of the extension.
This combination of a powerful tech stack and a proactive, client-focused approach led to the creation of a solution that was robust, scalable, and poised for future expansion.
The Results: A transformed LinkedIn user experience
With a winning collaboration between NaNLABS and Brian Hamor, the LI Folders Chrome extension resulted in achievements that surpassed the initial objectives of the project.
MVP development and deployment
Within a timeframe of just 90 days, NaNLABS delivered a fully functional MVP. This quick turnaround was crucial in maintaining the momentum necessary for Brian to take the extension to market. The MVP was developed, refined, and optimized during this period, ready for public use.
Real-world impact and user adoption
Since the MVP's launch, the extension has become an integral part of Brian's workflow, significantly enhancing his job performance. "The extension now makes my own job easier. I can search on LinkedIn for different posts and topics and save those to a folder specifically for the company," said Brian, highlighting the practical benefits of the tool.
The market response was also immediate and positive. With a waiting list of 70 people eager to use the extension, it was clear that Brian had tapped into a prevalent need among LinkedIn users. His proactive approach to building an early user base by inviting them to a beta list ensured that the extension had a ready and willing audience upon release.
Partnership and further development
"The MVP component was perfect" Brian acknowledged, appreciating the solid foundation that NaNLABS provided, which was instrumental in moving the project forward. "At the moment it's a Chrome Extension, but now we're developing it into a full web app. This allows us to plug into multiple platforms and add AI to different search components" Brian explained.
The LI Folders project delivered on its promise but also laid the groundwork for continued innovation and user engagement. With the MVP as a stepping stone, the project's future looks bright, bolstered by a growing user base and the prospect of expanded capabilities.
Take the first step with NaNLABS: Your partner in MVP development
Taking the first step towards developing your MVP can seem daunting, especially if you're venturing into unfamiliar territory. Questions about technical requirements, MVP costs, and the right approach to take can make initiating that first conversation with an agency feel like a leap into the unknown. But it doesn't have to be.
At NaNLABS, we understand these apprehensions. We're here to provide MVP development services, but also to guide you through the process and make sure you’re equipped with the things you need to know before building an MVP. We want to ensure that your first step towards building your MVP - whether it's a Chrome extension or any other software solution - is a positive one.
That sketch sitting in your library? It’s time to share it with the world. From idea to launch, we can design, architect and code your MVP vision into reality in 3 months or less.
More articles to read
Previous blog post
11/29/2023
Developing an MVP for SaaS: Your Guide to Make-or-Break Technical Decisions
Read the complete article
