Wire-framing has long been a part of the technical product workflow, aging back to the late 90’s when early websites and web apps were started in raw pencil and paper.
Those days are over… for smart UX folks at least. In other words, if you’re still wire-framing by hand or by tool, you’re doing it wrong.
That’s a bold statement – I know. But hear me out.
1. Speed
Wire-framing takes time. Even if you use modern and progressive tools like invision or UXPin, you’re still incurring time spent in those tools before you actually start building your experience (in web or native fashion). Time to design, time to manage, time to export, etc. To be competitive in today’s tech pace, especially start-up pace, you simple don’t have that time. Period.
2. The Role of UX Engineers
If you haven’t hired [or met] a UX engineer you should post a job ad today. True UX engineers are capable of rapidly prototyping HTML/CSS that provides the early user experiences that wire-frames cannot. The good UX engineers usually have JavaScript chops as well, which get you very close to production ready experiences. And the great UX engineers will help you architect systems that use or salvage 90% of their prototyping code. Go find these people today. Seriously.
3. Media Landscape
The media landscape by which we experience things has changed drastically within the last couple decades… and it continues to evolve at an exponential pace. These experiences become less and less static every day. Color, animations, and transitions are a core part of the competitive UX. So starting them as static experiences is just dumb. We should be thinking about them progressively – jump right into the HTML/CSS/JavaScript that will power your end experience, and refine it as you learn and explore.
So… It’s Time to Switch
Now I know what you’re thinking… “Our organization is too BIG to embrace this shift… we have 30 UX designers!” If that’s the case, teach them how to code front-end. Empower them to be modern designers who can replicate their vision in the proper medium. If they’re not interested in learning, find someone who is. Traditional UX designers will only slow you down. It’s a harsh statement – but it’s true.
Get rid of wire-framing to embrace faster, more efficient product development. You won’t regret it.
Ali Jafarian
Ali is a father, husband and serial entrepreneur with a deep drive to create. He writes, records, codes and builds things to inspire the artist in all of us.
I have all the things happened the other way around. I liked to prototyping directly into my browser on frameworks such as Bootstrap or Foundation. In fact it was a “live work” on the “live site”. I and my customers immediately saw all that was happening!
But then I thought – “no, I’m doing something wrong.” Because there are a lot of special tools for prototyping, such as Ninja Mock, etc .. So, I must use these tools, it will be “the expert handwriting” – so I thought.
And I started to use web prototyping tools. But I felt like I was doing something superfluous. This prototyping alienated me from the real site, it created an extra “layer” between me and developed site.
In the end, I gave up on wireframe tools. Because prototyping on Bootstrap and similar CSS-frameworks is not difficult, and even easier and clearer then wireframe prototyping.