Features   -   Download   -   Buy now   -   Get it for free!   -   FAQ   -   Help   -   Testimonials
How it looks
Napkee has three main areas: the top bar, where you can set a name for your current project and the nature of the project itself, a side bar to manage the list of the project files and to export the current project and the big preview area where you can have a quick look at the result before exporting.

Mainwindow
The top bar

Topbar
Here you can write the name of the project you are working on and choose between web and flex by clicking on one of the two buttons on the right side. Changing the project nature means changing the type of source code you can export from Napkee.

The side bar

From the side bar you can add BMML files (clicking on the green icon), remove them (red icon next to every single file) and reorganize them by simply dragging a file up or down.
Sidebar
In this part of application you can also find the Export Project button.

The preview panels

Mainpanel
The tabs you see here are taken from the Flex nature. Both project natures, beside the source code tabs (HTML, JS and CSS for web, MXML and AS for flex), include the source code of the mockup file and the preview of what you get when you export the project you are working on.



Preferences
To access the Preferences window on a Mac, click on "Napkee / Preferences" or if you are on Windows or Linux click on "Tools / Preferences". In there you have three tabs that allow you to modify the behavior of Napkee or the appearance of the generated code.

Fonts: this is how you can get rid of Comic Sans from the exported files!

Fonts


Export settings: every single component which is rendered by Napkee has a unique identifier made of some letters and a progressive number (in case you haven't set it on Balsamiq Mockups, on custom properties). In Components prefix you can set the starting letters of every component name.
Tick the first checkbox if you want Napkee to open the result of the export every time you click on the Export Project button and tick the second one if you want Napkee to skip the Markup components (Arrow, Callout, Comment, Geometric Shape, Horizontal and Vertical curly brace, Rex X, Scratch-out).

Export settings


HTML settings: in here you can change the default page title of what Napkee exports, the name of the icons folder and add an additional CSS file that will be included in the exported project.

HTML settings


Flex settings: the Flex 3 project nature allows you to choose between generating a web application or an AIR application with the Flex export and to set the target IDE (Flex Builder 3 or FDT 3). Tick the first checkbox if you want Napkee to open the result of the export every time you click on the Export Project button and tick the second one if you want Napkee to render a green box for the components that are not supported yet.

Flex settings


Software updates: In this tab you can tell Napkee to look for a software update every time it gets launched. Just tick on the checkbox and click on Save.

Software updates


Webcam: from this you can tell your Flash player to allow Napkee to use your webcam so you can see the live preview on the exported mockups! Just follow the instructions and you are ready to go.

Webcam




Please don't print me!
At Napkee Labs we care for the environment, that's why we ask you not to print out this web page. If you need to consult help offline, please save this web page.




Balsamiq Mockups get us to the decision point, Napkee opens the door and helps validate our decisions. The process is quick and painless for everyone involved.

Andrew Crowe - webqem