Framer Studio 1.5 (Framer.js)

Today we are happy to announce Framer Studio 1.5. The main focus of this release is a new, native code editor that makes working on your prototypes faster and better. This rewrite allows us to control every aspect of the editor, so we can add more advanced features in the future.

We updated the app to work great on Yosemite, fixing all currently known issues. And a fresh look for the icons make Framer Studio fit right in.

framer-studio-1.5


source

Font Awesome Symbols for Sketch

It’s all the goodness of Font Awesome in easily accessible symbols crafted specifically for Sketch 3!

Just go to Insert > Symbols and choose the Font Awesome icon you’d like to include. The icons are organized alphabetically and aliases are included.

You can safely delete the Instructions artboard and/or page and start your own Sketch project with the power of Font Awesome!

source

Framer Studio – Rapid Prototyping (Framer.js)

Framer Studio is built on Framer.js, an open source framework for rapid prototyping. Framer allows you to define animations and interactions. It runs on mobile devices, too.

Generate
Generate assets out of Sketch and Photoshop to set up new projects.

Animate
Animate any layer in 3D space with spring physics and bezier curves.

Perform
Hardware accelerated for high framerates, with CSS Transforms.

Flexible
Works on desktop, mobile and tablets. Plays well with WebKit.

source

Learn Sketch 3

Sketch uses one unit, styles only relevant to UI design, a built-in iPhone previewing tool called Mirror and Artboards, the most efficient way to template multiple screens.

Design isn’t hard to learn. That’s because most of us are already building products and are familiar with what design means. What used to be complex and confusing is now simple and effective, thanks to Sketch, an app that is entirely focused on user interface design. Unlike Photoshop, you don’t need to worry about photo editing and the hundreds of other settings that are noises to designing a simple application.

source

Design with Swift

Learn UI and animations using Swift.

Swift is much easier to follow, especially if you’ve never done iOS development before. This chapter is for designers and complete beginners… I will focus on executing simple user interfaces and powerful animations instead of the language itself, which can be read in the Swift iBooks. You don’t need to have read the book before this chapter. I’ll include all the important information for designers.

source

Flinto – iPhone, iPad and Android Prototyping

Like Marvelapp but more features and more expensive.

The App Design Process is Broken
It’s easy to catch issues in your design when you are testing an interactive prototype. Problem is, that usually doesn’t happen until development starts. At that point, it’s too late to fix things.

Fix it With Flinto
You’ll be testing interactive prototypes from the start. Flinto makes it quick and easy to create prototypes that look just like the real thing. And Flinto doesn’t disrupt your current workflow because it uses the screens you’ve already designed.

source

Famou.us – Javascript Library for iOS Animations

Famo.us is a free, open source JavaScript framework for creating smooth, complex UIs for any screen.

Famo.us is the only JavaScript framework that includes an open source 3D layout engine fully integrated with a 3D physics animation engine that can render to DOM, Canvas, or WebGL.

Choosing a development platform is more than just a technical decision—it’s a career decision. Whether you’re a seasoned developer expanding your skills, a designer looking to bring your ideas to life, or just learning to code, we’re building Famo.us for you.

Getting started is easy. Famo.us University will teach you to code in Famo.us with lessons, live code examples, and real app projects. And the Famo.us community is always here when you need help.

source

Ideo – Introducing Avocado: A new toolbox for interaction designers

Interaction design for non-coders. Mobile-only?

Bounce, swivel, spin. Today’s interface design is all about making things move. But the tools we use to create those interactions haven’t kept pace with our smart, intuitive enough for a 3-year-old child devices.

As an interaction designer with a software engineering background, I usually bring ideas to life through coding.

For those who don’t code, there are tools that offer a less technical approach, such as Quartz Composer (a nearly decade old visual programming language) and Origami (a new tool built by Facebook that streamlines Quartz Composer).

The effort to make interaction design accessible to a broader set of people is a worthy cause, and crucial to the fast-paced live prototyping process at IDEO. That set me on a path to explore a new set of prototyping tools—ones that work for designers who don’t code.

Taken together, Quartz Composer and Origami offer a set of basic interface building blocks called patches. It’s an inspired start, and I saw ways to build upon those tools and conceal some of their complexity. http://facebook.github.io/origami/

source