Trove is a location-specific container for digital files. The app lets you store digital photos, videos, audio, cryptcurrency and more in physical space, meaning that someone has to be in that same spot to access it. Think digital geochaching. The twist is that you have to put something in before you can take something out. The app was the result of PennApps (a large student hackathon), 36 hours without sleep and countless pivots.
My PennApps team consisted of Ben Davis, who I’d met at a hackathon organizer conference a month earlier, Michael Pfister and Niko Lazaris, who I’d never met before. Michael and Niko had brought with them a few pieces of cool hardware. Estimote beacons, blinky tape, a leap motion, and a raspberry pi. Not using one of these in our hack would be a waste, and so we spent the first few hours trying to figure out what to do.
Ideation
Looking back, these few hours are kind of a haze. We must have gone over dozens of possible hacks. We played around with the idea of using BLE technology for retail or for mapping out closed spaces. The idea that finally stuck was a location-based chat app using the beacons. We would place the 3 beacons on opposite sides of whichever room we were demoing in and figure out where people were through trilateration. This way we could not only display chat messages, but also a dynamic arrow always pointing towards each message’s sender. The chat would also be peer-to-peer, sent through Bluetooth Low Energy, and thus more secure than other chat apps on the market. It was a great idea, but a few hours of work into it, we realized that trilateration wasn’t possible given the beacons’ inaccuracy and short range.
Considering the amount of time we’d already put into the beacons, we began discussing what else we could do. One idea, that would later become Trove, was to let users store files within an area. It wouldn’t have to be an exact point, just an area within which you could access the files.
Niko came to the hackathon planning to work on an Android app. Michael wanted to build an iPhone app. Naturally, with four people and 20 hours to go, we decided to go for both. The beacons work using BLE, which Niko’s Android phone didn’t support, so we opted to make his version of Trove work using GPS rather than beacons. Meanwhile, we discovered that the beacons were even less accurate than we’d previously thought, and ended up using the beacons themselves as our troves. So essentially we were on course for creating two completely different experiences in a very short time.
Designing the App
The name we came up for the app was Trove, like a treasure trove. The name also allowed us to create a naming scheme and mental model for our containers—troves. We wanted users to be excited about finding and creating troves. We wanted trove to be whimsical, and so I created a cute, joyful mascot, Trover. I colored him as I’d colored much of the app—in gold, to associate it with treasure.
I wanted the experience to be organic, mysterious and exciting, so I opted for little to no interface. The app would notify you when you were close to a trove and would lead you to it with “getting warmer” feedback rather than an actual direction to follow. I chose a growing/shrinking circle for this. When the circle grew enough, it would transform and reveal the trove.
Version 1
In the first version, I experimented with a trove being an area rather than a single container. Instead of there being troves wherever you wanted, they were limited to specifically set area. Once you were in one, though, this opened the door to exploration in space. I thought it would be interesting to focus only on visual media with potential for emotion—photographs and videos. I called these “moments” and it added a certain poignancy to the app. A trove could have any number of moments scattered throughout, and you could leave your own moments anywhere within it.
I’d never touched Origami at this point, so the interaction examples I put together were just series of images.
Version 2
Michael had tried to build this, but the beacons simply weren’t good enough to let us explore the space in this way. The methods we had at our disposal to search for moments were rougher, less accurate. I decided to recycle the “getting warmer” feedback I’d used to find the trove.
I began experimenting with less of the mystery in favor of an interesting visual experience. Users would explore the space through the hot/cold feedback and once they happened upon moments they could swipe to either keep or discard them. If they kept them, they would have to replace them.
Version 3
Once we realized that exploring a space in any sense was simply not possible with the given technology, I had to rethink the experience. I had a single variable at my disposal to use when searching for a trove—signal strength. Estimote Beacons, apparently, are made only to provide binary states—nearby, or not. It was quickly becoming apparent that we were attempting to use them in a way that was impossible.
I decided to keep the hot/cold feedback in the meanwhile. In the future, we could transfer to using GPS for positioning of troves, but for now, with little time left in the hackathon, I decided to focus on the actual trove experience.
Since we could no longer scatter things around an area, a trove became a single point, from which you could pick out or store moments. The difference in experience is like the difference between walking into a cave full of gold coins, and opening a sparkling treasure chest. They’re both positive experiences, but they have different aesthetics.
I put together an animation that depicts finding a trove. The hot/cold circle grows until it reaches a critical mass and explodes into the moments within. I kept these cropped so that users would still have motive to replace them with their own moments.
Version 4
Showing partial photos made bringing our concept to fruition a bit more difficult, though. First, in this paradigm there was no way to display audio, bitcoins, text or anything except for visual files. Second, and perhaps more importantly, showing images, even cropped, took the mystery away and hurt the experience substantially. You didn’t have to put something in to see what you’d get since you already had an idea of what it was. It killed the motivation as well as the surprise. To combat this I designed a set of treasure-inspired icons to represent files in the trove, strengthening the mental model of these files being pieces of treasure within treasure troves.
An icon would be chosen randomly for each file, some appearing twice and in different arrangements, so each trove would feel different. This way, you would never know what you’d get in return for your own treasure. It brought back the excitement.
At this point we had a functional prototype of the latest version to show at the demos, and we set to create the website.
Designing the Website
We had about 2 hours to design and code our website before the demos. Ben opened Github repo and the two of us began jamming on a site.
I chose a soft lavender to complement the gold and the rest of the color scheme. The typeface is Source Sans Pro, one of my favorite web fonts.
The illustrations were designed to be simple and whimsical. Through iteration, I decided to represent a trove as 3 golden rings. This allowed me to show a standalone trove in one illustration and a trove as an area in another (with a 3D Trover in the middle, representing the user). Near the end of the site, where we explain how the app works, I decided to illustrate beacons as treasure. I have a habit of adding cute, delightful touches to my projects. If you go to the site (link below) and hover over Trover, he will be elated.
2 hours of high-stress design and iteration later, we had our website.
The Future
We love Trove and its potential. We all plan on going back to it one day in the near future. Whether that happens or not is left to be seen.
Check it out
Go see the site here: joelcalifa.com/trove.
