Wall of Quotes

A collection of my favorite quotes, sourced from my Twitter account, Instapaper and Kindle highlights, and things I’ve saved from various sources in my Notes app.

PROJECT TYPE

Personal

TOOLS

HTML/CSS/JS

I recently realized I have several years' worth of quotes and general snippets of memorable copy I've saved or written via various apps and manual collection. Between Kindle, Instapaper, Twitter, and a long-running Notes document I've amassed hundreds of clippings. Partially inspired by the wall of quotes at Pieology restaurants, I thought it'd be a fun project to export or scrape all the data, normalize it, and create a page to display them all together. Each quote has the author, source (with link), and the date it was written or saved. I also ended up categorizing each quote and adding a filter so you can browse by topic.

YOU CAN QUOTE ME ON THAT

The masonry layout and filtering is handled by the excellent Isotope library. Normalizing the data was a heavy lift, but after getting it all cleaned up I converted it to JSON to prototype the UI. Once that was all set, I converted it to static HTML for better performance with the filtering feature.

Quotes

More Projects

LoopNet Design SystemCorporate In-House

LoopNet Listing Detail PageCorporate In-House

LoopNet Search ResultsCorporate In-House

Wall of QuotesPersonal Project

Dribbble Top Player StatsPersonal Project

Body Weight AnalysisPersonal Project

Gymnastics Scores Data VizPersonal Project

Copyright ©2020