Friday, September 16, 2016

The Great Prototyping Debate: Software vs Hand-coding

We all know that prototyping is a super-useful technique, but sometimes it’s hard to get the balance right. There seem to be two main 'schools of thoughts' on the best approach.

School of Thought 1:

We love Invision/MarvelApp/Adobe XD/etc

These visual prototyping tools are fantastic for producing rock-solid prototypes quickly and with a minimum of fuss. You often import externally produced layouts into them and attach user flow and behaviors to the UI components

However, if you want to model a UI behavior that is a little outside the standard moves, your options may be limited.

School of Thought 2:

We always code our prototypes in HTML from scratch

This approach gives you complete flexibility and power over your prototype design decisions. But it is inevitably slower and requires an unusual combination of code and design skill.

Maybe you can have the best of both? Recently I’ve been using an app called Pingendo.

What is Pingendo?

Pingendo is a free visual prototyping tool. You can download the Desktop version (OSX, Win, and Linux) but there’s a perfectly useful Chrome-based version too.

You can begin with one of the preset templates or a blank canvas. Pick one.

Pingendo : Pick a template

Larger prebuilt UI sections are listed on the lefthand SECTIONS panel. These include top-level page elements such as:

Themed UI elements

  • Hero panels
  • Footers
  • 3 column layouts
  • Image galleries

One nice touch: Pingendo has themed placeholder images – food, tech, people etc – so you can match the feel of your final content more closely. Clicking the icons at the top of the panel switches the theme.

The COMPONENTS panel behind it contains a catalog of smaller UI components such as headings, text fields, maps, buttons. and lists.

Pingendo

Continue reading %The Great Prototyping Debate: Software vs Hand-coding%


by Alex Walker via SitePoint

No comments:

Post a Comment