UI of Twitter’s new ‘Vine’ app: Subtle Evolution

Recently Twitter released its new standalone short video sharing app ‘Vine’. It’s début isn’t without some controversies, but overall it’s a solid app with great potentials. All the dramas aside, I want to go ahead and do a bit of UI analysis on this hot social app, and see if we can find something interesting:

1. Biggest Screen Ever

Unlike the quite prevalent ‘5 Tabs Nav Bar’ design pattern other social apps have adopted, Vine doesn’t have a global navigation bar at all. It gives user the most screen real estate to display content, while UI gets out-of-the-way. Launch the app and you’ll see a video playing right away in loops, instantly immersive. Keep scrolling down and you’ll get end-less (literally) content, and there’s no bottom bar with 5 different icons to increase your cognitive load. The interface is clean and minimum.

Vine vs other SNS app

Notice that in above pictures, Twittbot, Twitter, Instagram all have the bottom navigation bar. It’s useful if user wander between these app sections a lot. But for a lot of users, most of the time they stay at their timeline viewing, thus the nav bar only gets in the way unnecessarily. Vine isn’t the first app to come up with this kind of ‘flat’ approach to content presentation. Path, which is another ‘intimate social network’ service, also shares the same ‘put content front and center’ philosophy.

Path Timeline and side menu

Path don’t have global navigation bar either, and they uses a side menu that’s hidden from the content panel, only revealed when the content panel slides to the right. Without the navigation bar, Path is able to keep the interface clean and display more content also.

2. Better Icon-Label Connection

Again using the picture above as an example, it’s really hard if not impossible to figure out what those little navigation bar icons stands for. Twitter at least put the label beneath the icons (but it’s very small, hard to read), Twittbot and Instagram only use icons, thus users will hesitate and ask themselves what those tabs are for before touching them. As we all know it, making users stop and think = bad user experience.

4 Section Design

Vine uses a drop-down menu to switch between app sections. In the menu, pretty and sizable icons are displayed along with the section name. When user gets into the respective section, the icon will stay on the top left corner, and the title will be in the middle of the title bar, further strengthen the connection.

3. Making ‘Like and Comment’ Easier

People are comparing ‘Vine’ with ‘Instagram’ by claiming ‘Vine is the Video Instagram’. They do have some resemblances in UI design. One case in point, they all use a ‘Like’ and ‘Comment’ button for the viewer to leave feedback. The difference is size, where Vine’s buttons are bigger than Instagram, which makes them more ‘touchable’, encouraging people to express their opinion, further foster the social part of the app.

Like & Comment Button Size

4. Curated ‘Explore’ Page
Exploring is an essential part of  social sharing apps. Whether the application can help user find the content they want will determine how far an social media can go.
Curated vd non-curated
As we can see from above pictures, Vine’s ‘Explore’ page has ‘Editor’s Picks’ and ‘Popular Now’, along with 12 most popular or interesting tags, this will cover a lot of ground already. Instagram, on the right side, only list photos that are currently popular. It’s more direct, but also due to the lack of sophisticated algorithm, the results as we can see, are quite random. User will have to input tags they want to search to get access to it, which is not very convenient.

5. Some flaws?

During the review, I also found some design hard to understand. For example, it is a video sharing app, but the only way you can capture a video is to go to ‘Home’ and touch the top right corner icon (no labels either). For such a prominent function as creating video, this is a bit too modest. Maybe Vine’s design team think this app as more of a major content consuming app than a content creating app I don’t know, but if making a video is not as easy as taking a photo, this will hurt its subscribers growth. Video is harder to capture and thus needs more love from UI/UX.

To Sum it up

Overall, I felt the application’s UI and UX is carefully designed. It’s not as sophisticated as Twitter, or as fancy as Path, but it gets the job done very efficiently. The UI gets out-of-the-way as much as possible, people will not have a hard time finding their way around because it’s just not that many layers worthy of the term ‘Information Hierarchy’. Everything is quite buttoned up. It’s simple and even ‘shallow’. (Interestingly, some say the early contents are also ‘shallow’, but addictive.) But simple can be powerful, and easier to get viral, which is critical critical for a new social service.


Google’s deer hitting car in our neighborhood

Google's deer hitting car in our neighborhood

Image: Taken on Jan 16, 2013.
Well, not exactly the same car of cause, but fearsome all the same! If you don’t know the story yet, here is the link to it.
There are always controversies with the Google Street View Cars. People love Google Maps, especially the street view feature, makes it easier to find the places you’ve never been to before. But people also don’t want Google sniffing around their neighborhood. (Aside from taking street view panorama photos, they also collects WiFi information) That’s why when things like this happens, it went viral instantly.
This is the first time I saw a Google Map Street View car in action. I have to say it’s kinda cool. See that blue sphere on top of the pole? I believe that’s the panorama camera they use. And the car is painted with a Google Map on it!


My love and lost with Instagram

My first Instagram photo

Image: Sunset near the apartment I used to live.

I was doing some ‘house cleaning’ of my photos today and this one came to my attention. This is my first Instagram photo. I believe it’s very early, nearly half a year after they released Instagram. Now looking at it from a better photographer (I hope) point of view, its composition is bad, no proper cropping, and wrong focus (on the car and not the sunset). But this photo reminds me a lot about what Instagram used to mean to me and that so much has changed.

I can’t say I’m a professional photographer, but I definitely learned a lot since then and enjoying every moment of the journey. And it’s Instagram that brought out my inner artist. Started by shooting snapshots here and there for fun, I  explored other’s photos and amazed by how great some people can do with the same app, same device I have. Intrigued, I started to learn how it’s done. I read blogs, bought photographer books, purchased by first DSLR, took photo walk with friends, etc. I steadily grow my followers on Instagram to 400+(not much I know, but I had a lot of fun communicating with them). You have to say, the social part of Instagram did encouraged me to be a better photographer. I could get instant feedback on whether my recent work has any major flaw, how to improve, and a lot of kind encouragement. Then Facebook happened, they bought Instagram. That’s a big thing to me, I just don’t trust Facebook. The appeal of Instagram is that it is a somewhat niche community, focus on photography and real live photo streams. No commercials, no ads, no ‘you might want to check this link’ kind of search results, just love for photography and share of everybody’s life moments. Facebook bought Instagram for 1 billion, and I believe they’ll definitely find some ways to get the money back, and that’ll ruin the whole thing for me.

So I quit Instagram and several months later only found out that more people are leaving due to the Terms of Service change they made. Sad sad to hear. I still love my photography journey, it’s just that it will be without Instagram, for now at least.


Image:  Most liked photo on my Instagram