Let’s Break Down Facebook Paper’s UI/UX

In case you haven’t heard, Facebook released a new app called Paper on February 3rd, 2014. Once we got our hands on the app, (get it here), we instantly noticed a minimalist design, awesome animations, and an emphasis on gestures. As mobile designers and developers, it’s so much fun to see Facebook really push the limits of what a native app can do.

Let’s check out some of our favorite animations and gestures:

Look at this minimalist design in action. Compare this to your existing Facebook newsfeed!

Facebook Paper - Minimal

We’re seeing basic gestures and animations in Paper – things like swipe and scroll. But, we’re also seeing some brand new animations for Facebook and iOS in general.

Facebook Paper - Swipe

Panoramic view of HD photos. We’ve never seen anything quite like this on iOS!

Facebook Paper - Panoramic

Here’s on of my personal favorites – a drop down menu to access your profile, write new posts and access settings. This kind of menu is traditionally hidden on the left or right as a slider.

Facebook Paper - Pull Down

Scrolling through an album of headlines for viewing in your “Paper”. Notice how the album scrolls in a wheel-type pattern. That slight angle of rotation really adds character.

Facebook Paper - Headline Scroll

Drag and drop can be very difficult to pull off on mobile screens. With such limited screen real-estate it’s hard to accurately pick up an object and place it in another location. But, in this case, I think Facebook did a good job of ensuring the user is dragging a large item and has a clear drop destination.

Facebook Paper - Drag and Drop

And here is my personal favorite, pressing the hamburger on the settings menu. I really like how the next menu springs into place. It just feels fun!

Facebook Paper - Settings Menu

Now that Paper is here, what do you think? Are you excited about Paper’s UI? Follow us on Twitter and let us know!

Post your thoughts