Origami: a free "Photoshop" to interactive design - MacRadar

Many are able to evaluate how lively and dynamic interface of the new Facebook iOS-application. To design this whole animation, static images, layouts enough. That is why the Facebook developers have created a first of its kind tool for developing interactive design - and share it with the world. Is free.

Although in terms of functionality is still virgin nepahannoe, on the part of the interactivity Paper application feysbuchnoe in fact, it turned out, without exaggeration, a new generation of interactive product. Here statuses tape turned into a strip cards, which are stylishly and comfortably not only blocks of text, but also pictures, and videos, and links to external web resources. And the main way to interact with all this variety reinterpreted - touch gestures and tilting your device from side to side. Latest in Paper designed for wide viewing photos which do not fit on the screen without zooming ayfon to black bars top and bottom.

Paper is part of a new initiative, voiced recently by Mark Tsukkerbergom. Its essence - to present a huge social network as a set of stand-alone applications that allow "Facebook" not offering users the root service Facebook, to compete with the new social media and news projects.

But if the Paper was the subject of heated discussions among the masses, and a new initiative Tsukkerberga interested in more business analysts and TechnoExpert, something about the Origami project, as a percentage, know exactly few.

By creating this tool, Facebook developers have significantly simplified and accelerated the process of software interface design, including "live" component - interactivity. And for Origami does not require a single line of code.

http://vimeo.com/85421325

"Before using Origami We design in" Photoshop "- it was a pack of static, arranged one behind the other pictures. As such, we showed them the leadership and with each other, - says designer Facebook Brandon Uokin products. - I think this approach is reflected in the work and on our products. "

Compared to Photoshop, Origami is as perfect as it is Paper, if it is compared with the standard Facebook application.

Origami has allowed designers to create one of the hardest animated elements Paper, which has never been associated with the Facebook interface - Disclosure booklet for download links to the news. It is important to note that the animation is not a pattern of Origami - it really interactive, always tied to your finger, while the three-dimensional lighting system adds a picture depths. Not bad for a small fragment of the application, which was created in just half an hour.

For the most part Origami - the brainchild Uokina and his friend, designer Drew Hamlin. Its creation began nine months ago, just as part of the work on the Paper. As soon as the project becomes more complex, more options appear in Origami. In essence, each animation Paper was first designed in Origami, and only then Facebook programmers to implement it in the application.

However, Origami was created from scratch. In fact it is a special extension for Quartz Composer, a free Apple application that has traditionally been used to create a simple animation. The problem is that Quartz Composer was never intended for the development of interactive design, so the Facebook team gradually created their own add-ons and modifications.

It was made many practical changes such as creating patterns by which Quartz began to speak in the language of pixels, for designers much clearer. Also, the developers have tried to make the product itself less intimidating and more convenient.

"Actually, we spent a lot of time and effort to make the terminology and organizing more convenient and friendly, so that even the students are not there is a feeling of something confusing and overly technical, - says Uokin. An excellent example of what they have done - paving the way system that is set to only two points, and the rest is automatically calculated. Handy thing for a quick animation of moving objects on the screen. In the language of Quartz Composer it is called linear interpolation. In Facebook is also called transition - implying that this effect the designer will use to navigate through the screens. It is interesting that over the term "transition" designers racked their brains for three weeks, but they are convinced that the time was well spent.

The Facebook firmly believe, Origami that can also be used in the training process in preparation young designers, so that they originally learned to think in terms of interactive rather than static design. Yes, and designers in the most Facebook is now a mandatory master Quartz Composer and Origami.

Skeptics might ask if Facebook worth giving this tool to all comers? It is, after all, the business of business. If Origami is really to be the next step in the development means rapid development of interfaces, whether the company was worth close to Origami internal use, thus providing a competitive advantage in terms of Twitter and other social applications and platforms Media?

"I am absolutely sure that if as a competitive advantage is taken of working tools, eventually you will lose - said Hamlin. - We want Facebook design was cool, but do not want this to be achieved only through a cool tool. Better to let the design will be different due to the first-class solutions and tasks thanks to the confidence that your work is the best in the world. "

download Origami