Collap

Collap

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.

Group 7500

We are responsible for
User Research, UX Design, UI Design, User Testing,
Extension Development, Devops

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.

Create targeted cards

The user finds a listing of courses with a detailed syllabus on the marketing site; they can filter programs according to the type, duration, difficulty level, and direction. Once they identify the course they wish to buy, the user can either pay with a card or PayPal and use affiliated banks to pay in installments.

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.

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.

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.

Tech Stack

Vue
ESLint
Tailwind
Jest

Laravel
Nova
Mix
Backpack

Github Actions
Digital Ocean

Swagger
Figma
Github
Jira

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.

  • Our Engagement Involved:

    User Research, UX Design, UI Design, User Testing, Chrome Extension Development, Dashboard Development, Admin Interface Development, Backend Development, Devops

  • Tech Stack & Tools:

    Vue.js, Tailwind CSS, ESLint, Laravel, Laravel Sanctum, Laravel Socialite, Digital Ocean, Github Actions, Figma, Jira, Swagger