Project Example: Medical-Tools.com
Wireframes and Mockups
Wireframes are simple sketches on paper, similar to floor plans in architecture, and show how a website would look like. Wireframes are drawn to understand web-canvas space, its distribution into sections, navigation and number of elements that will appear on a page.
For Medial-Tools.com, it was important to add features to its existing template which was built using smarty-template files and used tabular layout. Therefore new sections and additional functionality was built around the existing components and when necessary, old components were improved.
After careful analysis, following wireframes were drawn.

Prototypes
For the interactive elements, like accordion on the products page, footer navigation and components were built and tested separately using standard HTML/CSS/JQuery files and then plugged into the existing smarty templates.

