[dorseymike]

This is a really helpful outline.

I like your idea of keeping a "features" list and "questions" list separate. Otherwise, it gets confusing when the two get jumbled together.

One tool that most hardcore engineers chuckle at - but that I love for the higher fidelity mockups - is using Keynote/Powerpoint. It is extremely fast to make things like buttons, move text around, etc.

Most importantly, these tools make super easy to make a duplicate of any view and completely overhaul the layout...giving the ability to show users A/B options for the same slide.

Finally, it's easy to export the entire "app" mockup as one PDF file (made of many slides) and share all the mockups with users. I like it as a last step before diving into actual CSS/HTML. I like this more than Balsmiq because it lets me get closer to pixel perfect before I start coding - emphasis on actual look & feel, vs functionality (which balsamiq is probably faster at depicting).

Anyway, great writeup, thx for sharing.

[saraid216]

I've known about this method for a long while (back as early as 2004), but I've always found it easier to actually mock it up in HTML/CSS and then make changes on the fly. It might be my personal skill level that makes the difference, but it worked out better for me.

(My favorite design sessions remain the ones where I sat in a room, projecting my laptop onto a screen, and speed-editing CSS and PHP while my boss made suggestions at the front of the room. And then I'd go, "So, like this?" and refresh.)

Not really recommending it so much as saying it's a thing that can be done.

[dorseymike]

Yeah that's a good point. Your approach is getting easier and easier now with stuff like Bootstrap washing away CSS complexity...