Wireframing: Simpler Than It Sounds

I admit it. When I heard we’d be learning how to wireframe at AC4D, I was intimidated. Sounds like architecture, sounds like engineering, sounds, difficult. In actuality, wireframes are just sketches of a digital product, typically an app or website.

Designers, like writers, artists, and 147 other professions, make a draft before they create the real thing. Forgive the sarcasm, but there’s not much original or scientific about this process. But that doesn’t mean it’s easy, only that there’s not one right way to do wireframing.

In my assignment of redesigning the Ally Bank app, I began with simple sketches, and later drafted them in Sketch, the digital design program. The point is to create a “good-enough” prototype focusing on flow, rather than look-and-feel. From here, I plan on linking screens together, so that I can test my re-design with prospective users. I hope to answer: Will my redesign provide a simpler way to deposit a check? How clear is my navigation?

These and other questions will be answered once my prototype is in front of real users.

Hand drawn and digitized wireframes of two Ally Bank app functions
Hand drawn and digitized wireframes of two Ally Bank app functions