The Importance of Website Mockups

At HD Interactive, we have created many websites, each with its own unique features.  Because there is so much involved in a website and each one is different, it can be hard for clients and developers to picture how the final site will work.  An easy solution to this problem is a site mockup: a model of the site.

The mockup is especially useful if it is fully functional, meaning links work and pictures and text are included, so that everyone involved understands what needs to be done early on in the project.  The client can review this mockup and suggest any changes before the developers begin coding the site, saving time, energy, and money.

The process of creating a mockup begins with a discussion between the client and the project manager to determine functionality, design, and site layout which is then detailed in a site scope.  Next, the project manager passes the scope off to the project designers or developers who use it to create the mockup with an Adobe AIR application called Balsamiq.  The Balsamiq files are then imported into another AIR application called Napkee, where links are created for the buttons, text links, and forms to link the page mockups together into a functional representation of the website.

If the site is database driven we also use MySQL Workbench to piece together the database and map out the entity relationships properly. This step ties things together on the back-end (the admin and coding side of the site) and ensures the database information is included in the mockup.

When the mockup is complete and the client likes how everything works, we can start creating the real designs in Photoshop and writing the real application code that makes it all work.

We’ve found this process very useful in managing our time and resources and ensuring customer satisfaction, all of which are important to us.

1 Comment

GrandizTimFebruary 1st, 2010 at 6:25 am

Very solid and far-sighted process!
We’re using Axure RP, but the combination of Balsamiq and Napkee is equally good.. Maybe even better, as Balsamiq is fun to work with ))

Leave a comment

Your comment

IT Zertifizierung Prüfung click: http://www.exam-qa.de/  | 210-260  | 70-413  | 70-346  | COG-642  | 250-622  | 350-050  | 642-732  | 500-260  | EX300  | EX200  | 200-101  | C_TAW12_731  | 1Z0-803  | 1Y0-201  | 700-104  | 070-461  | 400-051  | 300-135  | JN0-343  | C_TSCM66_66  | C_TSCM62_65  | MB4-218  | JN0-360  | 300-208  | 9A0-163  | 3002  | 350-001  | JK0-022  | MB2-704  | MB3-465  | CheckPoint 156-706  | 1Z0-060  | 000-172  | 646-393  | HP0-680  | 70-270 pdf  | SY0-401  | VCP550  | 642-104  | 70-532  | ICGB  | C_HANASUP  | IBM C2010-568  | SAP C_TERP10_65  | SAP C_TFIN52_66  | SAP P_HCMTM_64  | C_TBIT44_73  | C_TSCM62_64  | 1Z0-352  | 050-555  | BI0-125  | SAP  | 70-411  | 920-170  | 1Z0-803  | 1Z0-552  | CISA  | MB2-707  | 640-911  | 070-685  | SDM_2002001030  | SAP C_TADM51702  | IBM 000-623  | 1Y0-201  | 74-678  | MB3-210  | 070-654  | 310-232  | 9A0-055  | 350-001  | 630-008  | 412-79V8  | JN0-102  | A4040-224  | 070-461  | M70-101  |