How we developed tables in Capacities
Recently, we launched tables in Capacities. It’s a major addition to our app, and we developed the whole feature in just a couple of weeks. I wanted to share a little bit about the process and why we think it’s one of the best table implementations in any note-taking app.
Figuring out what to build
From the beginning, we wanted it to stand out from table implementations in other note-taking apps while making no compromise on the UI/UX side of things. So these were our requirements:
A super nice UI/UX: keyboard accessibility, many shortcuts, using patterns already familiar to our users. Making them pretty and well-formatted: Supporting a variety of formatting options and styles that allow users to make beautiful and useful
Deep integration into the app: part of PDF export, rich-text in table cells, seamless copy and paste, linking to any content from within table cells, saving tables as objects, interaction with the AI assistant, familiar formatting options, export to CSV, reusing UI patterns our users already know, saving important tables as objects. For example, the table in this screenshot was generated by our AI assistant in the app.
A powerful extra feature: We added formulas like in Excel to make it stand out from other note-taking apps. It allows for a whole range of new use cases. While this will never replace a tool like excel, it is very useful for doing some calculations and the fly and have them right inside your note-taking app. This also works great as a “Pro” feature.
Being versatile: Having a flexible data model that is not too rigid and structured. Supporting simple inline tables for layout purposes all the way to tables-as-objects that users can open in full-page and revisit frequently.
We found that this is a combination that is not present in any other note-taking app and really makes @CapacitiesHQ stand out.
How we built it
We made the table feature the main project of a new employee. While this sounds risky, it allowed us to go the extra mile because he could spend all his time and effort on this one feature. We could then completely polish it with the input from the rest of the team. This focus gave us an enormous speed.
Another thing that made us super fast on the development side was reusing as much code and as many concepts as possible that already existed in the code base. This also allowed our new dev to get to know the codebase, use powerful abstractions, and learn by imitating what was already there.
Feel free to check out our new table implementation and let us know what you think!
