Suppose you're sitting at Starbucks with your corporate architect to discuss plans for an office renovation. You grab a napkin and start sketching desktops and conference areas with your pen. Some of the lines don't show up, and the napkin bunches up and tears, but you're quite pleased with your rendering--until you catch sight of your architect rolling her eyes.
Same goes for creating or redesigning your company's website. You can produce a forest of Post-it notes along with crude renderings in an attempt to communicate your point. Or you can employ sophisticated online wireframing tools or software to translate your vision into a website prototype.
Tools for Framing
While you can certainly use just about any graphics application to wireframe a website, more feature-rich options are available, including:
• Protoshare: Robust online wireframing tool that allows you to create rich, interactive website prototypes that you can share and collaborate on with others.
• Gliffy: Online diagramming tool with an intuitive interface.
• OmniGraffle: Mac-friendly software for wireframing.
• LucidChart: Create, collaborate on and publish highly polished wireframes online.
• Axure RP: Wireframing software for both the PC and Mac.
A wireframe--a stripped-down visual representation of a web page--helps you identify usability problems and market positioning opportunities early on, before you sink a lot of money into graphic design and programming. Until relatively recently, wireframes were in the sole domain of professional web designers. But today you can find dozens of wireframing tools online (see box), all with a free trial period, that simplify the process.
No real expertise is required to wireframe your site. Use the online tools to convey your ideas of what the site should look like and include. Because you're not a designer, you're not aiming for perfection; you're simply trying to convey a starting point that includes elements you feel are key to telling your story, positioning your company or brand, or drawing attention to a call to action or navigation scheme that is important to you. Your web designer will take it from there.
"I love it when clients provide wireframes," says Jerry Chrisman, owner of Grip Media, a graphic design and web development agency in Portland, Ore. "It helps me get a better idea of exactly what the client wants, and it speeds up development and avoids unnecessary complications."
So do yourself and your designer a favor. Wireframe your site before heading out to that meeting at Starbucks.
Same goes for creating or redesigning your company's website. You can produce a forest of Post-it notes along with crude renderings in an attempt to communicate your point. Or you can employ sophisticated online wireframing tools or software to translate your vision into a website prototype.
Tools for Framing
While you can certainly use just about any graphics application to wireframe a website, more feature-rich options are available, including:
• Protoshare: Robust online wireframing tool that allows you to create rich, interactive website prototypes that you can share and collaborate on with others.
• Gliffy: Online diagramming tool with an intuitive interface.
• OmniGraffle: Mac-friendly software for wireframing.
• LucidChart: Create, collaborate on and publish highly polished wireframes online.
• Axure RP: Wireframing software for both the PC and Mac.
A wireframe--a stripped-down visual representation of a web page--helps you identify usability problems and market positioning opportunities early on, before you sink a lot of money into graphic design and programming. Until relatively recently, wireframes were in the sole domain of professional web designers. But today you can find dozens of wireframing tools online (see box), all with a free trial period, that simplify the process.
No real expertise is required to wireframe your site. Use the online tools to convey your ideas of what the site should look like and include. Because you're not a designer, you're not aiming for perfection; you're simply trying to convey a starting point that includes elements you feel are key to telling your story, positioning your company or brand, or drawing attention to a call to action or navigation scheme that is important to you. Your web designer will take it from there.
"I love it when clients provide wireframes," says Jerry Chrisman, owner of Grip Media, a graphic design and web development agency in Portland, Ore. "It helps me get a better idea of exactly what the client wants, and it speeds up development and avoids unnecessary complications."
So do yourself and your designer a favor. Wireframe your site before heading out to that meeting at Starbucks.