iPhone

https://www.flinto.com/p/d27b1cb0

 

Android

https://www.flinto.com/p/8eaa6f39

Visit these links & follow the instructions to install a

Rapid Interactive Protoype

Add to homescreen on Andriod

 How Designers Can Embrace The Need For Speed

Rapid Interactive

Prototyping

http://uxisnotui.com

Paper Prototypes

You need this guy.

High Fidelity Prototypes

You need this guy.

The Agile Manifesto states a preference for “Working software over comprehensive documentation”.

 

So how can designers minimize waste?

By ditching static deliverables and moving quickly to a working prototype. 

But I don't write code.

No coding skills required.

Why RIP?

2. Less time managing documentation

1. Increase communication and clarity

3. Easily manage distribution

4. Create a feedback loop

5. Speed up development

6. More time designing

Communication

& Clarity

Enter the Functional Spec.

A designers job

is to reduce abstraction

as quickly as possible.

Talking about music

is like dancing about architecture.

Writing about software is like…​

???

Holt: measuring a tornado.

Me: Thanks buddy. Yer cute.

Writing about software is like…​

Holt Mansfield - Senior Developer

What I use to think a low fidelity mockup looked like.

Mid-fidelity?

Text

Lot's of hands

High-fidelity?

More hands.

I soon realized that adding more fidelity was not increase clarity.

This user flow changed my mind about a lot of things.

But why?

  1. It was fast
  2. It was clear
  3. It was easy to understand
  4. It prevented over designing/wasting time
  5. It was a step away from abstraction

But really this is too still overly designed

Fast forward a few projects and...

This took about an hour and the entire apps flow was mapped.

...this is what the starting point for design looks like.

Now that we understand the system we can start iterative design.

There is no substitute for interacting with a design on a touch device.

The ergonomics of the UI must be touched, tapped and swiped on the device to be fully understood.

Time to for some RIP

Summary - Communication and Clarity

  1. Our goal is to move away from abstraction as quickly as possible.
     
  2. A Rapid Interactive Prototype is so close to a functional piece of software that the level of abstraction is almost non-existent.
     
  3. This creates a high level of clarity for everyone involved. Allowing for less incidents of communication breakdown.

Managing Documentation & 

Distribution

The Designers Equivalent of Version Control Hell

RIP allows for a single file source for the team

Updating one set of files in a cloud storage system pushes changes to the entire team.

Summary - Managing Documentation

  1. Any time spent managing documentation is design time that has been lost.
     
  2. Giving files version numbers for static deliverables quickly becomes painful to manage.
     
  3. Use a version control system that works best for you. Dropbox, Google Drive, Layer Vault ect.

Workflow &

Platform Agnostic

Claudia: Do I have to learn a new design program!

Me: No. Choose your weapon. Speed wins.

Claudia Reinoza  - Designer/Front-End Dev

What is your weapon of choice?

These particular prototyping tools are workflow & platform agnostic

Wait. What?

Photoshop is not dead

Illustrator is not the best

Sketch is not the perfect solution

Even the lowly Pencil gains super powers

Balsamiq is not the fastest

Choose your weapon

Whatever allows YOU to design fastest wins.

From Pencil sketch to wireframe.

Summary - Workflow & Platform Agnostic

  1. These programs can integrate very easily with almost any design workflow.
     
  2. Choose your preferred design application. Speed wins.
     
  3. If it exports to PNG, JPG or GIF files you're good to go.
     
  4. Pencil + Rapid Interactive Prototype can be a lot of fun.

Design Feedback Loop

Design Feedback Loop

InVision let's you collect feedback.

Faster

Development

Create a very convincing prototype

that would fool most users with

ZERO DEVELOPMENT TIME

  1. The RIP becomes the documentation for development. A picture is worth a thousand words. A interactive prototype is worth a million words? Maybe a billion?
     

  2. Everyone is viewing the same source file and has a deeper understanding of the system being designed. 
     

  3. It can be augmented by the functional spec, broken out into stories for an agile team, and used as traditional static deliverables when needed.

Summary - Faster Development

Dean: Yeah but can you export code?

Mike: Nothing yet Dean...

Dean Gossi - COO

@mikecostanzo

Rapid Interactive Prototyping

By Mike Costanzo

Rapid Interactive Prototyping

Designing for the Web has become increasingly complex; the rise of HTML5 web apps, responsive design, adaptive design, etc. has made static mock-ups redundant and the trend toward lean and agile development methodologies can create a hostile environment for designers who are often left feeling rushed, disorganized and overwhelmed. But there is hope. Many new tools are now available to deal with designing in this dynamic landscape. We'll look at some and evaluate the advantages and limitations of each while discussing how they can be integrated into the workflow. These tools not only allow for faster design but also facilitate rapid iteration, concept evaluation and the creation of clear deliverables to distribute to product owners and team members, in turn, leaving more time to design a holistic product.

  • 792