A few weeks ago, I began noticing these strange circles appearing in a horizontally scrolling list at the top of my Instagram feed. I knew that Stories were coming, but I didn't expect the unconsidered presentation.
Instagram has a lot of apps. Each of these is tiny and focused. And yet, the main app is a combination of Flickr, Messenger, and now Snapchat.
The easy fix would have been to break apart the single app into three apps, embracing (if not their own strategy) the multi-app strategy of their parent Facebook. But I wanted to stay in the spirit of the original intention, which I assume is to keep everything together to encourage broader use.
I started by breaking down the high-level features. You have the original "grams" – photos/videos that don't expire that people can like, comment, and share (via a message). Then there are messages, which are photos/videos and/or text shared between individuals or groups. And most recently, there are Stories, which are expiring videos that aggregate per user. Lastly, there are the common features like search and my account.
Let me simplify that a bit: you have photos, stories, and messages. For each of these, you can view or you can add.
Let's start with a critique of the current adding execution. Add Story is in the top left. Add Message can be done from messages, which lives in the top right. Meanwhile, add photo keeps it’s prime location in the lower middle.
This feels like some pretty low hanging fruit.
Now a critique of viewing. Stories can be viewed from the horizontally-scrolling list at the top of home. Photos can be viewed by scrolling vertically – same as always. For messages, there’s that separate section of the app accessed from the little icon in the upper right.
If we can’t have three apps, let’s do the next best thing: three tabs. One for the public, one for the personal, and one for the momentary. I put these at the top, and then used the lower tab bar, now a contextual tab bar, for viewing and adding (and in the case of the traditional stream, viewing reactions).
Because my account is an even higher level, you can switch between multiple accounts here, I put that in the top left, physically and metaphorically above the three “apps”.
Search then moved to the top right, like my account above the tabs, since a search applies to all three “apps”.
The Artificial cares a lot about icons, so I couldn’t help but doing a bit of a redesign here. I wanted all of the add icons to be similar, so I used the outer, recognizable shape as an indicator of what, while putting the traditional plus symbol in the middle to indicate the action.