img
AboutContactBlogGet in touch

Collap

img

A Chrome extension that makes every website collaborative.

We designed and developed a Chrome extension that transforms any website into a collaborative workspace where you can create cards, tag your teammates, turn cards into actionable tasks and have these tasks update your productivity tools like Jira.

We are responsible for

UX Design
UI Design
User Research
User Testing
DevOps
Extension development
summary-box-icon
img

Scope:

Dedicated agile team


Team:

8 people


Duration:

8 months

Challenge

Far too often, various tools disrupt your team’s workflow. The job gets fragmented into multiple collaboration and productivity tools, and the actual task’s environment. That is mainly because all the software you used was centered around a specialized professional who set in a room with his team and could have micro-interactions about tasks. However, remote and hybrid work settings have challenged the relevancy of such processes.

Solution

We developed a Chrome extension that allows you to collaborate on the specific websites you work on with your team. Download the extension, create a workspace with all the websites your team is working on and get to it – leave and collect feedback through cards, create and monitor tasks that automatically update your productivity tools, and communicate with your team in the context of the job.

img
img
img
img

Create targeted cards

Users can create cards directly on the specific elements of the website they refer to, be it a headline, button, or image, so no one gets confused again. Plus, the cards automatically generate commenter context information such as screen resolution and browser version. Users can also easily attach automatically generated screenshots of the interface at the moment of commenting.



img
img

Turn cards into actionable tasks

Is your comment really a task someone needs to handle? Each card can be turned into actionable tasks and assigned to a teammate. Users can update and monitor the task’s status right on the website. Users can also easily access task update history to see who made changes. And if you’ve ever struggled with finding out what the final decision on an issue was in a cluttered thread of conversations, that pain is no more – tasks come with a highlighted “final decision” pinned to the top of the card.

Plus, our integrations do the tedious work of logging these tasks into the user’s productivity tools and updating their statuses simultaneously with the website. Users don’t need to switch between Jira and the website cause they have tasks and results in different places.



img
img
img

Invite by tagging their email

Users don’t need to bother their team with any prior onboarding process; they can be invited by simply tagging their email on the card once they actually have to come into play. Once tagged, users have to download the extension to access the content they were mentioned on.



img
img

Advanced filter and search

Collapp lets users search and filter cards by almost any parameter: people, comments, websites, cards, task status, and dates. Plus, users can use multi-select functions to get more focused results.

Involvement & Process

We started with thorough research of existing collaboration and productivity tools, closed in this market, and the overall outlook of experts about the future of deep collaboration. Once we derived valuable insights from the desk research, we moved on to 1-on-1 interviews with our potential user personas, digital product team members to better understand their workflows and how we could streamline them.

Based on the findings, we refined our product design concept and started workshopping sketches for the most significant features.

Based on our initial sketches, our designer started wireframing. We workshopped wireframes at each level until we got to the final version of the features and started prototyping the product in Figma. After testing the prototype with potential users, we iterated the UX, and our team crafted the design system and UI.

In the meantime, we distilled our value props, created a landing page, and wrote copies for the product. We are still in the process of testing the completed prototype with our potential users.

Our platform is built on Laravel and Vue.js as back-end & front-end frameworks. The development process was tested both automatically and manually. Interested in what we’ve created with Laravel? Check out this page to see more! And if you’re ready to talk, we’re just a message away and would love to assist you.

Tech Stack
img

Meet the authors

We are a 200+ people agency and provide product design, software development, and creative growth marketing services to companies ranging from fresh startups to established enterprises. Our work has earned us 100+ international awards, partnerships with Laravel, Vue, Meta, and Google, and the title of Georgia’s agency of the year in 2019 and 2021.

img
Contact us

Similar Projects

Squadro

SaaS Platform


Tweak

Ed-tech