Create Screen Mockups & Web Page Prototypes in Firefox with Pencil

With Firefox, you can do much more than simply browse web pages. Pencil is a free add-in that lets anyone sketch complex GUI screens or web page prototypes in Firefox without even being a graphic designer. 

firefox webpage design

Pencil includes a set of stencils that you can place on the drawing campus. Right click a shape to edit basic properties like color, border, opacity, etc. Alternatively, you may also drag images from the desktop.

Like other illustration software, these shapes can aligned with each other or can be grouped to prevent accidental edits. The drawing can be exported as a PNG image.

The Pencil Project - Thanks Ray Cheung

Related: Create Mockup Screens with Yahoo Stencils

Find this article at: http://www.labnol.org/internet/design/firefox-for-screen-mockups-web-page-prototypes/3978/

web: http://www.labnol.org/ email: amit@labnol.org


Reader Comments

thank you for this post.

can i know what are the file types which is supported?

Amit, ignore my previous comment, after installing it , I found it to be an amazing tool . At just 388Kb , it packs quite a bunch and works smoothly. Powerful and a great WYSIWYG tool for designers.

Looks quite interesting … this can be used for quick prototyping to show quick UI mockups to clients so they get an idea

things like grid layouts etc would have helped
but defi a good product and its FREE !

Thank you, for the information. Love those Foxfire add-on. Really very useful.

This is incredible. Thanks for sharing this piece of information with us.

This looks cool!

Google Custom Search