Welcome to the ProtoShare blog.

Design and Development: Best Practices

You may enjoy this.

Posted in Blog, Industry | Leave a comment

Getting IE8 to Work with the Bootstrap CDN

I recently did some work to get the website of another Site9 product, Two Minute Mobile, looking right in IE8. To do that, I needed to get the so-called “RespondJS proxy” to work with the Bootstrap CDN. The Bootstrap docs and RespondJS docs cover this pretty well, but it’s all a bit generalized. Here are actual steps to configure the proxy:

  1. In the head section of your page, change the URL for the Bootstrap CSS file to use the CDN:
    <link href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css" rel="stylesheet">
  2. Inside the conditional-comment section for IE8, after the existing code for RespondJS, add the RespondJS proxy:
    <link href="//netdna.bootstrapcdn.com/respond-proxy.html" id="respond-proxy" rel="respond-proxy">
    <link href="/vendor/respondjs/respond.proxy.gif" id="respond-redirect" rel="respond-redirect">
    <script src="/vendor/respondjs/respond.proxy.js"></script>
  3. Add the RespondJS proxy files (1, 2) to the “/vendor/respondjs/” folder of your website. (You’ll probably need to create this folder.)

The important thing to note is that the RespondJS proxy needs three files to work correctly: a GIF file and a JavaScript file on your domain, and an HTML file on the CDN.

When you’re finished you should have something like this in your page source:

<head>
    …

    <link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css" media="all">

    <!--[if lt IE 9]>
        <script src="//oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
        <script src="//oss.maxcdn.com/libs/respond.js/1.3.0/respond.min.js"></script>

        <link href="//netdna.bootstrapcdn.com/respond-proxy.html" id="respond-proxy" rel="respond-proxy">
        <link href="/vendor/respondjs/respond.proxy.gif" id="respond-redirect" rel="respond-redirect">
        <script src="/vendor/respondjs/respond.proxy.js"></script>
    <![endif]-->

    …
</head>

Except for a few unsupported visual effects, and a slight initial delay before RespondJS kicks in, Bootstrap works pretty well for us in IE8. Performance of the Two Minute Mobile website is crucial to us, and the ability to use a content delivery network to boost speed while still supporting IE8 is a big win.

Posted in Blog, Industry | Leave a comment

Some Insight from Forrester Research

For those of you with access to Forrester Research reports, you may be interested in a report they just published called “Responsive Web Mockup and Prototyping Tools Can Help Repair the Design Development Rift.”  The report is also available here.

We were happy to provide information to Forrester Research in helping them prepare the report.

Posted in Blog, Prototyping Benefits | Leave a comment

6 Reasons To Use ProtoShare Even If You Can Code

There are some voices today who say you should skip prototyping and just start building. Particularly with frameworks such as Bootstrap, coding up responsive layouts is quicker than it was before these libraries were available.  While I’ll avoid saying ‘always’ or ‘never’, I will say the vast majority of the time, it pays to use a rapid prototyping tool instead of just starting to code.  Here are my main reasons:

1)  Coding is always slower.  I don’t care how fast of a coder you are, using ProtoShare’s drag and drop interface with a bunch of pre-built templates is much faster than slinging code.  I’ve written a decent number of Bootstrap layouts, and while they are pretty reasonable to create, it still takes time to tweak your columns, adjust your content and get everything working the way you want it.

2)  Coding locks you in, fast.  When you invest time building and testing a coded prototype, it gets harder and harder to step back and take a brand new approach.  Radical changes mean starting from scratch.  Even if coding were only a small fraction harder than using ProtoShare, over many iterations, the weight of that effort builds up, and you end up defending the existing code over solving other user experiences issues.

3) It’s way easier than you think to break responsive frameworks.  Once you’re in Bootstrap tweaking, overriding styles, adding and stripping out various functionality, it’s pretty easy to mangle the different breakpoints.   When you do, you’ll spend time fixing the issues at every conceivable breakpoint.

4) Coding freezes out your non-coding partners.  When the prototyping process is open to more than just developers, you empower your UX’ers, designers and other stakeholders to really get involved in the process.

5) If you’re using ProtoShare, you can lend your technical expertise to non-coders.  Educating all of your stakeholders about what’s easy, what’s hard and what’s possible on a project allows them to make better decisions about what solutions to settle on.  It’s a great opportunity to raise the level of your team, and it’s faster and more productive than trying to teach them to code.

6) You’re going to throw away 90% of the code you write anyway.  If the extra effort of coding meant you pushed the final coded prototype right to production, it would be hard to argue that the extra effort wouldn’t be worth it.  But you won’t.  First of all, you’re iterating, so you will consciously dump much of your work.  Secondly, you’re trying to build and iterate fast, which leads to (justifiably) cutting corners.  Realistically, you’ll either need a major clean-up effort when you’re done, or you’ll just re-implement the solution from scratch.

I’m not saying that you should never ‘prototype’ in code.  We do it all the time.  But we do it after we’ve ideated, collaborated, prototyped, tested, iterated, reviewed and reworked. Then we code, test and iterate some more.  The purpose of prototyping isn’t to completely eliminate any rework or iteration in the build phase, its to minimize it. By using ProtoShare, and iterating and collaborating early,  you’ll eliminate hours, days or weeks of effort spent carefully crafting the wrong solution.

Posted in Blog, Prototyping Benefits | Leave a comment

ProtoShare Comes from Portlandia

As many of you know, ProtoShare comes from Portland, Oregon. We’re proud of our hometown, but it does have its quirks.

Many of you may watch the IFC series Portlandia, which nicely makes fun of Portland (and, more broadly, hipster culture in general).

The latest entry into the “Keep Portland Weird” sweepstakes is a list in the local paper (which is no longer actually a paper most days, but that is another story) of the “Top 11 Things You Will Never Hear a Real Portlander Say“.

A few of the items are inside jokes (like number 5 on the service speed at a local group of brewpubs) or obscure sports references from the ’80s (like number 2, referring to the Trail Blazers’ drafting of Kentucky center Sam Bowie over, now-Hall of Famer and multiple product pitch-man, Michael Jordan.

I have a hunch many of these are not unique to Portland, but thought I’d pass them on to give you a sense for ProtoShare’s hometown.

Posted in Blog | Leave a comment