code

Saving and Searching Meta-Data on Klart

Fredrik

Fredrik

— 2 min read
Saving and Searching Meta-Data on Klart

I've been building Klart — a bookmarking tool for designers for about a year and a half now. The reasons that I made Klart was that I didn't find any simple way to save screenshots together with links for designs and resources I liked online. I used to save screenshots to Dropbox and use the default bookmarks manager but it was such a pain to organize everything, so I made Klart and implemented a simple but efficient organization mechanism, tags. 🎉

After about a year of using Klart myself I decided that I could do more. A couple of month ago I added a search filter to complement tags. The old filter only included Snaps that had the requested tags. The new search filter searched for matches in the saved URL as well as tags and notes. This turned out to be really efficient since it allowed me to query things like "github.com", check available tags and filter further from there. I could also do stuff like searching for a user mention on a shared board like "@fredrik". I was super happy about this.

After search being a big success in user happiness I wanted to do more. I decided that the next step was to implement search for meta-data like description, site name and title. So as long as your saved sites uses meta tags properly, you should be able to query stuff like "Euclidean distance" and "CSS animations" and find snaps related to that. 🤗

Now the filter algorithm looks something like this:


# Match determines if Snap should be in result
# activeTags are the selected tags
# keyword is user search query
Match(s) = SnapHasTags(activeTags, s.tags)
           ∧ SnapHasKeyword(keyword, s.url, s.title, s.name, s.description)

SnapHasTags(activeTags, snapTags) = activeTags ⊆ snapTags

SnapHasKeyword(keyword, url, title, name, description) = keyword is ∅
    ∨ keyword in url
    ∨ keyword in title
    ∨ keyword in name
    ∨ keyword in description

And this is what it looks like (I forgot to mention that you can also toggle archived Snaps 🙈)

Search filter

Available tags are also updated based on matches so only tags that actually exists among the matches are available.

Hopefully this will make it easier for you to fully master the new search filters. If not, let me know on Twitter.

For the future I'll try to add more content based filter's as well like colors and categorization. I think there is a balance here though, so I'm going to try things out carefully :).

Oh, and I should probably mention that the meta-search is only available on new Snaps since I don't have access to your sessions and cannot travel back in time to fetch descriptions for you. 😬

Read more