What / Who Inspired TipList

One of the best things about building software is how different apps inspire one another. Everyone, and I mean everyone, borrows inspiration from each other, whether that means taking design aspects, user flows, wording, and more. It's okay. That's why the web moves quickly. It's constantly improving itself without the restrictions of crazy copyrights. It's open. And that's great.

This page is an experiment, but it's intended to be transparent about where I drew design and product inspiration while conceiving and building TipList. Hopefully, it will be updated as time passes, but I at least wanted to recognize, and thank, those who spent time thinking through some of these interfaces before I had to.

It'd be amazing to build a way to trace these inspirations through apps. Until then, I'd love to see more companies be transparent about inspiration. Enjoy!

Brenden Mulligan

Brief TipList History

TipList begins with a singular purpose: to replace the emails that you might send a friend visiting a city you know. You've probably written one of these emails before. A friend will ask you for tips in a city you've been to, and in return, you send a long email with notes on where to go, what to see, etc...

I wanted to build something to replace these emails. I've been thinking about this product for a long time. I started tinkering around with it over a year ago, but just felt that there were enough social travel startups trying to crack this nut. Gogobot, Trippy, and even Foursquare have interesting takes on solving this problem, but none of them are the way I'd solve it. So, the beauty of being a programmer and designer is that I get to build the thing I want and put it out in the world. That's TipList.

Product

I was really inspired by a few companies about some crucial details of the product interactions.

Tips appearing to the right of the TipList: Orchestra

I'm a fan of Orchestra. I'm not a big to-do list person, but I do think that Orchestra has done a great job with this problem. The first version of TipList was modeled very close to how the Orchestra Web App interaction works, where the page is anchored to the left, and when you click a row, a new container pops out to the right. While I abandoned this with the final product (having everything start on the left was weird), I kept the idea of clicking on something in the center and the content would appear on the right.

A narrower web view with a large background image: Path

Path 2.0 is great. I did a review of the UX after it came out, talking in detail about lots of things I liked. One thing I didn't include (since the article was mostly iOS app focused) was the web view. It's clean, simple, and to the point. I wanted Onesheet to feel a similar way. I loved the idea of intentionally not using the entire screen, and instead showing more of a big background image.

A cover for each TipList: Facebook

Facebook's timeline feature introduced the idea of adding a cover to your updates. Like Path, I was also inspired by this and loved the idea of having part of a rich image at the top of a list of text.

Simple Rating System: Oink

Oink is a great app for rating things inside places. I've been inspired by the way they do ratings. They moved from the 5 star system to make ratings that were more human. I wanted to do the same with TipList, so Oink's "Love, Thumbs Up, Meh, and Thumbs Down" had a direct influence on TipList Must Do, Do, Miss ratings.

Landing Page: PhotoPile

Last year I built a small app called PhotoPile. It was a small design exercise to build a fun way to view Instagram Photos, since their web app is nonexistent. I used some of the design from that to build the landing page for TipList.

Navigation & Icons: iOS

The interface to the iPhone is beautiful, and has heavily influenced most of the apps I've listed above. There are little inspirations from that speckled around the TipList interface. I use a lot of icons that are familiar to iOS users, such as the share button. I was inspired by how the options in the camera app were laid on top of the photo, which resulted in the upper right navigation bar.