arrow
SCROLL DOWN

tripio

A Journey Journal

Branding
UI/UX

The Task

Tripio had been living in Kiril and Christo's heads for quite a while when they came to us. They had a solid idea and had already worked out most of the details before our first meeting. The concept is clear: a social app that help travelers and adventurers connect and share their experiences on the go.

Tripio is not a social network per se, but a gateway that allows users to share content on other social media channels in a more convenient way. It's an app for professional travelers, couchsurfers and all sorts of adventurers. One could also use it on a conventional holiday and discover interesting spots the guide might skip. Kiril and Christo were passionate about building an app for their own kind: people who are ready to travel to the other side of the globe with only a few hundred dollars, a backpack and the address of a person they just met online. The last one is optional.

“We have three days”

To say the Tripio team was in a hurry would be an understatement. Kiril and Christo just heard about a local pre-accelerator event and the chance was too good to miss. They had been working on the business model for a while, but they had no visuals to show. No wireframes, no screens, no interaction prototypes. The problem? They had to present in three days.

Quick Branding

We used an inviting warm red as the main color and a dark shade of grey to bring in contrast. The guys insisted on a typographic logo that made the app look approachable and playful. We had three days to design outside of our comfort zone.

The Map

“It is not down in any map; true places never are.”

It was important for us to craft a map experience that stays clean over time. The only two types of content available are:

People around you
Tips and places around you

Weather Icons

Sunny
Rainy
Cloudy
Partly Cloudy
Thunder
Snow

Scaffolding

One late-night meeting was enough to broadly outline the structure. The feed screen is essential: no tabbed navigation, and settings that are barely there.

The Feed

Tripio is focused around the idea that all tripsters around the world are one big family, so giving easy access to friend-friends and total strangers who are nearby was our utmost priority. Switching between feeds is one tap/slide away and the feed layouts are identical. Ed Snowden might not like Tripio's default privacy settings, but they are a core part of the experience. The pictures and tips tripsters generate don't disappear over time. Even when you don't see them in the feed anymore, they remain on the map.

Swipe left or right to cycle trough screens. Tap to see comments.

Camera button is always one tap away
Social metrics are displayed inline
Posts feature basic weather information.
Tips and place around you
Travelers who are currently nearby

Camera

Most of the shots would probably end up on Instagram, so we decided to go with square, third-world network friendly resolution images. The UI is pretty similar to Apple's iOS Camera app, but has a much larger shutter button. We expect Tripio's users to take pictures in all sorts of intense scenarios. The camera UI also allows you to overlay a selfie on top of the main shot and we recreated Apple's full-screen mode switching in about an hour. We're still thinking on a way to embed prototypes, check back soon.

The vault allows you to share your photos and videos later with a single interaction.

The Vault

The feature we're most proud of is the vault. Our design process was restricted by the short deadline, but Kiril and Christo really wanted to persuade investors that Tripio is designed with it's actual use cases in mind. When you're out hiking in the Himalayas or on a safari in Namibia, sharing your pictures is not really a priority and that's perfectly okay. Even if you want to take the time and post them immediately, the connection might be poor or not there at all, and roaming prices go wild in certain parts of the world. The vault saves all your images (with geotags and timestamps) and allows you to add comments and batch publish them later. It's like reviewing your travel notes after a long day of wandering. We designed a super satisfying rubber band interaction for publishing. Pulling down and letting go publishes the selected images, but traditionalists could also tap the Upload button.

Every bit of profile information is easily accessible on a single screen.

Profile

The profile screen is pretty standard. You can see a user's trips, photos, tips and last location. Tripio's "Wanderer" mode allows the app to auto update your location whenever possible and share it with a select group of close friends. It would use a bit more battery and data, but might be life-saving.

The Result

Three days later, we had a (barebones) brand, a complete wireframe, pixel perfect designs of all the main screens and a few high fidelity interaction prototypes.
The three-day deadline is not perfect, but it was an amazing exercise. We managed to follow our regular process and didn't lose our dzen. Most importantly, we didn't try to mesmerize the crowd with a fancy UI. We preferred keeping it close to native visually, but making thoughtful UX decisions.

We’d love to make something awesome with you too. Want to work with us?

freezing point

Read More