Some inspiration found on my pinterest boards
A really good pdf about learning how to make wireframes
I have a Pinterest board dedicated to wireframes.
Navigational Chart
Your chart should clearly illustrate the relationship between your site pages and the navigational flow of the site.
![](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjR55in9s9kdtzX15dtc3B4K_BZZ1Hev8VhjUncbp7UUIEJc9AO_oMpQdVkCKiOEO2HbipYjQjlpTt4lRB47qTQRKNfFBi1xAR8i6SvwGdRW6MqDEuznZ-naO-V8VrbXb3shjze2dE9O-Zv/s200/postChart+wire-1.jpg)
Wireframes
Wireframes should visually represent the placement of your header, navigation (global, local, courtesy, etc.), content (main, secondary, tertiary, etc.), footer and any other sections of the page.
![](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgvawJ_5xNIRAQrLkUj7SL9V7Er9qb9EkG5j8s9Fo3pp8fSF70lgHORfjBeWzjwS8ZyKhooDGpKEn0tkzNmkHEVERTKtiH-0VKeZcFLszwvnK7mrwFw8iGr4vyJLSoVhw_Eqr83CV-xBXu-/s200/post1ation+Chart+wire-2.jpg)
![](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhmBjSVrViHL8PldwMNhNgqQzEmKyPcNjfuR_hjp5q-uW3bsq1BosyEmZlD1lYgFF_zTUKrCs2q_qWw_noL_7pYV3j_emxM1eapMgx8FdAbVXVi2NoZZdnsx1EiA7wgvFmUEa0g1sUKzT5z/s200/post3Chart+wire-4.jpg)
![](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj24_Bbg8q98riUTX3AX7QIsiRkKlNhRtEtIiduJU0U-unSKR4-dzjya2b-N4ccERJPG7ZD7sm5vl9lx-1ShgBTEG11Ui3_GOY29ejl3h1DjSkjlSw7xFjt2UbQAch1kkamLeo6XyyxT0Xs/s200/post2Chart+wire-3.jpg)
![](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgXEVJoeS7N-bVt8bWIISt5Rv9hlZA8kwBMOn_waKuT7OxffymFQNbdDbTBzK5wOcOh8UQhG8QrS0xiCY5jo4b4PbzNs4pqSs5BgAIxnCEf_EArVXY08ayzY6KCBvG7RE9yXc5-U-i4-cvC/s200/post4tion+Chart+wire-5.jpg)
![](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi2v20_UINn7WV3CYESoaBCB4wUEDFOkT5kS8HZdA6gNruQzhTdb2dfPOzWcFuNm1o7truVc2NiBlpTI62EPV9f8RnEJjTwI-RWUuKEoDQtSQXMBPuFL4ZN7TAJfqc03e83qd9I454CRyZn/s200/post5on+Chart+wire-7.jpg)
For wireframing and navigational charts I have created a set of brushes for Photoshop that I use to make them.
I know alot of students that are not comfortable with Photoshop yet and either use power point or online tools to help them make wireframes. How to use wireframes.