Validate product design ideas with wireframes

simonmccade.com

20 points·smccade··3 comments

Reading the book Creative Selection [1], by an early iPhone software engineer describing the development of the software keyboard, cemented my existing belief in working demos over wireframes.

A lot of what makes some UI great over others is little details in interaction design (subtle animations), color choices, typography, and live content that is very difficult to replicate in wireframes. Users have an emotional response to UI and that's what you want to "measure". Next to impossible to do that with static wireframes. I think all great UI designers should be able to code their designs, gone are the days of separate photoshop/indesign -> code steps, at least until the UI matures.

That said, wireframes are a great tool during product ideation and design. I like paper+pencil as a wire framing tool, and then go straight to working UI.

[1] https://www.amazon.com/Creative-Selection-Inside-Apples-Proc...

You can make great wireframes on paper, but it doesn’t scale very well. Get more than one person working on it, and more than a few pages and you start running into trouble. I worked on one complete travesty of a project once where the core requirements were 100 pages of stapled together, doodle covered wireframes that were passed around the office for months.

Agreed, which is why I think going to version controlled, working UI code ASAP is key. Also my views are for super early UI design and development. For a mature UI like existing Uber or Airbnb app where larger teams (more than a couple people) are designing each little piece, makes sense to have more steps in the process and tooling like Figma to support it.

Reply on news.ycombinator.com